/* ═══════════════════════════════════════════════════════════
   SissiTour Connector — Feuille de style premium
   Préfixe : .st-  (pas de conflits avec le thème WP)
   ═══════════════════════════════════════════════════════════ */

:root {
  --st-navy:    #1a3a5c;
  --st-ocean:   #0e5a8a;
  --st-accent:  #e67e22;
  --st-accent2: #f39c12;
  --st-green:   #22c55e;
  --st-orange:  #f59e0b;
  --st-red:     #ef4444;
  --st-soft:    #64748b;
  --st-border:  #e2e8f0;
  --st-bg:      #f8fafc;
  --st-white:   #ffffff;
  --st-radius:  14px;
  --st-shadow:  0 4px 20px rgba(0,0,0,.08);
  --st-shadow-hover: 0 12px 36px rgba(0,0,0,.16);
  --st-font:    -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --st-transition: .22s cubic-bezier(.4,0,.2,1);
}

/* ── Reset local ─────────────────────────────────────────── */
.st-catalogue *,
.st-voyage-page *,
.st-empty {
  box-sizing: border-box;
}

/* ── Layout général ──────────────────────────────────────── */
.st-catalogue {
  font-family: var(--st-font);
  color: #1e293b;
}

.st-section-heading {
  font-size: clamp(1.5rem, 3vw, 2.2rem);
  font-weight: 800;
  color: var(--st-navy);
  margin: 0 0 28px;
  text-align: center;
  letter-spacing: -.03em;
}

/* ── Filtres ─────────────────────────────────────────────── */
.st-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 28px;
  justify-content: center;
}

.st-chip {
  display: inline-flex;
  align-items: center;
  padding: 7px 18px;
  border-radius: 999px;
  border: 2px solid var(--st-border);
  background: var(--st-white);
  color: var(--st-soft);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--st-transition);
  font-family: var(--st-font);
}
.st-chip:hover,
.st-chip-active {
  border-color: var(--st-navy);
  background: var(--st-navy);
  color: #fff;
}
.st-chip[data-key="continent"].st-chip-active { background: var(--st-ocean); border-color: var(--st-ocean); }

/* ── Grille ──────────────────────────────────────────────── */
.st-grid {
  display: grid;
  gap: 24px;
}
.st-cols-1 { grid-template-columns: 1fr; }
.st-cols-2 { grid-template-columns: repeat(2, 1fr); }
.st-cols-3 { grid-template-columns: repeat(3, 1fr); }
.st-cols-4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 1024px) {
  .st-cols-4 { grid-template-columns: repeat(2, 1fr); }
  .st-cols-3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .st-cols-1,.st-cols-2,.st-cols-3,.st-cols-4 { grid-template-columns: 1fr; }
  .st-filters { justify-content: flex-start; }
}

/* ── Carte voyage ────────────────────────────────────────── */
.st-card {
  background: var(--st-white);
  border-radius: var(--st-radius);
  box-shadow: var(--st-shadow);
  overflow: hidden;
  position: relative;
  transition: transform var(--st-transition), box-shadow var(--st-transition);
  display: flex;
  flex-direction: column;
  cursor: pointer;
  border: 1px solid transparent;
}

/* ── Stretched link — clic sur toute la carte ── */
.st-card .st-btn-decouvrir::after,
.st-sc  .st-sc-cta::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
}
.st-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--st-shadow-hover);
  border-color: var(--st-border);
}
.st-card[data-hidden="true"] {
  display: none;
}

/* Image de la carte */
.st-card-visual {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: linear-gradient(135deg, #c8d8e8, #e8f0f8);
}
.st-card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
  display: block;
}
.st-card:hover .st-card-img {
  transform: scale(1.05);
}
.st-card-img-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 48px;
  background: linear-gradient(135deg, #dde8f4, #c4d9ee);
  color: var(--st-navy);
}

