/* =========================================================
   YOCOLO CI — Feuille de style principale
   Identité : vert (actions) · orange (attention / deals) · indigo (structure) · Nunito
   ========================================================= */
:root {
  --green: #12a150; --green-d: #0b7a3c; --green-l: #e7f6ee;
  --orange: #f28c28; --orange-d: #c86a0e; --orange-l: #fff3e6;
  --indigo: #3730a3; --indigo-d: #1e1b4b; --indigo-l: #eef0ff;
  --red: #dc2626; --red-l: #fdecec; --yellow-l: #fff8db;
  --text: #1f2433; --muted: #6b7280; --line: #e6e8ef; --bg: #f6f7fb; --card: #fff;
  --r: 16px; --r-sm: 12px; --shadow: 0 2px 10px rgba(30, 27, 75, .06); --shadow-h: 0 10px 28px rgba(30, 27, 75, .12);
  --max: 1200px; --pagin: 18px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: 'Nunito', system-ui, -apple-system, Segoe UI, Roboto, sans-serif; font-size: 16px; line-height: 1.55; color: var(--text); background: var(--bg); -webkit-font-smoothing: antialiased; }
a { color: var(--green-d); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; display: block; }
h1, h2, h3, h4 { line-height: 1.2; margin: 0 0 .5em; color: var(--indigo-d); }
h1 { font-size: clamp(28px, 4.6vw, 48px); font-weight: 800; }
h2 { font-size: clamp(22px, 3vw, 30px); font-weight: 800; }
h3 { font-size: 18px; font-weight: 700; }
p { margin: 0 0 .8em; }
.muted { color: var(--muted); }
.small { font-size: 14px; }
.wrap { max-width: var(--max); margin: 0 auto; padding: 0 var(--pagin); }
.ic { flex-shrink: 0; vertical-align: middle; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.hide { display: none !important; }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }

/* ---------- Boutons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 18px; border-radius: var(--r-sm); border: 1px solid transparent;
  font: inherit; font-weight: 700; font-size: 15px; cursor: pointer; text-decoration: none !important; transition: transform .12s, box-shadow .12s, background .12s; white-space: nowrap; }
.btn:active { transform: scale(.98); }
.btn-green { background: var(--green); color: #fff; } .btn-green:hover { background: var(--green-d); }
.btn-orange { background: var(--orange); color: #fff; } .btn-orange:hover { background: var(--orange-d); }
.btn-indigo { background: var(--indigo); color: #fff; } .btn-indigo:hover { background: var(--indigo-d); }
.btn-red { background: var(--red); color: #fff; }
.btn-light { background: #fff; color: var(--indigo-d); border-color: var(--line); } .btn-light:hover { border-color: #cfd3df; }
.btn-ghost { background: transparent; color: var(--indigo-d); } .btn-ghost:hover { background: var(--indigo-l); }
.btn-sm { min-height: 36px; padding: 6px 12px; font-size: 14px; border-radius: 10px; }
.btn-xs { min-height: 30px; padding: 4px 10px; font-size: 13px; border-radius: 8px; }
.btn-block { width: 100%; }
.btn-round { width: 44px; padding: 0; border-radius: 50%; }
.btn[disabled] { opacity: .5; cursor: not-allowed; }
.link { background: none; border: 0; padding: 0; font: inherit; color: var(--green-d); font-weight: 700; cursor: pointer; }

/* ---------- Badges, pastilles ---------- */
.badge { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 99px; font-size: 12.5px; font-weight: 700; background: #eef0f4; color: var(--indigo-d); }
.b-open { background: var(--green-l); color: var(--green-d); } .b-closed { background: var(--red-l); color: var(--red); }
.b-verif { background: var(--green-l); color: var(--green-d); } .b-deal { background: var(--orange); color: #fff; } .b-sponso { background: var(--orange-l); color: var(--orange-d); }
.b-resa { background: var(--indigo-l); color: var(--indigo); } .b-alert { background: var(--red); color: #fff; }
.chips { display: flex; gap: 8px; overflow-x: auto; padding: 4px 0 10px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.chips::-webkit-scrollbar { display: none; }
.chip { flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 99px; background: #fff; border: 1px solid var(--line); color: var(--indigo-d);
  font-weight: 700; font-size: 14px; text-decoration: none !important; white-space: nowrap; cursor: pointer; }
.chip:hover { border-color: var(--green); }
.chip.on { background: var(--green); border-color: var(--green); color: #fff; }
.chip .n { font-weight: 600; opacity: .7; font-size: 12.5px; }
.st { display: inline-block; padding: 2px 9px; border-radius: 99px; font-size: 12.5px; font-weight: 700; }
.st-g { background: var(--green-l); color: var(--green-d); } .st-o { background: var(--orange-l); color: var(--orange-d); } .st-r { background: var(--red-l); color: var(--red); }
.st-b { background: var(--indigo-l); color: var(--indigo); } .st-n { background: #eef0f4; color: var(--muted); }
.stars { color: #d1d5db; letter-spacing: -1px; } .stars i { font-style: normal; } .stars i.on { color: #f5a524; } .stars i.half { color: #f8c66a; }

/* ---------- En-tête ---------- */
.topbar { position: sticky; top: 0; z-index: 50; background: rgba(255, 255, 255, .96); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
.topbar .wrap { display: flex; align-items: center; gap: 14px; height: 64px; }
.logo { display: inline-flex; align-items: center; gap: 8px; font-weight: 900; font-size: 22px; color: var(--indigo-d) !important; text-decoration: none !important; letter-spacing: .5px; }
.logo .pin { width: 32px; height: 32px; border-radius: 50% 50% 50% 4px; transform: rotate(-45deg); background: linear-gradient(135deg, var(--green), var(--green-d)); display: grid; place-items: center; }
.logo .pin span { transform: rotate(45deg); width: 11px; height: 11px; background: #fff; border-radius: 50%; display: block; }
.logo b { color: var(--orange); font-weight: 900; }
.nav { display: flex; gap: 4px; margin-left: 12px; }
.nav a { padding: 8px 12px; border-radius: 10px; color: var(--indigo-d); font-weight: 700; font-size: 15px; text-decoration: none; }
.nav a:hover, .nav a.on { background: var(--indigo-l); }
.top-right { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.country { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 10px; border: 1px solid var(--line); background: #fff; font: inherit; font-weight: 700; font-size: 14px; cursor: pointer; color: var(--indigo-d); }
.btn-sos { background: var(--red); color: #fff; font-weight: 900; letter-spacing: 1px; border-radius: 10px; padding: 8px 14px; min-height: 40px; border: 0; cursor: pointer; font-family: inherit; font-size: 15px; box-shadow: 0 0 0 0 rgba(220, 38, 38, .5); animation: pulse 2.4s infinite; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(220, 38, 38, .45); } 70% { box-shadow: 0 0 0 10px rgba(220, 38, 38, 0); } 100% { box-shadow: 0 0 0 0 rgba(220, 38, 38, 0); } }
.avatar { width: 38px; height: 38px; border-radius: 50%; background: var(--indigo); color: #fff; display: grid; place-items: center; font-weight: 800; font-size: 14px; position: relative; }
.avatar .dot { position: absolute; top: -2px; right: -2px; background: var(--orange); color: #fff; font-size: 10px; min-width: 17px; height: 17px; border-radius: 9px; display: grid; place-items: center; border: 2px solid #fff; }
.compact-search { display: none; flex: 1; max-width: 360px; margin-left: 12px; }
.topbar.scrolled .compact-search { display: block; }
.compact-search button { width: 100%; display: flex; align-items: center; gap: 8px; padding: 8px 14px; border: 1px solid var(--line); border-radius: 99px; background: var(--bg); color: var(--muted); font: inherit; cursor: pointer; }
.menu-btn { display: none; }
.dropdown { position: relative; }
.dropdown-menu { position: absolute; right: 0; top: calc(100% + 8px); background: #fff; border: 1px solid var(--line); border-radius: var(--r-sm); box-shadow: var(--shadow-h); min-width: 230px; padding: 6px; display: none; z-index: 60; }
.dropdown.open .dropdown-menu { display: block; }
.dropdown-menu a, .dropdown-menu button { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 12px; border-radius: 8px; color: var(--text); font: inherit; font-weight: 600; text-decoration: none; background: none; border: 0; cursor: pointer; text-align: left; }
.dropdown-menu a:hover, .dropdown-menu button:hover { background: var(--bg); }
.dropdown-menu hr { border: 0; border-top: 1px solid var(--line); margin: 6px 0; }
.dropdown-menu .soon { opacity: .55; }

/* Menu plein écran (mobile) */
.drawer { position: fixed; inset: 0; background: #fff; z-index: 90; padding: 18px; display: none; overflow-y: auto; }
.drawer.open { display: block; }
.drawer a { display: flex; align-items: center; gap: 12px; padding: 14px 6px; border-bottom: 1px solid var(--line); font-weight: 700; color: var(--indigo-d); font-size: 17px; text-decoration: none; }

/* ---------- Flash ---------- */
.flashes { position: fixed; top: 74px; left: 50%; transform: translateX(-50%); z-index: 95; display: grid; gap: 8px; width: min(560px, calc(100% - 24px)); }
.flash { padding: 12px 16px; border-radius: 12px; font-weight: 700; box-shadow: var(--shadow-h); display: flex; gap: 10px; align-items: flex-start; animation: slidein .25s; }
.flash-ok { background: var(--green); color: #fff; } .flash-error { background: var(--red); color: #fff; } .flash-info { background: var(--indigo); color: #fff; }
.flash button { margin-left: auto; background: none; border: 0; color: inherit; cursor: pointer; font-size: 18px; line-height: 1; }
@keyframes slidein { from { opacity: 0; transform: translateY(-8px); } }

/* ---------- Hero / bannière ---------- */
.hero { position: relative; color: #fff; overflow: hidden; background: var(--indigo-d); }
.hero::before { content: ""; position: absolute; inset: 0; background:
  radial-gradient(circle at 15% 20%, rgba(242, 140, 40, .55), transparent 40%),
  radial-gradient(circle at 85% 30%, rgba(18, 161, 80, .55), transparent 45%),
  linear-gradient(135deg, #0b7a3c 0%, #1e1b4b 70%); }
.hero::after { content: ""; position: absolute; inset: 0; opacity: .12; background-image: repeating-linear-gradient(45deg, #fff 0 2px, transparent 2px 22px), repeating-linear-gradient(-45deg, #fff 0 2px, transparent 2px 22px); }
.hero > .wrap { position: relative; z-index: 2; padding-top: 56px; padding-bottom: 64px; }
.hero h1 { color: #fff; max-width: 760px; }
.hero .kicker { display: inline-block; background: rgba(255, 255, 255, .15); padding: 5px 12px; border-radius: 99px; font-weight: 800; font-size: 14px; margin-bottom: 12px; }
.hero .sub { font-size: 18px; max-width: 640px; opacity: .95; }
.hero-photo { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: .35; }

/* Boîte de recherche */
.searchbox { background: #fff; border-radius: 20px; padding: 10px; box-shadow: 0 20px 50px rgba(0, 0, 0, .25); margin-top: 22px; max-width: 880px; color: var(--text); }
.sb-row { display: flex; gap: 8px; align-items: stretch; flex-wrap: wrap; }
.sb-field { flex: 1 1 260px; position: relative; display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 14px; padding: 0 8px 0 14px; background: #fff; min-height: 54px; }
.sb-field:focus-within { border-color: var(--green); box-shadow: 0 0 0 3px rgba(18, 161, 80, .15); }
.sb-field input { flex: 1; border: 0; outline: 0; font: inherit; font-size: 16px; min-width: 0; background: transparent; padding: 14px 0; color: var(--text); }
.sb-field .ic { color: var(--muted); }
.sb-mini { display: inline-flex; align-items: center; gap: 6px; border: 0; background: var(--green-l); color: var(--green-d); font: inherit; font-weight: 800; font-size: 13px; border-radius: 10px; padding: 7px 10px; cursor: pointer; white-space: nowrap; }
.mic-btn { width: 54px; min-height: 54px; border-radius: 14px; border: 0; background: var(--indigo); color: #fff; cursor: pointer; display: grid; place-items: center; }
.mic-btn.listening { background: var(--red); animation: pulse 1.2s infinite; }
.sb-go { min-height: 54px; padding: 0 26px; font-size: 16px; border-radius: 14px; }
.sb-more { margin: 8px 4px 0; font-size: 14px; }
.sb-hint { margin: 12px 4px 0; font-size: 14px; color: rgba(255, 255, 255, .9); }
.sb-hint i { font-style: normal; font-weight: 800; }
.sb-msg { margin: 8px 4px 0; color: var(--red); font-weight: 700; font-size: 14px; }
.shake { animation: shake .35s; } @keyframes shake { 25% { transform: translateX(-6px); } 75% { transform: translateX(6px); } }
.suggest { position: absolute; left: 0; right: 0; top: calc(100% + 6px); background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-h); z-index: 40; max-height: 360px; overflow-y: auto; display: none; }
.suggest.open { display: block; }
.suggest .grp { padding: 8px 14px 4px; font-size: 12px; font-weight: 800; text-transform: uppercase; color: var(--muted); letter-spacing: .05em; }
.suggest a { display: flex; align-items: center; gap: 10px; padding: 10px 14px; color: var(--text); text-decoration: none; }
.suggest a:hover, .suggest a.act { background: var(--green-l); }
.suggest a small { color: var(--muted); display: block; font-size: 13px; }
.resume { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; background: rgba(255, 255, 255, .16); color: #fff !important; padding: 8px 14px; border-radius: 99px; font-weight: 800; text-decoration: none !important; }
.resume:hover { background: rgba(255, 255, 255, .26); }
.voice-bubble { position: fixed; left: 50%; bottom: 96px; transform: translateX(-50%); z-index: 96; background: #fff; color: var(--text); border-radius: 18px; box-shadow: var(--shadow-h); padding: 16px 18px; width: min(460px, calc(100% - 24px)); display: none; }
.voice-bubble.open { display: block; animation: slidein .2s; }
.wave { display: flex; gap: 4px; height: 26px; align-items: center; margin-bottom: 8px; }
.wave span { width: 5px; border-radius: 3px; background: var(--green); animation: wave 1s infinite ease-in-out; }
.wave span:nth-child(2) { animation-delay: .1s; background: var(--orange); } .wave span:nth-child(3) { animation-delay: .2s; background: var(--indigo); } .wave span:nth-child(4) { animation-delay: .3s; } .wave span:nth-child(5) { animation-delay: .4s; background: var(--orange); }
@keyframes wave { 0%, 100% { height: 6px; } 50% { height: 26px; } }

/* ---------- Sections ---------- */
.section { padding: 48px 0; }
.section.alt { background: #fff; }
.section.soft { background: #f0f2f7; }
.section.orange { background: var(--orange-l); }
.section.indigo { background: var(--indigo-l); }
.section.dark { background: var(--indigo-d); color: #fff; } .section.dark h2, .section.dark h3 { color: #fff; }
.section.greenl { background: var(--green-l); }
.sec-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 18px; flex-wrap: wrap; }
.sec-head h2 { margin: 0; }
.sec-head p { margin: 4px 0 0; color: var(--muted); }
.sec-head .more { font-weight: 800; display: inline-flex; align-items: center; gap: 4px; }
.pagin-band { height: 10px; background: repeating-linear-gradient(90deg, var(--orange) 0 18px, #fff 18px 22px, var(--green) 22px 40px, #fff 40px 44px, var(--indigo) 44px 62px, #fff 62px 66px); opacity: .85; }

/* ---------- Grilles et carrousels ---------- */
.grid { display: grid; gap: 16px; }
.g2 { grid-template-columns: repeat(2, 1fr); } .g3 { grid-template-columns: repeat(3, 1fr); } .g4 { grid-template-columns: repeat(4, 1fr); }
.carousel { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 48px) / 4); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 2px 14px; scrollbar-width: thin; }
.carousel > * { scroll-snap-align: start; }
.car-wrap { position: relative; }
.car-btn { position: absolute; top: 40%; z-index: 3; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--line); background: #fff; box-shadow: var(--shadow); display: grid; place-items: center; cursor: pointer; color: var(--indigo-d); }
.car-btn.prev { left: -14px; } .car-btn.next { right: -14px; }

/* ---------- Cartes ---------- */
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); overflow: hidden; }
.card-pad { padding: 18px; }
.ecard { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); transition: box-shadow .15s, transform .15s; color: var(--text); text-decoration: none !important; }
.ecard:hover { box-shadow: var(--shadow-h); transform: translateY(-2px); }
.ecard .ph { aspect-ratio: 16/9; }
.ecard .body { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.ecard .name { font-weight: 800; font-size: 16.5px; color: var(--indigo-d); line-height: 1.25; }
.ecard .meta { font-size: 14px; color: var(--muted); display: flex; align-items: center; gap: 4px; }
.ecard .row { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 14px; }
.ecard .tl { position: absolute; top: 10px; left: 10px; display: flex; gap: 6px; flex-wrap: wrap; z-index: 2; }
.ecard .tr { position: absolute; top: 8px; right: 8px; z-index: 2; }
.ecard .actions { display: flex; gap: 6px; margin-top: auto; padding-top: 8px; }
.fav { width: 38px; height: 38px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .95); color: var(--indigo-d); display: grid; place-items: center; cursor: pointer; box-shadow: var(--shadow); }
.fav.on { color: var(--red); } .fav.on svg { fill: var(--red); }
.ph { position: relative; overflow: hidden; background: #e9ecf3; }
.ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gallery > *, .fiche-top > *, .fiche-top > * > * { min-width: 0; }
.ph-gen { background: linear-gradient(135deg, var(--c), color-mix(in srgb, var(--c) 55%, #1e1b4b)); display: grid; place-items: center; color: #fff; }
.ph-gen .ph-ico { font-size: 42px; filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .2)); }
.ph-gen .ph-init { position: absolute; right: 12px; bottom: 6px; font-weight: 900; font-size: 30px; opacity: .25; }
.ph-place { background: linear-gradient(135deg, hsl(var(--h) 55% 38%), hsl(calc(var(--h) + 50) 60% 22%)); display: flex; align-items: flex-end; padding: 14px; color: #fff; }
.ph-place span { font-weight: 900; font-size: 24px; text-shadow: 0 2px 10px rgba(0, 0, 0, .3); }
.ph-place::after { content: ""; position: absolute; inset: 0; opacity: .1; background-image: repeating-linear-gradient(45deg, #fff 0 2px, transparent 2px 16px); }

/* Ligne de liste (page catégorie) */
.lrow { display: grid; grid-template-columns: 210px 1fr; gap: 0; background: #fff; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); transition: box-shadow .15s; }
.lrow:hover { box-shadow: var(--shadow-h); }
.lrow .ph { height: 100%; min-height: 150px; }
.lrow .body { padding: 14px 16px; display: flex; flex-direction: column; gap: 6px; }
.lrow .top { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; }
.lrow .name { font-weight: 800; font-size: 18px; color: var(--indigo-d); }
.lrow .eq { display: flex; gap: 6px; flex-wrap: wrap; }
.lrow .eq span { font-size: 12.5px; background: var(--bg); border-radius: 8px; padding: 2px 8px; color: var(--muted); font-weight: 700; }
.lrow .bottom { display: flex; gap: 8px; align-items: center; margin-top: auto; flex-wrap: wrap; }
.price { font-weight: 800; color: var(--indigo-d); } .price small { font-weight: 600; color: var(--muted); }

/* Ville */
.vcard { position: relative; display: block; border-radius: var(--r); overflow: hidden; color: #fff !important; text-decoration: none !important; box-shadow: var(--shadow); }
.vcard .ph { aspect-ratio: 4/3; }
.vcard .info { position: absolute; left: 0; right: 0; bottom: 0; padding: 14px; background: linear-gradient(transparent, rgba(0, 0, 0, .65)); }
.vcard .info b { display: block; font-size: 20px; font-weight: 900; }
.vcard .info small { opacity: .9; font-weight: 700; }
.vcard .ph-place span { display: none; }
.vcard .near { position: absolute; top: 10px; left: 10px; }

/* Deal */
.dcard .ph { aspect-ratio: 16/10; }
.dcard .pct { position: absolute; top: 10px; left: 10px; background: var(--orange); color: #fff; font-weight: 900; font-size: 20px; padding: 6px 12px; border-radius: 12px; z-index: 2; box-shadow: var(--shadow); }
.old { text-decoration: line-through; color: var(--muted); font-weight: 600; }
.countdown { color: var(--orange-d); font-weight: 800; font-size: 13.5px; display: inline-flex; align-items: center; gap: 4px; }

/* Événements, actualités */
.evcard { display: flex; gap: 14px; background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 14px; box-shadow: var(--shadow); color: var(--text); text-decoration: none !important; }
.evcard:hover { box-shadow: var(--shadow-h); }
.datebox { flex-shrink: 0; width: 64px; height: 70px; border-radius: 12px; background: var(--indigo); color: #fff; display: grid; place-items: center; align-content: center; text-align: center; line-height: 1; }
.datebox b { font-size: 26px; font-weight: 900; } .datebox small { font-size: 12px; font-weight: 800; margin-top: 4px; }
.ncard .ph { aspect-ratio: 16/9; }
.ncard.alert { border-color: var(--red); }

/* Tuiles chiffres */
.tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.tile { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 14px; box-shadow: var(--shadow); }
.tile .lbl { font-size: 13px; color: var(--muted); font-weight: 700; display: flex; align-items: center; gap: 6px; }
.tile .num { font-size: 22px; font-weight: 900; color: var(--indigo-d); margin-top: 2px; line-height: 1.2; }
.tile .src { font-size: 11.5px; color: var(--muted); margin-top: 2px; }

/* Catégories (icônes) */
.cats { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.cat { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; padding: 16px 8px 14px; background: #fff; border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); color: var(--indigo-d) !important; text-decoration: none !important; transition: transform .12s, box-shadow .12s; }
.cat:hover { transform: translateY(-2px); box-shadow: var(--shadow-h); }
.cat .ci { width: 56px; height: 56px; border-radius: 18px; display: grid; place-items: center; font-size: 28px; background: color-mix(in srgb, var(--c) 14%, #fff); }
.cat b { font-size: 14.5px; line-height: 1.2; }
.cat small { color: var(--muted); font-weight: 700; font-size: 12.5px; }
.cat.zero { opacity: .55; }
.quick { display: flex; gap: 10px; flex-wrap: wrap; }
.quick a { display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; background: #fff; border: 1px solid var(--line); border-radius: 12px; font-weight: 800; color: var(--indigo-d); text-decoration: none; box-shadow: var(--shadow); }

/* Bannière localité */
.loc-hero { position: relative; color: #fff; background: var(--indigo-d); overflow: hidden; }
.loc-hero .ph-place { position: absolute; inset: 0; }
.loc-hero .ph-place span { display: none; }
.loc-hero .shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11, 122, 60, .85), rgba(30, 27, 75, .75)); }
.loc-hero .wrap { position: relative; padding-top: 26px; padding-bottom: 30px; }
.loc-hero h1 { color: #fff; margin: 8px 0 6px; }
.crumbs { font-size: 14px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; opacity: .95; }
.crumbs a { color: inherit; font-weight: 700; }
.crumbs.dark { color: var(--muted); } .crumbs.dark a { color: var(--indigo-d); }
.loc-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.loc-actions .btn-light { background: rgba(255, 255, 255, .95); }
.official { display: inline-flex; align-items: center; gap: 6px; background: #fff; color: var(--green-d); padding: 4px 10px; border-radius: 99px; font-weight: 800; font-size: 13px; }
.alertbar { background: var(--yellow-l); border: 1px solid #f3dc8b; border-radius: 14px; padding: 12px 16px; display: flex; align-items: center; gap: 12px; color: #7a5a00; font-weight: 700; text-decoration: none !important; }
.qband { position: sticky; top: 64px; z-index: 30; background: rgba(246, 247, 251, .96); backdrop-filter: blur(6px); border-bottom: 1px solid var(--line); }
.qband .wrap { display: flex; align-items: center; gap: 10px; padding-top: 8px; }
.qband .chips { flex: 1; }

/* ---------- Page catégorie ---------- */
.cat-layout { display: grid; grid-template-columns: 280px 1fr; gap: 24px; align-items: start; }
.filters { position: sticky; top: 130px; background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 16px; box-shadow: var(--shadow); max-height: calc(100vh - 150px); overflow-y: auto; }
.filters h4 { font-size: 14px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); margin: 16px 0 8px; }
.filters h4:first-child { margin-top: 0; }
.filters label.ck { display: flex; align-items: center; gap: 8px; padding: 5px 0; font-weight: 600; cursor: pointer; font-size: 15px; }
.filters input[type=checkbox], .filters input[type=radio] { width: 18px; height: 18px; accent-color: var(--green); }
.toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.toolbar select { padding: 9px 12px; border-radius: 10px; border: 1px solid var(--line); font: inherit; font-weight: 700; background: #fff; }
.seg { display: inline-flex; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff; }
.seg a { padding: 8px 12px; display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--indigo-d); text-decoration: none; }
.seg a.on { background: var(--indigo); color: #fff; }
.results { display: grid; gap: 14px; }
.faq details { background: #fff; border: 1px solid var(--line); border-radius: 14px; margin-bottom: 10px; }
.faq summary { cursor: pointer; padding: 14px 16px; font-weight: 800; color: var(--indigo-d); list-style: none; display: flex; justify-content: space-between; gap: 10px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--green); font-size: 22px; line-height: 1; }
.faq details[open] summary::after { content: "–"; }
.faq .ans { padding: 0 16px 14px; color: #374151; }

/* ---------- Fiche établissement ---------- */
.fiche-top { display: grid; grid-template-columns: 1.4fr 1fr; gap: 24px; align-items: start; }
.gallery { display: grid; grid-template-columns: 2fr 1fr; gap: 8px; border-radius: var(--r); overflow: hidden; }
.gallery .ph { min-height: 160px; }
.gallery .main { grid-row: span 2; min-height: 330px; }
.side-card { position: sticky; top: 84px; }
.kv { display: grid; grid-template-columns: 26px 1fr; gap: 10px 8px; align-items: start; }
.kv .ic { color: var(--green-d); margin-top: 2px; }
.hours { width: 100%; border-collapse: collapse; font-size: 15px; }
.hours td { padding: 5px 0; border-bottom: 1px dashed var(--line); }
.hours tr.today td { font-weight: 800; color: var(--green-d); }
.offer { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); align-items: center; }
.offer:last-child { border-bottom: 0; }
.review { padding: 14px 0; border-bottom: 1px solid var(--line); }
.review .reply { background: var(--bg); border-left: 3px solid var(--green); padding: 8px 12px; border-radius: 8px; margin-top: 8px; font-size: 15px; }
.action-bar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.action-bar .btn { flex-direction: column; gap: 2px; min-height: 64px; font-size: 13px; }
.map { height: 320px; border-radius: var(--r); overflow: hidden; border: 1px solid var(--line); background: #e9ecf3; z-index: 1; }
.map.tall { height: 520px; }
.eq-list { display: flex; flex-wrap: wrap; gap: 8px; }
.eq-list span { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 10px; background: var(--green-l); color: var(--green-d); font-weight: 700; font-size: 14px; }
.tabs { display: flex; gap: 6px; border-bottom: 1px solid var(--line); margin-bottom: 16px; overflow-x: auto; }
.tabs a, .tabs button { padding: 10px 14px; font-weight: 800; color: var(--muted); border: 0; background: none; border-bottom: 3px solid transparent; cursor: pointer; font: inherit; font-weight: 800; white-space: nowrap; text-decoration: none; }
.tabs .on { color: var(--indigo-d); border-bottom-color: var(--green); }

/* ---------- Formulaires ---------- */
.form { display: grid; gap: 14px; }
.form .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form .row3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; }
label.f { display: grid; gap: 6px; font-weight: 700; font-size: 14.5px; color: var(--indigo-d); }
label.f small { font-weight: 600; color: var(--muted); }
.in, select.in, textarea.in { width: 100%; padding: 11px 13px; border: 1px solid #d7dbe5; border-radius: 12px; font: inherit; font-size: 16px; background: #fff; color: var(--text); }
.in:focus { outline: 0; border-color: var(--green); box-shadow: 0 0 0 3px rgba(18, 161, 80, .15); }
textarea.in { min-height: 110px; resize: vertical; }
.ckline { display: flex; align-items: center; gap: 10px; font-weight: 600; cursor: pointer; }
.ckline input { width: 18px; height: 18px; accent-color: var(--green); }
.ckgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 6px 14px; }
.auth-wrap { min-height: calc(100vh - 64px); display: grid; place-items: center; padding: 30px 16px; background: linear-gradient(135deg, var(--green-l), var(--indigo-l)); }
.auth-card { width: min(460px, 100%); background: #fff; border-radius: 20px; box-shadow: var(--shadow-h); padding: 28px; }
.steps { display: flex; gap: 8px; margin-bottom: 18px; }
.steps span { flex: 1; height: 6px; border-radius: 3px; background: var(--line); }
.steps span.on { background: var(--green); }

/* ---------- Pied de page ---------- */
.local-band { background: var(--green-d); color: #fff; }
.local-band .wrap { display: flex; align-items: center; gap: 10px 18px; flex-wrap: wrap; padding-top: 16px; padding-bottom: 16px; }
.local-band b { font-size: 17px; }
.local-band a { color: #fff; font-weight: 700; opacity: .92; }
.footer { background: #14123a; color: #c7c9e3; padding: 48px 0 0; }
.footer h4 { color: #fff; font-size: 15px; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 12px; }
.footer a { color: #c7c9e3; display: block; padding: 4px 0; font-weight: 600; }
.footer a:hover { color: #fff; }
.fgrid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 26px; }
.footer .logo { color: #fff !important; }
.socials { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.socials a { display: inline-flex; width: 38px; height: 38px; border-radius: 10px; background: rgba(255, 255, 255, .08); align-items: center; justify-content: center; padding: 0; font-weight: 900; font-size: 13px; }
.fbottom { border-top: 1px solid rgba(255, 255, 255, .1); margin-top: 32px; padding: 16px 0 90px; display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 14px; }
.footer-min { padding: 18px 0 90px; text-align: center; font-size: 14px; color: var(--muted); }
.footer-min a { color: var(--muted); margin: 0 8px; }

/* Barre de navigation mobile */
.bottom-nav { display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; background: #fff; border-top: 1px solid var(--line); padding: 6px 4px calc(6px + env(safe-area-inset-bottom)); }
.bottom-nav a, .bottom-nav button { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px; font-size: 11.5px; font-weight: 800; color: var(--muted); text-decoration: none; background: none; border: 0; font-family: inherit; cursor: pointer; padding: 4px 0; }
.bottom-nav .on { color: var(--green-d); }

/* ---------- Bulles flottantes et panneaux ---------- */
.ia-fab { position: fixed; right: 18px; bottom: 22px; z-index: 72; display: inline-flex; align-items: center; gap: 8px; background: var(--indigo); color: #fff; border: 0; border-radius: 99px; padding: 12px 18px 12px 14px; font: inherit; font-weight: 800; cursor: pointer; box-shadow: 0 10px 30px rgba(55, 48, 163, .4); }
.ia-fab .ic { color: var(--orange); }
.overlay { position: fixed; inset: 0; background: rgba(15, 14, 40, .45); z-index: 80; display: none; }
.overlay.open { display: block; }
.panel { position: fixed; top: 0; right: 0; bottom: 0; width: min(420px, 100%); background: #fff; z-index: 85; transform: translateX(105%); transition: transform .25s; display: flex; flex-direction: column; box-shadow: -10px 0 40px rgba(0, 0, 0, .15); }
.panel.open { transform: none; }
.panel-head { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.panel-head h3 { margin: 0; flex: 1; }
.panel-body { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; background: var(--bg); }
.panel-foot { padding: 10px; border-top: 1px solid var(--line); display: flex; gap: 8px; }
.msg { max-width: 88%; padding: 10px 14px; border-radius: 16px; white-space: pre-line; font-size: 15px; }
.msg.bot { background: #fff; border: 1px solid var(--line); border-bottom-left-radius: 4px; }
.msg.me { background: var(--green); color: #fff; align-self: flex-end; border-bottom-right-radius: 4px; }
.ia-cards { display: grid; gap: 8px; }
.ia-card { display: flex; gap: 10px; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 10px; color: var(--text); text-decoration: none !important; }
.ia-card .ico { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; font-size: 20px; flex-shrink: 0; }
.ia-sugg { display: flex; flex-wrap: wrap; gap: 6px; }
.ia-sugg button { border: 1px solid var(--line); background: #fff; border-radius: 99px; padding: 7px 12px; font: inherit; font-size: 13.5px; font-weight: 700; cursor: pointer; color: var(--indigo-d); }
.sos-panel { position: fixed; inset: 0; z-index: 99; background: #b91c1c; color: #fff; display: none; overflow-y: auto; }
.sos-panel.open { display: block; }
.sos-panel .wrap { max-width: 560px; padding-top: 22px; padding-bottom: 40px; }
.sos-panel h2, .sos-panel h3 { color: #fff; }
.sos-call { display: flex; align-items: center; gap: 14px; background: #fff; color: var(--red) !important; border-radius: 16px; padding: 14px 16px; margin-bottom: 10px; text-decoration: none !important; font-weight: 900; font-size: 18px; }
.sos-call .em { font-size: 30px; }
.sos-call small { display: block; color: var(--muted); font-weight: 700; font-size: 13px; }
.sos-call .num { margin-left: auto; font-size: 22px; }
.sos-list a { display: block; background: rgba(255, 255, 255, .12); color: #fff; padding: 12px 14px; border-radius: 12px; margin-bottom: 8px; font-weight: 700; }
.cookie { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 75; max-width: 560px; margin: 0 auto; background: var(--indigo-d); color: #fff; border-radius: 16px; padding: 14px 16px; display: none; box-shadow: var(--shadow-h); font-size: 14px; }
.cookie.open { display: block; }
.cookie .btns { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.modal { position: fixed; inset: 0; z-index: 92; display: none; align-items: flex-end; justify-content: center; background: rgba(15, 14, 40, .45); padding: 12px; }
.modal.open { display: flex; }
.modal-card { background: #fff; border-radius: 20px; width: min(520px, 100%); max-height: 90vh; overflow-y: auto; padding: 22px; animation: slidein .2s; }
@media (min-width: 700px) { .modal { align-items: center; } }

/* Étapes, compteurs */
.how { counter-reset: s; }
.how .step { background: #fff; border-radius: var(--r); padding: 22px; border: 1px solid var(--line); box-shadow: var(--shadow); position: relative; }
.how .step::before { counter-increment: s; content: counter(s); position: absolute; top: -14px; left: 18px; width: 34px; height: 34px; border-radius: 50%; background: var(--green); color: #fff; font-weight: 900; display: grid; place-items: center; }
.how .step .em { font-size: 34px; }
.counters { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.counter { text-align: center; padding: 20px; background: #fff; border-radius: var(--r); border: 1px solid var(--line); }
.counter b { display: block; font-size: 32px; font-weight: 900; color: var(--green-d); }
.adv { background: #fff; border-radius: var(--r); padding: 20px; border: 1px solid var(--line); }
.adv .em { font-size: 30px; }
.pcard { background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); border-radius: var(--r); padding: 20px; color: #fff !important; text-decoration: none !important; display: block; transition: background .15s; }
.pcard:hover { background: rgba(255, 255, 255, .13); }
.pcard .em { font-size: 30px; }
.pcard p { opacity: .85; margin: 6px 0 0; }
.phone-mock { width: 220px; height: 420px; border-radius: 34px; background: var(--indigo-d); padding: 12px; box-shadow: var(--shadow-h); margin: 0 auto; }
.phone-mock .scr { width: 100%; height: 100%; border-radius: 24px; background: linear-gradient(160deg, var(--green), var(--indigo)); display: grid; place-items: center; color: #fff; font-weight: 900; font-size: 22px; text-align: center; }
.empty { text-align: center; padding: 34px 20px; background: #fff; border: 1px dashed #cfd3df; border-radius: var(--r); color: var(--muted); }
.empty .em { font-size: 40px; }

/* Pagination */
.pager { display: flex; gap: 6px; justify-content: center; margin: 22px 0 6px; flex-wrap: wrap; }
.pager a, .pager span { min-width: 40px; height: 40px; display: grid; place-items: center; border-radius: 10px; border: 1px solid var(--line); background: #fff; font-weight: 800; color: var(--indigo-d); padding: 0 10px; text-decoration: none; }
.pager .on { background: var(--green); border-color: var(--green); color: #fff; }

/* Prose */
.prose { background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 26px; white-space: pre-line; }

/* ---------- Tableaux de bord ---------- */
.dash { display: grid; grid-template-columns: 260px 1fr; min-height: 100vh; }
.side { background: var(--indigo-d); color: #c9cbe8; padding: 16px 12px; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.side .logo { color: #fff !important; padding: 6px 8px 14px; font-size: 20px; }
.side .space { background: rgba(255, 255, 255, .08); border-radius: 12px; padding: 10px 12px; margin-bottom: 12px; font-size: 13px; }
.side .space b { color: #fff; display: block; font-size: 15px; }
.side .grp { font-size: 11.5px; text-transform: uppercase; letter-spacing: .08em; padding: 12px 10px 4px; opacity: .6; font-weight: 800; }
.side a { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; color: #d7d9f1; font-weight: 700; font-size: 14.5px; text-decoration: none; }
.side a:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.side a.on { background: var(--green); color: #fff; }
.side a .cnt { margin-left: auto; background: var(--orange); color: #fff; border-radius: 99px; font-size: 11.5px; padding: 1px 7px; }
.main { min-width: 0; }
.dtop { background: #fff; border-bottom: 1px solid var(--line); height: 60px; display: flex; align-items: center; gap: 12px; padding: 0 22px; position: sticky; top: 0; z-index: 20; }
.dtop h1 { font-size: 20px; margin: 0; flex: 1; }
.dcontent { padding: 22px; }
.kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px; margin-bottom: 20px; }
.kpi { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 16px; box-shadow: var(--shadow); }
.kpi .l { color: var(--muted); font-weight: 700; font-size: 13.5px; display: flex; align-items: center; gap: 6px; }
.kpi .v { font-size: 28px; font-weight: 900; color: var(--indigo-d); line-height: 1.2; margin-top: 4px; }
.kpi .d { font-size: 13px; font-weight: 700; color: var(--green-d); }
.kpi.warn .v { color: var(--orange-d); }
.panel-box { background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); margin-bottom: 18px; }
.panel-box > h3 { padding: 14px 16px; margin: 0; border-bottom: 1px solid var(--line); font-size: 16px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.panel-box > .pb { padding: 16px; }
.tbl-wrap { overflow-x: auto; }
table.tbl { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.tbl th { text-align: left; padding: 10px 12px; background: #f7f8fb; color: var(--muted); font-size: 12.5px; text-transform: uppercase; letter-spacing: .04em; border-bottom: 1px solid var(--line); white-space: nowrap; }
.tbl td { padding: 10px 12px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.tbl tr:hover td { background: #fafbfd; }
.tbl .acts { white-space: nowrap; text-align: right; }
.tbl .acts form { display: inline; }
.listbar { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 14px; }
.listbar .in { width: auto; min-width: 200px; padding: 9px 12px; }
.listbar select.in { min-width: 150px; }
.bar-chart { display: flex; align-items: flex-end; gap: 4px; height: 160px; padding-top: 10px; }
.bar-chart .b { flex: 1; background: linear-gradient(var(--green), var(--green-d)); border-radius: 4px 4px 0 0; min-height: 2px; position: relative; }
.bar-chart .b:hover::after { content: attr(data-v); position: absolute; top: -22px; left: 50%; transform: translateX(-50%); font-size: 11px; font-weight: 800; background: var(--indigo-d); color: #fff; padding: 1px 6px; border-radius: 6px; white-space: nowrap; }
.progress { height: 10px; background: var(--line); border-radius: 5px; overflow: hidden; }
.progress span { display: block; height: 100%; background: linear-gradient(90deg, var(--orange), var(--green)); }
.hbar { display: grid; grid-template-columns: 140px 1fr 50px; gap: 10px; align-items: center; margin: 6px 0; font-size: 14px; font-weight: 700; }
.hbar .t { height: 10px; background: var(--line); border-radius: 5px; overflow: hidden; } .hbar .t span { display: block; height: 100%; background: var(--indigo); }
.dash-mobile-top { display: none; }
.plan { background: #fff; border: 2px solid var(--line); border-radius: var(--r); padding: 20px; }
.plan.on { border-color: var(--green); }
.plan .p { font-size: 26px; font-weight: 900; color: var(--indigo-d); }

/* Mises en page à deux colonnes */
.split { display: grid; grid-template-columns: 1.25fr 1fr; gap: 16px; align-items: start; }
.split.rev { grid-template-columns: 1fr 1.3fr; }
.vgrid { grid-template-columns: repeat(4, 1fr); }
.map-btn { display: none; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .fgrid { grid-template-columns: 1fr 1fr 1fr; }
  .cats { grid-template-columns: repeat(4, 1fr); }
  .carousel { grid-auto-columns: calc((100% - 32px) / 3); }
}
@media (max-width: 900px) {
  .nav, .country .lbl, .top-right .btn-connect { display: none; }
  .menu-btn { display: inline-flex; }
  .g3, .g4 { grid-template-columns: repeat(2, 1fr); }
  .cat-layout, .fiche-top { grid-template-columns: 1fr; }
  .filters { position: static; max-height: none; display: none; }
  .filters.open { display: block; position: fixed; inset: auto 0 0 0; z-index: 88; max-height: 85vh; border-radius: 20px 20px 0 0; }
  .side-card { position: static; }
  .counters { grid-template-columns: repeat(2, 1fr); }
  .dash { grid-template-columns: 1fr; }
  .side { position: fixed; left: 0; top: 0; bottom: 0; width: 270px; z-index: 90; transform: translateX(-105%); transition: transform .2s; }
  .side.open { transform: none; }
  .dash-mobile-top { display: inline-flex; }
  .split, .split.rev { grid-template-columns: 1fr; }
  .vgrid { grid-template-columns: repeat(2, 1fr); }
  .hide-m { display: none; }
  .map-btn { display: flex; }
}
@media (max-width: 640px) {
  :root { --pagin: 14px; }
  body { font-size: 16px; }
  .bottom-nav { display: flex; }
  .ia-fab { bottom: 78px; right: 12px; padding: 12px; }
  .ia-fab .lbl { display: none; }
  .g2, .g3, .g4 { grid-template-columns: 1fr; }
  .carousel { grid-auto-columns: 78%; }
  .car-btn { display: none; }
  .cats { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .cat { padding: 10px 4px; } .cat .ci { width: 46px; height: 46px; font-size: 23px; border-radius: 14px; } .cat b { font-size: 12.5px; } .cat small { font-size: 11px; }
  .lrow { grid-template-columns: 110px 1fr; }
  .lrow .ph { min-height: 120px; }
  .lrow .eq { display: none; }
  .lrow .name { font-size: 16px; }
  .fgrid { grid-template-columns: 1fr 1fr; }
  .hero > .wrap { padding-top: 30px; padding-bottom: 40px; }
  .sb-row .sb-go { flex: 1; }
  .gallery { grid-template-columns: 1fr; } .gallery .ph:not(.main) { display: none; } .gallery .main { min-height: 220px; }
  .form .row2, .form .row3 { grid-template-columns: 1fr; }
  .section { padding: 34px 0; }
  .dcontent { padding: 14px; }
  .hbar { grid-template-columns: 100px 1fr 40px; }
  .topbar .wrap { gap: 8px; }
  .logo { font-size: 19px; }
  .action-bar .btn { min-height: 58px; }
}
@media (max-width: 640px) { .vgrid { grid-template-columns: repeat(2, 1fr); gap: 10px; } .vcard .info b { font-size: 16px; } }
.cats-more { display: none; margin-top: 10px; }
@media (max-width: 640px) { .cats:not(.all) .extra { display: none; } .cats-more { display: flex; } }
/* Correctifs de mise en page */
.vgrid { grid-template-columns: repeat(2, 1fr); }
.vcard .info small { display: block; line-height: 1.3; }
@media (max-width: 640px) {
  .country { display: none; }
  .sb-field { flex-basis: 100%; }
  .sb-mini span { display: none; }
  .btn-sos { padding: 8px 10px; }
  .top-right { gap: 6px; }
  .vcard .ph { aspect-ratio: 1 / 1; }
}

/* =========================================================
   ESPACE RENCONTRE — sorties, groupes, entraide
   Accent : rose « rencontre » (#e11d48) sur l'identité vert / orange / indigo
   ========================================================= */
:root { --rose: #e11d48; --rose-d: #be123c; --rose-l: #fff1f3; }
.btn-rose { background: var(--rose); color: #fff; } .btn-rose:hover { background: var(--rose-d); }
.b-rose { background: var(--rose-l); color: var(--rose-d); }

/* Bandeau d'en-tête */
.rc-hero { position: relative; overflow: hidden; color: #fff; background: radial-gradient(1200px 400px at 85% -10%, rgba(242, 140, 40, .55), transparent 60%), linear-gradient(120deg, var(--rose) 0%, #9f1239 45%, var(--indigo-d) 100%); }
.rc-hero::after { content: ""; position: absolute; inset: 0; opacity: .1; background-image: radial-gradient(#fff 1.5px, transparent 1.6px); background-size: 22px 22px; }
.rc-hero > .wrap { position: relative; z-index: 2; padding-top: 44px; padding-bottom: 48px; }
.rc-hero h1 { color: #fff; max-width: 780px; margin-bottom: 10px; }
.rc-hero .sub { font-size: 18px; max-width: 640px; opacity: .95; }
.rc-hero .kicker { display: inline-flex; gap: 6px; align-items: center; background: rgba(255, 255, 255, .16); padding: 5px 12px; border-radius: 99px; font-weight: 800; font-size: 14px; margin-bottom: 14px; }
.rc-hero .crumbs a, .rc-hero .crumbs { color: rgba(255, 255, 255, .9); }
.rc-hero .cta { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }
.rc-faces { display: flex; align-items: center; margin-top: 18px; }
.rc-faces span { width: 38px; height: 38px; border-radius: 50%; border: 2px solid #fff; margin-left: -8px; display: grid; place-items: center; font-weight: 900; font-size: 13px; background: var(--c, var(--orange)); color: #fff; }
.rc-faces span:first-child { margin-left: 0; }
.rc-faces small { margin-left: 10px; font-weight: 700; opacity: .95; }
.rc-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: -30px; position: relative; z-index: 3; }
.rc-stats div { background: #fff; border-radius: var(--r); padding: 14px 16px; box-shadow: var(--shadow-h); text-align: center; }
.rc-stats b { display: block; font-size: 26px; font-weight: 900; color: var(--rose-d); line-height: 1.1; }
.rc-stats small { color: var(--muted); font-weight: 700; }

/* Thèmes */
.rc-themes { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; }
.rc-theme { display: flex; flex-direction: column; gap: 4px; padding: 14px; border-radius: var(--r); background: #fff; border: 1px solid var(--line); color: var(--indigo-d); text-decoration: none !important; box-shadow: var(--shadow); transition: transform .12s, box-shadow .12s, border-color .12s; }
.rc-theme:hover { transform: translateY(-2px); box-shadow: var(--shadow-h); border-color: var(--rose); }
.rc-theme.on { border-color: var(--rose); background: var(--rose-l); }
.rc-theme .em { font-size: 28px; line-height: 1; }
.rc-theme b { font-weight: 800; line-height: 1.2; }
.rc-theme small { color: var(--muted); font-weight: 700; }

/* Carte « sortie » */
.mcard { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); overflow: hidden; color: var(--text); text-decoration: none !important; transition: box-shadow .15s, transform .15s; }
.mcard:hover { box-shadow: var(--shadow-h); transform: translateY(-2px); }
.mcard .top { display: flex; gap: 14px; padding: 14px 14px 10px; }
.mcard .datebox { background: linear-gradient(160deg, var(--rose), #9f1239); }
.mcard .datebox.past { background: #9ca3af; }
.mcard .t { font-weight: 800; font-size: 16.5px; color: var(--indigo-d); line-height: 1.25; margin: 4px 0 2px; }
.mcard .meta { font-size: 14px; color: var(--muted); display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.mcard .foot { margin-top: auto; padding: 10px 14px 14px; display: flex; flex-direction: column; gap: 8px; }
.mcard .row { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; }
.mcard.cancel { opacity: .75; }
.places { height: 7px; background: #f1f2f6; border-radius: 99px; overflow: hidden; }
.places i { display: block; height: 100%; background: linear-gradient(90deg, var(--green), var(--orange)); border-radius: 99px; }
.places.full i { background: var(--rose); }
.free { color: var(--green-d); } .paid { color: var(--orange-d); }

/* Carte « groupe » */
.gcard { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); overflow: hidden; color: var(--text); text-decoration: none !important; transition: box-shadow .15s, transform .15s; }
.gcard:hover { box-shadow: var(--shadow-h); transform: translateY(-2px); }
.gcard .cover { position: relative; aspect-ratio: 16/7; background: linear-gradient(135deg, var(--c, var(--rose)), color-mix(in srgb, var(--c, var(--rose)) 50%, #1e1b4b)); display: grid; place-items: center; overflow: hidden; }
.gcard .cover img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gcard .cover .em { font-size: 44px; filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .25)); }
.gcard .cover .badge { position: absolute; top: 10px; left: 10px; background: rgba(255, 255, 255, .92); }
.gcard .body { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.gcard .n { font-weight: 800; font-size: 17px; color: var(--indigo-d); line-height: 1.25; }
.gcard .meta { font-size: 14px; color: var(--muted); }
.gcard .foot { margin-top: auto; padding-top: 8px; display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; }

/* Avatars (prénoms uniquement) */
.avatars { display: flex; flex-wrap: wrap; gap: 10px; }
.avatars .p { display: flex; align-items: center; gap: 8px; background: var(--bg); border-radius: 99px; padding: 4px 12px 4px 4px; font-weight: 700; font-size: 14px; }
.avatars .p i { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-weight: 900; font-size: 12px; color: #fff; background: hsl(var(--h, 340) 65% 45%); }
.avatars .p.anim { background: var(--rose-l); color: var(--rose-d); }
.mini-faces { display: inline-flex; }
.mini-faces i { width: 24px; height: 24px; border-radius: 50%; border: 2px solid #fff; margin-left: -6px; display: grid; place-items: center; font-style: normal; font-weight: 900; font-size: 10px; color: #fff; background: hsl(var(--h, 340) 65% 45%); }
.mini-faces i:first-child { margin-left: 0; }

/* Mur de discussion */
.wall { display: flex; flex-direction: column; gap: 12px; max-height: 520px; overflow-y: auto; padding: 4px 2px; }
.wall .m { display: flex; gap: 10px; align-items: flex-start; }
.wall .m .bubble { background: var(--bg); border-radius: 4px 14px 14px 14px; padding: 9px 13px; max-width: 85%; }
.wall .m.me { flex-direction: row-reverse; }
.wall .m.me .bubble { background: var(--green-l); border-radius: 14px 4px 14px 14px; }
.wall .m .who { font-weight: 800; font-size: 13.5px; color: var(--indigo-d); }
.wall .m .when { font-size: 12px; color: var(--muted); }
.avatar-i { width: 32px; height: 32px; flex-shrink: 0; border-radius: 50%; display: grid; place-items: center; font-weight: 900; font-size: 12px; color: #fff; background: hsl(var(--h, 340) 65% 45%); }
.wall-form { display: flex; gap: 8px; margin-top: 12px; }
.wall-form textarea { min-height: 46px; resize: vertical; }

/* Encart sécurité / charte */
.safe { display: flex; gap: 12px; align-items: flex-start; background: var(--green-l); border: 1px solid #bfe6cf; border-radius: var(--r); padding: 14px 16px; color: #14532d; }
.safe .em { font-size: 26px; line-height: 1; }
.safe b { color: #14532d; }
.charter { counter-reset: c; display: grid; gap: 12px; }
.charter li { list-style: none; position: relative; padding: 14px 16px 14px 58px; background: #fff; border: 1px solid var(--line); border-radius: 14px; }
.charter li::before { counter-increment: c; content: counter(c); position: absolute; left: 16px; top: 14px; width: 30px; height: 30px; border-radius: 50%; background: var(--rose); color: #fff; font-weight: 900; display: grid; place-items: center; }
.charter { padding: 0; margin: 0; }
.ck-line { display: flex; gap: 10px; align-items: flex-start; font-weight: 700; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: #fff; cursor: pointer; }
.ck-line input { width: 20px; height: 20px; accent-color: var(--green); margin-top: 2px; flex-shrink: 0; }

/* Bloc « Espace rencontre » sur l'accueil / la commune */
.rc-band { display: grid; grid-template-columns: 1.1fr 1fr; gap: 0; border-radius: 22px; overflow: hidden; box-shadow: var(--shadow-h); background: #fff; }
.rc-band .l { padding: 28px; background: linear-gradient(135deg, var(--rose), #9f1239 60%, var(--indigo-d)); color: #fff; position: relative; }
.rc-band .l h2 { color: #fff; }
.rc-band .l p { opacity: .95; }
.rc-band .r { padding: 18px; display: flex; flex-direction: column; gap: 10px; justify-content: center; }
.rc-band .mline { display: flex; gap: 12px; align-items: center; padding: 10px; border-radius: 12px; border: 1px solid var(--line); color: var(--text); text-decoration: none !important; }
.rc-band .mline:hover { border-color: var(--rose); background: var(--rose-l); }
.rc-band .mline .datebox { width: 52px; height: 56px; background: var(--rose); }
.rc-band .mline .datebox b { font-size: 20px; }

.rc-tabs { display: flex; gap: 6px; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 5px; width: max-content; max-width: 100%; overflow-x: auto; }
.rc-tabs a { padding: 9px 16px; border-radius: 10px; font-weight: 800; color: var(--muted); text-decoration: none !important; white-space: nowrap; }
.rc-tabs a.on { background: var(--rose); color: #fff; }
.rc-split { display: grid; grid-template-columns: 1fr 340px; gap: 20px; align-items: start; }
.rc-aside { position: sticky; top: 84px; display: flex; flex-direction: column; gap: 14px; }
.status-pill { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 99px; font-weight: 800; font-size: 14px; }
.status-pill.ok { background: var(--green-l); color: var(--green-d); }
.status-pill.wait { background: var(--orange-l); color: var(--orange-d); }
.status-pill.off { background: var(--red-l); color: var(--red); }

@media (max-width: 900px) {
  .rc-split { grid-template-columns: 1fr; }
  .rc-aside { position: static; }
  .rc-band { grid-template-columns: 1fr; }
  .rc-stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .rc-hero > .wrap { padding-top: 28px; padding-bottom: 42px; }
  .rc-themes { grid-template-columns: repeat(2, 1fr); }
  .rc-stats b { font-size: 22px; }
  .wall .m .bubble { max-width: 100%; }
}
.rc-split > * { min-width: 0; }
.wall .bubble form .link { font-size: 12.5px; color: var(--muted); font-weight: 700; }
.mcard .meta { display: block; }
.mcard .meta .ic { vertical-align: -2px; margin-right: 2px; }
@media (max-width: 900px) { .rc-aside.first-mobile { order: -1; } }
.rc-form .row2, .rc-form .row3 { align-items: end; }
.ck-line > span { font-weight: 600; }

/* =========================================================
   ACCUEIL NATIONAL — « Tu es où ? » + carte des villes
   ========================================================= */
.h-country { background: var(--orange-l); border-bottom: 1px solid #f6d3ad; }
.h-country .wrap { padding-top: 10px; padding-bottom: 10px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }

.h-hero { position: relative; overflow: hidden; color: #fff; background: radial-gradient(900px 520px at 78% 40%, #2b2770 0%, transparent 70%), var(--indigo-d); }
.h-hero-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 28px; align-items: center; padding-top: 44px; padding-bottom: 40px; }
.h-hero-text { min-width: 0; }
.h-hello { margin: 0 0 6px; font-weight: 800; font-size: 17px; color: #ffd8ad; }
.h-title { font-size: clamp(56px, 9vw, 104px); font-weight: 900; line-height: .95; letter-spacing: -.03em; color: #fff; margin: 0 0 14px; }
.h-lead { font-size: clamp(17px, 1.6vw, 20px); line-height: 1.5; max-width: 560px; color: rgba(255, 255, 255, .88); margin: 0; }
.h-alert { display: inline-block; margin: 14px 0 0; background: rgba(220, 38, 38, .9); padding: 7px 12px; border-radius: 10px; font-weight: 700; }
.h-alert-o { background: rgba(242, 140, 40, .95); }
.h-hero .searchbox { margin-top: 22px; }
.h-resume { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; color: #fff !important; font-weight: 800; padding: 8px 14px 8px 10px; border-radius: 99px; background: rgba(18, 161, 80, .25); border: 1px solid rgba(18, 161, 80, .6); text-decoration: none !important; }
.h-resume:hover { background: rgba(18, 161, 80, .4); }

/* Carte dessinée */
.h-map { margin: 0; }
.h-map svg { width: 100%; height: auto; display: block; max-height: 520px; }
.h-coast { fill: none; stroke: #5ec6ff; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; opacity: .55; }
.h-sea { fill: #5ec6ff; opacity: .55; font: italic 700 14px Nunito, sans-serif; }
.h-route { stroke: #f28c28; stroke-width: 1.4; stroke-dasharray: 2 5; stroke-linecap: round; opacity: .7; }
.h-city circle { fill: var(--green); stroke: #fff; stroke-width: 2; transition: fill .15s; }
.h-city text { fill: #fff; font: 800 17px Nunito, sans-serif; paint-order: stroke; stroke: var(--indigo-d); stroke-width: 4px; stroke-linejoin: round; }
.h-city:hover circle, .h-city:focus circle { fill: var(--orange); }
.h-city:focus { outline: none; }
.h-city:focus-visible text { text-decoration: underline; }
.h-city.here circle:not(.h-ring) { fill: var(--orange); }
.h-ring { fill: none !important; stroke: var(--orange) !important; stroke-width: 2 !important; animation: h-pulse 2.4s ease-out infinite; transform-box: fill-box; transform-origin: center; }
@keyframes h-pulse { 0% { opacity: .9; transform: scale(.8); } 100% { opacity: 0; transform: scale(1.6); } }
.h-map figcaption { font-size: 14px; color: rgba(255, 255, 255, .72); text-align: center; margin-top: 4px; }

/* Panneaux des villes */
.h-signs { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 18px; }
.h-sign { display: grid; grid-template-columns: 1fr auto auto; grid-template-areas: "name km go" "region nb go"; align-items: center; column-gap: 16px; padding: 14px 16px 14px 18px; border-radius: 12px;
  background: var(--green-d); color: #fff !important; text-decoration: none !important; border: 2px solid #fff; box-shadow: 0 0 0 2px var(--green-d), var(--shadow); transition: transform .12s; }
.h-sign:hover { transform: translateX(3px); }
.h-sign:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
.h-sign.near { background: var(--orange-d); box-shadow: 0 0 0 2px var(--orange-d), var(--shadow); }
.h-sign-name { grid-area: name; font-size: 21px; font-weight: 900; letter-spacing: -.01em; display: flex; align-items: center; gap: 8px; }
.h-sign-name .badge { background: #fff; color: var(--orange-d); }
.h-sign-region { grid-area: region; font-size: 14px; opacity: .85; }
.h-sign-km { grid-area: km; font-weight: 900; font-size: 18px; text-align: right; font-variant-numeric: tabular-nums; }
.h-sign-nb { grid-area: nb; font-size: 14px; opacity: .85; text-align: right; font-variant-numeric: tabular-nums; }
.h-sign-go { grid-area: go; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: rgba(255, 255, 255, .16); }

.h-adcard { background: var(--orange-l); justify-content: center; align-items: center; text-align: center; padding: 24px; min-height: 260px; gap: 8px; }

/* Étapes */
.h-center { text-align: center; }
.h-steps { list-style: none; counter-reset: hs; display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 26px auto 26px; padding: 0; max-width: 980px; position: relative; }
.h-steps::before { content: ""; position: absolute; top: 21px; left: 16%; right: 16%; border-top: 2px dashed #cfd5e3; }
.h-steps li { counter-increment: hs; position: relative; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.h-steps li::before { content: counter(hs); width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--green); color: #fff; font-weight: 900; font-size: 20px; box-shadow: 0 0 0 6px #fff; margin-bottom: 6px; }
.h-steps b { font-size: 18px; color: var(--indigo-d); }
.h-steps span { color: var(--muted); max-width: 30ch; }

/* Assistant */
.h-ia { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; align-items: center; }
.h-ia-lead { font-size: 17px; color: var(--muted); }
.h-ia-form { background: #fff; padding: 8px; border-radius: 16px; box-shadow: var(--shadow); }
.h-chat { display: flex; flex-direction: column; gap: 10px; background: #fff; border-radius: 22px; padding: 20px; box-shadow: var(--shadow-h); }
.h-bubble { margin: 0; padding: 10px 14px; max-width: 85%; line-height: 1.45; }
.h-bubble.me { align-self: flex-end; background: var(--indigo); color: #fff; border-radius: 16px 16px 4px 16px; }
.h-bubble.bot { align-self: flex-start; background: var(--bg); color: var(--text); border-radius: 16px 16px 16px 4px; }

/* Pour qui */
.h-who { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.h-who > div { padding: 6px 22px 6px 18px; border-left: 3px solid var(--line); }
.h-who > div:first-child { border-left-color: var(--green); }
.h-who .em { font-size: 30px; }
.h-who h3 { margin: 8px 0 4px; }
.h-who p { color: var(--muted); margin: 0; }
.h-figures { margin: 28px 0 0; font-size: 19px; color: var(--indigo-d); }
.h-figures b { font-weight: 900; color: var(--green-d); }

/* Installer */
.h-install { background: var(--green-l); border-top: 1px solid #c6ebd6; }
.h-install .wrap { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; padding-top: 26px; padding-bottom: 26px; }
.h-install h2 { margin: 0 0 4px; font-size: 24px; }
.h-install p { margin: 0; color: #14532d; }
.h-install-btns { display: flex; gap: 10px; flex-wrap: wrap; }

@media (max-width: 1000px) {
  .h-hero-grid { grid-template-columns: 1fr; }
  .h-map { max-width: 460px; margin: 0 auto; width: 100%; }
  .h-ia { grid-template-columns: 1fr; }
  .h-who { grid-template-columns: repeat(2, 1fr); row-gap: 22px; }
}
@media (max-width: 700px) {
  .h-hero-grid { padding-top: 26px; padding-bottom: 22px; gap: 16px; }
  .h-signs { grid-template-columns: 1fr; }
  .h-sign-name { font-size: 19px; }
  .h-steps { grid-template-columns: 1fr; gap: 18px; }
  .h-steps::before { display: none; }
  .h-who { grid-template-columns: 1fr; }
  .h-figures { font-size: 17px; }
}
@media (prefers-reduced-motion: reduce) { .h-ring { animation: none; } }

/* En-tête : 5 liens + Connexion tiennent sur une ligne */
.nav a { white-space: nowrap; padding: 8px 10px; }
.country { white-space: nowrap; }
@media (max-width: 1440px) { .country .lbl { display: none; } }
@media (max-width: 1140px) { .nav, .top-right .btn-connect { display: none; } .menu-btn { display: inline-flex; } }
.h-hero-grid { grid-template-columns: 1.3fr .7fr; }
@media (max-width: 1000px) { .h-hero-grid { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .h-map { max-width: 330px; } .h-title { font-size: 64px; } }

/* =========================================================
   PAGE COMMUNE / QUARTIER — panneau d'entrée de localité
   ========================================================= */
.c-hero { background: radial-gradient(800px 420px at 85% 30%, #2b2770 0%, transparent 70%), var(--indigo-d); color: #fff; }
.c-hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 34px; align-items: center; padding-top: 30px; padding-bottom: 36px; }
.c-hero-main { min-width: 0; }
.c-hero .crumbs, .c-hero .crumbs a { color: rgba(255, 255, 255, .8); }
.c-sign { display: inline-flex; flex-direction: column; align-items: center; margin: 16px 0 6px; padding: 16px 34px 14px; background: #fff; border-radius: 14px;
  border: 7px solid #c8102e; box-shadow: 0 0 0 4px #fff, 0 18px 40px rgba(0, 0, 0, .35); color: #111827; max-width: 100%; }
.c-sign-name { font-size: clamp(38px, 6vw, 68px); font-weight: 900; line-height: 1; letter-spacing: -.02em; overflow-wrap: anywhere; text-align: center; }
.c-sign-sub { margin-top: 6px; font-size: 17px; font-weight: 800; color: #374151; }
.c-official { margin: 12px 0 0; font-weight: 800; color: #86efac; }
.c-lead { font-size: 19px; line-height: 1.5; max-width: 560px; color: rgba(255, 255, 255, .9); margin: 12px 0 0; }
.c-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 18px; }
.c-actions form { margin: 0; }
.c-hero .btn-ghost { color: #fff; border-color: rgba(255, 255, 255, .4); }
.c-facts { background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); border-radius: 18px; padding: 8px 20px 14px; }
.c-facts dl { margin: 0; }
.c-facts dl > div { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.c-facts dt { color: rgba(255, 255, 255, .7); }
.c-facts dd { margin: 0; font-weight: 800; text-align: right; }
.c-facts dd small { display: block; font-weight: 600; font-size: 12.5px; color: rgba(255, 255, 255, .55); }
.c-near { margin: 12px 0 0; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 14px; }
.c-near span { color: rgba(255, 255, 255, .7); margin-right: 4px; }
.c-near a { color: #fff !important; background: rgba(255, 255, 255, .12); padding: 4px 10px; border-radius: 99px; font-weight: 700; text-decoration: none !important; }
.c-near a:hover { background: rgba(255, 255, 255, .22); }
.c-near small { opacity: .7; }

.c-services { padding-top: 26px; }
.c-ask { font-size: clamp(26px, 3.2vw, 36px); margin: 0 0 4px; }
.c-filter { margin: 0 0 8px; color: var(--muted); }
.c-search { margin: 12px 0 0; background: #fff; padding: 8px; border-radius: 16px; box-shadow: var(--shadow); max-width: 820px; }
.c-search .sb-field { border: 0; }
.c-urgent { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 16px 0 28px; }
.c-urgent span { font-weight: 800; color: var(--red); margin-right: 4px; }
.c-urgent a { padding: 8px 14px; border-radius: 99px; background: #fff; border: 1px solid #fecaca; font-weight: 800; color: var(--indigo-d) !important; text-decoration: none !important; }
.c-urgent a:hover { border-color: var(--red); background: #fef2f2; }
.c-main { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.c-cat { display: grid; grid-template-columns: auto 1fr; grid-template-areas: "ic name" "ic n"; column-gap: 14px; align-items: center; padding: 18px; border-radius: 16px;
  background: color-mix(in srgb, var(--c) 9%, #fff); border: 1px solid color-mix(in srgb, var(--c) 22%, #fff); color: var(--indigo-d) !important; text-decoration: none !important; transition: border-color .15s, background .15s; }
.c-cat:hover { border-color: var(--c); background: color-mix(in srgb, var(--c) 15%, #fff); }
.c-cat:focus-visible { outline: 3px solid var(--c); outline-offset: 2px; }
.c-cat-ic { grid-area: ic; font-size: 34px; width: 58px; height: 58px; display: grid; place-items: center; border-radius: 14px; background: #fff; }
.c-cat-name { grid-area: name; font-weight: 900; font-size: 17px; line-height: 1.2; }
.c-cat-n { grid-area: n; font-weight: 700; color: color-mix(in srgb, var(--c) 70%, #1f2937); font-size: 14px; }
.c-cat.zero, .c-more a.zero { opacity: .55; }
.c-more-title { margin: 30px 0 8px; font-size: 18px; }
.c-more { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 28px; }
.c-more a { display: flex; align-items: center; gap: 12px; padding: 11px 4px; border-bottom: 1px solid var(--line); color: var(--indigo-d) !important; text-decoration: none !important; font-weight: 700; }
.c-more a:hover .nm { color: var(--green-d); }
.c-more .ic { font-size: 22px; width: 28px; text-align: center; }
.c-more .nm { flex: 1; }
.c-more .n { color: var(--muted); font-size: 14px; font-variant-numeric: tabular-nums; }

.c-help { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 10px; }
.c-help a { display: flex; flex-direction: column; gap: 4px; padding: 6px 22px 6px 18px; border-left: 3px solid #a7dfbf; color: var(--indigo-d) !important; text-decoration: none !important; }
.c-help a:hover { border-left-color: var(--green); }
.c-help .em { font-size: 28px; }
.c-help b { font-size: 17px; }
.c-help a span:last-child { color: #3f5e4b; }

@media (max-width: 1000px) {
  .c-hero-grid { grid-template-columns: 1fr; }
  .c-main { grid-template-columns: repeat(2, 1fr); }
  .c-more { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .c-hero-grid { padding-top: 18px; gap: 20px; }
  .c-sign { padding: 12px 20px 10px; border-width: 5px; }
  .c-main { grid-template-columns: 1fr 1fr; gap: 10px; }
  .c-cat { grid-template-columns: 1fr; grid-template-areas: "ic" "name" "n"; padding: 14px; row-gap: 6px; }
  .c-cat-ic { width: 48px; height: 48px; font-size: 28px; }
  .c-cat-name { font-size: 15.5px; }
  .c-more { grid-template-columns: 1fr; }
  .c-help { grid-template-columns: 1fr; row-gap: 16px; }
}
@media (max-width: 640px) {
  .c-facts { padding: 6px 14px 12px; }
  .c-facts dl { display: grid; grid-template-columns: 1fr 1fr; column-gap: 14px; }
  .c-facts dl > div { flex-direction: column; gap: 2px; padding: 8px 0; }
  .c-facts dt { font-size: 13px; }
  .c-facts dd { text-align: left; font-size: 15px; }
  .c-facts dd small { display: none; }
}

/* =========================================================
   ACCUEIL — design validé (maquette « Maquette accueil YOCOLO CI »)
   Fond blanc / gris clair, vert pour les actions, orange pour les promos, une seule section sombre.
   ========================================================= */
:root { --hp-ink: #1e1b4b; --hp-muted: #5b6178; --hp-line: #e9ebf2; --hp-grey: #f6f7fb; --hp-green: #0c7d3d; --hp-green-h: #0a6531; }
.topbar .wrap { height: 72px; }
.nav a { font-size: 15.5px; }
.nav a:hover, .nav a.on { background: #f3f4f9; }

.hp-sec { padding: 88px 0; }
.hp-grey { background: var(--hp-grey); }
.hp-warm { background: #fff6ec; }
.hp-dark { background: var(--hp-ink); color: #fff; }
.hp-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 28px; }
.hp-head h2, .hp-h2 { margin: 0; font-size: clamp(28px, 3vw, 36px); line-height: 1.15; font-weight: 900; letter-spacing: -.02em; color: var(--hp-ink); }
.hp-dark .hp-h2 { color: #fff; }
.hp-head p { margin: 6px 0 0; color: var(--hp-muted); font-size: 17px; max-width: 620px; }
.hp-head-r { display: flex; align-items: center; gap: 18px; }
.hp-link { display: inline-flex; align-items: center; gap: 6px; font-weight: 800; color: var(--hp-green) !important; text-decoration: none !important; }
.hp-link:hover { color: var(--hp-green-h) !important; }
.hp-over { margin: 0 0 10px; font-weight: 800; }
.hp-lead2 { font-size: 17px; color: var(--hp-muted); margin: 12px 0 18px; }
.hp-dark .hp-lead2 { color: #c3c5e0; }
.hp-btns { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 24px; }
.hp-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.hp-ico { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; background: #eef7f1; color: var(--hp-green); flex-shrink: 0; }
.hp-ico-i { background: #eef0fb; color: #3730a3; }
.hp-ico-r { background: #fdecec; color: #dc2626; }

/* Photos et fonds d'attente */
.hp-photo { position: relative; overflow: hidden; background: linear-gradient(150deg, color-mix(in srgb, var(--c, #12a150) 22%, #fff), color-mix(in srgb, var(--c, #12a150) 72%, #2a2a3a)); }
.hp-photo > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hp-sky { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; fill: #0d1030; }

/* Bannière */
.hp-hero { position: relative; overflow: hidden; color: #fff; background: linear-gradient(180deg, #0e1336 0%, #26306b 34%, #7c4a6b 62%, #e08a4f 82%, #f4b56a 100%); }
.hp-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hp-hero-sky { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 30%; fill: #0b0e26; opacity: .92; }
.hp-hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10, 12, 40, .86) 0%, rgba(10, 12, 40, .6) 48%, rgba(10, 12, 40, .18) 100%); }
.hp-hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 48px; align-items: center; padding-top: 88px; padding-bottom: 112px; }
.hp-hello { margin: 0 0 14px; font-weight: 800; font-size: 18px; color: #ffd2a3; }
.hp-title { margin: 0; font-size: clamp(60px, 8vw, 96px); line-height: .95; font-weight: 900; letter-spacing: -.035em; color: #fff; }
.hp-lead { margin: 22px 0 0; font-size: 20px; line-height: 1.5; max-width: 540px; color: rgba(255, 255, 255, .88); }
.hp-hero .searchbox { margin-top: 32px; max-width: 640px; border-radius: 20px; padding: 10px; box-shadow: 0 30px 60px rgba(0, 0, 0, .35); }
.hp-hero .sb-field { background: #f5f6fa; border: 0; border-radius: 14px; min-height: 56px; }
.hp-hero .sb-field:focus-within { box-shadow: 0 0 0 3px rgba(18, 161, 80, .25); }
.hp-hero .mic-btn { width: 56px; min-height: 56px; border-radius: 14px; }
.hp-hero .sb-go { min-height: 56px; background: var(--hp-green); }
.hp-hero .sb-go:hover { background: var(--hp-green-h); }
.hp-hero .sb-more { margin: 8px 4px 0; }
.hp-quick { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 18px; font-size: 15px; }
.hp-quick > span { color: rgba(255, 255, 255, .75); margin-right: 4px; }
.hp-quick a { color: #fff !important; text-decoration: none !important; font-weight: 800; padding: 6px 12px; border-radius: 99px; background: rgba(255, 255, 255, .14); }
.hp-quick a:hover { background: rgba(255, 255, 255, .24); }
.hp-quick .hp-quick-back { display: inline-flex; align-items: center; gap: 6px; background: rgba(18, 161, 80, .35); margin-right: 10px; }
.hp-map { margin: 0; padding: 22px 22px 16px; border-radius: 24px; background: rgba(14, 16, 48, .55); border: 1px solid rgba(255, 255, 255, .16); backdrop-filter: blur(6px); }
.hp-map svg { width: 100%; height: auto; display: block; }
.hp-map figcaption { display: flex; justify-content: space-between; gap: 12px; margin-top: 6px; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .14); font-size: 14px; color: rgba(255, 255, 255, .78); }
.hp-ring { fill: none !important; stroke: var(--orange) !important; stroke-width: 2 !important; opacity: .55; }
.h-city.here .hp-ring { animation: h-pulse 2.4s ease-out infinite; transform-box: fill-box; transform-origin: center; opacity: 1; }

/* Carrousels */
.hp-arrows { display: flex; gap: 8px; }
.hp-arrow { width: 44px; height: 44px; border-radius: 50%; border: 1px solid #d9dce7; background: #fff; color: var(--hp-ink); display: grid; place-items: center; cursor: pointer; }
.hp-arrow:hover { border-color: var(--hp-ink); }
.hp-arrow:focus-visible, .hp-dot:focus-visible { outline: 3px solid var(--orange); outline-offset: 2px; }
.hp-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 72px) / 4); gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; scrollbar-width: none; }
.hp-track::-webkit-scrollbar { display: none; }
.hp-track > * { scroll-snap-align: start; }
.hp-dots { display: flex; gap: 6px; justify-content: center; margin-top: 22px; min-height: 8px; }
.hp-dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 99px; background: #d4d7e3; cursor: pointer; transition: width .2s; }
.hp-dot.on { width: 26px; background: var(--hp-ink); }

/* Cartes villes */
.hp-city { position: relative; display: block; border-radius: 20px; overflow: hidden; aspect-ratio: 3 / 4; color: #fff !important; text-decoration: none !important; }
.hp-city .hp-photo { position: absolute; inset: 0; }
.hp-city-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15, 13, 40, 0) 40%, rgba(15, 13, 40, .82) 100%); }
.hp-city-txt { position: absolute; left: 22px; right: 22px; bottom: 20px; }
.hp-city-txt b { display: block; font-size: 28px; font-weight: 900; letter-spacing: -.01em; line-height: 1.1; }
.hp-city-txt > span { display: block; font-size: 15px; opacity: .9; }
.hp-city-meta { display: flex; justify-content: space-between; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .25); font-weight: 800; font-size: 14px; }
.hp-city:hover .hp-photo > img { transform: scale(1.04); }
.hp-photo > img { transition: transform .4s; }

/* Cartes établissements / deals */
.hp-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--hp-line); border-radius: 18px; overflow: hidden; color: var(--hp-ink) !important; text-decoration: none !important; transition: box-shadow .2s; }
.hp-card:hover { box-shadow: 0 18px 40px rgba(30, 27, 75, .10); }
.hp-card .hp-photo { aspect-ratio: 4 / 3; }
.hp-body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.hp-body h3 { margin: 0; font-size: 18px; line-height: 1.3; font-weight: 800; }
.hp-kind { font-weight: 700; font-size: 14px; color: var(--hp-muted); }
.hp-where { font-size: 14px; color: var(--hp-muted); }
.hp-tag { position: absolute; top: 14px; left: 14px; padding: 4px 10px; border-radius: 8px; font-size: 13px; font-weight: 800; background: rgba(255, 255, 255, .94); color: var(--hp-ink); }
.hp-tag-o { background: var(--orange); color: var(--hp-ink); }
.hp-tag-r { background: #dc2626; color: #fff; }
.hp-city .hp-tag { z-index: 2; }
.hp-fav { position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; border-radius: 50%; background: rgba(255, 255, 255, .94); border: 0; display: grid; place-items: center; color: var(--hp-ink); cursor: pointer; }
.hp-fav.on { color: #dc2626; } .hp-fav.on svg { fill: currentColor; }
.hp-rate { display: flex; align-items: center; gap: 6px; font-weight: 800; font-size: 14px; margin-top: 6px; }
.hp-rate > span:not(.hp-open) { font-weight: 600; color: var(--hp-muted); }
.hp-star { color: var(--orange); fill: var(--orange); }
.hp-open { margin-left: auto; }
.hp-price { margin-top: auto; padding-top: 10px; font-weight: 900; font-size: 17px; }
.hp-price small { font-weight: 600; color: var(--hp-muted); font-size: 14px; }
.hp-price s { color: #7a8099; font-weight: 700; margin-right: 8px; font-size: 15px; }
.hp-pct { position: absolute; top: 14px; left: 14px; padding: 6px 12px; border-radius: 10px; font-size: 18px; font-weight: 900; background: var(--orange); color: var(--hp-ink); }
.hp-ends { display: flex; align-items: center; gap: 6px; color: #b45309; font-weight: 800; font-size: 14px; margin-top: 6px; }
.hp-card-ad { align-items: flex-start; justify-content: center; gap: 10px; padding: 26px; background: #fff6ec; border-style: dashed; border-color: #f2c48f; }
.hp-card-ad h3 { margin: 4px 0 0; font-size: 20px; font-weight: 900; }
.hp-card-ad p { margin: 0 0 6px; color: var(--hp-muted); }
.hp-ad-ic { width: 52px; height: 52px; border-radius: 16px; background: #fff; color: #b45309; display: grid; place-items: center; }
.hp-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 22px; }
.hp-chips a { padding: 9px 16px; border-radius: 99px; border: 1px solid #e3e6ef; background: #fff; font-weight: 700; font-size: 15px; color: var(--hp-ink) !important; text-decoration: none !important; }
.hp-chips a.on { background: var(--hp-ink); border-color: var(--hp-ink); color: #fff !important; }
.hp-note { color: var(--hp-muted); margin: -8px 0 18px; }

/* Étapes */
.hp-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.hp-steps > div { display: flex; flex-direction: column; gap: 10px; }
.hp-steps small { font-weight: 800; color: var(--hp-green); font-size: 14px; }
.hp-steps h3 { margin: 0; font-size: 20px; font-weight: 900; }
.hp-steps p { margin: 0; color: var(--hp-muted); }

/* Magazine : actualités + agenda */
.hp-mag { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 48px; }
.hp-feature { display: block; color: var(--hp-ink) !important; text-decoration: none !important; margin-bottom: 8px; }
.hp-feature .hp-photo { aspect-ratio: 16 / 9; border-radius: 20px; }
.hp-feature h3 { margin: 0; font-size: 26px; line-height: 1.25; font-weight: 900; }
.hp-feature:hover h3 { color: var(--hp-green); }
.hp-meta { display: block; margin: 16px 0 4px; font-size: 14px; font-weight: 700; color: var(--hp-muted); }
.hp-excerpt { margin: 8px 0 0; color: var(--hp-muted); }
.hp-news { display: grid; grid-template-columns: 120px 1fr; gap: 16px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--hp-line); color: var(--hp-ink) !important; text-decoration: none !important; }
.hp-news .hp-photo { aspect-ratio: 4 / 3; border-radius: 12px; }
.hp-news .hp-meta { margin: 0; }
.hp-news h4 { margin: 2px 0 0; font-size: 16px; font-weight: 800; line-height: 1.3; }
.hp-news:hover h4, .hp-ev:hover h4 { color: var(--hp-green); }
.hp-sub { margin: 0 0 10px; font-size: 22px; font-weight: 900; }
.hp-ev { display: grid; grid-template-columns: 64px 1fr; gap: 16px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--hp-line); color: var(--hp-ink) !important; text-decoration: none !important; }
.hp-ev h4 { margin: 0 0 2px; font-size: 16px; font-weight: 800; }
.hp-ev span { font-size: 14px; color: var(--hp-muted); }
.hp-date { border-radius: 14px; border: 1px solid #e3e6ef; text-align: center; padding: 8px 0; line-height: 1.1; }
.hp-date b { display: block; font-size: 24px; font-weight: 900; }
.hp-date small { font-size: 12px; font-weight: 800; color: var(--hp-muted); }

/* Espace rencontre / partenaires : grandes photos */
.hp-rc-photo { aspect-ratio: 5 / 4; border-radius: 24px; background: linear-gradient(150deg, #f6c9a4, #e58a6a 45%, #b4495e); }
.hp-pro-photo { aspect-ratio: 4 / 5; border-radius: 24px; background: linear-gradient(160deg, #f5c38b, #d9824a 50%, #8a3f2c); }
.hp-float { position: absolute; left: 20px; right: 20px; bottom: 20px; display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 16px; background: rgba(255, 255, 255, .95); color: var(--hp-ink); font-weight: 800; }
.hp-float svg { color: #e11d48; }
.hp-float-top { top: 20px; bottom: auto; right: auto; box-shadow: 0 14px 30px rgba(0, 0, 0, .2); }
.hp-float-top svg { color: var(--hp-green); }
.hp-float-top b { display: block; }
.hp-float-top small { display: block; font-weight: 600; color: var(--hp-muted); font-size: 14px; }

/* Assistant */
.hp-ask { display: flex; gap: 8px; padding: 8px; border-radius: 18px; border: 1px solid #e3e6ef; background: #fff; box-shadow: 0 14px 34px rgba(30, 27, 75, .08); }
.hp-ask .sb-field { border: 0; min-height: 50px; }
.hp-ask-mic, .hp-ask-go { width: 50px; height: 50px; border-radius: 12px; border: 0; display: grid; place-items: center; cursor: pointer; flex-shrink: 0; }
.hp-ask-mic { background: #eef0fb; color: #3730a3; }
.hp-ask-mic.rec { background: #dc2626; color: #fff; }
.hp-ask-go { background: #3730a3; color: #fff; }
.hp-sugg { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.hp-sugg button { padding: 9px 14px; border-radius: 99px; background: #fff; border: 1px solid #dfe2f0; font: inherit; font-weight: 700; font-size: 14.5px; color: var(--hp-ink); cursor: pointer; }
.hp-sugg button:hover { border-color: #3730a3; }
.hp-chat { display: flex; flex-direction: column; gap: 12px; padding: 26px; border-radius: 26px; background: #fff; border: 1px solid var(--hp-line); box-shadow: 0 24px 60px rgba(30, 27, 75, .10); }
.hp-chat-head { display: flex; align-items: center; gap: 10px; padding-bottom: 14px; border-bottom: 1px solid #eef0f5; }
.hp-chat-head > span:last-child { margin-left: auto; color: var(--hp-muted); font-size: 14px; }
.hp-chat-logo { width: 36px; height: 36px; border-radius: 50%; background: var(--green); display: grid; place-items: center; }
.hp-chat .h-bubble { font-size: 15.5px; padding: 12px 16px; }
.hp-chat .h-bubble.bot { background: #f3f4f9; }
.hp-chat-card { align-self: flex-start; width: 82%; display: flex; gap: 12px; align-items: center; padding: 12px; border-radius: 16px; border: 1px solid var(--hp-line); }
.hp-chat-card .hp-photo { width: 56px; height: 56px; border-radius: 12px; flex-shrink: 0; }
.hp-chat-card div { flex: 1; } .hp-chat-card b { display: block; font-size: 15px; } .hp-chat-card div span { font-size: 14px; color: var(--hp-muted); }
.hp-chat-call { width: 40px; height: 40px; border-radius: 50%; background: #e7f5ec; color: var(--hp-green); display: grid; place-items: center; }

/* Pour qui + chiffres */
.hp-who { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
.hp-who h3 { margin: 14px 0 4px; font-size: 19px; font-weight: 900; }
.hp-who p { margin: 0; color: var(--hp-muted); }
.hp-figs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; margin-top: 48px; padding-top: 36px; border-top: 1px solid #e3e6ef; }
.hp-figs b { display: block; font-size: 40px; font-weight: 900; letter-spacing: -.02em; line-height: 1; color: var(--hp-ink); }
.hp-figs span { color: var(--hp-muted); font-weight: 700; }

/* Partenaires (section sombre) */
.hp-offer { display: grid; grid-template-columns: 44px 1fr 20px; gap: 16px; align-items: center; padding: 18px 0; border-bottom: 1px solid rgba(255, 255, 255, .14); color: #fff !important; text-decoration: none !important; }
.hp-offer-ic { width: 44px; height: 44px; border-radius: 12px; background: rgba(255, 255, 255, .1); display: grid; place-items: center; }
.hp-offer b { display: block; font-size: 17px; }
.hp-offer > span > span { display: block; color: #c3c5e0; font-size: 15px; }
.hp-offer:hover b { color: #ffd2a3; }
.hp-btn-line { background: transparent; color: #fff !important; border: 1px solid rgba(255, 255, 255, .45); }
.hp-btn-line:hover { border-color: #fff; }

/* Application */
.hp-app { padding-bottom: 0; overflow: hidden; }
.hp-app-text { padding-bottom: 88px; }
.hp-app-list { list-style: none; padding: 0; margin: 22px 0 4px; display: flex; flex-direction: column; gap: 14px; font-weight: 700; }
.hp-app-list li { display: flex; align-items: center; gap: 12px; }
.hp-app-list .hp-ico { width: 40px; height: 40px; border-radius: 12px; }
.hp-phone { width: 300px; height: 440px; margin: 0 auto; border-radius: 44px 44px 0 0; border: 10px solid var(--hp-ink); border-bottom: 0; background: #fff; overflow: hidden; box-shadow: 0 -10px 60px rgba(30, 27, 75, .18); }
.hp-phone-top { height: 210px; padding: 34px 20px 0; color: #fff; background: linear-gradient(180deg, #0e1336, #26306b 55%, #7c4a6b); display: flex; flex-direction: column; }
.hp-phone-top small { font-size: 12px; color: #ffd2a3; font-weight: 800; }
.hp-phone-top b { margin: 2px 0 14px; font-size: 38px; font-weight: 900; line-height: 1; letter-spacing: -.03em; }
.hp-phone-top span { height: 40px; border-radius: 12px; background: #fff; display: flex; align-items: center; gap: 8px; padding: 0 12px; color: #7a8099; font-size: 13px; }
.hp-phone-grid { padding: 16px 20px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.hp-phone-grid i { aspect-ratio: 3 / 4; border-radius: 14px; }

@media (max-width: 1000px) {
  .hp-hero-grid, .hp-split, .hp-mag { grid-template-columns: 1fr; }
  .hp-map { max-width: 480px; width: 100%; margin: 0 auto; }
  .hp-track { grid-auto-columns: calc((100% - 24px) / 2.2); }
  .hp-who, .hp-figs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hp-app-text { padding-bottom: 60px; }
}
@media (max-width: 640px) {
  .hp-sec { padding: 60px 0; }
  .hp-hero-grid { padding-top: 40px; padding-bottom: 56px; gap: 28px; }
  .hp-lead { font-size: 18px; }
  .hp-head { flex-wrap: wrap; align-items: flex-start; }
  .hp-track { grid-auto-columns: 78%; gap: 16px; }
  .hp-steps { grid-template-columns: 1fr; gap: 28px; }
  .hp-news { grid-template-columns: 96px 1fr; }
  .hp-figs b { font-size: 32px; }
  .hp-chat { padding: 18px; }
  .hp-chat-card { width: 100%; }
  .hp-map { max-width: 360px; }
}
.hp-hero .sb-field { min-width: 0; }
.hp-hero .sb-field input { width: 0; }
.hp-split > *, .hp-mag > *, .hp-hero-grid > * { min-width: 0; }
.hp-ask .sb-field { min-width: 0; flex: 1; }
.hp-ask .sb-field input { width: 0; }

/* Écran d'attente avant l'ouverture d'une localité */
.yc-wait { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; padding: 20px; background: rgba(14, 16, 48, .42); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); opacity: 0; pointer-events: none; transition: opacity .25s; }
.yc-wait.on { opacity: 1; pointer-events: auto; }
.yc-wait-card { width: min(420px, 100%); text-align: center; background: #fff; border-radius: 24px; padding: 30px 28px 26px; box-shadow: 0 30px 80px rgba(0, 0, 0, .3); color: #1e1b4b; transform: translateY(10px) scale(.98); transition: transform .3s; }
.yc-wait.on .yc-wait-card { transform: none; }
.yc-wait-card b { display: block; font-size: 22px; font-weight: 900; margin-top: 14px; }
.yc-wait-card p { margin: 6px 0 18px; color: #5b6178; font-size: 16.5px; }
.yc-wait-pin { position: relative; width: 52px; height: 68px; margin: 0 auto; }
.yc-wait-pin svg { position: relative; z-index: 1; animation: yc-hop 1s ease-in-out infinite; }
.yc-wait-pin i { position: absolute; left: 50%; bottom: 0; width: 26px; height: 7px; margin-left: -13px; border-radius: 50%; background: rgba(30, 27, 75, .18); animation: yc-shadow 1s ease-in-out infinite; }
.yc-wait-bar { height: 5px; border-radius: 99px; background: #eef0f5; overflow: hidden; }
.yc-wait-bar span { display: block; height: 100%; width: 40%; border-radius: 99px; background: linear-gradient(90deg, #12a150, #f28c28); animation: yc-bar 1.2s ease-in-out infinite; }
html.yc-waiting body { overflow: hidden; }
@keyframes yc-hop { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes yc-shadow { 0%, 100% { transform: scale(1); opacity: .9; } 50% { transform: scale(.6); opacity: .5; } }
@keyframes yc-bar { 0% { transform: translateX(-100%); } 100% { transform: translateX(250%); } }
@media (prefers-reduced-motion: reduce) { .yc-wait-pin svg, .yc-wait-pin i, .yc-wait-bar span { animation: none; } }

/* ================= Pages commune & service (maquettes validées) ================= */
/* Bannière photo */
section.pb { position: relative; overflow: hidden; color: #fff; background: linear-gradient(135deg, #1e1b4b 0%, #2d2a6e 55%, #0c7d3d 130%); }
.pb-cat { background: linear-gradient(135deg, color-mix(in srgb, var(--c, #0c7d3d) 85%, #1e1b4b), #1e1b4b 120%); }
.pb-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pb-sky { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 45%; fill: rgba(255, 255, 255, .07); }
.pb-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(14, 16, 48, .82) 0%, rgba(14, 16, 48, .55) 55%, rgba(14, 16, 48, .25) 100%); }
.pb-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 48px; align-items: end; padding-top: 56px; padding-bottom: 64px; }
.pb-crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: 14.5px; font-weight: 700; color: rgba(255, 255, 255, .78); margin-bottom: 18px; }
.pb-crumbs a { color: #fff !important; text-decoration: none !important; }
.pb-crumbs a:hover { text-decoration: underline !important; }
.pb-title { color: #fff; margin: 0; font-size: clamp(44px, 7vw, 88px); line-height: 1; font-weight: 900; letter-spacing: -.035em; }
.pb-sub { margin: 12px 0 0; font-size: 19px; font-weight: 700; color: rgba(255, 255, 255, .85); }
.pb-lead { margin: 14px 0 0; font-size: 18px; line-height: 1.55; max-width: 620px; color: rgba(255, 255, 255, .9); }
.pb-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.pb-actions form { margin: 0; }
section.pb .hp-btn-line { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .45); color: #fff !important; }
section.pb .hp-btn-line:hover { background: rgba(255, 255, 255, .2); }
.pb-facts { padding: 24px 26px; border-radius: 22px; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .22); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.pb-facts dl { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 22px; }
.pb-facts dt { font-size: 13.5px; font-weight: 700; color: rgba(255, 255, 255, .75); }
.pb-facts dd { margin: 2px 0 0; font-size: 22px; font-weight: 900; }
.pb-near { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 18px 0 0; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .2); }
.pb-near span { font-size: 13.5px; font-weight: 700; color: rgba(255, 255, 255, .75); margin-right: 4px; }
.pb-near a { padding: 5px 12px; border-radius: 99px; background: rgba(255, 255, 255, .14); color: #fff !important; text-decoration: none !important; font-weight: 700; font-size: 14px; }
.pb-near a:hover { background: rgba(255, 255, 255, .26); }
.pb-near small { opacity: .75; font-weight: 600; }
.pb-cat-head { display: flex; gap: 22px; align-items: center; }
.pb-cat-ic { width: 76px; height: 76px; flex-shrink: 0; border-radius: 22px; display: grid; place-items: center; background: #fff; color: var(--c, #0c7d3d); }
.pb-kpis { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.pb-kpis span { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 99px; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .25); font-weight: 800; font-size: 15px; }

/* Barre des quartiers (collante) */
.pb-qbar { position: sticky; top: 72px; z-index: 30; background: rgba(255, 255, 255, .96); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom: 1px solid var(--hp-line); }
.pb-chips { flex-wrap: nowrap; overflow-x: auto; margin: 0; padding: 12px 0; scrollbar-width: none; }
.pb-chips::-webkit-scrollbar { display: none; }
.pb-chips a { white-space: nowrap; flex-shrink: 0; }
.pb-chips .n { margin-left: 4px; font-size: 13px; font-weight: 700; color: var(--hp-muted); }
.pb-chips a.on .n { color: rgba(255, 255, 255, .7); }
.pb-types { padding-top: 0; }
.pb-types a { padding: 7px 14px; font-size: 14px; }

/* Alertes, recherche, besoins urgents */
.pb-alert { display: flex; align-items: center; gap: 12px; padding: 14px 18px; margin-bottom: 22px; border-radius: 16px; background: #fef2f2; border: 1px solid #fecaca; color: #991b1b !important; text-decoration: none !important; }
.pb-alert > svg { flex-shrink: 0; color: #dc2626; }
.pb-search { display: flex; gap: 10px; margin: 20px 0 16px; padding: 8px; border-radius: 20px; background: #fff; border: 1px solid #dfe2ec; box-shadow: 0 14px 34px rgba(30, 27, 75, .07); }
.pb-search .sb-field { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; padding: 0 12px; color: var(--hp-muted); }
.pb-search input { flex: 1; width: 0; min-width: 0; border: 0; outline: 0; font: inherit; font-size: 17px; color: var(--hp-ink); background: none; min-height: 50px; }
.pb-search .btn { min-height: 52px; border-radius: 14px; background: var(--hp-green); }
.pb-search .btn:hover { background: var(--hp-green-h); }
.pb-mic { width: 52px; height: 52px; flex-shrink: 0; border-radius: 14px; }
.pb-urgent { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 56px; }
.pb-urgent > span { font-weight: 800; font-size: 14.5px; color: var(--hp-muted); margin-right: 4px; }
.pb-urgent a { display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 99px; background: #fff6ec; border: 1px solid #fde1c3; color: #9a4a00 !important; text-decoration: none !important; font-weight: 800; font-size: 14.5px; }
.pb-urgent a:hover { border-color: var(--orange); }

/* Tous les services encadrés */
.pb-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.pb-help { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.pb-tile { position: relative; display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: 18px; background: #fff; border: 1px solid var(--hp-line); color: var(--hp-ink) !important; text-decoration: none !important; transition: border-color .15s, box-shadow .15s; }
.pb-tile:hover { border-color: color-mix(in srgb, var(--c, #0c7d3d) 55%, #fff); box-shadow: 0 12px 28px rgba(30, 27, 75, .08); }
.pb-tile-ic { width: 52px; height: 52px; flex-shrink: 0; border-radius: 15px; display: grid; place-items: center; background: color-mix(in srgb, var(--c, #0c7d3d) 13%, #fff); color: var(--c, #0c7d3d); }
.pb-tile b { display: block; font-size: 16.5px; font-weight: 800; line-height: 1.25; }
.pb-tile small { display: block; margin-top: 2px; font-size: 14px; font-weight: 600; color: var(--hp-muted); }
.pb-tile-go { margin-left: auto; color: #b7bccd; }
.pb-tile:hover .pb-tile-go { color: var(--c, var(--hp-ink)); }
.pb-tile.zero .pb-tile-ic { filter: grayscale(.6); opacity: .7; }
.pb-help .pb-tile { align-items: flex-start; padding: 22px; }

.pb-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; padding: 44px 24px; border-radius: 20px; border: 1.5px dashed #d5d9e6; background: #fff; color: var(--hp-muted); }
.pb-empty > svg { color: #a7adc2; }
.pb-empty p { margin: 0; font-size: 16.5px; }

.pb-tabs { display: flex; gap: 6px; padding: 5px; margin-bottom: 26px; border-radius: 14px; background: var(--hp-grey); width: max-content; max-width: 100%; overflow-x: auto; }
.pb-tabs button { padding: 10px 18px; border: 0; border-radius: 10px; background: none; font: inherit; font-weight: 800; color: var(--hp-muted); cursor: pointer; white-space: nowrap; }
.pb-tabs button.on { background: #fff; color: var(--hp-ink); box-shadow: 0 2px 8px rgba(30, 27, 75, .08); }
.pb-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; }
.pb-mairie { display: flex; gap: 14px; align-items: center; margin-top: 22px; padding: 16px; border-radius: 16px; background: #fff; border: 1px solid var(--hp-line); }
.pb-mairie b { display: block; } .pb-mairie span span { color: var(--hp-muted); font-size: 15px; }
.pb-mapbox { position: relative; min-height: 360px; border-radius: 22px; overflow: hidden; border: 1px solid var(--hp-line); background: #eaf3ee; }
.pb-mapbox .map { margin: 0; height: 100%; min-height: 360px; border-radius: 0; }
.pb-mapcover { position: absolute; inset: 0; display: grid; place-items: center; background: linear-gradient(160deg, #e7f3ec, #dfe9f6); }
.pb-mapcover > svg { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: #fff; stroke-width: 6; }
.pb-mapcover .btn { position: relative; }

/* Carte d'établissement */
.pc { position: relative; }
.pc .hp-fav { z-index: 2; }
.pc-photo { display: block; aspect-ratio: 4 / 3; }
.pc-ph { position: absolute; inset: 0; display: grid; place-items: center; color: rgba(255, 255, 255, .85); }
.pc-verif { display: inline-flex; align-items: center; gap: 4px; color: var(--hp-green); }
.pc-deal { left: auto; right: 62px; }
.pc .hp-body h3 a { color: inherit !important; text-decoration: none !important; }
.pc .hp-body h3 a:hover { color: var(--hp-green) !important; }
.pc-eq { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.pc-eq span { padding: 3px 9px; border-radius: 7px; background: var(--hp-grey); font-size: 13px; font-weight: 700; color: var(--hp-muted); }
.pc-rep { display: flex; align-items: center; gap: 5px; margin-top: 4px; font-size: 14px; color: var(--hp-muted); }
.pc-rep svg { flex-shrink: 0; }
.pc .hp-price { display: flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 10px; }
.pc-resa { margin-left: auto; padding: 3px 9px; border-radius: 7px; background: #e7f5ec; color: var(--hp-green); font-size: 13px; font-weight: 800; }
.pc-acts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--hp-line); }
.pc-acts a { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 42px; padding: 0 8px; border-radius: 11px; border: 1px solid #e0e3ed; font-weight: 800; font-size: 14px; color: var(--hp-ink) !important; text-decoration: none !important; white-space: nowrap; }
.pc-acts a:hover { border-color: var(--hp-ink); }
.pc-acts .pc-main { background: var(--hp-green); border-color: var(--hp-green); color: #fff !important; }
.pc-acts .pc-main:hover { background: var(--hp-green-h); }
.pc-acts:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* Page service : outils, résultats, filtres */
.pf-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 18px; }
.pf-count { color: var(--hp-muted); font-weight: 700; }
.pf-tool { display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 0 16px; border-radius: 12px; border: 1px solid #dfe2ec; background: #fff; font: inherit; font-weight: 800; font-size: 15px; color: var(--hp-ink); cursor: pointer; }
.pf-tool:hover { border-color: var(--hp-ink); }
.pf-badge { min-width: 22px; height: 22px; padding: 0 6px; border-radius: 99px; background: var(--hp-green); color: #fff; font-size: 12.5px; display: grid; place-items: center; }
.pf-sort { margin: 0; cursor: default; }
.pf-sort label { color: var(--hp-muted); font-weight: 700; }
.pf-sort select { border: 0; background: none; font: inherit; font-weight: 800; color: var(--hp-ink); cursor: pointer; padding-right: 4px; }
.pf-seg { display: inline-flex; padding: 4px; border-radius: 12px; background: var(--hp-grey); }
.pf-seg a { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 9px; font-weight: 800; font-size: 14.5px; color: var(--hp-muted) !important; text-decoration: none !important; }
.pf-seg a.on { background: #fff; color: var(--hp-ink) !important; box-shadow: 0 2px 8px rgba(30, 27, 75, .08); }
.pf-active { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 22px; }
.pf-active > a:not(.hp-link) { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 99px; background: var(--hp-ink); color: #fff !important; text-decoration: none !important; font-weight: 700; font-size: 14px; }
.pf-active .hp-link { margin-left: 6px; font-size: 14.5px; }
.pf-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-bottom: 28px; }
.pf-bottom { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 48px; align-items: start; }
.pf-faq { margin-top: 20px; }
.pf-faq details { border-bottom: 1px solid #dfe2ec; }
.pf-faq summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 0; font-weight: 800; font-size: 17px; cursor: pointer; list-style: none; }
.pf-faq summary::-webkit-details-marker { display: none; }
.pf-faq summary svg { flex-shrink: 0; transition: transform .2s; }
.pf-faq details[open] summary svg { transform: rotate(180deg); }
.pf-faq details > div { padding: 0 0 18px; color: var(--hp-muted); line-height: 1.6; }
.pf-ask { margin-top: 20px; border: 0; background: none; font: inherit; cursor: pointer; padding: 0; }
.pf-side { display: flex; flex-direction: column; gap: 16px; }
.pf-box { padding: 22px; border-radius: 20px; background: #fff; border: 1px solid var(--hp-line); }
.pf-box h3 { margin: 0 0 14px; font-size: 18px; font-weight: 900; }
.pf-mini { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.pf-mini .pb-tile { padding: 10px; gap: 10px; border-radius: 14px; }
.pf-mini .pb-tile-ic { width: 38px; height: 38px; border-radius: 11px; }
.pf-mini .pb-tile b { font-size: 14.5px; } .pf-mini .pb-tile small { font-size: 13px; }
.pf-pro { background: #fff6ec; border-color: #fde1c3; }
.pf-pro p { margin: -6px 0 14px; color: var(--hp-muted); }

/* Panneau des filtres */
.pf-drawer { position: fixed; inset: 0; z-index: 200; visibility: hidden; }
.pf-drawer.open { visibility: visible; }
.pf-veil { position: absolute; inset: 0; background: rgba(14, 16, 48, .45); opacity: 0; transition: opacity .25s; }
.pf-drawer.open .pf-veil { opacity: 1; }
.pf-panel { position: absolute; top: 0; right: 0; bottom: 0; width: 440px; max-width: 100%; display: flex; flex-direction: column; margin: 0; background: #fff; transform: translateX(100%); transition: transform .28s ease; box-shadow: -20px 0 50px rgba(14, 16, 48, .18); }
.pf-drawer.open .pf-panel { transform: none; }
.pf-panel-head { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px; border-bottom: 1px solid var(--hp-line); }
.pf-panel-head h2 { margin: 0; font-size: 24px; font-weight: 900; }
.pf-close { width: 42px; height: 42px; border-radius: 50%; border: 1px solid #e0e3ed; background: #fff; display: grid; place-items: center; cursor: pointer; color: var(--hp-ink); }
.pf-panel-body { flex: 1; overflow-y: auto; padding: 8px 24px 24px; }
.pf-panel fieldset { border: 0; margin: 0; padding: 18px 0; border-bottom: 1px solid var(--hp-line); }
.pf-panel legend { padding: 0; margin-bottom: 10px; font-weight: 900; font-size: 16.5px; }
.pf-ck { display: flex; align-items: center; gap: 12px; padding: 8px 0; font-weight: 600; cursor: pointer; }
.pf-ck input { width: 20px; height: 20px; accent-color: var(--hp-green); }
.pf-price { display: flex; align-items: center; gap: 8px; padding: 0 14px; border: 1px solid #dfe2ec; border-radius: 12px; }
.pf-price input { flex: 1; min-width: 0; border: 0; outline: 0; font: inherit; font-size: 16px; min-height: 48px; }
.pf-price span { font-weight: 800; color: var(--hp-muted); }
.pf-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.pf-pills input { position: absolute; opacity: 0; pointer-events: none; }
.pf-pills span { display: inline-block; padding: 9px 16px; border-radius: 99px; border: 1px solid #dfe2ec; font-weight: 800; cursor: pointer; }
.pf-pills input:checked + span { background: var(--hp-ink); border-color: var(--hp-ink); color: #fff; }
.pf-pills input:focus-visible + span { outline: 3px solid var(--orange); outline-offset: 2px; }
.pf-panel-foot { display: flex; gap: 10px; padding: 16px 24px; border-top: 1px solid var(--hp-line); }
.pf-panel-foot .btn { flex: 1; justify-content: center; min-height: 50px; }
.pf-panel-foot .btn-green { background: var(--hp-green); }
html.pf-lock { overflow: hidden; }

@media (max-width: 1100px) {
  .pb-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pf-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .pb-grid, .pf-bottom { grid-template-columns: 1fr; gap: 28px; }
  .pb-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pb-list { grid-template-columns: 1fr; }
  .pb-help { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .pb-grid { padding-top: 32px; padding-bottom: 36px; }
  .pb-facts { padding: 18px; }
  .pb-facts dd { font-size: 19px; }
  .pb-cat-head { flex-direction: column; align-items: flex-start; gap: 14px; }
  .pb-cat-ic { width: 60px; height: 60px; border-radius: 18px; }
  .pb-tiles, .pf-grid, .pf-mini { grid-template-columns: 1fr; }
  .pb-search { flex-wrap: wrap; }
  .pb-search .sb-field { flex-basis: calc(100% - 62px); }
  .pb-search .btn { flex: 1; justify-content: center; }
  .pf-tools .hp-h2 { width: 100%; }
  .pf-tool, .pf-seg { flex: 1 1 auto; justify-content: center; }
  .pf-sort select { max-width: 130px; }
  .pf-panel { width: 100%; }
  .pc-acts a { font-size: 13.5px; gap: 4px; }
}

/* ================= Bannière carrousel (toutes les pages) ================= */
.pb-slides { position: absolute; inset: 0; }
.pb-slide { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 1.2s ease, transform 7s ease; transform: scale(1.04); }
.pb-slide.on { opacity: 1; transform: scale(1); }
.pb-dots { position: absolute; right: 24px; bottom: 18px; z-index: 3; display: flex; gap: 6px; }
.pb-dots button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 99px; background: rgba(255, 255, 255, .5); cursor: pointer; transition: width .2s; }
.pb-dots button.on { width: 26px; background: #fff; }
.pb-dots button:focus-visible { outline: 3px solid var(--orange); outline-offset: 2px; }
.pb-page { min-height: 300px; display: flex; align-items: flex-end; }
.pb-page.pb-sm { min-height: 220px; }
.pb-page-in { position: relative; z-index: 2; display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; width: 100%; padding-top: 44px; padding-bottom: 48px; }
.pb-page-txt { min-width: 0; max-width: 760px; }
.pb-title-md { font-size: clamp(32px, 4.6vw, 56px); }
.pb-title em { font-style: normal; color: #ffb547; }
.pb-crumbs svg { vertical-align: -2px; }
.pb-stat { flex-shrink: 0; display: flex; align-items: center; gap: 14px; padding: 18px 22px; border-radius: 18px; background: rgba(14, 16, 48, .62); border: 1px solid rgba(255, 255, 255, .18); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.pb-stat-ic { color: #ffb547; display: grid; }
.pb-stat b { display: block; font-size: 34px; line-height: 1; font-weight: 900; }
.pb-stat span span, .pb-stat > span:last-child { font-weight: 700; color: rgba(255, 255, 255, .85); }
@media (max-width: 700px) { .pb-page-in { flex-direction: column; align-items: flex-start; gap: 18px; padding-top: 30px; padding-bottom: 36px; } .pb-stat { padding: 12px 16px; } .pb-stat b { font-size: 26px; } .pb-dots { right: 16px; bottom: 12px; } }

/* ================= Photo de profil ================= */
.uav { border-radius: 50%; object-fit: cover; flex-shrink: 0; display: inline-grid; place-items: center; }
.uav-i { background: linear-gradient(135deg, #3730a3, #0c7d3d); color: #fff; font-weight: 900; }
.avatar.has-photo { padding: 0; overflow: hidden; background: none; }
.avatar.has-photo .uav { width: 100% !important; height: 100% !important; }

/* ================= SOS ================= */
.sos-panel { background: radial-gradient(120% 80% at 0% 0%, #dc2626 0%, #991b1b 55%, #6f1414 100%); }
.sos-wrap { max-width: 760px !important; }
.sos-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.sos-head h2 { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 30px; font-weight: 900; color: #fff; }
.sos-head p { margin: 6px 0 0; opacity: .9; max-width: 560px; }
.sos-x { width: 46px; height: 46px; flex-shrink: 0; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .4); background: rgba(255, 255, 255, .12); color: #fff; display: grid; place-items: center; cursor: pointer; }
.sos-main { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 22px 0 16px; }
.sos-tile { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; min-height: 190px; padding: 80px 16px 16px; border-radius: 20px; background: #fff; color: #7f1d1d !important; text-decoration: none !important; box-shadow: 0 14px 30px rgba(0, 0, 0, .18); transition: transform .15s; }
.sos-tile:hover { transform: translateY(-2px); }
.sos-tile > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sos-tile-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .05) 20%, rgba(80, 10, 10, .85)); }
.sos-tile:has(img) { color: #fff !important; }
.sos-tile-ic { position: absolute; top: 14px; left: 14px; width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; background: #fee2e2; color: #b91c1c; }
.sos-tile-txt { position: relative; z-index: 1; }
.sos-tile-txt b { display: block; font-size: 18px; font-weight: 900; }
.sos-tile-num { display: block; font-size: 28px; font-weight: 900; letter-spacing: .02em; }
.sos-tile-txt small { display: block; margin-top: 2px; font-size: 13px; font-weight: 600; opacity: .8; line-height: 1.35; }
.sos-tile-call { position: absolute; top: 14px; right: 14px; z-index: 1; width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: #16a34a; color: #fff; }
.sos-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sos-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; border-radius: 14px; border: 1px solid rgba(255, 255, 255, .5); background: rgba(255, 255, 255, .14); color: #fff; font: inherit; font-weight: 800; cursor: pointer; }
.sos-btn:hover { background: rgba(255, 255, 255, .24); }
.sos-msg { margin: 10px 0 0; font-weight: 700; }
.sos-h3 { margin: 26px 0 10px; font-size: 19px; font-weight: 900; color: #fff; }
.sos-rows { display: grid; gap: 8px; }
.sos-row { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; background: rgba(255, 255, 255, .12); color: #fff !important; text-decoration: none !important; }
.sos-row b { display: block; } .sos-row b a { color: #fff !important; }
.sos-row small { display: block; opacity: .8; font-weight: 600; }
.sos-row-ic { width: 44px; height: 44px; flex-shrink: 0; border-radius: 12px; background: #fff; color: #b91c1c; display: grid; place-items: center; overflow: hidden; }
.sos-row-ic img { width: 100%; height: 100%; object-fit: cover; }
.sos-row-go, .sos-row-btns { margin-left: auto; display: flex; gap: 6px; }
.sos-row-go, .sos-row-btns a { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: #16a34a; color: #fff !important; }
.sos-row-btns a + a { background: rgba(255, 255, 255, .2); }
.sos-note { margin-top: 18px; opacity: .9; } .sos-note a { color: #fff !important; font-weight: 800; }
.sos-page { background: #7f1d1d; color: #fff; padding: 36px 0 60px; }
.sos-page .wrap { max-width: 860px; }
.sos-city { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 6px; }
.sos-city a { padding: 7px 14px; border-radius: 99px; background: rgba(255, 255, 255, .14); color: #fff !important; font-weight: 700; text-decoration: none !important; }
.sos-city a.on { background: #fff; color: #991b1b !important; }
@media (max-width: 640px) { .sos-main { grid-template-columns: 1fr 1fr; } .sos-tile { min-height: 150px; } .sos-tile-num { font-size: 22px; } .sos-tile-txt small { display: none; } }

/* ================= Les services en cases photo (option A) ================= */
.sv-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.sv-tile { position: relative; overflow: hidden; display: block; aspect-ratio: 4 / 3; border-radius: 20px; color: #fff !important; text-decoration: none !important; isolation: isolate;
  background: linear-gradient(150deg, color-mix(in srgb, var(--c) 70%, #fff) 0%, var(--c) 55%, color-mix(in srgb, var(--c) 60%, #1e1b4b) 100%); box-shadow: 0 10px 26px rgba(30, 27, 75, .10); transition: transform .2s, box-shadow .2s; }
.sv-tile:hover { transform: translateY(-3px); box-shadow: 0 18px 40px rgba(30, 27, 75, .18); }
.sv-tile:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
.sv-tile > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .5s; }
.sv-tile:hover > img { transform: scale(1.06); }
.sv-big { position: absolute; right: -6px; top: -4px; color: rgba(255, 255, 255, .22); z-index: -1; }
.sv-shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(14, 16, 48, 0) 35%, rgba(14, 16, 48, .78) 100%); }
.sv-tile:not(.has-photo) .sv-shade { background: linear-gradient(180deg, rgba(14, 16, 48, 0) 45%, rgba(14, 16, 48, .35) 100%); }
.sv-ic { position: absolute; top: 14px; left: 14px; width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; background: #fff; color: var(--c); box-shadow: 0 6px 16px rgba(0, 0, 0, .15); }
.sv-txt { position: absolute; left: 16px; right: 56px; bottom: 14px; }
.sv-txt b { display: block; font-size: 18px; font-weight: 900; line-height: 1.2; text-shadow: 0 1px 8px rgba(0, 0, 0, .25); }
.sv-txt small { display: block; margin-top: 3px; font-size: 14px; font-weight: 700; opacity: .9; }
.sv-go { position: absolute; right: 14px; bottom: 14px; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .22); backdrop-filter: blur(6px); transition: background .2s; }
.sv-tile:hover .sv-go { background: var(--hp-green); }
.sv-tile.zero { filter: saturate(.75); }
@media (max-width: 1100px) { .sv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .sv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .sv-txt b { font-size: 15px; } .sv-txt small { font-size: 12.5px; } .sv-ic { width: 38px; height: 38px; border-radius: 12px; top: 10px; left: 10px; } .sv-go { display: none; } .sv-txt { left: 12px; right: 12px; bottom: 10px; } }

/* ================= Page service (style « Hôtels à Yopougon ») ================= */
.pb-svc { min-height: 330px; display: flex; align-items: flex-end; }
.pb-svc .pb-page-in { padding-bottom: 76px; }
.st-wrap { position: relative; z-index: 5; margin-top: -38px; }
.st-bar { display: flex; gap: 10px; overflow-x: auto; padding: 4px 2px 10px; scrollbar-width: none; }
.st-bar::-webkit-scrollbar { display: none; }
.st-card { flex-shrink: 0; display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px 10px 10px; border-radius: 14px; background: #fff; border: 1px solid var(--hp-line); box-shadow: 0 10px 24px rgba(30, 27, 75, .10); color: var(--hp-ink) !important; text-decoration: none !important; font-weight: 800; font-size: 15px; white-space: nowrap; transition: border-color .15s, transform .15s; }
.st-card:hover { border-color: var(--hp-green); transform: translateY(-1px); }
.st-card .st-cnt { font-weight: 600; color: var(--hp-muted); }
.st-card.on { background: var(--hp-green); border-color: var(--hp-green); color: #fff !important; }
.st-card.on .st-cnt { color: rgba(255, 255, 255, .8); }
.st-card.zero { opacity: .65; }
.st-ic { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: var(--k); color: #fff; }
.st-card.on .st-ic { background: rgba(255, 255, 255, .2); }

.tr-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 26px; }
.tr-opt { display: flex; align-items: center; gap: 16px; padding: 22px; border-radius: 20px; background: #fff; border: 1px solid var(--hp-line); color: var(--hp-ink) !important; text-decoration: none !important; box-shadow: 0 10px 26px rgba(30, 27, 75, .07); transition: border-color .15s, box-shadow .15s; }
.tr-opt:hover { border-color: var(--hp-green); box-shadow: 0 16px 34px rgba(30, 27, 75, .12); }
.tr-opt b { display: block; font-size: 20px; font-weight: 900; } .tr-opt small { display: block; margin-top: 4px; color: var(--hp-muted); font-size: 15px; line-height: 1.45; }
.tr-opt-ic { width: 64px; height: 64px; flex-shrink: 0; border-radius: 18px; display: grid; place-items: center; background: #fff3e0; color: #c2410c; }
.tr-opt-go { margin-left: auto; flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; font-weight: 800; color: var(--hp-green); white-space: nowrap; }
.tr-taxi { background: linear-gradient(120deg, #fff7ed, #fff); }

.sv-main { display: grid; grid-template-columns: 260px minmax(0, 1fr) 300px; gap: 24px; align-items: start; margin-top: 26px; margin-bottom: 56px; }
.sv-side { position: sticky; top: 86px; display: grid; gap: 14px; max-height: calc(100vh - 100px); overflow-y: auto; scrollbar-width: thin; }
.sv-side-h { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 19px; font-weight: 900; }
.sv-side-box { padding: 16px; border-radius: 18px; background: #fff; border: 1px solid var(--hp-line); }
.sv-side-box h3 { margin: 0 0 8px; font-size: 16px; font-weight: 900; }
.sv-link { display: flex; justify-content: space-between; gap: 8px; padding: 6px 8px; border-radius: 8px; color: var(--hp-ink) !important; text-decoration: none !important; font-weight: 600; font-size: 14.5px; }
.sv-link span { color: var(--hp-muted); font-weight: 600; }
.sv-link:hover { background: var(--hp-grey); }
.sv-link.on { background: #e7f5ec; color: var(--hp-green) !important; font-weight: 800; }
.sv-link.zero { opacity: .55; }
.pf-inline { padding: 4px 16px 16px; }
.pf-inline fieldset { padding: 12px 0; }
.pf-inline legend { font-size: 15px; }
.pf-inline .pf-ck { padding: 5px 0; font-size: 14.5px; }
.pf-eqs { display: grid; grid-template-columns: 1fr; }
.sv-search { display: flex; gap: 10px; flex: 1; }
.sv-search-f { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; padding: 0 14px; border-radius: 12px; border: 1px solid #dfe2ec; background: #fff; color: var(--hp-muted); }
.sv-search-f input { flex: 1; min-width: 0; width: 0; border: 0; outline: 0; font: inherit; font-size: 15.5px; min-height: 46px; background: none; color: var(--hp-ink); }
.sv-search .btn { min-height: 48px; background: var(--hp-green); }
.sv-count { margin: 4px 0 16px; color: var(--hp-muted); font-weight: 600; } .sv-count b { color: var(--hp-ink); }
.sv-grid-res { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
@media (min-width: 1500px) { .sv-grid-res { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.sv-only-m { display: none; }
.sv-right { position: sticky; top: 86px; display: grid; gap: 14px; }
.sv-mapbox, .sv-near { padding: 14px; border-radius: 18px; background: #fff; border: 1px solid var(--hp-line); }
.sv-right-h { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.sv-right h3 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 16.5px; font-weight: 900; }
.sv-right h3 svg { color: var(--hp-green); }
.sv-map { height: 250px !important; min-height: 0 !important; margin: 0 !important; border-radius: 12px; }
.sv-near h3 { margin-bottom: 10px; }
.sv-near-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--hp-line); color: var(--hp-ink) !important; text-decoration: none !important; }
.sv-near-row:last-of-type { border-bottom: 0; }
.sv-near-ph { width: 64px; height: 48px; flex-shrink: 0; border-radius: 10px; overflow: hidden; display: grid; place-items: center; color: #fff; background: var(--c); }
.sv-near-ph img { width: 100%; height: 100%; object-fit: cover; }
.sv-near-t { min-width: 0; flex: 1; } .sv-near-t b { display: block; font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .sv-near-t small { color: var(--hp-muted); font-size: 13px; }
.sv-near-r { text-align: right; font-weight: 800; font-size: 14px; white-space: nowrap; } .sv-near-r small { display: block; color: var(--hp-muted); font-weight: 600; font-size: 12px; }
@media (max-width: 1240px) { .sv-main { grid-template-columns: 240px minmax(0, 1fr); } .sv-right { grid-column: 1 / -1; position: static; grid-template-columns: 1fr 1fr 1fr; } }
@media (max-width: 900px) {
  .sv-main { grid-template-columns: 1fr; } .sv-side { display: none; } .sv-only-m { display: inline-flex; }
  .sv-right { grid-template-columns: 1fr; } .tr-choice { grid-template-columns: 1fr; } .tr-opt-go { display: none; }
  .pb-svc .pb-page-in { padding-bottom: 60px; }
}
@media (max-width: 640px) { .sv-grid-res { grid-template-columns: 1fr; } .sv-search { flex-wrap: wrap; } .sv-search .btn { width: 100%; } .pf-seg { margin-left: 0 !important; } }

/* Carte d'établissement (version page service) */
.pc-pop { background: #dc2626 !important; color: #fff !important; }
.pc-rate { position: absolute; left: 12px; bottom: 12px; display: inline-flex; align-items: center; gap: 4px; padding: 4px 9px; border-radius: 9px; background: rgba(255, 255, 255, .95); color: var(--hp-ink); font-weight: 800; font-size: 13.5px; }
.pc-rate small { color: var(--hp-muted); font-weight: 600; }
.pc-vid { position: absolute; right: 12px; bottom: 12px; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: rgba(14, 16, 48, .7); color: #fff; }
.pc-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.pc-name { min-width: 0; }
.pc-name h3 { margin-top: 2px; }
.pc-price { text-align: right; flex-shrink: 0; }
.pc-price b { display: block; font-size: 21px; font-weight: 900; line-height: 1.1; color: var(--hp-ink); }
.pc-price small { font-size: 12.5px; color: var(--hp-muted); font-weight: 700; }
.pc-loc { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin-top: 6px; font-size: 14px; color: var(--hp-muted); }
.pc-dir { margin-left: auto; display: inline-flex; align-items: center; gap: 3px; font-weight: 800; font-size: 13px; color: var(--hp-green) !important; text-decoration: none !important; }
.pc-open { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; }
.pc-open .pc-resa { margin-left: 0; }
.pc-noav { font-size: 13px; color: var(--hp-muted); font-weight: 600; }
.pc .hp-body .hp-price { display: none; }

/* Carte d'un bien immobilier */
.bc-feat { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; font-size: 13.5px; font-weight: 700; color: var(--hp-muted); }
.bc-feat span { display: inline-flex; align-items: center; gap: 4px; }
.bc-ok { color: var(--hp-green); }
.bc-price { margin-top: auto; padding-top: 10px; font-size: 20px; font-weight: 900; color: var(--hp-ink); }
.pf-inline fieldset { border: 0; margin: 0; border-bottom: 1px solid var(--hp-line); padding: 12px 0; min-width: 0; }
.pf-inline legend { padding: 0; margin-bottom: 8px; font-weight: 900; }
.pf-inline .pf-ck input { width: 18px; height: 18px; accent-color: var(--hp-green); }
.pf-inline .pf-pills span { padding: 7px 12px; font-size: 14px; }
.pb-mag { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 40px; }
@media (max-width: 1000px) { .pb-mag { grid-template-columns: 1fr; } }
.pb-mapcover .btn { white-space: normal; text-align: center; max-width: calc(100% - 32px); }

/* ================= Fiche détaillée : chambres, menu, services, produits, offices, biens ================= */
.of-box { margin-top: 18px; }
.of-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.of-head h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 22px; }
.of-head h2 svg { color: var(--hp-green); }
.of-video video, .of-media video { width: 100%; display: block; border-radius: 14px; background: #000; aspect-ratio: 4 / 3; object-fit: cover; }
.of-noimg { width: 100%; height: 100%; display: grid; place-items: center; color: #fff; background: linear-gradient(140deg, color-mix(in srgb, var(--c) 60%, #fff), var(--c)); }
.of-rooms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.of-room { border: 1px solid var(--hp-line); border-radius: 18px; overflow: hidden; display: flex; flex-direction: column; background: #fff; }
.of-media { position: relative; aspect-ratio: 4 / 3; background: #eef1f6; }
.of-media > img, .of-media video { width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.of-vtag { position: absolute; top: 10px; left: 10px; display: inline-flex; align-items: center; gap: 4px; padding: 4px 9px; border-radius: 8px; background: rgba(14, 16, 48, .75); color: #fff; font-size: 12.5px; font-weight: 800; pointer-events: none; }
.of-body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.of-body h3 { margin: 0; font-size: 17px; font-weight: 900; }
.of-body p { margin: 2px 0 0; color: var(--hp-muted); font-size: 14.5px; }
.of-meta { display: flex; gap: 12px; font-size: 14px; font-weight: 700; color: var(--hp-muted); } .of-meta span { display: inline-flex; align-items: center; gap: 4px; }
.of-foot { margin-top: auto; padding-top: 10px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.of-price { font-size: 18px; font-weight: 900; color: var(--hp-ink); } .of-price small { font-size: 13px; color: var(--hp-muted); font-weight: 700; } .of-price s { color: var(--hp-muted); font-weight: 700; font-size: 14px; margin-right: 4px; }
.of-tabs { margin-bottom: 14px; }
.of-tabs small { font-weight: 600; opacity: .7; }
.of-menu { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; }
.of-dish { display: flex; align-items: center; gap: 12px; padding: 8px; border-radius: 14px; border: 1px solid var(--hp-line); }
.of-dish-ph { width: 76px; height: 76px; flex-shrink: 0; border-radius: 12px; overflow: hidden; background: #f3f4f6; }
.of-dish-ph img { width: 100%; height: 100%; object-fit: cover; }
.of-dish-t { flex: 1; min-width: 0; } .of-dish-t b { display: block; font-size: 15.5px; } .of-dish-t small { display: block; color: var(--hp-muted); font-size: 13.5px; line-height: 1.35; }
.of-dish-p { display: flex; flex-direction: column; align-items: flex-end; font-weight: 900; white-space: nowrap; color: var(--hp-green); }
.of-services { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.of-svc { border: 1px solid var(--hp-line); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; }
.of-svc-ph { aspect-ratio: 4 / 3; background: #fef2f2; } .of-svc-ph img { width: 100%; height: 100%; object-fit: cover; }
.of-prods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.of-prod { border: 1px solid var(--hp-line); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; }
.of-prod-ph { position: relative; aspect-ratio: 4 / 3; background: #f8fafc; } .of-prod-ph img { width: 100%; height: 100%; object-fit: cover; }
.of-promo { position: absolute; top: 10px; left: 10px; padding: 5px 10px; border-radius: 10px; background: #dc2626; color: #fff; font-weight: 900; font-size: 15px; box-shadow: 0 6px 14px rgba(220, 38, 38, .35); }
.of-rub { font-size: 12.5px; font-weight: 800; color: var(--hp-muted); }
.of-biens { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.cu-week { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.cu-day { padding: 14px; border-radius: 16px; border: 1px solid var(--hp-line); background: #fff; }
.cu-day.today { border-color: var(--hp-green); background: #f0faf4; }
.cu-day h3 { margin: 0 0 8px; font-size: 16px; } .cu-day h3 small { font-size: 12px; color: var(--hp-green); font-weight: 800; }
.cu-row { display: flex; gap: 10px; padding: 6px 0; border-top: 1px dashed var(--hp-line); }
.cu-row:first-of-type { border-top: 0; }
.cu-time { min-width: 90px; font-weight: 900; color: #7c3aed; font-variant-numeric: tabular-nums; }
.cu-row b { display: block; font-size: 14.5px; } .cu-row small { color: var(--hp-muted); font-size: 12.5px; }
@media (max-width: 760px) { .of-rooms, .of-menu, .of-biens { grid-template-columns: 1fr; } .of-services, .of-prods { grid-template-columns: 1fr 1fr; } }

/* ================= Immobilier ================= */
.re-filters { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)) auto; gap: 10px; align-items: end; padding: 16px; border-radius: 18px; background: #fff; border: 1px solid var(--hp-line); box-shadow: 0 10px 26px rgba(30, 27, 75, .06); }
.re-filters label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 800; color: var(--hp-muted); min-width: 0; }
.re-filters select, .re-filters input[type=number] { min-height: 44px; border-radius: 10px; border: 1px solid #dfe2ec; padding: 0 10px; font: inherit; font-size: 14.5px; color: var(--hp-ink); background: #fff; min-width: 0; }
.re-filters .re-ck { flex-direction: row; align-items: center; gap: 8px; min-height: 44px; color: var(--hp-ink); }
.re-filters .btn { min-height: 46px; background: var(--hp-green); }
.re-layout { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 24px; margin-top: 22px; align-items: start; }
.re-map { position: sticky; top: 86px; height: calc(100vh - 110px); }
.re-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-bottom: 22px; }
.re-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.re-gal { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 200px 200px; gap: 8px; border-radius: 20px; overflow: hidden; margin: 14px 0 22px; }
.re-ph { position: relative; padding: 0; border: 0; cursor: zoom-in; background: #eee; overflow: hidden; }
.re-ph img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; } .re-ph:hover img { transform: scale(1.04); }
.re-ph.main { grid-row: span 2; }
.re-more { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(14, 16, 48, .55); color: #fff; font-weight: 900; font-size: 20px; }
.re-detail { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 28px; align-items: start; }
.re-badges { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.re-title { margin: 10px 0 4px; font-size: clamp(26px, 3.4vw, 38px); font-weight: 900; }
.re-feats { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 10px; margin: 18px 0 4px; }
.re-feats div { display: flex; flex-direction: column; gap: 2px; padding: 14px; border-radius: 16px; background: #fff; border: 1px solid var(--hp-line); }
.re-feats svg { color: #b45309; } .re-feats b { font-size: 20px; font-weight: 900; } .re-feats small { color: var(--hp-muted); font-weight: 700; }
.re-videos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.re-docs { list-style: none; padding: 0; margin: 0 0 10px; display: grid; gap: 6px; } .re-docs li { display: flex; gap: 8px; align-items: center; font-weight: 700; } .re-docs svg { color: var(--hp-green); }
.re-side { position: sticky; top: 86px; }
.re-price { font-size: 32px; font-weight: 900; color: var(--hp-ink); } .re-price small { font-size: 15px; color: var(--hp-muted); }
.re-agence { display: flex; gap: 12px; align-items: center; margin: 16px 0; padding: 12px; border-radius: 14px; background: var(--hp-grey); }
.re-ag-ph { width: 48px; height: 48px; flex-shrink: 0; border-radius: 12px; overflow: hidden; display: grid; place-items: center; background: #fff; color: #b45309; } .re-ag-ph img { width: 100%; height: 100%; object-fit: cover; }
.re-agence b { display: block; } .re-agence small { color: var(--hp-muted); }
.re-lightbox { position: fixed; inset: 0; z-index: 300; background: rgba(8, 10, 30, .94); display: grid; place-items: center; }
.re-lightbox[hidden] { display: none; }
.re-lightbox img { max-width: 92vw; max-height: 84vh; border-radius: 12px; }
.re-lightbox button { position: absolute; width: 52px; height: 52px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .14); color: #fff; display: grid; place-items: center; cursor: pointer; }
.re-lb-x { top: 18px; right: 18px; } .re-lb-p { left: 18px; top: 50%; } .re-lb-n { right: 18px; top: 50%; }
.re-lb-c { position: absolute; bottom: 18px; color: #fff; font-weight: 800; }
@media (max-width: 1100px) { .re-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); } .re-layout, .re-detail { grid-template-columns: 1fr; } .re-map { position: static; height: 360px; } .re-side { position: static; } }
@media (max-width: 640px) { .re-filters { grid-template-columns: 1fr 1fr; } .re-grid, .re-grid-2, .re-videos { grid-template-columns: 1fr; } .re-gal { grid-template-columns: 1fr 1fr; grid-template-rows: 220px 110px; } .re-ph.main { grid-column: span 2; grid-row: auto; } .re-ph:nth-child(n+4) { display: none; } }

/* ================= Taxi ================= */
.tx { position: relative; display: grid; grid-template-columns: 420px minmax(0, 1fr); height: calc(100vh - 72px); min-height: 560px; }
.tx-map { grid-column: 2; grid-row: 1; position: relative; background: #e8eef3; z-index: 1; }
.tx-nomap { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 8px; padding: 30px; text-align: center; color: var(--hp-muted); }
.tx-panel { grid-column: 1; grid-row: 1; overflow-y: auto; padding: 22px; background: var(--hp-grey); border-right: 1px solid var(--hp-line); z-index: 2; }
.tx-card { background: #fff; border: 1px solid var(--hp-line); border-radius: 22px; padding: 22px; box-shadow: 0 14px 34px rgba(30, 27, 75, .08); }
.tx-card h1 { margin: 0; font-size: 28px; font-weight: 900; } .tx-card h2 { margin: 6px 0 0; font-size: 22px; text-align: center; }
.tx-lead { margin: 6px 0 16px; color: var(--hp-muted); }
.tx-search .tx-lead { text-align: center; }
.tx-route { border: 1px solid var(--hp-line); border-radius: 16px; padding: 6px 12px; }
.tx-pt { display: flex; align-items: center; gap: 12px; padding: 8px 0; }
.tx-pt small { display: block; font-size: 12px; font-weight: 800; color: var(--hp-muted); text-transform: none; }
.tx-pt b { font-size: 15px; }
.tx-pt input { width: 100%; border: 0; outline: 0; font: inherit; font-size: 16px; font-weight: 700; padding: 2px 0; color: var(--hp-ink); }
.tx-dot { width: 14px; height: 14px; flex-shrink: 0; border-radius: 50%; } .tx-dot-a { background: #2563eb; box-shadow: 0 0 0 4px #dbeafe; } .tx-dot-b { background: #dc2626; border-radius: 3px; box-shadow: 0 0 0 4px #fee2e2; }
.tx-line { margin-left: 6px; height: 14px; border-left: 2px dashed #cbd5e1; }
.tx-mini { margin-left: auto; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--hp-line); background: #fff; display: grid; place-items: center; cursor: pointer; color: var(--hp-ink); }
.tx-hint { display: flex; gap: 6px; align-items: center; margin: 10px 0 0; font-size: 13.5px; color: var(--hp-muted); font-weight: 600; }
.tx-options { display: grid; gap: 8px; margin-top: 14px; }
.tx-opt { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 14px; border: 2px solid var(--hp-line); cursor: pointer; }
.tx-opt input { position: absolute; opacity: 0; pointer-events: none; }
.tx-opt.on { border-color: var(--hp-green); background: #f0faf4; }
.tx-opt b { display: block; } .tx-opt small { color: var(--hp-muted); font-weight: 600; }
.tx-opt-ic { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--c); color: #fff; }
.tx-opt-p { margin-left: auto; font-size: 17px; font-weight: 900; }
.tx-tel { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding: 0 12px; border: 1px solid var(--hp-line); border-radius: 12px; color: var(--hp-muted); }
.tx-tel input { flex: 1; border: 0; outline: 0; font: inherit; min-height: 46px; }
.tx-go { margin-top: 14px; min-height: 54px; font-size: 16.5px; background: var(--hp-green); }
.tx-go:disabled { opacity: .55; cursor: not-allowed; }
.tx-msg { margin: 10px 0 0; font-weight: 700; color: var(--hp-muted); font-size: 14px; }
.tx-hist { margin-top: 14px; font-size: 14px; } .tx-hist summary { cursor: pointer; font-weight: 800; } .tx-hist div { padding: 6px 0; border-bottom: 1px solid var(--hp-line); }
.tx-radar { position: relative; width: 150px; height: 150px; margin: 10px auto; display: grid; place-items: center; }
.tx-radar span { position: absolute; inset: 0; border-radius: 50%; border: 3px solid var(--hp-green); opacity: 0; animation: tx-wave 2.4s infinite; }
.tx-radar span:nth-child(2) { animation-delay: .8s; } .tx-radar span:nth-child(3) { animation-delay: 1.6s; }
.tx-radar i { width: 70px; height: 70px; border-radius: 50%; background: var(--hp-green); color: #fff; display: grid; place-items: center; font-style: normal; z-index: 1; }
@keyframes tx-wave { from { transform: scale(.4); opacity: .9; } to { transform: scale(1.1); opacity: 0; } }
.tx-eta { text-align: center; padding: 6px 0 14px; } .tx-eta b { display: block; font-size: 52px; font-weight: 900; line-height: 1; color: var(--hp-green); } .tx-eta span { font-weight: 700; color: var(--hp-muted); }
.tx-bar { height: 6px; border-radius: 9px; background: var(--hp-line); margin-top: 12px; overflow: hidden; } .tx-bar i { display: block; height: 100%; width: 0; background: var(--hp-green); transition: width .2s; }
.tx-driver { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 16px; background: var(--hp-grey); }
.tx-driver img { width: 58px; height: 58px; border-radius: 50%; object-fit: cover; background: #ddd; }
.tx-driver b { display: block; font-size: 17px; } .tx-driver small { color: var(--hp-muted); font-weight: 700; }
.tx-call { margin-left: auto; width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: var(--hp-green); color: #fff !important; }
.tx-car, .tx-sum { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 12px 0; }
.tx-sum { grid-template-columns: 1.6fr 1fr 1fr; }
.tx-car small, .tx-sum small { display: block; font-size: 12px; font-weight: 800; color: var(--hp-muted); } .tx-car b, .tx-sum b { font-size: 14.5px; }
.tx-plate { display: inline-block; padding: 2px 8px; border-radius: 6px; border: 2px solid var(--hp-ink); font-family: ui-monospace, monospace; letter-spacing: .04em; }
.tx-pin { width: 34px; height: 34px; border-radius: 50%; background: var(--c); color: #fff; display: grid; place-items: center; border: 3px solid #fff; box-shadow: 0 4px 12px rgba(0, 0, 0, .3); }
.tx-me { width: 24px; height: 24px; border-radius: 50%; background: rgba(37, 99, 235, .25); display: grid; place-items: center; } .tx-me span { width: 14px; height: 14px; border-radius: 50%; background: #2563eb; border: 3px solid #fff; }
@media (max-width: 900px) { .tx { grid-template-columns: 1fr; grid-template-rows: 42vh auto; height: auto; } .tx-map { grid-column: 1; grid-row: 1; min-height: 300px; } .tx-panel { grid-column: 1; grid-row: 2; border: 0; padding: 14px; margin-top: -26px; background: none; } }
[hidden] { display: none !important; }

/* ================= Connexion / inscription ================= */
.au { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); min-height: calc(100vh - 72px); background: var(--hp-grey); }
.au-side { position: relative; overflow: hidden; color: #fff; background: linear-gradient(140deg, #1e1b4b, #0c7d3d); }
.au-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14, 16, 48, .25) 0%, rgba(14, 16, 48, .78) 75%); }
.au-side-in { position: relative; z-index: 2; height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 40px 48px 56px; }
.au-logo { color: #fff !important; font-size: 22px; } .au-logo b { color: var(--orange); }
.au-side h2 { margin: 0; font-size: clamp(30px, 3.4vw, 46px); line-height: 1.1; font-weight: 900; color: #fff; max-width: 560px; }
.au-side p { margin: 14px 0 20px; font-size: 18px; opacity: .92; max-width: 520px; }
.au-side ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.au-side li { display: flex; gap: 10px; align-items: center; font-weight: 700; } .au-side li svg { flex-shrink: 0; width: 28px; height: 28px; padding: 5px; border-radius: 50%; background: rgba(255, 255, 255, .18); }
.au-main { display: grid; place-items: center; padding: 36px 20px; }
.au-card { width: 100%; max-width: 480px; background: #fff; border-radius: 24px; padding: 30px; box-shadow: 0 24px 60px rgba(30, 27, 75, .10); border: 1px solid var(--hp-line); }
.au-card h1 { margin: 0; font-size: 28px; font-weight: 900; }
.au-sub { margin: 6px 0 20px; color: var(--hp-muted); }
.au-tabs { display: grid; grid-template-columns: 1fr 1fr; padding: 4px; border-radius: 14px; background: var(--hp-grey); margin-bottom: 22px; }
.au-tabs a { text-align: center; padding: 10px; border-radius: 10px; font-weight: 800; color: var(--hp-muted) !important; text-decoration: none !important; }
.au-tabs a.on { background: #fff; color: var(--hp-ink) !important; box-shadow: 0 2px 8px rgba(30, 27, 75, .08); }
.fx { display: block; margin-bottom: 14px; }
.fx-l { display: flex; justify-content: space-between; margin-bottom: 6px; font-weight: 800; font-size: 14.5px; }
.fx-l a { font-weight: 700; }
.fx-in { display: flex; align-items: center; gap: 10px; padding: 0 12px; border: 1.5px solid #dfe2ec; border-radius: 12px; background: #fff; color: #8a90a6; transition: border-color .15s, box-shadow .15s; }
.fx-in:focus-within { border-color: var(--hp-green); box-shadow: 0 0 0 4px rgba(12, 125, 61, .12); color: var(--hp-green); }
.fx-in input, .fx-in textarea { flex: 1; min-width: 0; width: 0; border: 0; outline: 0; background: none; font: inherit; font-size: 16px; color: var(--hp-ink); min-height: 48px; }
.fx-in textarea { min-height: 70px; resize: vertical; padding: 0 0 10px; }
.fx-pre { font-weight: 800; color: var(--hp-ink); padding-right: 8px; border-right: 1px solid var(--hp-line); }
.fx-eye { width: 38px; height: 38px; border: 0; background: none; border-radius: 10px; display: grid; place-items: center; color: #8a90a6; cursor: pointer; }
.fx-eye:hover { background: var(--hp-grey); color: var(--hp-ink); }
.fx-eye svg + svg { display: none; } .fx-eye.on svg { display: none; } .fx-eye.on svg + svg { display: block; }
.fx.bad .fx-in, .bad > .fx-in { border-color: #dc2626; background: #fef2f2; color: #dc2626; box-shadow: 0 0 0 4px rgba(220, 38, 38, .10); }
.fx.bad .fx-l { color: #b91c1c; }
.fx-err { display: block; margin-top: 5px; color: #b91c1c; font-size: 13.5px; font-weight: 700; }
.au-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.au-photo { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; padding: 12px; border-radius: 16px; background: var(--hp-grey); }
.au-photo b { display: block; } .au-photo small { color: var(--hp-muted); font-size: 13px; }
.au-ph { position: relative; width: 74px; height: 74px; flex-shrink: 0; border-radius: 50%; display: grid; place-items: center; background: #fff; border: 2px dashed #c7cbe0; color: #8a90a6; cursor: pointer; overflow: hidden; }
.au-ph input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.au-ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.au-ph.has { border-style: solid; border-color: var(--hp-green); }
.au-str { margin: -6px 0 14px; } .au-bar { height: 6px; border-radius: 9px; background: var(--hp-line); overflow: hidden; } .au-bar i { display: block; height: 100%; width: 0; transition: width .25s, background .25s; }
.au-str[data-level="1"] i { background: #dc2626; } .au-str[data-level="2"] i { background: #f97316; } .au-str[data-level="3"] i { background: #eab308; } .au-str[data-level="4"] i { background: #16a34a; }
.au-str > span { display: block; margin-top: 4px; font-size: 13px; font-weight: 800; color: var(--hp-muted); min-height: 16px; }
.au-str ul { list-style: none; padding: 0; margin: 4px 0 0; display: flex; flex-wrap: wrap; gap: 6px; }
.au-str li { font-size: 12.5px; font-weight: 700; padding: 3px 9px; border-radius: 99px; background: var(--hp-grey); color: var(--hp-muted); }
.au-str li.ok { background: #e7f5ec; color: var(--hp-green); } .au-str li.ok::before { content: '✓ '; }
.au-ck { display: flex; gap: 10px; align-items: flex-start; margin: 8px 0; font-size: 14.5px; } .au-ck input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--hp-green); flex-shrink: 0; }
.fx-ck.bad { color: #b91c1c; }
.au-go { min-height: 52px; margin-top: 10px; font-size: 16.5px; background: var(--hp-green); }
.au-or { display: flex; align-items: center; gap: 12px; margin: 18px 0 12px; color: var(--hp-muted); font-weight: 700; font-size: 14px; }
.au-or::before, .au-or::after { content: ''; flex: 1; height: 1px; background: var(--hp-line); }
.au-social { display: grid; gap: 8px; }
.au-soc { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; border-radius: 12px; border: 1.5px solid #dfe2ec; font-weight: 800; color: var(--hp-ink) !important; text-decoration: none !important; background: #fff; }
.au-soc:hover { border-color: var(--hp-ink); }
.au-foot { margin: 16px 0 0; text-align: center; font-size: 14.5px; color: var(--hp-muted); }
.au-demo, .au-help { margin-top: 14px; font-size: 13.5px; color: var(--hp-muted); } .au-demo summary, .au-help summary { cursor: pointer; font-weight: 700; }
.au-canal { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 4px; }
.au-canal input { position: absolute; opacity: 0; } .au-canal span { display: flex; justify-content: center; align-items: center; gap: 6px; padding: 12px; border-radius: 12px; border: 1.5px solid #dfe2ec; font-weight: 800; cursor: pointer; }
.au-canal input:checked + span { border-color: var(--hp-green); background: #f0faf4; color: var(--hp-green); }
.au-otp { letter-spacing: .5em; font-size: 22px !important; font-weight: 900; }
@media (max-width: 900px) { .au { grid-template-columns: 1fr; } .au-side { min-height: 230px; } .au-side-in { padding: 24px; gap: 18px; } .au-side ul, .au-side p { display: none; } .au-side h2 { font-size: 26px; } .au-main { padding: 0 14px 30px; margin-top: -30px; position: relative; z-index: 3; } .au-card { padding: 22px; } }
@media (max-width: 420px) { .au-row { grid-template-columns: 1fr; gap: 0; } }
.au-ck { flex-wrap: wrap; } .au-ck .fx-err { width: 100%; margin: 2px 0 0 28px; }
.adm-media { display: block; margin-bottom: 8px; }
.adm-media img, .adm-media video { max-height: 160px; max-width: 100%; border-radius: 12px; display: block; }
.adm-media-empty { display: flex; align-items: center; gap: 8px; padding: 14px; border-radius: 12px; border: 1.5px dashed var(--line); color: var(--muted); font-size: 14px; }
.adm-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.adm-tabs a { padding: 9px 14px; border-radius: 10px; background: #fff; border: 1px solid var(--line); font-weight: 800; color: var(--indigo-d) !important; text-decoration: none !important; }
.adm-tabs a.on { background: var(--indigo-d); color: #fff !important; border-color: var(--indigo-d); }
.adm-photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.adm-ph-card { background: #fff; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; }
.adm-ph-img { aspect-ratio: 16 / 10; display: grid; place-items: center; color: #b8bdd0; background: linear-gradient(150deg, color-mix(in srgb, var(--c, #e5e7eb) 45%, #fff), var(--c, #f1f2f6)); }
.adm-ph-img img { width: 100%; height: 100%; object-fit: cover; }
.adm-ph-ic { color: #fff; }
.adm-ph-body { padding: 12px; display: flex; flex-direction: column; gap: 6px; }
.adm-ph-body small { color: var(--muted); }
.adm-ph-body form { display: flex; gap: 6px; align-items: center; margin-top: 4px; }
.adm-file { position: relative; overflow: hidden; cursor: pointer; }
.adm-file input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.pw-opt { display: flex; gap: 12px; align-items: flex-start; padding: 12px; border: 1.5px solid var(--line); border-radius: 12px; cursor: pointer; }
.pw-opt:has(input:checked) { border-color: var(--green); background: #f0faf4; }
.pw-opt input { margin-top: 3px; accent-color: var(--green); } .pw-opt b { display: block; } .pw-opt small { color: var(--muted); }
.pw-show { display: flex; gap: 8px; align-items: center; } .pw-show code { font-size: 22px; font-weight: 900; padding: 8px 14px; border-radius: 10px; background: var(--bg); letter-spacing: .05em; }
.ms-row { display: flex; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); }
.ms-row:last-child { border-bottom: 0; }
.ms-row > span:nth-child(2) { flex: 1; min-width: 0; } .ms-row b { display: block; } .ms-row small { color: var(--muted); }
.ms-ic { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: #e7f5ec; color: var(--green); flex-shrink: 0; }
.bm-up { display: grid; grid-template-columns: 1fr 1fr auto; gap: 12px; align-items: stretch; }
.bm-drop { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 18px; border-radius: 14px; border: 2px dashed var(--line); text-align: center; cursor: pointer; color: var(--muted); }
.bm-drop b { color: var(--indigo-d); } .bm-drop input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.bm-drop:hover { border-color: var(--green); }
.bm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.bm-item { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: #fff; }
.bm-item.main { border: 2px solid var(--green); }
.bm-item img, .bm-item video { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.bm-acts { display: flex; justify-content: space-between; align-items: center; padding: 6px; gap: 6px; }
@media (max-width: 760px) { .bm-up { grid-template-columns: 1fr; } }
.rc-hero .pb-slides { z-index: 0; }
.rc-shade { z-index: 1; background: linear-gradient(115deg, rgba(225, 29, 72, .86) 0%, rgba(159, 18, 57, .72) 45%, rgba(30, 27, 75, .7) 100%) !important; }
.rc-hero::after { z-index: 1; }
.rc-face { display: inline-grid; margin-left: -8px; border: 3px solid rgba(255, 255, 255, .9); border-radius: 50%; }
.rc-face:first-child { margin-left: 0; }
.loc-hero .pb-slides { z-index: 0; }
.pb-partners { color: #fff; }
.pb-partners h1, .pb-partners .sub, .pb-partners .kicker { color: #fff; position: relative; }
.rc-tiles { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.rc-tiles .sv-tile { aspect-ratio: 1 / 1; }
.rc-tiles .sv-tile.on { outline: 4px solid var(--rose, #e11d48); outline-offset: 2px; }
.rc-tiles .sv-txt b { font-size: 16px; }
@media (max-width: 1100px) { .rc-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 760px) { .rc-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ================= Accueil : choix de la localité en deux listes ================= */
.pp-box { margin-top: 22px; padding: 10px; border-radius: 22px; background: rgba(255, 255, 255, .97); box-shadow: 0 24px 60px rgba(14, 16, 48, .25); max-width: 680px; color: var(--hp-ink); }
.pp-tabs { display: flex; gap: 4px; padding: 4px; margin-bottom: 8px; border-radius: 14px; background: var(--hp-grey); }
.pp-tabs button { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 9px 10px; border: 0; border-radius: 10px; background: none; font: inherit; font-weight: 800; font-size: 14.5px; color: var(--hp-muted); cursor: pointer; }
.pp-tabs button.on { background: #fff; color: var(--hp-ink); box-shadow: 0 2px 8px rgba(30, 27, 75, .08); }
.pp { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto auto; gap: 8px; align-items: end; padding: 4px; }
.pp-f { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pp-l { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; font-weight: 800; color: var(--hp-muted); padding-left: 4px; } .pp-l small { font-weight: 600; }
.pp select { width: 100%; min-height: 54px; padding: 0 12px; border-radius: 14px; border: 1.5px solid #dfe2ec; background: #fff; font: inherit; font-size: 16px; font-weight: 700; color: var(--hp-ink); }
.pp select:focus { outline: 0; border-color: var(--hp-green); box-shadow: 0 0 0 4px rgba(12, 125, 61, .12); }
.pp select:disabled { background: var(--hp-grey); color: var(--hp-muted); }
.pp-f.bad select { border-color: #dc2626; background: #fef2f2; }
.pp-mic { width: 54px; height: 54px; border-radius: 14px; border: 0; background: #3730a3; color: #fff; display: grid; place-items: center; cursor: pointer; }
.pp-mic.on { background: #dc2626; animation: yc-hop .9s infinite; }
.pp-go { min-height: 54px; border-radius: 14px; background: var(--hp-green); padding: 0 20px; }
.pp-hint { grid-column: 1 / -1; margin: 2px 4px 0; font-size: 13.5px; color: var(--hp-muted); display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.pp-loc { border: 0; background: none; padding: 0; font: inherit; font-weight: 800; color: var(--hp-green); cursor: pointer; display: inline-flex; gap: 4px; align-items: center; }
.pp-box .hp-hero, .pp-box .sb-row { margin: 0; }
@media (max-width: 700px) { .pp { grid-template-columns: 1fr 1fr; } .pp-f { grid-column: 1 / -1; } .pp-mic { width: 100%; } .pp-go { width: 100%; } }
.sv-main > *, .re-layout > *, .re-detail > * { min-width: 0; }
.sv-right > * { min-width: 0; }
@media (max-width: 1240px) { .sv-right { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) { .sv-right { grid-template-columns: minmax(0, 1fr); } }

/* Piège anti-robots : champ invisible pour les humains */
.hp-trap{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}

/* Reçu de réservation : QR code + code */
.rq-card{margin-top:14px;display:flex;gap:22px;align-items:center}
.rq-code{flex-shrink:0;width:210px;height:210px;border:1px solid var(--line,#e5e7eb);border-radius:14px;overflow:hidden;background:#fff}
.rq-code svg{display:block;width:100%;height:100%}
.rq-txt{min-width:0}
.rq-l{display:block;font-size:13px;color:var(--muted);font-weight:700}
.rq-num{display:block;font-size:30px;font-weight:900;letter-spacing:2px;margin:2px 0 8px}
.rq-txt p{margin:0 0 12px;color:var(--muted);font-size:14.5px}
.rq-ok{color:var(--green-d)!important;font-weight:800;display:flex;gap:6px;align-items:center}
@media(max-width:560px){.rq-card{flex-direction:column;text-align:center}.rq-code{width:230px;height:230px}}
@media print{header,footer,.site-header,.site-footer,.rq-print,.btn,nav{display:none!important}.rq-card{border:1px solid #ccc;box-shadow:none}}

/* Espace pro : scanner de QR code */
.sc-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:18px;align-items:start}
.sc-grid>*{min-width:0}
.sc-head h3{display:flex;gap:8px;align-items:center;margin:0 0 4px}
.sc-view{position:relative;aspect-ratio:4/3;margin:14px 0 12px;border-radius:16px;overflow:hidden;background:#0f172a;display:grid;place-items:center}
.sc-view video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sc-idle{display:flex;flex-direction:column;align-items:center;gap:8px;color:#94a3b8;font-weight:700;font-size:14px}
.sc-frame{position:absolute;inset:16% 22%;pointer-events:none;z-index:2}
.sc-frame i{position:absolute;width:34px;height:34px;border:4px solid #22c55e}
.sc-frame i:nth-child(1){top:0;left:0;border-right:0;border-bottom:0;border-radius:10px 0 0 0}
.sc-frame i:nth-child(2){top:0;right:0;border-left:0;border-bottom:0;border-radius:0 10px 0 0}
.sc-frame i:nth-child(3){bottom:0;left:0;border-right:0;border-top:0;border-radius:0 0 0 10px}
.sc-frame i:nth-child(4){bottom:0;right:0;border-left:0;border-top:0;border-radius:0 0 10px 0}
.sc-btns{display:flex;gap:8px;flex-wrap:wrap}
.sc-msg{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:var(--orange-l);color:var(--orange-d);font-weight:700}
.sc-manual{margin-top:16px;padding-top:14px;border-top:1px solid var(--line,#e5e7eb)}
.sc-manual label{display:block;font-weight:800;font-size:14px;margin-bottom:6px}
.sc-row{display:flex;gap:8px}.sc-row .in{flex:1;min-width:0;text-transform:uppercase;letter-spacing:1px;font-weight:800}
.sc-side{display:flex;flex-direction:column;gap:14px}
.sc-side .panel-box{margin:0}
.sc-res{display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:14px;font-size:14.5px}
.sc-res p{margin:2px 0 0}
.sc-ico{flex-shrink:0;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;color:#fff}
.sc-good{background:var(--green-l);color:var(--green-d)}.sc-good .sc-ico{background:var(--green)}
.sc-ok{background:var(--indigo-l);color:var(--indigo)}.sc-ok .sc-ico{background:var(--indigo)}
.sc-warn{background:var(--orange-l);color:var(--orange-d)}.sc-warn .sc-ico{background:var(--orange)}
.sc-bad{background:var(--red-l);color:var(--red)}.sc-bad .sc-ico{background:var(--red)}
.sc-code{font-size:22px;font-weight:900;letter-spacing:1.5px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.sc-dl{display:grid;grid-template-columns:110px 1fr;gap:8px 12px;margin:0 0 14px;font-size:14.5px}
.sc-dl dt{color:var(--muted);font-weight:700}.sc-dl dd{margin:0}
.sc-acts{display:flex;gap:8px;flex-wrap:wrap}
.sc-list{list-style:none;margin:0;padding:0}
.sc-list li+li{border-top:1px solid var(--line,#e5e7eb)}
.sc-list a{display:flex;gap:10px;align-items:center;padding:9px 0;color:inherit;text-decoration:none}
.sc-list a>span:nth-child(2){flex:1;min-width:0}.sc-list small{display:block;color:var(--muted)}
.sc-av{width:36px;height:36px;border-radius:50%;background:var(--indigo-l);color:var(--indigo);display:grid;place-items:center;font-weight:900;flex-shrink:0}
@media(max-width:860px){.sc-grid{grid-template-columns:1fr}.sc-dl{grid-template-columns:90px 1fr}}
.sc-grid .panel-box{padding:18px}
.sc-grid .panel-box>h3{padding:0 0 10px;border:0}
@media(max-width:860px){.sc-has .sc-side{order:-1}}

/* =====================================================================
   Fiche établissement (mise en page « dx ») : mosaïque, bandeau, onglets,
   à propos, offres, avis + colonne de réservation
   ===================================================================== */
.dx .wrap{max-width:1240px}
.dx-mosaic{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);gap:10px;height:clamp(300px,42vw,470px);border-radius:20px;overflow:hidden}
.dx-mosaic-1{grid-template-columns:1fr}
.dx-main-ph{position:relative;min-height:0}
.dx-thumbs{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:10px;min-height:0}
.dx-ph{position:relative;display:block;width:100%;height:100%;padding:0;border:0;background:#e5e7eb;overflow:hidden;cursor:pointer;min-height:0}
.dx-ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}
.dx-ph:hover img{transform:scale(1.04)}
.dx-ph-gen{display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--c,#0c7d3d),color-mix(in srgb,var(--c,#0c7d3d) 55%,#1e1b4b));cursor:default;height:100%}
.dx-badge{position:absolute;top:14px;left:14px;display:inline-flex;gap:6px;align-items:center;padding:6px 12px;border-radius:99px;background:var(--hp-green);color:#fff;font-weight:800;font-size:13px;box-shadow:0 6px 16px rgba(0,0,0,.18)}
.dx-allph{position:absolute;left:14px;bottom:14px;display:inline-flex;gap:8px;align-items:center;padding:9px 14px;border:0;border-radius:12px;background:rgba(255,255,255,.95);color:var(--hp-ink);font:inherit;font-weight:800;font-size:14px;cursor:pointer;box-shadow:0 6px 16px rgba(0,0,0,.15)}
.dx-allph:hover{background:#fff}
.dx-more span{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(17,24,39,.58);color:#fff;font-weight:700;font-size:14px}
.dx-more span b{font-size:28px;font-weight:900;line-height:1.1}

.dx-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-top:22px}
.dx-id{min-width:0}
.dx-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.dx-chip{display:inline-flex;gap:5px;align-items:center;padding:4px 11px;border-radius:99px;background:var(--green-l);color:var(--green-d);font-weight:800;font-size:13px}
.dx-chip-o{background:var(--orange-l);color:var(--orange-d)}
.dx-head h1{font-size:clamp(26px,3.4vw,38px);line-height:1.15;margin:0 0 8px;color:var(--hp-ink)}
.dx-verif{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#1d9bf0;color:#fff;vertical-align:middle;position:relative;top:-3px}
.dx-meta{display:flex;gap:8px 16px;align-items:center;flex-wrap:wrap;color:var(--hp-muted);font-weight:600;font-size:15px}
.dx-meta>span{display:inline-flex;gap:5px;align-items:center}
.dx-rate svg{color:#f5a524;fill:#f5a524}.dx-rate b{color:var(--hp-ink)}
.dx-lead{margin:10px 0 0;color:var(--hp-muted);max-width:760px}
.dx-tools{display:flex;gap:8px;flex-shrink:0}
.dx-tool{display:inline-flex;gap:6px;align-items:center;padding:10px 14px;border:1px solid var(--hp-line);border-radius:12px;background:#fff;color:var(--hp-ink);font:inherit;font-weight:800;font-size:14px;cursor:pointer}
.dx-tool:hover{border-color:var(--hp-green);color:var(--hp-green)}
.dx-tool.fav.on{color:var(--rose,#e11d48);border-color:currentColor}.dx-tool.fav.on svg{fill:currentColor}

.dx-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:20px;background:#fff;border:1px solid var(--hp-line);border-radius:18px;box-shadow:var(--shadow)}
.dx-si{display:flex;gap:12px;align-items:center;padding:16px 18px;min-width:0}
.dx-si+.dx-si{border-left:1px solid var(--hp-line)}
.dx-si-ic{flex-shrink:0;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--green-l);color:var(--hp-green)}
.dx-si div{min-width:0}
.dx-si small{display:block;color:var(--hp-muted);font-size:12.5px;font-weight:700}
.dx-si b{display:block;color:var(--hp-ink);font-size:15.5px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dx-si em{display:block;font-style:normal;font-size:12.5px;font-weight:700;color:var(--hp-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dx-si em.dx-ok{color:var(--hp-green)}.dx-si em.dx-no{color:var(--red)}

.dx-tabs{position:sticky;top:72px;z-index:25;margin:18px 0 0;background:rgba(246,247,251,.96);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--hp-line)}
.dx-tabs>div{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.dx-tabs>div::-webkit-scrollbar{display:none}
.dx-tabs a{flex-shrink:0;padding:14px 14px 12px;color:var(--hp-muted);font-weight:800;font-size:15px;border-bottom:3px solid transparent;white-space:nowrap}
.dx-tabs a:hover{color:var(--hp-ink)}
.dx-tabs a.on{color:var(--hp-green);border-bottom-color:var(--hp-green)}

.dx-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:26px;align-items:start;margin-top:22px}
.dx-main{min-width:0}
.dx-main [id],.dx-side [id]{scroll-margin-top:136px}
.dx-sec{background:#fff;border:1px solid var(--hp-line);border-radius:18px;padding:22px;box-shadow:var(--shadow);margin-bottom:18px}
.dx-sec-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.dx-sec h2,.dx-main .of-head h2{font-size:22px;margin:0;color:var(--hp-ink)}
.dx-main .of-box{margin:0 0 18px;border-radius:18px;border:1px solid var(--hp-line);padding:22px}

.dx-about{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:22px;align-items:start}
.dx-about-media{border-radius:14px;overflow:hidden;aspect-ratio:4/3;background:#e5e7eb}
.dx-about-media img,.dx-about-media video{width:100%;height:100%;object-fit:cover;display:block}
.dx-about-media .dx-ph-gen{height:100%}
.dx-about-txt h2{margin:0 0 10px!important}
.dx-about-txt p{margin:0 0 14px;color:#3b4157}
.dx-check{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 14px}
.dx-check li{display:flex;gap:8px;align-items:flex-start;font-weight:700;font-size:14.5px;color:var(--hp-ink)}
.dx-check svg{flex-shrink:0;width:20px;height:20px;padding:3px;border-radius:50%;background:var(--green-l);color:var(--hp-green);margin-top:1px}

.dx-rv-sum{display:grid;grid-template-columns:170px 1fr;gap:22px;align-items:center;padding:16px;border-radius:14px;background:var(--hp-grey)}
.dx-rv-score{text-align:center}
.dx-rv-score b{display:block;font-size:46px;line-height:1;font-weight:900;color:var(--hp-ink);margin-bottom:4px}
.dx-rv-score small{display:block;color:var(--hp-muted);font-weight:700}
.dx-bar{display:grid;grid-template-columns:42px 1fr 30px;gap:10px;align-items:center;font-size:13.5px;font-weight:700;margin:3px 0}
.dx-bar span:first-child{display:inline-flex;gap:3px;align-items:center}.dx-bar span:first-child svg{color:#f5a524;fill:#f5a524}
.dx-bar i{height:8px;border-radius:99px;background:#e3e6ee;overflow:hidden}.dx-bar s{display:block;height:100%;background:#f5a524;border-radius:99px}
.dx-rv-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.dx-rv{border:1px solid var(--hp-line);border-radius:14px;padding:14px 16px;min-width:0}
.dx-rv header{display:flex;gap:10px;align-items:center;margin-bottom:8px}
.dx-rv header>div{flex:1;min-width:0}
.dx-rv header b{display:block;color:var(--hp-ink);font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dx-rv header small{color:var(--hp-muted);font-size:12.5px}
.dx-av{width:40px;height:40px;border-radius:50%;flex-shrink:0;object-fit:cover;display:grid;place-items:center;background:var(--indigo-l);color:var(--indigo);font-weight:900}
.dx-rv p{margin:0;font-size:14.5px;color:#3b4157}
.dx-reply{margin-top:10px;padding:10px 12px;border-radius:10px;background:var(--green-l);font-size:14px;color:#24493a}
.dx-reply b{display:block;color:var(--green-d);font-size:13px}
.dx-rv-form{margin-top:16px}

.dx-side{display:flex;flex-direction:column;gap:14px;min-width:0}
.dx-book{border-radius:18px;overflow:hidden;background:#fff;border:1px solid var(--hp-line);box-shadow:var(--shadow-h)}
.dx-book-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:16px 18px;background:linear-gradient(120deg,#0c7d3d,#0a5f30);color:#fff}
.dx-book-h span{font-weight:900;font-size:18px}
.dx-book-h b{font-size:16px;font-weight:900;white-space:nowrap}.dx-book-h small{font-weight:600;opacity:.85}
.dx-book-b{padding:16px 18px}
.dx-book-f{display:flex;flex-direction:column;gap:10px}
.dx-book-f label{display:block}
.dx-book-f label span{display:block;font-size:12.5px;font-weight:800;color:var(--hp-muted);margin-bottom:4px}
.dx-book-f input,.dx-book-f select{width:100%;height:44px;padding:0 12px;border:1px solid var(--hp-line);border-radius:10px;font:inherit;font-weight:700;color:var(--hp-ink);background:#fff}
.dx-book-f input:focus,.dx-book-f select:focus{outline:2px solid color-mix(in srgb,var(--hp-green) 35%,transparent);border-color:var(--hp-green)}
.dx-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dx-book-go{min-height:50px;font-size:16.5px;margin-top:2px}
.dx-book-t{margin:8px 0 0;color:var(--hp-muted);font-size:13px;display:flex;gap:6px;align-items:flex-start}
.dx-book-t svg{flex-shrink:0;margin-top:2px;color:var(--hp-green)}

.dx-card{background:#fff;border:1px solid var(--hp-line);border-radius:18px;padding:18px;box-shadow:var(--shadow)}
.dx-card h3{font-size:17px;margin:0 0 12px;color:var(--hp-ink);display:flex;gap:8px;align-items:center;justify-content:space-between}
.dx-quick{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.dx-quick a,.dx-quick button{display:flex;flex-direction:column;align-items:center;gap:6px;padding:4px 0;border:0;background:none;font:inherit;font-size:12.5px;font-weight:800;color:var(--hp-ink);cursor:pointer;text-align:center}
.dx-quick span{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;transition:transform .15s}
.dx-quick a:hover span,.dx-quick button:hover span{transform:translateY(-2px)}
.q-g{background:var(--green-l);color:var(--hp-green)}.q-w{background:#e7f8ee;color:#16a34a}.q-b{background:var(--indigo-l);color:var(--indigo)}.q-o{background:var(--orange-l);color:var(--orange-d)}
.dx-links{display:flex;flex-direction:column;gap:6px;margin-top:14px;padding-top:12px;border-top:1px solid var(--hp-line);font-size:14px;font-weight:700}
.dx-links a{display:flex;gap:8px;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dx-map{height:190px!important;border-radius:12px;margin-bottom:10px}
.dx-addr{display:flex;gap:8px;margin:0 0 8px;font-size:14px}
.dx-addr svg{flex-shrink:0;margin-top:3px;color:var(--hp-green)}
.dx-addr span b{display:block;color:var(--hp-ink)}
.dx-maplinks{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.dx-hours{width:100%;border-collapse:collapse;font-size:14.5px}
.dx-hours td{padding:6px 0;border-bottom:1px dashed var(--hp-line)}
.dx-hours tr:last-child td{border-bottom:0}
.dx-hours td:last-child{text-align:right;font-weight:700;color:var(--hp-ink)}
.dx-hours tr.today td{color:var(--hp-green);font-weight:900}
.dx-info{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.dx-info li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;font-weight:700;color:var(--hp-ink)}
.dx-info svg{flex-shrink:0;color:var(--hp-green);margin-top:2px}
.dx-info small{display:block;color:var(--hp-muted);font-size:12.5px}
.dx-small{font-size:14px}

.dx-mbar{display:none}

/* Toutes les photos */
.dx-lb .modal-card{width:min(1100px,100%);max-height:92vh;padding:0;border-radius:18px}
.dx-lb{align-items:center}
.dx-lb-h{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 18px;background:#fff;border-bottom:1px solid var(--hp-line)}
.dx-lb-h h3{margin:0;font-size:18px}.dx-lb-h small{color:var(--hp-muted);font-weight:700;font-size:14px;margin-left:6px}
.dx-lb-x{border:0;background:var(--hp-grey);width:38px;height:38px;border-radius:50%;cursor:pointer;display:grid;place-items:center}
.dx-lb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px;padding:16px}
.dx-lb-grid figure{margin:0;border-radius:12px;overflow:hidden;background:#f1f2f6}
.dx-lb-grid img,.dx-lb-grid video{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:#000}
.dx-lb-grid figcaption{padding:7px 10px;font-size:13px;font-weight:700;color:var(--hp-ink);display:flex;gap:5px;align-items:center}
.dx-lb-v{grid-column:span 2}

@media(max-width:1020px){
  .dx-grid{grid-template-columns:1fr}
  .dx-strip{grid-template-columns:1fr 1fr}
  .dx-si:nth-child(3){border-left:0}
  .dx-si:nth-child(n+3){border-top:1px solid var(--hp-line)}
}
@media(max-width:700px){
  .dx-mosaic{grid-template-columns:1fr;height:270px;border-radius:16px;margin:0 -2px}
  .dx-thumbs{display:none}
  .dx-head{flex-direction:column;gap:12px}
  .dx-tools{width:100%}.dx-tool{flex:1;justify-content:center}
  .dx-si{padding:12px}.dx-si-ic{width:38px;height:38px}
  .dx-tabs{top:64px;margin-left:calc(-1 * var(--pagin));margin-right:calc(-1 * var(--pagin));padding:0 calc(var(--pagin) - 4px)}
  .dx-about{grid-template-columns:1fr}
  .dx-check{grid-template-columns:1fr}
  .dx-rv-sum{grid-template-columns:1fr;gap:12px}
  .dx-rv-list{grid-template-columns:1fr}
  .dx-sec,.dx-main .of-box{padding:16px}
  .dx-lb-v{grid-column:auto}
  .dx-mbar{display:flex;gap:8px;position:fixed;left:0;right:0;bottom:calc(62px + env(safe-area-inset-bottom));z-index:60;padding:8px 12px;background:rgba(255,255,255,.97);border-top:1px solid var(--hp-line);box-shadow:0 -6px 20px rgba(30,27,75,.08)}
  .dx-mbar .btn{min-height:48px}
  .dx-mbar .dx-mbar-go{flex:1}
  body:has(.dx-mbar){padding-bottom:136px}
  body:has(.dx-mbar) .ia-fab{bottom:142px}
}

.dx-tool.fav{width:auto;height:auto;border-radius:12px;box-shadow:none;position:static}
.dx-2>label{min-width:0}
.dx-book-f input[type=date],.dx-book-f input[type=time]{padding:0 8px;font-size:14.5px}

/* =====================================================================
   Page Taxi : bandeau, sélecteur Taxi / Compagnies, carte + panneau,
   véhicules, chauffeurs proches, étapes
   ===================================================================== */
.tx-hero{position:relative;overflow:hidden;color:#fff;background:radial-gradient(900px 340px at 90% -20%,rgba(242,140,40,.45),transparent 60%),linear-gradient(120deg,#1e1b4b 0%,#26215e 55%,#0c5a33 130%)}
.tx-hero::after{content:"";position:absolute;inset:0;opacity:.07;background-image:radial-gradient(#fff 1.4px,transparent 1.5px);background-size:22px 22px;pointer-events:none}
.tx-hero .wrap{position:relative;z-index:1;padding-top:22px;padding-bottom:28px}
.tx-crumbs{font-size:14px;font-weight:700;color:rgba(255,255,255,.75);margin-bottom:14px}
.tx-crumbs a{color:#fff;display:inline-flex;gap:4px;align-items:center}
.tx-hero-row{display:flex;gap:28px;justify-content:space-between;align-items:flex-end}
.tx-hero h1{color:#fff;font-size:clamp(28px,3.6vw,42px);line-height:1.1;margin:0 0 8px}
.tx-hero h1 span{color:#ffb35c}
.tx-hero p{margin:0;max-width:600px;color:rgba(255,255,255,.86);font-size:16.5px}
.tx-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.tx-chips span{display:inline-flex;gap:6px;align-items:center;padding:7px 12px;border-radius:99px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);font-weight:700;font-size:13.5px}
.tx-live{width:9px;height:9px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 0 rgba(34,197,94,.7);animation:tx-pulse 1.8s infinite}
@keyframes tx-pulse{70%{box-shadow:0 0 0 9px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
.tx-switch{display:flex;gap:6px;padding:6px;border-radius:18px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);flex-shrink:0}
.tx-switch a{display:flex;gap:10px;align-items:center;padding:10px 16px;border-radius:13px;color:#fff;text-decoration:none}
.tx-switch a b{display:block;font-size:15px}.tx-switch a small{display:block;font-size:12px;opacity:.75;font-weight:600}
.tx-switch a:hover{background:rgba(255,255,255,.08)}
.tx-switch a.on{background:#fff;color:var(--hp-ink)}.tx-switch a.on svg{color:#c2410c}.tx-switch a.on small{opacity:1;color:var(--hp-muted)}

.tx-app{margin-top:-6px;padding-top:22px}
.tx-app .tx{height:660px;min-height:0;border-radius:24px;overflow:hidden;border:1px solid var(--hp-line);box-shadow:0 18px 40px rgba(30,27,75,.10);background:#fff}
.tx-app .tx-panel{background:#fbfbfd}
.tx-card-t{margin:0!important;font-size:24px!important;text-align:left!important;font-weight:900}
.tx-legend{position:absolute;top:14px;left:14px;z-index:500;display:flex;gap:6px;flex-wrap:wrap;max-width:calc(100% - 28px)}
.tx-legend span{display:inline-flex;gap:6px;align-items:center;padding:6px 11px;border-radius:99px;background:rgba(255,255,255,.95);box-shadow:0 4px 14px rgba(30,27,75,.12);font-size:13px;font-weight:800;color:var(--hp-ink)}
.tx-legend i{width:11px;height:11px;border-radius:50%;display:inline-block}
.tx-legend b{color:var(--hp-muted)}
.tx-legend-me{background:#2563eb;box-shadow:0 0 0 3px #dbeafe}

.tx-more{padding-bottom:40px}
.tx-sec-h{margin:38px 0 14px}
.tx-sec-h h2{margin:0;font-size:24px;color:var(--hp-ink)}
.tx-sec-h p{margin:4px 0 0;color:var(--hp-muted)}
.tx-types{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.tx-type{position:relative;display:grid;grid-template-columns:auto 1fr;gap:12px 14px;align-items:start;text-align:left;padding:18px;border-radius:20px;border:2px solid var(--hp-line);background:#fff;font:inherit;color:var(--hp-ink);cursor:pointer;transition:border-color .15s,box-shadow .15s}
.tx-type:hover{box-shadow:0 12px 28px rgba(30,27,75,.09)}
.tx-type.on{border-color:var(--c);box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 14%,transparent)}
.tx-type-ic{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 14%,#fff);color:var(--c)}
.tx-type-t b{display:block;font-size:17px}.tx-type-t small{display:block;color:var(--hp-muted);font-size:13.5px;line-height:1.4;margin-top:2px}
.tx-type-p{grid-column:1/-1;display:flex;gap:6px;align-items:baseline;flex-wrap:wrap;padding-top:12px;border-top:1px dashed var(--hp-line)}
.tx-type-p b{font-size:20px;font-weight:900}.tx-type-p small{color:var(--hp-muted);font-weight:700;font-size:13px}
.tx-type-n{position:absolute;top:14px;right:14px;padding:3px 9px;border-radius:99px;background:var(--green-l);color:var(--green-d);font-size:12.5px;font-weight:800}
.tx-drivers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.tx-dcard{display:flex;gap:12px;align-items:center;padding:14px;border-radius:18px;background:#fff;border:1px solid var(--hp-line);box-shadow:var(--shadow);min-width:0}
.tx-dph{position:relative;flex-shrink:0}
.tx-dph img,.tx-dph>span{width:54px;height:54px;border-radius:50%;object-fit:cover;display:grid;place-items:center;background:var(--indigo-l);color:var(--indigo);font-weight:900;font-size:20px}
.tx-dph i{position:absolute;right:-4px;bottom:-4px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:#fff;border:2px solid #fff}
.tx-dph i svg{width:13px;height:13px}
.tx-dtx{flex:1;min-width:0}
.tx-dtx b{display:block;font-size:16px;color:var(--hp-ink)}
.tx-dtx small{display:block;color:var(--hp-muted);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tx-dmeta{display:flex;gap:8px;font-size:12.5px;font-weight:700;color:var(--hp-muted);margin-top:2px}.tx-dmeta em{font-style:normal;color:#b45309}
.tx-dkm{text-align:right;flex-shrink:0}
.tx-dkm b{display:block;font-size:15px;color:var(--hp-ink)}.tx-dkm small{display:block;color:var(--hp-muted);font-weight:700;font-size:12.5px}
.tx-dkm span{display:block;font-size:11.5px;font-weight:800;margin-top:2px}
.tx-how{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;counter-reset:how}
.tx-how li{position:relative;padding:20px;border-radius:20px;background:#fff;border:1px solid var(--hp-line);counter-increment:how}
.tx-how li::before{content:counter(how);position:absolute;top:16px;right:18px;font-size:34px;font-weight:900;color:#eef0f6;line-height:1}
.tx-how span{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--green-l);color:var(--hp-green);margin-bottom:12px}
.tx-how b{display:block;font-size:16.5px;color:var(--hp-ink)}.tx-how small{display:block;color:var(--hp-muted);font-size:14px;margin-top:4px}

@media(max-width:1020px){
  .tx-hero-row{flex-direction:column;align-items:stretch}
  .tx-switch{align-self:flex-start}
  .tx-types,.tx-drivers,.tx-how{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
  .tx-app{padding-left:0;padding-right:0}
  .tx-app .tx{height:auto;border-radius:0;border-left:0;border-right:0;display:flex;flex-direction:column}
  .tx-app .tx-map{height:320px;flex-shrink:0}
  .tx-app .tx-panel{overflow:visible;border-right:0;padding:16px}
}
@media(max-width:600px){
  .tx-switch{width:100%}.tx-switch a{flex:1;padding:9px 10px}.tx-switch a small{display:none}
  .tx-types,.tx-drivers,.tx-how{grid-template-columns:1fr}
  .tx-legend span{padding:5px 9px;font-size:12px}
}

/* Cartes de lieux : 3 boutons → bouton principal sur toute la largeur (évite les textes coupés) */
.pc-acts:has(> :nth-child(3)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pc-acts:has(> :nth-child(3)) .pc-main { grid-column: 1 / -1; order: 3; }
.pc-acts a { overflow: hidden; text-overflow: ellipsis; min-width: 0; }

/* =====================================================================
   Tableaux de bord (admin, agent, pro, utilisateur) : barre latérale verte,
   barre du haut, bandeau d'accueil, indicateurs pastel, graphiques, listes
   ===================================================================== */
.dash{grid-template-columns:272px 1fr;background:#f4f6f5}
.side{background:linear-gradient(180deg,#0b4a2b 0%,#073821 100%);color:#cfe3d7;padding:18px 14px;display:flex;flex-direction:column}
.side .logo{padding:4px 8px 16px}
.side-me{display:flex;gap:12px;align-items:center;padding:12px;border-radius:16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);margin-bottom:10px}
.side-av{width:46px;height:46px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;overflow:hidden;background:#f28c28;color:#fff;font-weight:900;font-size:16px;border:2px solid rgba(255,255,255,.35)}
.side-av img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.side-who{min-width:0}
.side-who b{display:block;color:#fff;font-size:15px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-who small{display:block;color:#9fd1b3;font-weight:700;font-size:12.5px}
.side-nav{flex:1}
.side .grp{color:#8fbfa3;opacity:1;font-size:11px}
.side a{color:#d6ebdf;border-radius:12px;padding:10px 12px}
.side a svg{opacity:.85}
.side a:hover{background:rgba(255,255,255,.08)}
.side a.on{background:#fff;color:#0b4a2b;box-shadow:0 8px 18px rgba(0,0,0,.18)}
.side a.on svg{opacity:1;color:#0c7d3d}
.side-out{margin-top:14px}
.side-out button{width:100%;display:flex;gap:10px;align-items:center;justify-content:center;padding:11px 12px;border:0;border-radius:12px;background:#dc2626;color:#fff;font:inherit;font-weight:800;font-size:14.5px;cursor:pointer}
.side-out button:hover{background:#b91c1c}
.side-veil{display:none}

.dtop{height:72px;padding:0 26px;gap:14px;border-bottom:1px solid #e3e8e5}
.dtop-t{flex:1;min-width:0}
.dtop-t h1{font-size:21px;margin:0;line-height:1.2;color:var(--hp-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dtop-t small{display:block;color:var(--hp-muted);font-weight:700;font-size:12.5px}
.dtop-search{display:flex;align-items:center;gap:8px;width:min(340px,30vw);height:44px;padding:0 14px;border-radius:12px;background:#f2f4f3;border:1px solid transparent;color:var(--hp-muted)}
.dtop-search:focus-within{background:#fff;border-color:#0c7d3d}
.dtop-search input{flex:1;min-width:0;border:0;background:none;outline:0;font:inherit;font-size:14.5px;color:var(--hp-ink)}
.dtop-bell{position:relative;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:#f2f4f3;color:var(--hp-ink)!important}
.dtop-bell span{position:absolute;top:6px;right:6px;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:#dc2626;color:#fff;font-size:11px;font-weight:900;display:grid;place-items:center;border:2px solid #fff}
.dtop-me{display:flex;gap:10px;align-items:center;color:var(--hp-ink)!important;text-decoration:none!important}
.dtop-me .avatar{width:42px;height:42px}
.dtop-me-t b{display:block;font-size:14px;line-height:1.2}.dtop-me-t small{display:block;color:var(--hp-muted);font-weight:700;font-size:12px}
.dcontent{padding:24px 26px}

/* Indicateurs : cartes pastel */
.kpis{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.kpi{position:relative;border:0;border-radius:18px;padding:18px;box-shadow:none;background:#fff;--kc:#0c7d3d;--kb:#e3f5ea;background:linear-gradient(135deg,var(--kb),#fff 85%);border:1px solid color-mix(in srgb,var(--kc) 14%,#fff);color:inherit}
.kpi:nth-child(5n+2){--kc:#c2410c;--kb:#fff0e0}
.kpi:nth-child(5n+3){--kc:#4338ca;--kb:#ebebff}
.kpi:nth-child(5n+4){--kc:#0369a1;--kb:#e2f3fc}
.kpi:nth-child(5n+5){--kc:#be185d;--kb:#fde8f1}
.kpi .l{gap:10px;color:#4b5563;font-size:13.5px}
.kpi .l svg{width:38px;height:38px;padding:9px;border-radius:12px;background:var(--kc);color:#fff;flex-shrink:0}
.kpi .v{font-size:30px;margin-top:10px;color:var(--hp-ink)}
.kpi .d{color:var(--kc)}
a.kpi:hover{box-shadow:0 12px 26px rgba(30,27,75,.08)}

/* Bandeau d'accueil */
.dw{position:relative;overflow:hidden;display:flex;align-items:center;min-height:150px;margin-bottom:20px;padding:24px 28px;border-radius:22px;color:#fff;background:radial-gradient(600px 220px at 100% 0%,rgba(242,140,40,.35),transparent 60%),linear-gradient(120deg,#0c7d3d 0%,#0a5f30 55%,#073821 100%)}
.dw-txt{position:relative;z-index:2;max-width:640px}
.dw h2{color:#fff;margin:0 0 6px;font-size:clamp(22px,2.4vw,28px)}
.dw p{margin:0;color:rgba(255,255,255,.88);font-size:15.5px}
.dw-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.dw-btn{display:inline-flex;gap:7px;align-items:center;padding:9px 14px;border-radius:12px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);color:#fff!important;font-weight:800;font-size:14px;text-decoration:none!important}
.dw-btn:hover{background:rgba(255,255,255,.22)}
.dw-btn.on{background:#fff;color:#0b4a2b!important;border-color:#fff}
.dw-sky{position:absolute;right:0;bottom:0;width:min(46%,420px);height:auto;z-index:1}
.dw-flag{position:absolute;top:18px;right:22px;z-index:2;display:flex;width:36px;height:24px;border-radius:5px;overflow:hidden;box-shadow:0 4px 10px rgba(0,0,0,.2)}
.dw-flag i{flex:1}.dw-flag i:nth-child(1){background:#f77f00}.dw-flag i:nth-child(2){background:#fff}.dw-flag i:nth-child(3){background:#009e60}

/* Blocs */
.db-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:18px;align-items:start}
.db-col{display:flex;flex-direction:column;gap:18px;min-width:0}
.db-card{background:#fff;border:1px solid #e3e8e5;border-radius:18px;padding:18px 20px;min-width:0}
.db-h{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px}
.db-h h3{margin:0;font-size:17px;color:var(--hp-ink);display:flex;gap:8px;align-items:center}
.db-h a{font-size:13.5px;font-weight:800}
.db-chart{position:relative}
.db-chart svg{display:block;width:100%;height:auto;overflow:visible}
.db-chart .db-lbl{font-size:11px;fill:#8a93a6;font-weight:700}
.db-legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:6px;font-size:13px;font-weight:700;color:var(--hp-muted)}
.db-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}
.db-total{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:8px}
.db-total b{display:block;font-size:24px;font-weight:900;color:var(--hp-ink)}.db-total small{color:var(--hp-muted);font-weight:700;font-size:12.5px}
.db-quick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.db-quick a{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:14px;background:#f6f8f7;border:1px solid #eaeeec;color:var(--hp-ink)!important;font-weight:800;font-size:14px;text-decoration:none!important}
.db-quick a:hover{border-color:#0c7d3d;background:#fff}
.db-quick span{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--qb,#e3f5ea);color:var(--qc,#0c7d3d)}
.db-list{list-style:none;margin:0;padding:0}
.db-list>li{display:flex;gap:12px;align-items:center;padding:11px 0;border-top:1px solid #eef1ef;min-width:0}
.db-list>li:first-child{border-top:0;padding-top:2px}
.db-list .db-ic{width:40px;height:40px;border-radius:12px;flex-shrink:0;display:grid;place-items:center;background:var(--qb,#e3f5ea);color:var(--qc,#0c7d3d);font-weight:900;overflow:hidden}
.db-list .db-ic img{width:100%;height:100%;object-fit:cover}
.db-list .db-t{flex:1;min-width:0}
.db-list .db-t b{display:block;font-size:14.5px;color:var(--hp-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.db-list .db-t small{display:block;color:var(--hp-muted);font-size:12.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.db-list .db-r{flex-shrink:0;display:flex;gap:6px;align-items:center}
.db-list form{display:inline}
.db-empty{color:var(--hp-muted);margin:0;font-size:14.5px}
.db-q{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 0;border-top:1px solid #eef1ef;color:var(--hp-ink)!important;font-weight:700;text-decoration:none!important}
.db-q:first-of-type{border-top:0}
.db-q .st{min-width:30px;text-align:center}
.db-q:hover{color:#0c7d3d!important}
.db-tbl td,.db-tbl th{padding:9px 10px}
.db-prog{height:8px;border-radius:99px;background:#e8ecea;overflow:hidden;margin:8px 0}
.db-prog i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#f28c28,#0c7d3d)}

@media(max-width:1180px){.dtop-me-t{display:none}.db-grid{grid-template-columns:1fr}}
@media(max-width:980px){
  .dash{grid-template-columns:1fr}
  .side{position:fixed;left:0;top:0;bottom:0;width:282px;z-index:90;transform:translateX(-105%);transition:transform .2s}
  .side.open{transform:none;box-shadow:20px 0 40px rgba(0,0,0,.25)}
  .side.open+.side-veil{display:block;position:fixed;inset:0;z-index:85;background:rgba(10,20,15,.45)}
  .dash-mobile-top{display:inline-flex}
}
@media(max-width:760px){
  .dtop{padding:0 12px;gap:8px;height:64px}
  .dtop-search{display:none}
  .dtop-t small{display:none}.dtop-t h1{font-size:18px}
  .dcontent{padding:16px 12px}
  .dw{padding:20px;min-height:0}.dw-sky{width:70%;opacity:.6}
  .db-quick{grid-template-columns:1fr 1fr}
  .kpis{grid-template-columns:1fr 1fr;gap:10px}.kpi{padding:14px}.kpi .v{font-size:24px}.kpi .l svg{width:32px;height:32px;padding:7px}
}
.db-tips p{margin:0;padding:10px 0;border-top:1px solid #eef1ef;font-size:14px}.db-tips p:first-child{border-top:0;padding-top:0}
.db-ic svg{flex-shrink:0}
.db-chart-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:34px 16px;border-radius:14px;background:#f6f8f7;color:#8a93a6;text-align:center}.db-chart-empty p{margin:0;font-weight:700;font-size:14px}
.dcontent .panel-box{border-radius:18px;border-color:#e3e8e5;box-shadow:none}
.db-tbl td{white-space:nowrap}@media(max-width:760px){.dw-flag{display:none}}

/* Accueil : recherche d'un village qui n'est pas dans la liste */
.pp-other{grid-column:1/-1;display:flex;flex-direction:column;gap:6px}
.pp-other input{width:100%;min-height:50px;padding:0 14px;border-radius:14px;border:1.5px solid var(--hp-green);font:inherit;font-size:16px;font-weight:700;color:var(--hp-ink)}
.pp-other input:focus{outline:0;box-shadow:0 0 0 4px rgba(12,125,61,.12)}
.pp-sugg{list-style:none;margin:0;padding:0;max-height:260px;overflow-y:auto;border-radius:14px}
.pp-sugg:not(:empty){border:1px solid var(--hp-line);background:#fff}
.pp-sugg li+li{border-top:1px solid var(--hp-line)}
.pp-sugg button{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:10px 14px;border:0;background:none;font:inherit;text-align:left;cursor:pointer;color:var(--hp-ink)}
.pp-sugg button:hover{background:var(--green-l)}
.pp-sugg small{color:var(--hp-muted);font-weight:600;font-size:13px}
.pp-none{padding:10px 14px;color:var(--hp-muted);font-size:14px}

/* Page « Toutes les villes » */
.ct-search{display:flex;gap:10px;align-items:center;max-width:720px;padding:6px 6px 6px 16px;border-radius:16px;background:#fff;border:1.5px solid var(--hp-line);box-shadow:var(--shadow);color:var(--hp-muted)}
.ct-search:focus-within{border-color:var(--hp-green)}
.ct-search input{flex:1;min-width:0;border:0;outline:0;font:inherit;font-size:16px;font-weight:700;color:var(--hp-ink);min-height:44px}
.ct-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.ct-head h2{margin:0;font-size:22px}
.ct-regions{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px}
.ct-regions a{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 14px;border-radius:12px;background:#fff;border:1px solid var(--hp-line);color:var(--hp-ink)!important;font-weight:800;font-size:14.5px;text-decoration:none!important}
.ct-regions a:hover{border-color:var(--hp-green)}
.ct-regions b{flex-shrink:0;padding:2px 9px;border-radius:99px;background:var(--green-l);color:var(--green-d);font-size:12.5px}
.ct-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px}
.ct-list a{display:flex;flex-direction:column;padding:9px 12px;border-radius:10px;background:#fff;border:1px solid var(--hp-line);color:var(--hp-ink)!important;text-decoration:none!important;min-width:0}
.ct-list a:hover{border-color:var(--hp-green)}
.ct-list b{font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ct-list small{color:var(--hp-muted);font-size:12px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sel-filter{margin-bottom:6px}

/* Sous-types d'un service : sous la bannière (plus de chevauchement), sur plusieurs lignes à l'écran large */
.st-wrap{margin-top:18px}
.st-bar{flex-wrap:wrap;overflow:visible;padding:0}
.st-card.zero{opacity:.75}
@media(max-width:760px){
  .st-wrap{margin-top:14px}
  .st-bar{flex-wrap:nowrap;overflow-x:auto;padding:2px 2px 8px;margin-right:calc(-1 * var(--pagin));padding-right:var(--pagin);-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
}

/* Téléphone avec indicatif + choix du canal du code + confirmation */
.fx-phone .fx-in{padding-left:4px}
.fx-cc{flex-shrink:0;border:0;background:var(--hp-grey);border-radius:10px;height:38px;padding:0 6px;font:inherit;font-weight:800;font-size:14px;color:var(--hp-ink);margin-right:6px;cursor:pointer}
.au-recv{margin:4px 0 10px}.au-recv .fx-l{display:block;margin-bottom:6px}
.au-alt{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin-top:14px}
.au-alt form{display:inline}.au-alt .link{font-weight:800}
.pf-code{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:10px 12px;border-radius:12px;background:var(--green-l);color:var(--green-d);font-size:14px}

/* Revendication */
.cl-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin:12px 0 16px}
.cl-head h1{font-size:clamp(22px,3vw,30px);margin:4px 0}
.cl-steps{list-style:none;margin:0 0 16px;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;counter-reset:cl}
.cl-steps li{counter-increment:cl;padding:12px;border-radius:14px;background:#fff;border:1px solid var(--hp-line);font-size:14px;position:relative}
.cl-steps li::before{content:counter(cl);display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#e5e7eb;color:#4b5563;font-weight:900;font-size:12px;margin-bottom:6px}
.cl-steps li.done::before{content:"✓";background:var(--green);color:#fff}.cl-steps li.now{border-color:var(--orange)}.cl-steps li.now::before{background:var(--orange);color:#fff}
.cl-steps b{display:block}.cl-steps small{color:var(--muted)}
.cl-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cl-grid h2{font-size:18px;display:flex;gap:8px;align-items:center;margin:0 0 10px}
.cl-ok{color:var(--green-d);font-weight:800;display:flex;gap:6px;align-items:center}
.cl-code{display:flex;gap:8px}.cl-code .in{flex:1;min-width:0;letter-spacing:3px;font-weight:800}
.pj{display:flex;flex-wrap:wrap;gap:8px}
.pj-img{width:92px;height:92px;border-radius:10px;overflow:hidden;border:1px solid var(--hp-line);display:block}.pj-img img{width:100%;height:100%;object-fit:cover}
.pj-doc{display:flex;gap:8px;align-items:center;padding:8px 12px;border-radius:10px;border:1px solid var(--hp-line);background:#fff;color:var(--hp-ink)!important;font-weight:700;font-size:13.5px;max-width:260px}
.pj-doc span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pj-doc small{display:block;color:var(--muted);font-weight:600}
@media(max-width:760px){.cl-steps{grid-template-columns:1fr 1fr}.cl-grid{grid-template-columns:1fr}}
.cl-mini{margin:6px 0 14px;padding-left:20px;color:var(--muted);font-size:14px}.cl-mini li{margin:2px 0}
.rv-list{display:flex;flex-direction:column;gap:14px}
.rv-card{padding:16px 18px}
.rv-card header{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;padding-bottom:10px;border-bottom:1px solid #eef1ef;margin-bottom:10px}
.rv-card header small{display:block}
.rv-body dl{display:grid;grid-template-columns:120px 1fr;gap:8px 14px;margin:0 0 12px;font-size:14.5px}
.rv-body dt{color:var(--muted);font-weight:700}.rv-body dd{margin:0}
.rv-body .pj{margin-top:8px}
.rv-acts{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.rv-refus{display:flex;gap:8px;flex:1;min-width:260px}.rv-refus .in{flex:1;min-width:0}
@media(max-width:700px){.rv-body dl{grid-template-columns:1fr}.rv-body dt{margin-top:6px}}
/* Fiche : encadré « Vous êtes le propriétaire ? » */
.dx-claim{display:flex;gap:16px;align-items:center;margin-bottom:18px;padding:18px 20px;border-radius:18px;background:linear-gradient(120deg,#ecfdf3,#fff 70%);border:1.5px dashed #86d1a6}
.dx-claim.pending{background:linear-gradient(120deg,#fff4e5,#fff 70%);border-color:#f5b971}
.dx-claim-ic{flex-shrink:0;width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:#fff;color:var(--hp-green);box-shadow:var(--shadow)}
.dx-claim-t{flex:1;min-width:0}.dx-claim-t b{display:block;font-size:16px;color:var(--hp-ink)}.dx-claim-t small{display:block;color:var(--hp-muted);font-weight:700;font-size:13px}
.dx-claim-t p{margin:6px 0 0;font-size:14.5px;color:#3b4157}
.dx-claim .btn{flex-shrink:0}
@media(max-width:700px){.dx-claim{flex-direction:column;align-items:flex-start}.dx-claim .btn{width:100%}}
.pc-src{display:flex;gap:5px;align-items:center;font-size:12px;font-weight:700;color:#8a93a6;margin-top:2px}
.pc-pend{background:#fff4e5!important;color:#b45309!important}
.ec-src{font-size:11.5px;color:#8a93a6;font-weight:700;margin-top:4px}
/* Fenêtre « Voir » */
.cv-modal .modal-card{width:min(760px,100%);max-height:90vh;overflow-y:auto;padding:0;border-radius:18px}
.cv-head{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 18px;background:#fff;border-bottom:1px solid #eef1ef}
.cv-head h3{margin:0;font-size:18px}
.cv-acts{display:flex;gap:6px;align-items:center;flex-shrink:0}
.cv-dl{display:grid;grid-template-columns:170px 1fr;gap:10px 16px;margin:0;padding:16px 18px;font-size:14.5px}
.cv-dl dt{color:var(--muted);font-weight:700}.cv-dl dd{margin:0;min-width:0;overflow-wrap:anywhere}
.cv-text{white-space:normal;line-height:1.55;background:#f6f8f7;border-radius:10px;padding:10px 12px}
.cv-img{max-width:220px;max-height:160px;border-radius:10px;object-fit:cover;display:block}
.cv-vid{max-width:100%;border-radius:10px}
.cv > .pj,.cv > .cv-extra{padding:0 18px 18px}
@media(max-width:640px){.cv-dl{grid-template-columns:1fr}.cv-dl dt{margin-top:4px}}
/* Messagerie */
.cvs{display:flex;flex-direction:column;gap:12px}
.cvs-list{display:flex;flex-direction:column;gap:12px;max-height:62vh;overflow-y:auto;padding:4px 2px}
.cvs-msg{max-width:78%;align-self:flex-start}
.cvs-msg.me{align-self:flex-end;text-align:right}
.cvs-who{font-size:12.5px;font-weight:800;color:var(--muted);margin:0 6px 3px}
.cvs-who small{font-weight:600;margin-left:4px}
.cvs-bub{display:inline-block;text-align:left;padding:10px 14px;border-radius:16px 16px 16px 4px;background:#f1f4f2;color:var(--hp-ink);font-size:14.5px;line-height:1.5;overflow-wrap:anywhere}
.cvs-msg.me .cvs-bub{background:#0c7d3d;color:#fff;border-radius:16px 16px 4px 16px}
.cvs-msg.s-equipe:not(.me) .cvs-bub{background:#ebebff}
.cvs-msg.me .pj-doc{color:var(--hp-ink)!important}
.cvs-bub .pj{margin-top:8px}
.cvs-sys{align-self:center;max-width:90%;text-align:center;font-size:13px;color:var(--muted);background:#fff;border:1px dashed var(--hp-line);border-radius:12px;padding:8px 12px}
.cvs-sys small{display:block;font-size:11.5px}
.cvs-form{border-top:1px solid var(--hp-line);padding-top:12px;display:flex;flex-direction:column;gap:8px}
.cvs-foot{display:flex;justify-content:space-between;align-items:center;gap:10px}
.cvs-clip{display:inline-flex;gap:6px;align-items:center;cursor:pointer;font-weight:800;font-size:14px;color:var(--hp-ink);padding:8px 12px;border-radius:10px;background:var(--hp-grey)}
.cvs-clip input{display:none}
.cvs-closed{text-align:center}
.cv-items{display:flex;flex-direction:column}
.cv-item{display:flex;gap:12px;align-items:center;padding:12px 4px;border-top:1px solid #eef1ef;color:inherit!important;text-decoration:none!important}
.cv-item:first-child{border-top:0}
.cv-item:hover{background:#fafbfa}
.cv-item .cv-ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex-shrink:0;background:var(--green-l);color:var(--green-d)}
.cv-item .cv-t{flex:1;min-width:0}.cv-item .cv-t b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cv-item .cv-t small{display:block;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cv-item.unread .cv-t b::after{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#dc2626;margin-left:6px;vertical-align:middle}
.cv-cnt{min-width:22px;height:22px;border-radius:99px;background:#dc2626;color:#fff;font-size:12px;font-weight:900;display:grid;place-items:center;padding:0 6px}
.sp-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}
.sp-side .panel-box{padding:16px}
@media(max-width:900px){.sp-grid{grid-template-columns:1fr}.cvs-msg{max-width:92%}}
.msg-top{display:flex;justify-content:space-between;align-items:flex-end;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.msg-btns{display:flex;gap:8px;flex-wrap:wrap}
.msg-h{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid #eef1ef}
.msg-h b{display:block;font-size:17px}.msg-h small{display:block}
/* Assistant : passer à un humain */
.ia-human{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;padding:8px 16px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.ia-human a{display:inline-flex;gap:5px;align-items:center;font-weight:600}
/* ===== P6 — Livraison, suivi en direct, espace conducteur ===== */
.alert{border-radius:14px;padding:12px 16px;margin:0 0 14px;font-weight:600;display:flex;gap:10px;align-items:flex-start;border:1px solid}
.alert-info{background:var(--indigo-l);color:var(--indigo);border-color:#d7dafc}
.alert-ok{background:var(--green-l);color:var(--green-d);border-color:#bfe6cf}
.alert-error{background:var(--red-l);color:var(--red);border-color:#f5c2c2}
.lv-hero{background:radial-gradient(900px 340px at 90% -20%,rgba(234,88,12,.5),transparent 60%),linear-gradient(120deg,#3b1d0b 0%,#7c2d12 55%,#1e1b4b 130%)}
.lv .tx-card{display:flex;flex-direction:column;gap:10px}
.lv .tx-card .f{margin:0}
.lv-types{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.lv-type input{position:absolute;opacity:0;pointer-events:none}
.lv-type span{display:flex;flex-direction:column;align-items:center;gap:4px;padding:9px 4px;border:1.5px solid var(--line);border-radius:12px;font-size:12.5px;font-weight:700;text-align:center;cursor:pointer;color:var(--ink-2,#334155)}
.lv-type input:checked+span{border-color:#ea580c;background:#fff4ec;color:#c2410c}
.lv-type input:focus-visible+span{outline:2px solid #ea580c;outline-offset:2px}
.lv .tx-pt.on{background:#fff7f0;border-radius:12px}
.lv-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.lv-row3{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.lv-h{margin:6px 0 0;font-size:15px}
.lv-err{display:block;color:var(--red);font-size:12.5px;font-weight:700;margin-top:4px}
.lv-options .tx-opt.off{opacity:.45}
.lv-options .tx-opt input:disabled{pointer-events:none}
.lv-more summary{cursor:pointer;font-weight:700;padding:4px 0}
.lv-etab{margin:0;padding:8px 12px;border-radius:12px;background:var(--indigo-l);color:var(--indigo);display:flex;gap:8px;align-items:center}
.lv-pro{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;margin-top:22px;padding:16px 18px;border-radius:16px;background:#fff7f0;border:1px solid #fed7aa}
.lv-pro div{flex:1;min-width:240px}.lv-pro b{display:block}.lv-pro span{font-size:14px;color:var(--muted)}
@media(max-width:640px){.lv-types{grid-template-columns:repeat(3,1fr)}.lv-row{grid-template-columns:1fr}}

.trk{padding-top:16px;padding-bottom:30px}
.trk-crumbs{font-size:13px;color:var(--muted);margin-bottom:10px}
.trk-shared{display:flex;gap:10px;align-items:center;padding:12px 14px;border-radius:14px;background:var(--indigo-l);color:var(--indigo);margin-bottom:12px}
.trk-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:16px;align-items:start}
.trk-map{position:relative;min-height:520px;border-radius:20px;overflow:hidden;background:#eef2f0;border:1px solid var(--line);position:sticky;top:84px}
.trk-panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;display:flex;flex-direction:column;gap:14px}
.trk-kind{display:inline-flex;gap:6px;align-items:center;font-size:13px;font-weight:700;color:var(--muted)}
.trk-head h1{margin:4px 0 0;font-size:24px;line-height:1.2}
.trk-eta{margin:4px 0 0;color:#c2410c;font-weight:700;min-height:1.2em}
.trk-steps{list-style:none;margin:0;padding:0;display:grid;gap:0}
.trk-steps li{position:relative;padding:0 0 12px 26px;font-size:14px;color:var(--muted)}
.trk-steps li span{position:absolute;left:4px;top:3px;width:12px;height:12px;border-radius:50%;border:2px solid #cbd5e1;background:#fff}
.trk-steps li:not(:last-child)::after{content:"";position:absolute;left:9px;top:17px;bottom:0;width:2px;background:#e2e8f0}
.trk-steps li.done{color:var(--ink,#0f172a)}.trk-steps li.done span{background:var(--green);border-color:var(--green)}.trk-steps li.done::after{background:var(--green)}
.trk-steps li.on{color:var(--ink,#0f172a);font-weight:800}.trk-steps li.on span{border-color:#ea580c;box-shadow:0 0 0 4px rgba(234,88,12,.18)}
.trk-search{text-align:center}.trk-search .tx-radar{margin:0 auto 6px}
.trk-driver{display:flex;gap:12px;align-items:center;padding:12px;border-radius:16px;background:#f8faf9;border:1px solid var(--line)}
.trk-driver img{width:54px;height:54px;border-radius:50%;object-fit:cover;background:#e2e8f0}
.trk-driver div{flex:1;min-width:0}.trk-driver b{display:block}.trk-driver small{display:block;color:var(--muted);font-size:13px}
.trk-plate{font:800 14px/1 ui-monospace,monospace;padding:6px 8px;border:2px solid #0f172a;border-radius:6px;background:#fff;white-space:nowrap}
.trk-call{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff}
.trk-pin{display:grid;gap:2px;padding:12px 14px;border-radius:16px;background:#1e1b4b;color:#fff}
.trk-pin small{opacity:.75;font-weight:700}.trk-pin b{font-size:32px;letter-spacing:.18em}.trk-pin span{font-size:13px;opacity:.85}
.trk-sum{margin:0;display:grid;gap:10px}
.trk-sum div{display:grid;grid-template-columns:92px 1fr;gap:10px}
.trk-sum dt{color:var(--muted);font-weight:700;font-size:13.5px;display:flex;gap:6px;align-items:center}
.trk-sum dd{margin:0;font-size:14.5px}.trk-sum dd small{display:block;color:var(--muted)}
.trk-acts{display:flex;flex-wrap:wrap;gap:8px}
.trk-sos-btn{background:#dc2626;color:#fff}.trk-sos-btn:hover{background:#b91c1c}
.trk-sos-go{background:#dc2626;color:#fff;font-size:18px;padding:16px}
.trk-sos-box h2{display:flex;gap:8px;align-items:center;color:#dc2626;margin-top:0}
.trk-sos-nums{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;margin-top:10px}
.trk-sos-nums a{display:grid;padding:10px;border-radius:12px;background:#fdecec;color:#991b1b;text-decoration:none}
.trk-sos-nums b{font-size:18px}.trk-sos-nums small{font-size:12px}
.trk-rate{display:grid;gap:8px;padding:14px;border-radius:16px;background:#fffbeb;border:1px solid #fde68a}
.trk-stars{display:flex;flex-direction:row-reverse;justify-content:flex-end;gap:4px}
.trk-stars input{position:absolute;opacity:0}
.trk-stars label{font-size:34px;line-height:1;color:#d6d3d1;cursor:pointer}
.trk-stars input:checked~label,.trk-stars label:hover,.trk-stars label:hover~label{color:#f59e0b}
.trk-stars input:focus-visible+label{outline:2px solid #f59e0b;border-radius:4px}
.trk-done{margin:0;font-weight:700;color:var(--green-d)}
@media(max-width:900px){.trk-grid{grid-template-columns:1fr}.trk-map{position:relative;top:0;min-height:300px}}

.drv-top{display:flex;flex-wrap:wrap;gap:14px;align-items:stretch;margin-bottom:6px}
.drv-switch{display:flex;gap:14px;align-items:center;padding:14px 20px 14px 14px;border-radius:999px;border:0;background:#334155;color:#fff;cursor:pointer;text-align:left;min-height:72px}
.drv-switch b{display:block;font-size:20px}.drv-switch small{opacity:.8}
.drv-knob{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.15)}
.drv-top.on .drv-switch{background:var(--green)}
.drv-top.on .drv-knob{background:#fff;color:var(--green);animation:drvpulse 2s infinite}
@keyframes drvpulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.55)}70%{box-shadow:0 0 0 14px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
@media(prefers-reduced-motion:reduce){.drv-top.on .drv-knob{animation:none}}
.drv-kpis{flex:1;display:grid;grid-template-columns:repeat(3,minmax(110px,1fr));gap:10px;min-width:280px}
.drv-kpis div{background:#fff;border:1px solid var(--line);border-radius:16px;padding:10px 14px;display:grid}
.drv-kpis small{color:var(--muted);font-weight:700}.drv-kpis b{font-size:20px}.drv-kpis span{font-size:12.5px;color:var(--muted)}
.drv-h{font-size:18px;margin:16px 0 10px}
.drv-reqs{display:grid;gap:10px}
.drv-req{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:14px 16px;border-radius:16px;background:#fff;border:1.5px solid #fed7aa}
.drv-req-t b{display:block;font-size:22px;color:#c2410c}.drv-req-t small{display:block;color:var(--muted);max-width:170px}
.drv-req-r{font-size:14px;line-height:1.6}.drv-req .btn{min-height:52px;padding:0 22px;font-size:16px}
.drv-off{text-align:center;color:var(--muted);padding:22px}.drv-off .tx-radar{margin:0 auto 8px}
.drv-job{padding:18px;display:grid;gap:12px}
.drv-job-h{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.drv-price{margin-left:auto;font-size:22px;font-weight:800}
.drv-legs{display:grid;gap:8px}
.drv-legs>div{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:14px;border:1px solid var(--line)}
.drv-legs>div.on{border-color:#ea580c;background:#fff7f0}
.drv-legs>div>div{flex:1;min-width:0}.drv-legs small{display:block;color:var(--muted);font-size:12.5px}
.drv-big{min-height:60px;font-size:18px}
.drv-pin{font-size:28px;letter-spacing:.4em;text-align:center}
.drv-drop summary{cursor:pointer;color:var(--muted);font-size:14px}.drv-drop form{display:flex;gap:8px;margin-top:8px}
.drv-join-h{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px;max-width:760px}
.drv-join-h a{display:grid;gap:4px;padding:16px;border-radius:16px;border:2px solid var(--line);background:#fff;text-decoration:none;color:inherit}
.drv-join-h a.on{border-color:var(--green);background:var(--green-l)}.drv-join-h small{color:var(--muted)}
@media(max-width:640px){.drv-req{grid-template-columns:1fr}.drv-kpis{grid-template-columns:1fr 1fr 1fr;min-width:0}.drv-switch{width:100%;border-radius:20px}}
.rv-h{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;padding-bottom:10px;border-bottom:1px solid #eef1ef;margin-bottom:10px}
.rv-dl{display:grid;gap:6px;margin:0 0 10px;font-size:14px}.rv-dl div{display:grid;grid-template-columns:130px 1fr;gap:10px}.rv-dl dt{color:var(--muted);font-weight:700}.rv-dl dd{margin:0}
.rv-acts .in{flex:1;min-width:220px}
.trk-call[hidden],.trk-driver[hidden],.trk-search[hidden],#trk-long[hidden]{display:none!important}
.drv-req-r .tx-dot{display:inline-block;width:10px;height:10px;margin-right:6px;vertical-align:middle;position:static}
/* ===== P7 — YOCOLO Live ===== */
.live-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:#475569;color:#fff;font:800 12px/1 inherit;letter-spacing:.06em;vertical-align:middle}
.live-pill i{width:8px;height:8px;border-radius:50%;background:#fff;opacity:.7}
.live-pill.on{background:#dc2626}
.live-pill.on i{animation:liveblink 1s steps(2,start) infinite;opacity:1}
@keyframes liveblink{to{visibility:hidden}}
.hdr-live{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 12px;border-radius:12px;background:#dc2626;color:#fff;font-weight:800;letter-spacing:.05em;text-decoration:none;animation:livepulse 1.6s infinite}
.hdr-live i{width:8px;height:8px;border-radius:50%;background:#fff;animation:liveblink 1s steps(2,start) infinite}
@keyframes livepulse{0%{box-shadow:0 0 0 0 rgba(220,38,38,.55)}70%{box-shadow:0 0 0 10px rgba(220,38,38,0)}100%{box-shadow:0 0 0 0 rgba(220,38,38,0)}}
@media(prefers-reduced-motion:reduce){.hdr-live,.hdr-live i,.live-pill.on i,.sp-live.on{animation:none}}
.sp-live{display:flex;gap:16px;align-items:center;margin:22px 0 0;padding:18px 20px;border-radius:20px;background:linear-gradient(110deg,#111827,#1f2937 60%,#3f1d1d);color:#fff;text-decoration:none}
.sp-live b{display:block;font-size:20px}.sp-live small{color:#cbd5e1}.sp-live>span:nth-child(2){flex:1}
.sp-live .live-pill{font-size:15px;padding:8px 14px}
.sp-live.on{animation:livepulse 1.6s infinite}
.sp-live .tr-opt-go{color:#fff}
.lvx-hero{background:linear-gradient(115deg,#0b1020,#1f2937 55%,#450a0a);color:#fff}
.lvx-hero-in{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:flex-end;padding-top:22px;padding-bottom:26px}
.lvx-hero h1{color:#fff;margin:6px 0;font-size:34px;display:flex;align-items:center;gap:12px}.lvx-hero p{max-width:620px;color:#cbd5e1;margin:0}
.lvx-hero .tx-crumbs,.lvx-hero .tx-crumbs a{color:#cbd5e1}
.lvx-hero-acts{display:flex;gap:8px;flex-wrap:wrap}
.lvx{padding-top:16px;padding-bottom:32px}
.lvx-filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px}.lvx-filters .in{width:auto;min-width:180px}
.lvx-sec{margin-top:18px}.lvx-sec h2{font-size:19px;display:flex;align-items:center;gap:10px;margin:0 0 10px}
.lvx-cols{display:grid;grid-template-columns:1fr 320px;gap:18px;align-items:start}
.lvx-side{display:grid;gap:14px;margin-top:18px}.lvx-side h3{margin:0 0 8px}
.lvx-how{margin:0 0 12px;padding-left:18px;font-size:14px;color:var(--muted);display:grid;gap:6px}
.lvx-comp{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;margin-bottom:12px}
.lvx-comp header{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;padding:10px 14px;background:#f1f5f4;border-bottom:1px solid var(--line)}
.lvx-comp header small{color:var(--muted)}
.lvx-flag{font-size:11px;font-weight:800;padding:2px 7px;border-radius:6px;background:#1e1b4b;color:#fff}
.mr{display:grid;grid-template-columns:56px 1fr auto auto auto;gap:10px;align-items:center;padding:10px 14px;border-top:1px solid #eef1ef;color:inherit;text-decoration:none}
.mr:first-of-type{border-top:0}.mr:hover{background:#f8faf9}
.mr-t{font-size:13px;color:var(--muted);display:grid;text-align:center}.mr-t small{font-size:11px}
.mr-min{color:#dc2626;font-weight:800}
.mr.is-live .mr-min::after{content:"";display:inline-block;width:6px;height:6px;margin-left:3px;border-radius:50%;background:#dc2626;vertical-align:middle;animation:liveblink 1s steps(2,start) infinite}
.mr-off{color:#b45309;font-size:11.5px;font-weight:700}
.mr-teams{display:grid;gap:4px;min-width:0}.mr-teams span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mr-teams .win{font-weight:800}
.mr-sc{display:grid;gap:4px;text-align:right;min-width:20px}.mr.is-live .mr-sc b{color:#dc2626}
.mr-tab{font-size:11px;color:var(--muted);display:grid;gap:4px;line-height:1.55}
.mr-tv{color:#dc2626}
.mr.flash,.lvm-board.flash{animation:goalflash 1.6s ease-out}
@keyframes goalflash{0%{background:#fde68a}100%{background:transparent}}
.lvx-tv{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.lvx-vid{display:grid;gap:4px;color:inherit;text-decoration:none}
.lvx-vid-img{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#111827;color:#94a3b8;display:grid;place-items:center}
.lvx-vid-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lvx-vid-img .live-pill{position:absolute;left:8px;top:8px}
.lvx-when{position:absolute;left:8px;bottom:8px;background:rgba(0,0,0,.7);color:#fff;font-size:12px;padding:3px 8px;border-radius:8px}
.lvx-vid small{color:var(--muted)}
.lvx-replay{display:flex;gap:8px;align-items:flex-start;padding:8px 0;border-top:1px solid #eef1ef;color:inherit;text-decoration:none;font-size:14px}.lvx-replay small{display:block;color:var(--muted)}
.lvx-empty{text-align:center;color:var(--muted);padding:26px}
.lvm{padding-top:16px;padding-bottom:30px}
.lvm-board{background:linear-gradient(120deg,#0b1020,#1e293b);color:#fff;border-radius:22px;padding:18px 18px 14px;margin:8px 0 16px}
.lvm-comp{text-align:center;font-size:13px;color:#cbd5e1}
.lvm-score{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;margin:12px 0}
.lvm-team{display:grid;justify-items:center;gap:8px;text-align:center}.lvm-team b{font-size:18px;color:#fff}
.lvm-badge{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#f28c28;font-weight:800;font-size:20px}.lvm-badge.b2{background:#0c7d3d}
.lvm-mid{text-align:center}
.lvm-num{font-size:52px;font-weight:800;display:flex;gap:10px;justify-content:center;font-variant-numeric:tabular-nums}.lvm-num i{opacity:.5;font-style:normal}
.lvm-st{margin-top:4px;color:#e2e8f0;font-weight:700}.lvm-tab{font-size:13px;color:#fde68a;margin-top:4px}
.lvm-info{text-align:center;font-size:13px;color:#94a3b8}
.lvm-grid{display:grid;grid-template-columns:1fr 340px;gap:18px;align-items:start}
.lvm-video{position:relative;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#000;margin-bottom:14px}.lvm-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.lvm-h{font-size:17px;margin:0 0 10px}
.lvm-ev{list-style:none;margin:0;padding:0;display:grid;gap:0}
.lvm-ev li{display:grid;grid-template-columns:42px 28px 1fr;gap:8px;align-items:start;padding:8px 0;border-top:1px solid #eef1ef;font-size:14.5px}
.lvm-ev li.ext{grid-template-columns:1fr 28px 42px}.lvm-ev li.ext .x{order:1;text-align:right}.lvm-ev li.ext .i{order:2}.lvm-ev li.ext .m{order:3;text-align:right}
.lvm-ev li.mid{background:#f8faf9;border-radius:8px;padding:8px 6px}
.lvm-ev .m{font-weight:800;color:var(--muted)}.lvm-ev .x small{color:var(--muted)}
.lvv-t{font-size:24px;margin:10px 0 4px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
@media(max-width:900px){.lvx-cols,.lvm-grid{grid-template-columns:1fr}.lvm-num{font-size:40px}.lvx-hero h1{font-size:26px}}
/* Agent de terrain : gros boutons, utilisable d'une main */
.tm{max-width:760px;margin:0 auto;padding:12px 12px 40px}
.tm-top{display:flex;justify-content:space-between;font-size:14px;margin-bottom:8px}
.tm-score{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;text-align:center;background:#0b1020;color:#fff;border-radius:18px;padding:14px}
.tm-score b{font-size:16px}.tm-num{font-size:40px;font-weight:800;font-variant-numeric:tabular-nums}.tm-num small{display:block;font-size:13px;font-weight:600;color:#cbd5e1}
.tm-btn{display:block;width:100%;min-height:64px;border:0;border-radius:16px;font-size:18px;font-weight:800;cursor:pointer;color:#fff;background:#334155;padding:8px}
.tm-btn:active{transform:scale(.98)}
.tm-period{background:#1e1b4b;margin-top:10px;min-height:70px;font-size:20px}
.tm-row2{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.tm-small{min-height:50px;font-size:15px;background:#475569}
.tm-teams{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.tm-team{background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px;display:grid;gap:8px}
.tm-team h2{margin:0;font-size:16px;text-align:center}
.tm-team .in{margin-bottom:8px}
.tm-goal{background:#16a34a;min-height:84px;font-size:24px;margin-bottom:8px}
.tm-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tm-grid .tm-btn{min-height:58px;font-size:15px}
.tm-pen{background:#15803d}.tm-miss{background:#64748b}.tm-yel{background:#eab308;color:#1f2937}.tm-red{background:#dc2626}.tm-csc{background:#0f766e}
.tm-sub summary{cursor:pointer;font-weight:700;padding:8px 0}.tm-sub .in{margin:6px 0}
.tm-tools{display:grid;gap:8px;margin-top:12px}
.tm-undo{background:#fff;color:#b91c1c;border:2px solid #fecaca;min-height:54px;font-size:16px}
.tm-info{display:flex;gap:8px}.tm-info .in{flex:1}
@media(max-width:560px){.tm-teams{grid-template-columns:1fr}}
/* ===== P8 — Paiements, notifications ===== */
.pay{padding:26px 12px 40px;display:grid;place-items:center}
.pay-card{width:min(460px,100%);background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px;box-shadow:var(--shadow)}
.pay-card h1{font-size:40px;margin:4px 0}
.pay-test{display:flex;gap:8px;align-items:flex-start;font-size:13px;font-weight:600;background:#fff7ed;color:#9a3412;border:1px solid #fed7aa;border-radius:12px;padding:10px 12px;margin-bottom:14px}
.pay-ops{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}
.pay-op input{position:absolute;opacity:0}
.pay-op span{display:flex;gap:8px;align-items:center;padding:12px;border:2px solid var(--line);border-radius:14px;font-weight:700;cursor:pointer}
.pay-op span i{width:16px;height:16px;border-radius:50%;background:var(--c)}
.pay-op input:checked+span{border-color:var(--green);background:var(--green-l)}
.pay-op input:focus-visible+span{outline:2px solid var(--green);outline-offset:2px}
.pay-box{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:12px 14px;border-radius:16px;background:#f0fdf4;border:1px solid #bbf7d0}
.pay-box b{flex:1;min-width:160px}
.pay-ok{display:inline-flex;gap:6px;align-items:center;color:var(--green-d);font-weight:800}
.ntf-set{display:grid;gap:10px}
.ntf-row{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:#fff}
.ntf-row b{display:block}.ntf-row small{color:var(--muted)}
/* ===== P9 — Services pratiques ===== */
.prt-hero{background:linear-gradient(120deg,#0b3d24,#0c7d3d 60%,#14532d);color:#fff;padding:22px 0 26px}
.prt-hero h1{color:#fff;margin:6px 0;font-size:30px}.prt-hero p{margin:0;color:#d1fae5;max-width:640px}
.prt-hero .trk-crumbs,.prt-hero .trk-crumbs a{color:#bbf7d0}
.prt-hero-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:flex-end}
.bus-hero{background:linear-gradient(120deg,#082f49,#0369a1)}
.prt-page{padding-top:18px;padding-bottom:34px}
.prt-page>h1{margin:6px 0}
.prt-form{padding:18px;max-width:820px}
.prt-two{display:grid;grid-template-columns:1fr 340px;gap:18px;align-items:start}
.prt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;padding-top:18px;padding-bottom:34px}
.prt-card{position:relative;display:grid;gap:6px;padding:18px;border-radius:18px;background:#fff;border:1px solid var(--line);color:inherit;text-decoration:none;transition:border-color .15s}
.prt-card:hover{border-color:var(--c)}
.prt-ic{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 14%,#fff);color:var(--c)}
.prt-card b{font-size:17px}.prt-card small{color:var(--muted)}
.prt-badge{position:absolute;top:14px;right:14px;font-size:11.5px;font-weight:800;padding:3px 8px;border-radius:999px;background:var(--green-l);color:var(--green-d)}
.prt-badge.live{background:#dc2626;color:#fff}
.dv-rep{padding:14px 16px;margin-bottom:10px}.dv-rep.on{border-color:var(--green);background:#f0fdf4}
.dv-rep-h{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.dv-prix{font-size:22px;color:var(--green-d);white-space:nowrap}
.dv-form{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;margin-top:10px;padding-top:10px;border-top:1px solid #eef1ef}.dv-form .btn{justify-self:start}
.an-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.an-card{display:grid;gap:4px;color:inherit;text-decoration:none;background:#fff;border:1px solid var(--line);border-radius:16px;padding:8px 8px 12px}
.an-card b{font-size:15px;line-height:1.3;padding:0 4px}.an-card small{color:var(--muted);padding:0 4px}
.an-img{position:relative;aspect-ratio:4/3;border-radius:12px;overflow:hidden;background:#f1f5f4;display:grid;place-items:center;color:#94a3b8}
.an-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.an-type{position:absolute;left:8px;top:8px;background:rgba(0,0,0,.65);color:#fff;font-size:11.5px;font-weight:700;padding:3px 8px;border-radius:8px}
.an-prix{font-weight:800;color:var(--orange-d,#c2410c);padding:0 4px}.an-prix small{font-weight:600;color:var(--muted)}
.an-show{display:grid;grid-template-columns:1fr 340px;gap:18px;align-items:start}
.an-gal{display:grid;grid-template-columns:1fr 1fr;gap:8px}.an-gal img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px}.an-gal img:first-child{grid-column:1/-1;aspect-ratio:16/10}
.an-noimg{grid-column:1/-1;aspect-ratio:16/9;border-radius:14px;background:#f1f5f4;display:grid;place-items:center;color:#94a3b8}
.an-side{display:grid;gap:12px;position:sticky;top:84px}
.an-edit-ph{display:flex;gap:8px;flex-wrap:wrap}.an-edit-ph label{display:grid;gap:4px;font-size:12.5px}.an-edit-ph img{width:90px;height:70px;object-fit:cover;border-radius:10px}
.lf-list,.cp-list{display:grid;gap:10px}
.lf{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;background:#fff;border:1px solid var(--line);border-left:4px solid #dc2626;border-radius:14px;padding:12px}
.lf.trouve{border-left-color:var(--green)}
.lf img,.lf-ic{width:64px;height:64px;border-radius:12px;object-fit:cover;background:#f1f5f4;display:grid;place-items:center;color:var(--muted)}
.lf b{display:block}.lf small{display:block;color:var(--muted)}.lf p{margin:4px 0 0;font-size:14px}
.lf-tag{font-size:11px;font-weight:800;color:#dc2626}.lf.trouve .lf-tag{color:var(--green-d)}
.lf-switch,.cp-types{display:grid;grid-template-columns:1fr 1fr;gap:6px}.cp-types{grid-template-columns:repeat(3,1fr)}
.lf-switch input,.cp-types input{position:absolute;opacity:0}
.lf-switch span,.cp-types span{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;border:1.5px solid var(--line);border-radius:12px;font-weight:700;font-size:13.5px;cursor:pointer;text-align:center}
.lf-switch input:checked+span,.cp-types input:checked+span{border-color:var(--green);background:var(--green-l);color:var(--green-d)}
.lf-switch input:focus-visible+span,.cp-types input:focus-visible+span{outline:2px solid var(--green);outline-offset:2px}
.lf-mine{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-top:8px;font-size:14px}
.mk-p{font-weight:800;font-size:16px;white-space:nowrap}.mk-up{color:#dc2626;font-weight:700;white-space:nowrap}.mk-down{color:var(--green-d);font-weight:700;white-space:nowrap}
.cp{display:grid;grid-template-columns:48px 1fr auto;gap:12px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px}
.cp b{margin-right:4px}.cp small{display:block;color:var(--muted)}
.cp-ic{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:#fef3c7;color:#b45309}
.cp.t-eau .cp-ic{background:#e0f2fe;color:#0369a1}.cp.t-internet .cp-ic{background:#ede9fe;color:#6d28d9}
.cp.en_cours{border-color:#fca5a5}.cp.retablie{opacity:.7}
.cp-acts{display:flex;flex-direction:column;gap:6px}
.bus-search{display:grid;grid-template-columns:1fr 1fr 170px auto;gap:10px;align-items:end;margin-top:14px;background:#fff;color:var(--ink,#0f172a);padding:12px;border-radius:16px}
.bus-search label{display:grid;gap:4px;font-size:13px;font-weight:700}
.bus-list{display:grid;gap:10px}
.bus-row{display:grid;grid-template-columns:80px 1fr auto auto;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px}
.bus-time b{display:block;font-size:22px}.bus-time small,.bus-co small{color:var(--muted)}.bus-co b{display:block}
.bus-seats{font-weight:700;color:var(--green-d);white-space:nowrap}.bus-seats.low{color:#c2410c}
.bus-price{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.bus-price b{font-size:20px}.bus-price .in{width:auto}
.bus-lines{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.bus-lines a{display:grid;gap:2px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:#fff;color:inherit;text-decoration:none}.bus-lines small{color:var(--muted)}
.tk-buy{display:flex;flex-wrap:wrap;gap:10px;align-items:end;margin-top:14px;padding:14px;border-radius:16px;background:#f5f3ff;border:1px solid #ddd6fe}
.tk-buy div{flex:1;min-width:200px}.tk-buy b{display:flex;gap:6px;align-items:center}.tk-buy small{color:var(--muted)}.tk-buy label{display:grid;gap:2px;font-size:13px}
.tk-ticket{background:#fff;border:1px solid var(--line);border-radius:22px;padding:20px;text-align:center;box-shadow:var(--shadow)}
.tk-top{display:flex;justify-content:space-between;font-size:13px;color:var(--muted)}.tk-top span{display:flex;gap:6px;align-items:center}
.tk-ticket h1{font-size:24px;margin:12px 0 4px}.tk-when{font-weight:700;margin:0 0 4px}
.tk-cut{border-top:2px dashed var(--line);margin:16px -20px}
.tk-status{font-weight:800;color:var(--green-d)}.tk-ticket .trk-sum{text-align:left}
.tk-ticket.utilise{opacity:.75}
@media(max-width:900px){.prt-two,.an-show{grid-template-columns:1fr}.an-side{position:static}.bus-search{grid-template-columns:1fr 1fr}.bus-row{grid-template-columns:70px 1fr}.bus-seats,.bus-price{grid-column:span 1}.dv-form{grid-template-columns:1fr}}
@media print{.tk-ticket{box-shadow:none;border:0}.rq-print{display:none}}
.fill{height:8px;border-radius:99px;background:#e2e8f0;overflow:hidden;margin-bottom:3px}.fill span{display:block;height:100%;background:var(--green)}
/* ===== P11 — Fidélité, parrainage ===== */
.fd-top{display:grid;grid-template-columns:1fr 1.4fr;gap:12px;margin-bottom:14px}
.fd-pts,.fd-par{border-radius:20px;padding:18px;display:grid;gap:2px}
.fd-pts{background:linear-gradient(135deg,#f28c28,#ea580c);color:#fff}.fd-pts b{font-size:44px;line-height:1.1}.fd-pts span{font-size:13px;opacity:.9}
.fd-par{background:#fff;border:1px solid var(--line)}.fd-par b{font-size:26px;letter-spacing:.04em}.fd-par span,.fd-par small,.fd-pts small{font-size:13px;color:inherit;opacity:.85}
.fd-rw{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.fd-card{display:grid;gap:4px;padding:14px;border-radius:16px;background:#fff;border:1.5px solid #fed7aa}.fd-card b{font-size:22px;color:#c2410c}.fd-card small{color:var(--muted)}.fd-card.off{border-color:var(--line);opacity:.75}
.fx-par summary{cursor:pointer;font-size:14px;font-weight:600;color:var(--green-d)}
.lv-bon{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:12px;background:#fff7ed;border:1px solid #fed7aa;font-size:14px}
@media(max-width:700px){.fd-top{grid-template-columns:1fr}}
.lt h1{font-size:22px;margin:0 0 10px}.lt h2{font-size:16px;margin:16px 0 6px;color:var(--green-d)}.lt ul{margin:0;padding-left:20px}.lt{padding:20px}
.lang-sw{display:inline-grid;place-items:center;height:40px;min-width:40px;padding:0 8px;border-radius:12px;border:1px solid var(--line);font-weight:800;font-size:13px;color:inherit;text-decoration:none;background:#fff}
/* ===== P12 — État du site ===== */
.et-box{padding:16px;margin-bottom:12px}.et-box h3{margin:0 0 8px}
.et-row{display:grid;grid-template-columns:24px 230px 1fr;gap:10px;align-items:start;padding:8px 0;border-top:1px solid #eef1ef;font-size:14px}
.et-ic{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#fff}
.et-ok .et-ic{background:var(--green)}.et-warn .et-ic{background:#f59e0b}.et-bad .et-ic{background:#dc2626}
b.et-bad{color:#dc2626}b.et-warn{color:#b45309}
.et-err{margin:8px 0 0;padding-top:8px;border-top:1px solid #eef1ef}.et-err code{font-size:12px;word-break:break-word}
@media(max-width:700px){.et-row{grid-template-columns:24px 1fr}.et-row span:last-child{grid-column:2}}

/* Invitation aux notifications du téléphone */
.push-inv { position: fixed; left: 50%; bottom: 84px; transform: translateX(-50%); z-index: 60; width: min(440px, calc(100vw - 24px)); background: #fff; border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow-h); padding: 14px; display: grid; grid-template-columns: 40px 1fr; gap: 12px; }
.push-inv[hidden] { display: none; }
.push-inv-ic { width: 40px; height: 40px; border-radius: 12px; background: var(--green-l); color: var(--green-d); display: grid; place-items: center; }
.push-inv b { display: block; color: var(--indigo-d); line-height: 1.25; }
.push-inv small { display: block; color: var(--muted); font-size: 13.5px; margin-top: 3px; }
.push-inv-a { display: flex; gap: 8px; margin-top: 10px; }

/* Commentaires et « j'aime » (directs, vidéos, matchs, événements) */
.soc { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 14px; margin: 14px 0; }
.soc-bar { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.soc-like { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 7px 14px; font: inherit; font-weight: 800; cursor: pointer; color: var(--text); min-height: 40px; }
.soc-like span[aria-hidden] { color: #9ca3af; font-size: 18px; line-height: 1; transition: transform .2s; }
.soc-like.on { border-color: #fecdd3; background: #fff1f2; color: #be123c; }
.soc-like.on span[aria-hidden] { color: #e11d48; transform: scale(1.15); }
.soc-like:focus-visible { outline: 3px solid var(--green); outline-offset: 2px; }
.soc-stat { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 14px; }
.soc-stat b { color: var(--text); }
.soc-live { margin-left: auto; display: inline-flex; gap: 6px; align-items: center; font-size: 12.5px; font-weight: 800; color: #dc2626; }
.soc-live i { width: 8px; height: 8px; border-radius: 50%; background: #dc2626; animation: soc-blink 1.4s infinite; }
@keyframes soc-blink { 50% { opacity: .25; } }
.soc-form { display: flex; gap: 8px; align-items: flex-end; margin-top: 12px; }
.soc-form textarea { flex: 1; resize: none; border: 1px solid var(--line); border-radius: 14px; padding: 10px 12px; font: inherit; min-height: 44px; max-height: 140px; }
.soc-form .btn { min-height: 44px; }
.soc-login { margin: 12px 0 0; font-size: 14px; }
.soc-list { list-style: none; margin: 12px 0 0; padding: 0; max-height: 460px; overflow-y: auto; display: grid; gap: 12px; }
.soc-c { display: grid; grid-template-columns: 34px 1fr; gap: 10px; }
.soc-av { width: 34px; height: 34px; border-radius: 50%; background: var(--green-l); color: var(--green-d); display: grid; place-items: center; font-weight: 900; overflow: hidden; }
.soc-av img { width: 100%; height: 100%; object-fit: cover; }
.soc-c b { font-size: 14px; } .soc-c small { color: var(--muted); font-size: 12px; }
.soc-c p { margin: 2px 0 0; font-size: 14.5px; line-height: 1.45; overflow-wrap: anywhere; }
.soc-acts button { border: 0; background: none; color: var(--muted); font: inherit; font-size: 12px; cursor: pointer; padding: 2px 6px 2px 0; }
.soc-acts button:hover { color: var(--text); text-decoration: underline; }
.soc-dark { background: #101a28; border-color: #22324a; color: #e6edf5; }
.soc-dark .soc-like { background: #16243a; border-color: #2b4563; color: #fff; }
.soc-dark .soc-stat, .soc-dark .soc-c small, .soc-dark .soc-acts button { color: #9fb3c8; }
.soc-dark .soc-stat b { color: #fff; }
.soc-dark .soc-form textarea { background: #0a1726; border-color: #2b4563; color: #fff; }
.soc-dark .soc-bar { border-color: #22324a; }

/* Directs : régie, attente, étapes */
.lv-ctrl { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; background: #fff7ed; border: 1px solid #fed7aa; border-radius: 14px; padding: 10px 12px; margin-bottom: 12px; }
.lv-ctrl span { flex: 1; min-width: 200px; font-size: 14px; }
.lvm-wait { display: grid; place-items: center; background: linear-gradient(135deg, #0c1a2a, #1d3550); color: #fff; text-align: center; }
.lvm-wait > div { display: grid; gap: 6px; justify-items: center; padding: 20px; }
.lvm-wait span { color: #b9c6d6; font-size: 14px; }
.lvm-video video { position: absolute; inset: 0; width: 100%; height: 100%; background: #000; }
.lv-steps { margin: 0 0 12px; padding-left: 20px; line-height: 1.7; }
.lv-diff { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin: 6px 0 4px; }
.lv-diff label { display: grid; gap: 4px; border: 2px solid var(--line); border-radius: 14px; padding: 12px; cursor: pointer; background: #fff; }
.lv-diff label:has(input:checked) { border-color: var(--green); background: var(--green-l); }
.lv-diff input { position: absolute; opacity: 0; }
.lv-diff b { display: flex; gap: 8px; align-items: center; }
.lv-diff small { color: var(--muted); }
.lv-diff label:focus-within { outline: 3px solid var(--green); outline-offset: 2px; }
/* Sport Live : liens vers les autres espaces de directs */
.lv-spaces{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin:0 0 22px}
.lv-spaces a{display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid var(--line,#e5e7eb);border-radius:14px;background:#fff;color:inherit;text-decoration:none}
.lv-spaces a:hover{border-color:#c4b5fd}.lv-spaces a>span:first-child{font-size:26px}.lv-spaces a>span:nth-child(2){flex:1}.lv-spaces small{display:block;color:#64748b;font-size:13px}
/* Console de terrain (matchs locaux) : joueurs, temps additionnel, prolongations */
.tm-mute{border:0;background:#e2e8f0;border-radius:10px;padding:4px 9px;font-size:16px;cursor:pointer}
.tm-ta{display:inline-block;margin-top:6px;padding:3px 10px;border-radius:999px;background:#facc15;color:#1c1917;font-size:13px;font-weight:800}
.tm-ta-form{margin:12px 0;padding:10px 12px;border:1px solid #e2e8f0;border-radius:14px;background:#fff}.tm-ta-form>span{display:block;font-weight:800;font-size:14px;margin-bottom:6px}
.tm-ta-form div{display:flex;gap:6px;flex-wrap:wrap}.tm-chip{min-width:52px;min-height:44px;border-radius:12px;border:1px solid #cbd5e1;background:#f8fafc;font-weight:800;font-size:16px;cursor:pointer}.tm-chip.on{background:#facc15;border-color:#eab308}
.tm-prol{display:grid;gap:6px}.tm-prol label{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px}.tm-prol select{width:auto}
.tm-note{font-size:13px;color:#64748b;margin:8px 0}
.tm-dlg{border:0;border-radius:18px;padding:16px;width:min(560px,96vw);max-height:88vh}.tm-dlg::backdrop{background:rgba(15,23,42,.6)}
.tm-dlg h3{margin:0 0 10px}.tm-list{max-height:56vh;overflow:auto;display:grid;gap:10px;margin:10px 0}
.tm-pos b{display:block;font-size:12px;color:#64748b;margin-bottom:6px}.tm-pos>div{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:6px}
.tm-pl{display:flex;align-items:center;gap:8px;min-height:48px;padding:6px 10px;border-radius:12px;border:1px solid #cbd5e1;background:#f8fafc;font-weight:700;font-size:15px;text-align:left;cursor:pointer}
.tm-pl i{font-style:normal;min-width:26px;height:26px;border-radius:8px;background:#0b1020;color:#fff;display:grid;place-items:center;font-size:13px}
.tm-pl[disabled]{opacity:.45;text-decoration:line-through;cursor:not-allowed}.tm-pl small{color:#b91c1c;font-weight:600}
.tm-dlg-acts{display:flex;gap:8px;justify-content:flex-end}
/* Fiche établissement : actions bien espacées, onglets sur téléphone, chambres en carrousel, avis repliés */
.dx-mquick{display:none}
.dx-rv-more{display:none}.dx-rv-more.on{display:block}.dx-rv-all{margin-top:12px}
@media (max-width: 980px){
  .dx-mquick{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0 4px}
  .dx-mquick a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 4px;border:1px solid var(--hp-line);border-radius:16px;background:#fff;color:var(--hp-ink);font-weight:800;font-size:13px;text-decoration:none}
  .dx-mquick span{width:44px;height:44px;border-radius:14px;display:grid;place-items:center}
  .dx-quickcard{display:none}
  .dx-off{display:none!important}
  .dx-tools{gap:10px}
  .of-rooms{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;padding-bottom:6px;scrollbar-width:thin}
  .of-room{flex:0 0 82%;scroll-snap-align:start}
  .dx-main [id],.dx-side [id]{scroll-margin-top:120px}
}
/* Livraison : suggestions d'adresses, position partagée par le destinataire */
.tx-pt>div{position:relative}
.lv-sug{position:absolute;left:0;right:0;top:100%;z-index:40;margin:4px 0 0;padding:4px;list-style:none;background:#fff;border:1px solid var(--hp-line,#e5e7eb);border-radius:14px;box-shadow:0 14px 34px rgba(30,27,75,.16);max-height:320px;overflow:auto}
.lv-sug li{padding:9px 10px;border-radius:10px;cursor:pointer;display:flex;flex-direction:column;gap:1px}
.lv-sug li b{font-size:14.5px;color:var(--hp-ink,#111827)}.lv-sug li small{font-size:12px;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lv-sug li:hover,.lv-sug li.on{background:#f1f5f9}
.lv-askpos{display:flex;flex-direction:column;gap:6px;margin:10px 0 4px}.lv-askpos>.btn{align-self:flex-start}
.lv-askbox{padding:10px 12px;border:1px dashed #86efac;border-radius:12px;background:#f0fdf4}.lv-askbox p{margin:0 0 6px}.lv-askbox .err{color:#b91c1c}
.lv-ask-acts{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.pos-share{padding:28px 0 60px;display:flex;justify-content:center}
.pos-card{max-width:440px;width:100%;background:#fff;border:1px solid var(--hp-line,#e5e7eb);border-radius:22px;padding:26px 22px;text-align:center;box-shadow:0 10px 30px rgba(30,27,75,.06)}
.pos-ic{width:68px;height:68px;border-radius:20px;background:#dcfce7;color:#15803d;display:inline-grid;place-items:center;margin-bottom:10px}
.pos-card h1{font-size:22px;margin:0 0 8px}.pos-go{min-height:56px;font-size:17px;margin:14px 0 8px}
.pos-msg{min-height:22px;font-weight:700}.pos-msg.ok{color:#15803d}.pos-msg.err{color:#b91c1c}
/* Double vérification */
.sec2fa{margin-bottom:16px}.sec2fa h3{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sec2fa-steps{display:grid;gap:14px;padding-left:20px}.sec2fa-qr{margin:10px 0;width:216px;padding:8px;background:#fff;border:1px solid #e5e7eb;border-radius:12px}
.sec2fa-key{font-size:15px;letter-spacing:1px;word-break:break-all}.sec2fa-confirm{display:flex;gap:8px;margin-top:8px;max-width:320px}.sec2fa-confirm .in{font-size:20px;letter-spacing:4px;text-align:center}
.sec2fa-codes{padding:14px;border:2px dashed #f59e0b;border-radius:14px;background:#fffbeb;margin-bottom:14px}.sec2fa-codes ol{columns:2;margin:8px 0}.sec2fa-codes code{font-size:16px;font-weight:800}
/* Logo personnalisé (Paramètres › Logo et icône) */
.logo-img{display:block;height:40px;width:auto;max-width:220px;object-fit:contain}
.side .logo-img,.footer .logo-img,.au-side .logo-img{height:36px}
.logo-on-dark{background:#fff;border-radius:10px;padding:4px 8px}
@media (max-width:760px){.logo-img{height:34px;max-width:170px}}
.brand-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.brand-box{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--line,#e5e7eb);border-radius:14px}
.brand-prev{min-height:84px;display:grid;place-items:center;border-radius:12px;padding:10px}.brand-prev.light{background:#f8fafc}.brand-prev.dark{background:#0b5d2e}
.brand-prev.dark .logo{color:#fff!important}
/* Statistiques du site */
.st-per{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}.st-per a{padding:8px 14px;border-radius:999px;border:1px solid var(--line,#e5e7eb);background:#fff;font-weight:800;font-size:14px;color:inherit;text-decoration:none}.st-per a.on{background:#0c7d3d;border-color:#0c7d3d;color:#fff}
.st-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#16a34a;box-shadow:0 0 0 0 rgba(22,163,74,.5);animation:st-pulse 2s infinite}
@keyframes st-pulse{70%{box-shadow:0 0 0 8px rgba(22,163,74,0)}100%{box-shadow:0 0 0 0 rgba(22,163,74,0)}}
@media (prefers-reduced-motion:reduce){.st-dot{animation:none}}
.st-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}.st-wide{grid-column:1/-1}
.st-list{list-style:none;margin:0;padding:0}.st-list li{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid #f1f5f9;font-size:14px}.st-list li span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.st-new{font-style:normal;font-size:12px;font-weight:800;color:#15803d;background:#dcfce7;border-radius:999px;padding:1px 7px}.st-tot{font-weight:800}.st-warn{color:#b45309;font-weight:700}
.st-hours{display:grid;grid-template-columns:repeat(24,1fr);gap:3px;height:170px;align-items:end;padding:6px 0 18px}.st-hours span{height:100%;display:flex;flex-direction:column;justify-content:flex-end;position:relative}
.st-hours i{display:block;background:#0c7d3d;border-radius:4px 4px 0 0;min-height:2px}.st-hours small{position:absolute;bottom:-17px;left:0;font-size:10px;color:#64748b}
.st-google ol{display:grid;gap:6px;padding-left:20px}
/* Compteur de la page d'accueil */
.hp-live{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 14px}
.hp-live span{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.16);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:#fff;font-size:14px;font-weight:600;border:1px solid rgba(255,255,255,.25)}
.hp-live b{font-weight:900}