/* Badges sur l'image */
.st-card-badges {
  position: absolute;
  top: 10px;
  left: 10px;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.st-badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.st-badge-continent { background: rgba(26,58,92,.85); color: #fff; backdrop-filter: blur(4px); }
.st-badge-complet   { background: var(--st-red); color: #fff; }
.st-badge-encours   { background: var(--st-accent); color: #fff; }
.st-badge-hero      { background: rgba(255,255,255,.2); color: #fff; border: 1px solid rgba(255,255,255,.4); backdrop-filter: blur(4px); }

/* Durée */
.st-card-duree {
  position: absolute;
  bottom: 10px;
  right: 10px;
  background: rgba(0,0,0,.6);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 999px;
}

/* Corps de carte */
.st-card-body {
  padding: 18px 20px 20px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.st-card-date {
  font-size: 12px;
  color: var(--st-soft);
  margin-bottom: 6px;
  font-weight: 500;
}
.st-card-titre {
  font-size: 17px !important;
  font-weight: 800 !important;
  color: var(--st-navy) !important;
  margin: 0 0 5px !important;
  line-height: 1.3 !important;
}
.st-card-dest {
  font-size: 13px;
  color: var(--st-soft);
  margin-bottom: 8px;
}
.st-card-desc {
  font-size: 13px;
  color: var(--st-soft);
  line-height: 1.55;
  margin: 0 0 14px;
  flex: 1;
}

/* Footer de carte */
.st-card-footer {
  margin-top: auto;
}
.st-card-price {
  display: flex;
  align-items: baseline;
  gap: 5px;
  margin-bottom: 10px;
}
.st-price-from  { font-size: 11px; color: var(--st-soft); }
.st-price-amount{ font-size: 22px; font-weight: 800; color: var(--st-navy); }
.st-price-pp    { font-size: 11px; color: var(--st-soft); }

/* Barre places */
.st-places-wrap {
  margin-bottom: 14px;
}
.st-places-bar {
  height: 4px;
  background: #e2e8f0;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 4px;
}
.st-places-fill {
  height: 4px;
  border-radius: 4px;
  transition: width .4s ease;
}
.st-places-label {
  font-size: 11px;
  color: var(--st-soft);
}

/* Bouton/lien carte — fonctionne aussi bien en <button> qu'en <a> */
.st-btn-decouvrir {
  display: block;
  width: 100%;
  padding: 10px;
  background: var(--st-navy);
  color: #fff !important;
  border: none;
  border-radius: 9px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: background var(--st-transition), transform .1s;
  font-family: var(--st-font);
  text-align: center;
  text-decoration: none !important;
  box-sizing: border-box;
}
.st-btn-decouvrir:hover {
  background: var(--st-ocean);
  transform: translateY(-1px);
  color: #fff !important;
}

/* ── État vide ───────────────────────────────────────────── */
.st-empty {
  text-align: center;
  padding: 48px 24px;
  color: var(--st-soft);
  font-size: 15px;
  font-family: var(--st-font);
}

/* ── Modal catalogue ─────────────────────────────────────── */
.st-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.st-modal[hidden] { display: none; }

.st-modal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(4px);
}
.st-modal-content {
  position: relative;
  background: var(--st-white);
  border-radius: var(--st-radius);
  width: 100%;
  max-width: 840px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 24px 80px rgba(0,0,0,.28);
  animation: st-modal-in .22s ease;
}
@keyframes st-modal-in {
  from { opacity: 0; transform: scale(.96) translateY(12px); }
  to   { opacity: 1; transform: none; }
}
.st-modal-close {
  position: sticky;
  top: 12px;
  float: right;
  margin: 12px 12px 0 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--st-bg);
  border: none;
  cursor: pointer;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  transition: background .15s;
}
.st-modal-close:hover { background: var(--st-border); }

.st-modal-body { padding: 0; }
.st-modal-body .st-voyage-page { border-radius: 0; }
.st-modal-body .st-detail-hero { height: 220px; border-radius: 0; }
.st-modal-body .st-detail-hero-overlay { background: linear-gradient(to top, rgba(10,30,55,.88) 0%, rgba(10,30,55,.35) 60%, transparent 100%); }
.st-modal-body .st-detail-hero-content { max-width: 100%; padding: 20px 24px; }
.st-modal-body .st-detail-breadcrumb,
.st-modal-body .st-detail-layout { display: none; }

.st-spinner {
  text-align: center;
  padding: 60px;
  color: var(--st-soft);
  font-family: var(--st-font);
}

/* ═══════════════════════════════════════════════════════════
   PAGE VOYAGE CPT — Layout 2 colonnes premium
   ═══════════════════════════════════════════════════════════ */

.st-voyage-page {
  font-family: var(--st-font);
  color: #1e293b;
  max-width: 100%;
  margin: 0;
}

/* ── Hero ─────────────────────────────────────────────────── */
.st-detail-hero {
  height: 520px;
  background-color: var(--st-navy);
  position: relative;
  overflow: hidden;
}
.st-detail-hero-img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  z-index: 0;
  max-width: none !important;
}
.st-detail-hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(160deg,
    rgba(10,20,40,.12) 0%,
    rgba(10,25,50,.50) 48%,
    rgba(5,15,35,.86) 100%
  );
  display: flex;
  align-items: flex-end;
}
.st-detail-hero-content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 32px 44px;
  width: 100%;
}
.st-detail-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.st-detail-titre {
  font-size: clamp(1.9rem, 4.5vw, 3rem) !important;
  font-weight: 900 !important;
  color: #fff !important;
  margin: 0 0 16px !important;
  line-height: 1.15 !important;
  text-shadow: 0 2px 16px rgba(0,0,0,.5);
  letter-spacing: -.02em;
}
.st-detail-meta-row {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  color: rgba(255,255,255,.9);
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 20px;
}
.st-hero-cta { display: none; }

/* ── Breadcrumb ───────────────────────────────────────────── */
.st-detail-breadcrumb {
  max-width: 1200px;
  margin: 20px auto 0;
  padding: 0 32px;
  font-size: 13px;
  color: var(--st-soft);
  font-family: var(--st-font);
}
.st-detail-breadcrumb a {
  color: var(--st-soft);
  text-decoration: none;
}
.st-detail-breadcrumb a:hover { color: var(--st-navy); }
.st-bc-sep { margin: 0 6px; opacity: .5; }

/* ── Layout 2 colonnes ───────────────────────────────────── */
.st-detail-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 52px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 36px 32px 72px;
  align-items: start;
}
.st-detail-main { min-width: 0; }

/* ── Corps ────────────────────────────────────────────────── */
.st-detail-intro {
  background: linear-gradient(135deg, #eef4fb, #f8fafc);
  border-left: 4px solid var(--st-accent);
  border-radius: 0 var(--st-radius) var(--st-radius) 0;
  padding: 18px 22px;
  margin-bottom: 36px;
  font-size: 16px;
  font-style: italic;
  color: #374151;
  line-height: 1.7;
}
.st-detail-section { margin-bottom: 44px; }
.st-detail-desc {
  font-size: 15px;
  line-height: 1.8;
  color: #374151;
}

.st-section-titre {
  font-size: 1.2rem !important;
  font-weight: 800 !important;
  color: var(--st-navy) !important;
  margin: 0 0 20px !important;
  padding-bottom: 12px !important;
  border-bottom: 2px solid var(--st-border) !important;
  letter-spacing: -.01em;
}
.st-subsection {
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: var(--st-navy) !important;
  margin: 0 0 10px !important;
}

/* ── Inclus / Non inclus ──────────────────────────────────── */
.st-inclus-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.st-inclus-block {
  background: var(--st-bg);
  border-radius: 14px;
  padding: 20px 22px;
}
.st-inclus-yes { border-top: 3px solid var(--st-green); }
.st-inclus-no  { border-top: 3px solid #cbd5e1; }
.st-inclus-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}
.st-inclus-header strong {
  font-size: 14px;
  font-weight: 700;
  color: #1e293b;
}
.st-checklist {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.st-checklist li {
  font-size: 14px;
  line-height: 1.55;
  color: #374151;
  display: flex;
  align-items: baseline;
  gap: 8px;
  word-break: break-word;
}
.st-li-icon {
  flex-shrink: 0;
  font-weight: 700;
  font-size: 13px;
  width: 16px;
  text-align: center;
  line-height: 1.55;
}
.st-li-yes .st-li-icon { color: var(--st-green); }
.st-li-no  .st-li-icon { color: #e74c3c; }

/* ── Programme — timeline verticale ──────────────────────── */
.st-programme {
  position: relative;
  display: flex;
  flex-direction: column;
  padding-left: 28px;
}
.st-programme::before {
  content: '';
  position: absolute;
  left: 21px;
  top: 28px;
  bottom: 28px;
  width: 2px;
  background: linear-gradient(to bottom, var(--st-navy), rgba(14,90,138,.1));
}
.st-prog-jour {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding-bottom: 22px;
  position: relative;
}
.st-prog-jour:last-child { padding-bottom: 0; }
.st-prog-num {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  background: var(--st-navy);
  color: #fff;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
  box-shadow: 0 0 0 4px #fff, 0 0 0 6px rgba(26,58,92,.15);
  margin-left: -22px;
}
.st-prog-num span { font-size: 15px; font-weight: 900; line-height: 1; }
.st-prog-num small { font-size: 8px; font-weight: 700; letter-spacing: .06em; opacity: .7; text-transform: uppercase; }
.st-prog-content {
  flex: 1;
  background: var(--st-bg);
  border-radius: 10px;
  padding: 14px 18px;
  margin-top: 10px;
  border-left: 3px solid var(--st-ocean);
}
.st-prog-content strong { display: block; font-size: 14px; font-weight: 700; margin-bottom: 6px; color: #1e293b; }
.st-prog-content p { font-size: 13px; color: var(--st-soft); margin: 0; line-height: 1.7; }

/* ── Galerie ──────────────────────────────────────────────── */
.st-gallery {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  border-radius: 14px;
  overflow: hidden;
}
.st-gallery-1 { grid-template-columns: 1fr; }
.st-gallery-2 { grid-template-columns: repeat(2, 1fr); }
.st-gallery-3 { grid-template-columns: repeat(3, 1fr); }
.st-gallery-img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  cursor: zoom-in;
  transition: opacity .15s, transform .3s;
  display: block;
}
.st-gallery-img:hover { opacity: .9; transform: scale(1.03); }

/* ── Lightbox ─────────────────────────────────────────────── */
.st-lightbox {
  position: fixed;
  inset: 0;
  z-index: 999999;
  background: rgba(0,0,0,.93);
  display: flex;
  align-items: center;
  justify-content: center;
}
.st-lightbox[hidden] { display: none; }
.st-lightbox-img { max-width: 90vw; max-height: 88vh; object-fit: contain; border-radius: 8px; }
.st-lightbox-close {
  position: fixed;
  top: 16px; right: 20px;
  width: 40px; height: 40px;
  background: rgba(255,255,255,.15);
  border: none; border-radius: 50%;
  color: #fff; font-size: 20px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.st-lightbox-nav {
  position: fixed;
  bottom: 24px; left: 50%;
  transform: translateX(-50%);
  display: flex; gap: 16px;
}
.st-lightbox-nav button {
  width: 44px; height: 44px;
  background: rgba(255,255,255,.2);
  border: none; border-radius: 50%;
  color: #fff; font-size: 22px; cursor: pointer;
}

/* ── Ramassage ────────────────────────────────────────────── */
.st-ramassage { margin-bottom: 24px; }
.st-tags { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.st-tag {
  background: #eef4fb;
  color: var(--st-navy);
  font-size: 13px;
  font-weight: 600;
  padding: 5px 13px;
  border-radius: 999px;
  border: 1px solid #c8daea;
}

/* ── Conditions ───────────────────────────────────────────── */
.st-conditions { background: var(--st-bg); border-radius: 12px; padding: 20px; }
.st-conditions-text { font-size: 13px; color: var(--st-soft); line-height: 1.7; margin: 0; }

/* ── Formulaire de demande ────────────────────────────────── */
.st-demande-section {
  background: #f4f8ff;
  border-radius: 16px;
  padding: 32px;
  border: 1px solid #dce8f8;
}
.st-demande-section .st-section-titre { margin-top: 0; }
.st-demande-intro {
  color: var(--st-soft);
  font-size: 14.5px;
  margin: 0 0 20px;
}
.st-demande-form { display: flex; flex-direction: column; gap: 16px; }
.st-demande-row  { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.st-demande-field { display: flex; flex-direction: column; gap: 6px; }
.st-demande-field label {
  font-size: 13px;
  font-weight: 600;
  color: var(--st-navy);
}
.st-demande-field input,
.st-demande-field textarea {
  padding: 11px 14px;
  border: 1.5px solid var(--st-border);
  border-radius: 10px;
  font-size: 14px;
  font-family: inherit;
  color: var(--st-navy);
  background: #fff;
  transition: border-color .2s, box-shadow .2s;
  outline: none;
  width: 100%;
  box-sizing: border-box;
}
.st-demande-field input:focus,
.st-demande-field textarea:focus {
  border-color: var(--st-accent);
  box-shadow: 0 0 0 3px rgba(230,126,34,.12);
}
.st-demande-field textarea { resize: vertical; min-height: 100px; }
.st-demande-footer { display: flex; flex-direction: column; gap: 12px; }
.st-demande-btn {
  display: inline-block;
  padding: 13px 28px;
  background: var(--st-accent);
  color: #fff !important;
  font-size: 15px;
  font-weight: 700;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  font-family: inherit;
  text-align: center;
  transition: background .2s, transform .15s, box-shadow .2s;
  box-shadow: 0 4px 16px rgba(230,126,34,.3);
  align-self: flex-start;
  text-decoration: none !important;
}
.st-demande-btn:hover:not(:disabled) {
  background: #d4650a;
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(230,126,34,.4);
}
.st-demande-btn:disabled { opacity: .65; cursor: not-allowed; transform: none; }
.st-demande-msg {
  padding: 12px 16px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
}
.st-demande-ok  { background: #f0fdf4; color: #166534; border: 1px solid #86efac; }
.st-demande-err { background: #fef2f2; color: #991b1b; border: 1px solid #fca5a5; }

/* Lien ancre sidebar */
.st-demande-anchor-btn {
  display: block;
  margin-top: 10px;
  padding: 11px 16px;
  background: #f4f8ff;
  color: var(--st-accent) !important;
  border: 1.5px solid var(--st-accent);
  border-radius: 10px;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  text-decoration: none !important;
  transition: background .2s, color .2s;
}
.st-demande-anchor-btn:hover {
  background: var(--st-accent);
  color: #fff !important;
}

@media (max-width: 640px) {
  .st-demande-row     { grid-template-columns: 1fr; }
  .st-demande-section { padding: 20px; }
  .st-demande-btn     { width: 100%; align-self: stretch; }
}

/* ── Sidebar sticky ──────────────────────────────────────── */
.st-detail-sidebar {
  position: sticky;
  top: 80px;
  align-self: start;
}

.st-prix-card {
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 8px 48px rgba(0,0,0,.12);
  padding: 28px;
  border: 1px solid rgba(0,0,0,.06);
  color: #1e293b;
}
.st-prix-header {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--st-soft);
  margin-bottom: 6px;
}
.st-prix-amount {
  margin-bottom: 4px;
}
.st-prix-amount strong {
  font-size: 44px;
  font-weight: 900;
  color: var(--st-navy);
  display: block;
  line-height: 1;
  letter-spacing: -.03em;
}
.st-prix-amount sup {
  font-size: 22px;
  font-weight: 700;
  vertical-align: top;
  margin-top: 8px;
  display: inline-block;
}
.st-departs-list {
  margin: 10px 0 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.st-depart-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  background: #f8fafc;
  border: 1px solid var(--st-border);
  border-radius: 10px;
  font-size: 14px;
}
.st-depart-lieu { color: #374151; }
.st-depart-prix {
  color: var(--st-navy);
  font-size: 15px;
  font-weight: 800;
  white-space: nowrap;
}

.st-prix-acompte {
  font-size: 13px;
  color: var(--st-soft);
  margin: 8px 0 20px;
}
.st-prix-acompte strong { color: var(--st-navy); }

.st-prix-dates {
  border-top: 1px solid var(--st-border);
  border-bottom: 1px solid var(--st-border);
  padding: 14px 0;
  margin-bottom: 18px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.st-prix-date-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
}
.st-prix-date-row span  { color: var(--st-soft); }
.st-prix-date-row strong { color: #1e293b; font-weight: 600; }

.st-places-detail { margin-bottom: 20px; }
.st-places-detail .st-places-bar {
  height: 6px;
  background: var(--st-border);
  border-radius: 6px;
  margin-bottom: 7px;
  overflow: hidden;
}
.st-places-info {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: var(--st-soft);
}

.st-prix-cta { margin-bottom: 14px; }
.st-cta-btn {
  display: block;
  text-align: center;
  padding: 14px 24px;
  background: var(--st-accent);
  color: #fff !important;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  transition: background .15s, transform .1s, box-shadow .15s;
  font-family: var(--st-font);
  box-shadow: 0 4px 16px rgba(230,126,34,.35);
}
.st-cta-btn:hover {
  background: var(--st-accent2);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(230,126,34,.45);
  color: #fff !important;
}
.st-hero-cta-btn {
  background: rgba(255,255,255,.15) !important;
  border: 2px solid rgba(255,255,255,.7) !important;
  box-shadow: none !important;
  backdrop-filter: blur(8px);
}
.st-hero-cta-btn:hover {
  background: rgba(255,255,255,.25) !important;
  transform: translateY(-2px) !important;
}
.st-cta-note { font-size: 13px; text-align: center; color: var(--st-soft); padding: 14px 0; }

.st-contact-links {
  display: flex;
  gap: 8px;
  flex-direction: column;
}
.st-contact-link {
  color: var(--st-soft) !important;
  font-size: 13px;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 500;
  transition: color .15s;
}
.st-contact-link:hover { color: var(--st-navy) !important; }

/* Lien page dédiée (modal) */
.st-modal-permalink {
  font-size: 13px;
  color: var(--st-ocean) !important;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1.5px solid rgba(14,90,138,.3);
  padding-bottom: 1px;
  transition: border-color .15s, color .15s;
  font-family: var(--st-font);
}
.st-modal-permalink:hover {
  color: var(--st-navy) !important;
  border-bottom-color: var(--st-navy);
}

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 1024px) {
  .st-detail-layout { grid-template-columns: 1fr 300px; gap: 36px; }
}
@media (max-width: 860px) {
  .st-detail-layout {
    grid-template-columns: 1fr;
    gap: 28px;
    padding: 24px 20px 56px;
  }
  .st-detail-sidebar { position: static; order: -1; }
  .st-prix-card { border-radius: 14px; }
  .st-detail-hero { height: 360px; }
  .st-detail-hero-content { padding: 0 20px 32px; }
  .st-hero-cta { display: block; }
  .st-inclus-grid { grid-template-columns: 1fr; }
  .st-gallery { grid-template-columns: repeat(2, 1fr); }
  .st-detail-meta-row { gap: 12px; font-size: 13px; }
  .st-detail-breadcrumb { padding: 0 20px; }
}
@media (max-width: 480px) {
  .st-detail-hero { height: 280px; }
  .st-detail-titre { font-size: 1.6rem !important; }
  .st-prix-amount strong { font-size: 34px; }
}

/* ════════════════════════════════════════════════════════════
   MOTEUR DE RECHERCHE  [sissitour_search]
   ════════════════════════════════════════════════════════════ */

.st-search { font-family: var(--st-font); }

/* ── Hero ─────────────────────────────────────────────────── */
.st-sh-hero {
  background: linear-gradient(135deg, #08192e 0%, #1a3a5c 48%, #0e5a8a 100%);
  padding: 72px 24px 56px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.st-sh-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 80% 60% at 70% 20%, rgba(230,126,34,.18), transparent 55%),
              radial-gradient(ellipse 50% 40% at 20% 80%, rgba(14,90,138,.3), transparent 55%);
  pointer-events: none;
}
.st-sh-hero-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: .22;
  filter: saturate(1.2);
}
.st-sh-hero-content {
  position: relative;
  z-index: 1;
  max-width: 740px;
  margin: 0 auto;
}
.st-sh-heading {
  font-size: clamp(1.9rem, 4.5vw, 3rem) !important;
  font-weight: 900 !important;
  color: #fff !important;
  margin: 0 0 10px !important;
  letter-spacing: -.035em !important;
  line-height: 1.08 !important;
  text-shadow: 0 3px 24px rgba(0,0,0,.35);
}
.st-sh-subheading {
  font-size: 16px;
  color: rgba(255,255,255,.72);
  margin: 0 0 36px;
  font-weight: 400;
  letter-spacing: .01em;
}

/* Barre de recherche */
.st-sh-form {
  display: flex;
  gap: 10px;
  max-width: 640px;
  margin: 0 auto 26px;
}
.st-sh-input-wrap {
  flex: 1;
  position: relative;
  display: flex;
  align-items: center;
}
.st-sh-icon {
  display: none;
  position: absolute;
  left: 17px;
  font-size: 18px;
  pointer-events: none;
  z-index: 2;
  line-height: 1;
}
.st-sh-field {
  width: 100% !important;
  padding: 17px 50px 17px 20px !important;
  font-size: 16px !important;
  border: 2px solid transparent !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.97) !important;
  color: #1e293b !important;
  box-shadow: 0 6px 36px rgba(0,0,0,.28), 0 1px 0 rgba(255,255,255,.08) inset !important;
  outline: none !important;
  font-family: var(--st-font) !important;
  transition: border-color .2s, box-shadow .2s !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}
.st-sh-field:focus {
  border-color: var(--st-accent) !important;
  box-shadow: 0 6px 36px rgba(0,0,0,.28), 0 0 0 4px rgba(230,126,34,.25) !important;
}
.st-sh-clear {
  position: absolute;
  right: 13px;
  width: 26px;
  height: 26px;
  border: none;
  background: #e2e8f0;
  color: #64748b;
  border-radius: 50%;
  cursor: pointer;
  font-size: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s, color .15s;
  font-family: var(--st-font);
}
.st-sh-clear:hover { background: var(--st-red); color: #fff; }
.st-sh-btn {
  padding: 17px 30px;
  background: var(--st-accent);
  color: #fff;
  border: none;
  border-radius: 16px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  font-family: var(--st-font);
  white-space: nowrap;
  transition: background .18s, transform .1s, box-shadow .18s;
  box-shadow: 0 4px 24px rgba(230,126,34,.45);
  letter-spacing: .01em;
}
.st-sh-btn:hover {
  background: #d97019;
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(230,126,34,.5);
}
.st-sh-btn:active { transform: translateY(0); }

/* Chips rapides continents */
.st-sh-quick-filters {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 4px;
}
.st-sh-qchip {
  padding: 6px 17px;
  border-radius: 999px;
  border: 1.5px solid rgba(255,255,255,.32);
  background: rgba(255,255,255,.1);
  color: rgba(255,255,255,.82);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: var(--st-font);
  transition: all .18s;
  backdrop-filter: blur(6px);
  letter-spacing: .01em;
}
.st-sh-qchip:hover { background: rgba(255,255,255,.22); color: #fff; border-color: rgba(255,255,255,.55); }
.st-sh-qchip.st-active {
  background: rgba(255,255,255,.92);
  color: var(--st-navy);
  border-color: transparent;
  box-shadow: 0 2px 12px rgba(0,0,0,.2);
}

/* ── Corps résultats ──────────────────────────────────────── */
.st-sh-body {
  max-width: 1180px;
  margin: 0 auto;
  padding: 36px 24px 72px;
}

/* Toolbar */
.st-sh-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
  gap: 12px;
  flex-wrap: wrap;
  padding-bottom: 18px;
  border-bottom: 1.5px solid var(--st-border);
}
.st-sh-count {
  font-size: 15px;
  color: var(--st-soft);
  font-weight: 500;
}
.st-sh-count strong { color: var(--st-navy); font-weight: 800; font-size: 17px; }
.st-sh-controls { display: flex; align-items: center; gap: 10px; }
.st-sh-sort {
  padding: 9px 34px 9px 14px;
  border: 1.5px solid var(--st-border);
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--st-navy);
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%2364748b' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 11px center;
  appearance: none;
  cursor: pointer;
  font-family: var(--st-font);
  transition: border-color .15s;
}
.st-sh-sort:focus { outline: none; border-color: var(--st-navy); }
.st-sh-view-btns { display: flex; gap: 4px; }
.st-sh-view-btn {
  width: 38px;
  height: 38px;
  border: 1.5px solid var(--st-border);
  border-radius: 9px;
  background: #fff;
  cursor: pointer;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--st-soft);
  transition: all .15s;
  font-family: var(--st-font);
}
.st-sh-view-btn:hover { border-color: var(--st-navy); color: var(--st-navy); }
.st-sh-view-btn.st-sh-view-active {
  background: var(--st-navy);
  border-color: var(--st-navy);
  color: #fff;
}

/* Filtres actifs */
.st-sh-active {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 22px;
}
.st-sh-active:empty { margin-bottom: 0; }
.st-sh-ftag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 8px 5px 14px;
  background: linear-gradient(135deg, #eef4fb, #ddeaf8);
  color: var(--st-navy);
  border: 1px solid #b8d4ec;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  font-family: var(--st-font);
}
.st-sh-ftag-rm {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: none;
  background: var(--st-navy);
  color: #fff;
  font-size: 10px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-family: var(--st-font);
  transition: background .15s;
  line-height: 1;
}
.st-sh-ftag-rm:hover { background: var(--st-red); }
.st-sh-reset {
  padding: 5px 14px;
  border: 1px solid var(--st-border);
  background: #fff;
  color: var(--st-soft);
  border-radius: 999px;
  font-size: 12px;
  cursor: pointer;
  font-family: var(--st-font);
  font-weight: 500;
  transition: all .15s;
}
.st-sh-reset:hover { border-color: var(--st-red); color: var(--st-red); background: #fff5f5; }

/* ── Grille résultats ─────────────────────────────────────── */
.st-sh-results { display: grid; gap: 24px; }
.st-sh-grid    { grid-template-columns: repeat(3, 1fr); }
.st-sh-list    { grid-template-columns: 1fr; }

/* ── Carte search — IMAGE + BODY ──────────────────────────── */
.st-sc {
  cursor: pointer;
  position: relative;
}

/* Liste view — horizontale */
.st-sh-list .st-sc {
  display: grid;
  grid-template-columns: 300px 1fr;
  background: #fff;
  border-radius: var(--st-radius);
  box-shadow: var(--st-shadow);
  overflow: hidden;
  border: 1px solid transparent;
  transition: transform var(--st-transition), box-shadow var(--st-transition), border-color var(--st-transition);
}
.st-sh-list .st-sc:hover {
  transform: translateY(-4px);
  box-shadow: var(--st-shadow-hover);
  border-color: rgba(26,58,92,.15);
}

/* Grid view — verticale */
.st-sh-grid .st-sc {
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: var(--st-radius);
  box-shadow: var(--st-shadow);
  overflow: hidden;
  border: 1px solid transparent;
  transition: transform var(--st-transition), box-shadow var(--st-transition), border-color var(--st-transition);
}
.st-sh-grid .st-sc:hover {
  transform: translateY(-6px);
  box-shadow: var(--st-shadow-hover);
  border-color: rgba(26,58,92,.15);
}

/* Image zone */
.st-sc-img-wrap {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #c8d8e8, #dde9f4);
  flex-shrink: 0;
}
.st-sh-list .st-sc-img-wrap  { min-height: 200px; }
.st-sh-grid .st-sc-img-wrap  { aspect-ratio: 16/9; }

.st-sc-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
}
.st-sc:hover .st-sc-img { transform: scale(1.07); }
.st-sc-img-placeholder {
  width: 100%;
  height: 100%;
  min-height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 54px;
  background: linear-gradient(135deg, #dde8f4, #c4d9ee);
}
.st-sc-img-badges {
  position: absolute;
  top: 12px;
  left: 12px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.st-sc-img-duree {
  position: absolute;
  bottom: 10px;
  right: 10px;
  background: rgba(0,0,0,.65);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 999px;
  backdrop-filter: blur(4px);
}

/* Gradient overlay en bas de l'image (list) */
.st-sh-list .st-sc-img-wrap::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, transparent 60%, rgba(255,255,255,.08));
  pointer-events: none;
}

/* Body */
.st-sc-body {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.st-sh-list .st-sc-body { padding: 24px 28px; }
.st-sh-grid .st-sc-body { padding: 18px 20px 20px; flex: 1; }

.st-sc-date {
  font-size: 12px;
  color: var(--st-soft);
  font-weight: 500;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  gap: 5px;
}
.st-sc-titre {
  font-size: 1.18rem !important;
  font-weight: 800 !important;
  color: var(--st-navy) !important;
  margin: 0 0 5px !important;
  line-height: 1.25 !important;
  letter-spacing: -.01em !important;
}
.st-sh-grid .st-sc-titre { font-size: 1.05rem !important; }
.st-sc-dest {
  font-size: 13px;
  color: var(--st-soft);
  margin-bottom: 10px;
}
.st-sc-desc {
  font-size: 13.5px;
  color: #4b5563;
  line-height: 1.6;
  margin: 0 0 16px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.st-sh-grid .st-sc-desc { flex: 1; }

/* Footer carte */
.st-sc-footer {
  padding-top: 14px;
  border-top: 1px solid var(--st-border);
  margin-top: auto;
}
.st-sh-list .st-sc-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}
.st-sh-grid .st-sc-footer {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Prix */
.st-sc-price-label { font-size: 11px; color: var(--st-soft); margin-bottom: 3px; letter-spacing: .03em; text-transform: uppercase; }
.st-sc-price {
  font-size: 28px;
  font-weight: 900;
  color: var(--st-navy);
  letter-spacing: -.03em;
  line-height: 1;
}
.st-sh-grid .st-sc-price { font-size: 22px; }
.st-sc-price sup { font-size: 14px; vertical-align: super; font-weight: 700; }
.st-sc-price-pp { font-size: 11px; color: var(--st-soft); margin-top: 3px; }

/* Barre places + CTA (list) */
.st-sc-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  flex-shrink: 0;
}
.st-sh-grid .st-sc-right {
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.st-sc-places-wrap { text-align: right; }
.st-sh-grid .st-sc-places-wrap { text-align: left; }
.st-sc-bar {
  height: 4px;
  background: #e2e8f0;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 5px;
}
.st-sh-list .st-sc-bar { width: 110px; }
.st-sh-grid .st-sc-bar { width: 80px; }
.st-sc-bar-fill { height: 100%; border-radius: 4px; transition: width .4s ease; }
.st-sc-places-lbl { font-size: 11px; color: var(--st-soft); white-space: nowrap; }

.st-sc-cta {
  display: inline-block;
  padding: 11px 24px;
  background: var(--st-navy);
  color: #fff !important;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 700;
  border: none;
  cursor: pointer;
  font-family: var(--st-font);
  transition: background .15s, transform .1s, box-shadow .15s;
  white-space: nowrap;
  text-decoration: none;
  letter-spacing: .01em;
}
.st-sc-cta:hover {
  background: var(--st-accent);
  color: #fff !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 18px rgba(230,126,34,.35);
}
.st-sh-grid .st-sc-cta { width: 100%; text-align: center; }

/* ── Skeleton ─────────────────────────────────────────────── */
@keyframes st-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
.st-skeleton {
  border-radius: var(--st-radius);
  background: linear-gradient(90deg, #eef2f7 25%, #e2e8f0 50%, #eef2f7 75%);
  background-size: 200% 100%;
  animation: st-shimmer 1.8s infinite linear;
}
.st-sh-skel { border-radius: var(--st-radius); }
.st-sh-grid .st-sh-skel { aspect-ratio: 3/4; }
.st-sh-list .st-sh-skel { height: 180px; }

/* ── État vide ────────────────────────────────────────────── */
.st-sh-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 80px 24px;
  font-family: var(--st-font);
}
.st-sh-empty-icon { font-size: 56px; margin-bottom: 20px; display: block; }
.st-sh-empty h3 {
  font-size: 1.4rem !important;
  font-weight: 800 !important;
  color: var(--st-navy) !important;
  margin: 0 0 10px !important;
}
.st-sh-empty p { font-size: 15px; color: var(--st-soft); margin: 0 0 24px; }
.st-sh-empty-reset {
  padding: 11px 28px;
  border: 2px solid var(--st-navy);
  background: transparent;
  color: var(--st-navy);
  border-radius: 10px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  font-family: var(--st-font);
  transition: all .18s;
}
.st-sh-empty-reset:hover { background: var(--st-navy); color: #fff; }

/* ── Charger plus ─────────────────────────────────────────── */
.st-sh-more { text-align: center; padding: 36px 0 0; }
.st-sh-more[hidden] { display: none; }
.st-sh-more-btn {
  padding: 14px 40px;
  border: 2px solid var(--st-navy);
  background: transparent;
  color: var(--st-navy);
  border-radius: 12px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  font-family: var(--st-font);
  transition: all .18s;
  letter-spacing: .01em;
}
.st-sh-more-btn:hover { background: var(--st-navy); color: #fff; }
.st-sh-more-btn:disabled { opacity: .45; cursor: not-allowed; }

/* ── Responsive search ────────────────────────────────────── */
@media (max-width: 1024px) {
  .st-sh-list .st-sc { grid-template-columns: 240px 1fr; }
  .st-sh-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
  .st-sh-grid { grid-template-columns: 1fr; }
  .st-sh-list .st-sc { grid-template-columns: 200px 1fr; }
  .st-sh-list .st-sc-body { padding: 18px 20px; }
}
@media (max-width: 640px) {
  .st-sh-hero  { padding: 48px 16px 40px; }
  .st-sh-form  { flex-direction: column; }
  .st-sh-btn   { width: 100%; padding: 15px; }
  .st-sh-body  { padding: 24px 16px 52px; }
  .st-sh-list .st-sc { grid-template-columns: 1fr; }
  .st-sh-list .st-sc-img-wrap { min-height: 0; aspect-ratio: 16/9; }
  .st-sh-list .st-sc-footer { flex-direction: column; align-items: stretch; }
  .st-sh-list .st-sc-right  { flex-direction: row; align-items: center; justify-content: space-between; }
  .st-sh-toolbar { flex-direction: column; align-items: flex-start; }
  .st-sh-sort { width: 100%; }
}

/* ════════════════════════════════════════════════════════════
   BARRE DE FILTRES AVANCÉS
   ════════════════════════════════════════════════════════════ */

/* ── Wrapper externe (injecté entre le hero et le body) ───── */
.st-sh-fbar-wrap {
  background: #fff;
  border-bottom: 1.5px solid var(--st-border);
  position: sticky;
  top: 0;
  z-index: 200;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}

/* Conteneur scroll horizontal sur petits écrans */
.st-sh-fbar {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 24px;
}

.st-sh-fbar-inner {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 0;
  overflow-x: auto;
  overflow-y: visible;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.st-sh-fbar-inner::-webkit-scrollbar { display: none; }

/* ── Pill bouton (ouvre le panel) ─────────────────────────── */
.st-sh-fpill-wrap {
  position: relative;
  flex-shrink: 0;
}

.st-sh-fpill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 8px 14px;
  border: 1.5px solid var(--st-border);
  border-radius: 999px;
  background: #fff;
  color: #374151;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: var(--st-font);
  transition: border-color .15s, background .15s, color .15s, box-shadow .15s;
  white-space: nowrap;
}
.st-sh-fpill:hover {
  border-color: var(--st-navy);
  color: var(--st-navy);
  background: #f8fafc;
}
.st-sh-fpill.st-sh-fpill-open {
  border-color: var(--st-navy);
  background: var(--st-navy);
  color: #fff;
  box-shadow: 0 4px 16px rgba(26,58,92,.22);
}
.st-sh-fpill.st-sh-fpill-active {
  border-color: var(--st-accent);
  background: #fff7f0;
  color: var(--st-accent);
}
.st-sh-fpill.st-sh-fpill-active.st-sh-fpill-open {
  background: var(--st-accent);
  color: #fff;
}

.st-sh-fpill-label { flex-shrink: 0; }

.st-sh-fpill-val {
  font-weight: 700;
  color: var(--st-accent);
  font-size: 12px;
  flex-shrink: 0;
}
.st-sh-fpill-open .st-sh-fpill-val,
.st-sh-fpill-active.st-sh-fpill-open .st-sh-fpill-val { color: rgba(255,255,255,.9); }

.st-sh-fpill-caret {
  flex-shrink: 0;
  opacity: .55;
  transition: transform .2s;
}
.st-sh-fpill-open .st-sh-fpill-caret {
  transform: rotate(180deg);
  opacity: .9;
}

/* ── Panel déroulant ──────────────────────────────────────── */
.st-sh-fpanel {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 500;
  background: #fff;
  border: 1.5px solid var(--st-border);
  border-radius: 16px;
  box-shadow: 0 16px 56px rgba(0,0,0,.14);
  padding: 20px;
  min-width: 280px;
  animation: st-panel-in .18s cubic-bezier(.22,1,.36,1);
}
.st-sh-fpanel[hidden] { display: none; }

@keyframes st-panel-in {
  from { opacity: 0; transform: translateY(-8px) scale(.97); }
  to   { opacity: 1; transform: none; }
}

.st-sh-fpanel-mois  { min-width: 320px; }
.st-sh-fpanel-pays  { min-width: 360px; }

.st-sh-fpanel-head {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--st-soft);
  margin-bottom: 14px;
}

/* ── Presets (raccourcis budget / durée) ──────────────────── */
.st-sh-fpresets {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 16px;
}

.st-sh-fpreset {
  padding: 6px 13px;
  border: 1.5px solid var(--st-border);
  border-radius: 999px;
  background: #fff;
  color: #374151;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  font-family: var(--st-font);
  transition: border-color .15s, background .15s, color .15s;
  white-space: nowrap;
}
.st-sh-fpreset:hover {
  border-color: var(--st-ocean);
  color: var(--st-ocean);
  background: #f0f7ff;
}
.st-sh-fpreset-active {
  border-color: var(--st-accent) !important;
  background: #fff4ec !important;
  color: var(--st-accent) !important;
}

/* ── Saisie min/max (budget / durée) ─────────────────────── */
.st-sh-frange-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}

.st-sh-frange-field {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.st-sh-frange-field label {
  font-size: 11px;
  font-weight: 700;
  color: var(--st-soft);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.st-sh-frange-inp {
  display: flex;
  align-items: center;
  gap: 0;
  border: 1.5px solid var(--st-border);
  border-radius: 9px;
  overflow: hidden;
  background: #fff;
  transition: border-color .15s, box-shadow .15s;
}
.st-sh-frange-inp:focus-within {
  border-color: var(--st-navy);
  box-shadow: 0 0 0 3px rgba(26,58,92,.1);
}
.st-sh-frange-inp input {
  flex: 1;
  border: none;
  outline: none;
  padding: 9px 10px;
  font-size: 14px;
  font-family: var(--st-font);
  color: #1e293b;
  background: transparent;
  min-width: 0;
  -moz-appearance: textfield;
}
.st-sh-frange-inp input::-webkit-outer-spin-button,
.st-sh-frange-inp input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.st-sh-frange-inp span {
  padding: 9px 10px 9px 4px;
  font-size: 13px;
  font-weight: 700;
  color: var(--st-soft);
  pointer-events: none;
}

.st-sh-frange-sep {
  font-size: 16px;
  color: var(--st-border);
  font-weight: 300;
  flex-shrink: 0;
  padding-top: 22px;
}

/* ── Bouton appliquer ─────────────────────────────────────── */
.st-sh-fapply {
  width: 100%;
  padding: 11px;
  background: var(--st-navy);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  font-family: var(--st-font);
  transition: background .15s, transform .1s;
  letter-spacing: .01em;
}
.st-sh-fapply:hover { background: var(--st-ocean); transform: translateY(-1px); }

/* ── Grille mois ──────────────────────────────────────────── */
.st-sh-months {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 7px;
}

.st-sh-month-chip {
  padding: 8px 4px;
  border: 1.5px solid var(--st-border);
  border-radius: 9px;
  background: #fff;
  color: #374151;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  font-family: var(--st-font);
  text-align: center;
  transition: border-color .15s, background .15s, color .15s, transform .1s;
  line-height: 1.1;
}
.st-sh-month-chip:hover {
  border-color: var(--st-ocean);
  color: var(--st-ocean);
  background: #f0f7ff;
  transform: translateY(-1px);
}
.st-sh-month-chip.st-sh-month-active {
  border-color: var(--st-accent);
  background: var(--st-accent);
  color: #fff;
  box-shadow: 0 3px 10px rgba(230,126,34,.3);
}

.st-sh-fpanel-hint {
  font-size: 11px;
  color: var(--st-soft);
  margin-top: 10px;
  text-align: center;
  font-style: italic;
}

/* ── Pays — chips cliquables ──────────────────────────────── */
/* ── Recherche rapide dans le panel Pays ─────────────────── */
.st-sh-pays-search-box {
  margin-bottom: 10px;
}
.st-sh-pays-search-inp {
  width: 100%;
  padding: 8px 12px;
  border: 1.5px solid var(--st-border);
  border-radius: 8px;
  font-size: 13px;
  font-family: var(--st-font);
  color: var(--st-dark);
  background: #f9fafb;
  outline: none;
  box-sizing: border-box;
  transition: border-color .15s, background .15s;
}
.st-sh-pays-search-inp:focus {
  border-color: var(--st-ocean);
  background: #fff;
}
.st-sh-pays-search-inp::placeholder { color: #9ca3af; }
.st-sh-pays-no-result {
  font-size: 13px;
  color: var(--st-soft);
  padding: 6px 2px;
  display: none;
}

/* ── Chips pays ───────────────────────────────────────────── */
.st-sh-pays-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  max-height: 180px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--st-border) transparent;
  padding: 4px 2px 2px;
}
.st-sh-pays-chips::-webkit-scrollbar { width: 4px; }
.st-sh-pays-chips::-webkit-scrollbar-thumb { background: var(--st-border); border-radius: 4px; }

.st-sh-pays-chip {
  padding: 7px 15px;
  border: 1.5px solid var(--st-border);
  border-radius: 999px;
  background: #fff;
  color: #374151;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: var(--st-font);
  transition: border-color .15s, background .15s, color .15s, transform .1s, box-shadow .15s;
  white-space: nowrap;
  line-height: 1.2;
}
.st-sh-pays-chip:hover {
  border-color: var(--st-ocean);
  color: var(--st-ocean);
  background: #f0f7ff;
  transform: translateY(-1px);
}
.st-sh-pays-chip-active {
  border-color: var(--st-accent) !important;
  background: var(--st-accent) !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(230,126,34,.3);
}
.st-sh-pays-all { font-weight: 700; }

/* ── Toggle "Disponibles uniquement" — bouton pur sans checkbox ── */
.st-sh-fdispo {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  cursor: pointer;
  padding: 6px 14px 6px 10px;
  border: 1.5px solid var(--st-border);
  border-radius: 999px;
  background: #fff;
  font-family: var(--st-font);
  flex-shrink: 0;
  transition: border-color .15s, background .15s;
}
.st-sh-fdispo:hover { border-color: var(--st-green); background: #f0fdf4; }
.st-sh-fdispo.st-sh-fdispo-on { border-color: var(--st-green); background: #f0fdf4; }

.st-sh-fdispo-track {
  width: 34px;
  height: 19px;
  border-radius: 999px;
  background: #d1d5db;
  position: relative;
  flex-shrink: 0;
  transition: background .2s;
}
.st-sh-fdispo.st-sh-fdispo-on .st-sh-fdispo-track { background: var(--st-green); }

.st-sh-fdispo-thumb {
  position: absolute;
  left: 2px;
  top: 2px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0,0,0,.25);
  transition: left .2s;
}
.st-sh-fdispo.st-sh-fdispo-on .st-sh-fdispo-thumb { left: 17px; }

.st-sh-fdispo-lbl {
  font-size: 12.5px;
  font-weight: 600;
  color: #374151;
  white-space: nowrap;
}
.st-sh-fdispo.st-sh-fdispo-on .st-sh-fdispo-lbl { color: #166534; }

/* ── Responsive fbar ──────────────────────────────────────── */
@media (max-width: 640px) {
  .st-sh-fbar { padding: 0 16px; }
  .st-sh-fbar-inner { gap: 5px; padding: 8px 0; }
  .st-sh-fpill { padding: 7px 11px; font-size: 12px; }
  .st-sh-fpanel { min-width: 92vw; max-width: 98vw; left: 50% !important; right: auto !important; transform: translateX(-50%); }
  .st-sh-fpanel-mois, .st-sh-fpanel-pays { min-width: 92vw; }
  .st-sh-months { grid-template-columns: repeat(3, 1fr); }
}