:root {
  --bg:#0f1420; --bg2:#1a2440; --bg3:#242e4f; --card:#f0f4f8; --card-text:#0a2540; --card-muted:#5a534e; --card-label:#7a6f68;
  --border:rgba(255,255,255,0.10); --border2:rgba(255,255,255,0.18);
  --accent:#2563eb; --accent2:#3b82f6; --accent3:#1d4ed8;
  /* Accents chaleureux "vacances/soleil" */
  --warm:#f59e0b;       /* ambre / soleil couchant */
  --warm2:#7dd3fc;      /* ambre clair */
  --warm-soft:#fde68a;  /* sable */
  --terracotta:#2563eb; /* tuile sud de la France */
  --sage:#84a98c;       /* pin méditerranéen */
  --text:#f0f0f0; --muted:#909090;
  --font-head:'Segoe UI','Segoe UI Bold','Helvetica Neue',Arial,sans-serif;
  --font-mono:'Segoe UI','Courier New',monospace;
  --font-body:'Segoe UI','Helvetica Neue',Arial,sans-serif;
  /* Liquid Glass (iOS 26 style) — effet verre poli avec bord lumineux */
  --glass-bg: rgba(255,255,255,0.025);
  --glass-bg-hover: rgba(255,255,255,0.05);
  --glass-border: rgba(255,255,255,0.14);
  --glass-border-hover: rgba(255,255,255,0.24);
  --glass-shadow:
    0 1px 0 0 rgba(255,255,255,0.3) inset,
    0 -1px 0 0 rgba(255,255,255,0.08) inset,
    1px 0 0 0 rgba(255,255,255,0.12) inset,
    -1px 0 0 0 rgba(255,255,255,0.12) inset,
    0 10px 30px -5px rgba(0,0,0,0.45),
    0 20px 60px -10px rgba(0,0,0,0.5);
  --glass-shadow-hover:
    0 1px 0 0 rgba(255,255,255,0.45) inset,
    0 -1px 0 0 rgba(255,255,255,0.1) inset,
    1px 0 0 0 rgba(255,255,255,0.18) inset,
    -1px 0 0 0 rgba(255,255,255,0.18) inset,
    0 14px 40px -5px rgba(0,0,0,0.55),
    0 28px 80px -15px rgba(0,0,0,0.6);
  --glass-blur: blur(0.5px) saturate(180%);
  --glass-text: #f0f0f0;
  --glass-text-muted: rgba(255,255,255,0.6);
  --glass-text-label: rgba(255,255,255,0.45);
}

/* Liquid Glass: force text colors for elements nested in glass cards */
.stat-card *, .region-card *, .team-card *, .brand-card *, .gamme-card *,
.mini-brand-card *, .mini-equip-card *, .chart-wrap * {
  color: inherit;
}
.stat-card [class*="muted"], .region-card [class*="muted"], .team-card [class*="muted"],
.brand-card [class*="muted"], .gamme-card [class*="muted"], .chart-wrap [class*="muted"] {
  color: var(--glass-text-muted) !important;
}
.stat-card [style*="color:var(--card-text)"], .region-card [style*="color:var(--card-text)"],
.team-card [style*="color:var(--card-text)"], .brand-card [style*="color:var(--card-text)"],
.gamme-card [style*="color:var(--card-text)"], .chart-wrap [style*="color:var(--card-text)"] {
  color: var(--glass-text) !important;
}
.stat-card [style*="color:var(--card-muted)"], .region-card [style*="color:var(--card-muted)"],
.team-card [style*="color:var(--card-muted)"], .brand-card [style*="color:var(--card-muted)"],
.gamme-card [style*="color:var(--card-muted)"], .chart-wrap [style*="color:var(--card-muted)"] {
  color: var(--glass-text-muted) !important;
}
.stat-card [style*="color:var(--card-label)"], .region-card [style*="color:var(--card-label)"],
.brand-card [style*="color:var(--card-label)"], .gamme-card [style*="color:var(--card-label)"] {
  color: var(--glass-text-label) !important;
}

/* Thème clair pour le Hero 1 seulement (fond crème du canvas) */
.cream-hero h1, .cream-hero h2 { color: #0a2540 !important; }
.cream-hero p { color: rgba(10,37,64,0.72) !important; }
.cream-hero p strong, .cream-hero p span:not([style*="gradient"]) { color: #0a2540 !important; }
.cream-hero .hero-tag {
  background: rgba(10,37,64,0.06);
  border: 1px solid rgba(10,37,64,0.15);
  color: #3a332e;
}
.cream-hero [style*="color:#fff"]:not([style*="gradient"]) { color: #0a2540 !important; }
.cream-hero [style*="color:rgba(255,255,255,.9)"] { color: #0a2540 !important; }
.cream-hero [style*="color:rgba(255,255,255,.85)"] { color: rgba(10,37,64,0.85) !important; }
.cream-hero [style*="color:rgba(220,220,220"] { color: rgba(10,37,64,0.7) !important; }
.cream-hero [style*="color:rgba(255,255,255,.55)"] { color: rgba(10,37,64,0.6) !important; }
.cream-hero [style*="color:rgba(255,255,255,.5)"],
.cream-hero [style*="color:rgba(255,255,255,.45)"],
.cream-hero [style*="color:rgba(255,255,255,.4)"] { color: rgba(10,37,64,0.5) !important; }
.cream-hero [style*="border:1.5px solid rgba(255,255,255,.3)"] { border-color: rgba(10,37,64,0.35) !important; }
.cream-hero [style*="background:rgba(255,255,255,.55)"] { background: rgba(10,37,64,0.55) !important; }
/* Keep gradient text transparent so the bleu gradient remains visible */
#page-home h1 span[style*="background:linear-gradient"],
#page-home h2 span[style*="background:linear-gradient"] {
  color: transparent !important;
}

/* France map en filigrane derrière le texte du hero */


*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--text);font-family:'Segoe UI','Helvetica Neue',Arial,sans-serif;font-weight:600;min-height:100vh;overflow-x:clip;position:relative;}
/* Native dialogs must keep their viewport positioning, including on a scrolled mobile page. */
body>*:not(#bg-canvas):not(.ui-skip):not(.ui-route-announcement):not(dialog){position:relative;z-index:1;}
#bg-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;}
*{font-family:'Segoe UI','Helvetica Neue',Arial,sans-serif;font-weight:600;}

/* NAV */
nav{position:fixed !important;top:0 !important;left:0 !important;right:0 !important;z-index:999999 !important;background:#fff !important;border-bottom:1px solid rgba(10,37,64,0.08);display:flex;align-items:center;justify-content:space-between;padding:0 max(1.5rem, calc((100% - 1400px) / 2 + 2rem));height:64px;transition:box-shadow .25s ease, border-color .25s ease;will-change:box-shadow;}
nav.scrolled{box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 8px 20px -10px rgba(10,37,64,0.15);border-bottom-color:rgba(10,37,64,0.12);}
.logo{font-family:var(--font-head);font-weight:800;font-size:1.55rem;display:flex;align-items:center;gap:0;cursor:pointer;letter-spacing:-0.03em;text-transform:none;position:relative;z-index:1;}
.logo span{color:var(--accent);}
.nav-links{display:flex;gap:.15rem;align-items:center;}
.nav-link{font-size:.82rem;font-weight:600;color:#425466;padding:9px 14px;border-radius:6px;cursor:pointer;transition:all .2s;letter-spacing:.04em;text-transform:uppercase;font-family:var(--font-body);white-space:nowrap;}
.nav-link:hover{color:#0a2540;background:rgba(10,37,64,0.06);}
.nav-link.nav-analyses{color:#1e3a8a;font-weight:800;}
.nav-link.nav-analyses:hover{color:#16306f;}
.nav-link.active{color:#fff;background:#2563eb;}
.nav-link-muted{color:rgba(10,37,64,0.45);font-size:.75rem;}
.nav-link-muted:hover{color:rgba(10,37,64,0.85);}
.nav-cta{font-size:.8rem;font-weight:700;color:#0a2540;background:linear-gradient(135deg,#7dd3fc 0%,#2563eb 100%);padding:9px 18px;border-radius:6px;cursor:pointer;font-family:var(--font-body);letter-spacing:.03em;transition:all .2s;box-shadow:0 4px 14px rgba(217,119,6,.25),inset 0 1px 0 rgba(255,255,255,0.3);}
.nav-cta:hover{box-shadow:0 6px 20px rgba(217,119,6,.4),inset 0 1px 0 rgba(255,255,255,0.4);transform:translateY(-1px);}

/* Dropdown menu */
.nav-dropdown{position:relative;}
.nav-link-dropdown{display:flex;align-items:center;}
.nav-dropdown-menu{
  position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%) translateY(-4px);
  background:rgba(20,24,38,0.92);
  backdrop-filter:blur(20px) saturate(180%);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  border:1px solid rgba(255,255,255,0.14);
  border-radius:6px;
  padding:.5rem;
  min-width:260px;
  opacity:0;
  visibility:hidden;
  transition:all .2s cubic-bezier(0.4,0,0.2,1);
  box-shadow:
    0 1px 0 0 rgba(255,255,255,0.12) inset,
    0 12px 36px -5px rgba(0,0,0,0.5),
    0 24px 60px -10px rgba(0,0,0,0.4);
  z-index:100;
}
.nav-dropdown:hover .nav-dropdown-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.nav-dropdown-item{
  display:flex;align-items:center;gap:.85rem;
  padding:.7rem .85rem;
  border-radius:6px;
  cursor:pointer;
  transition:background .15s;
}
.nav-dropdown-item:hover{background:rgba(255,255,255,0.06);}
.nav-dd-icon{font-size:1.3rem;width:34px;text-align:center;flex-shrink:0;}
.nav-dd-title{font-family:var(--font-head);font-size:.88rem;font-weight:700;color:#fff;letter-spacing:-0.01em;margin-bottom:2px;}
.nav-dd-desc{font-size:.72rem;color:rgba(255,255,255,0.55);font-weight:500;}
.nav-dd-ai{background:linear-gradient(135deg,rgba(167,139,250,0.08),rgba(99,102,241,0.03));}

/* Bouton warm (accent ambre) */
.btn-warm {
  font-family: var(--font-body);
  font-weight: 700;
  color: #0a2540;
  background: linear-gradient(135deg, #7dd3fc 0%, #2563eb 100%);
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: all .25s cubic-bezier(0.4,0,0.2,1);
  box-shadow: 0 8px 24px rgba(217,119,6,0.35), inset 0 1px 0 rgba(255,255,255,0.3);
}
.btn-warm:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(217,119,6,0.5), inset 0 1px 0 rgba(255,255,255,0.4);
}

/* Variante bleue (couleur "Track" du logo MobiTrack) — même style que btn-warm */
.btn-blue {
  font-family: var(--font-body);
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 50%, #1d4ed8 100%);
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: all .25s cubic-bezier(0.4,0,0.2,1);
  box-shadow: 0 8px 24px rgba(37,99,235,0.35), inset 0 1px 0 rgba(255,255,255,0.25);
}
.btn-blue:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(37,99,235,0.5), inset 0 1px 0 rgba(255,255,255,0.35);
}

/* App mockup style Linear/Stripe */
.app-mockup {
  background: #0b0f1a;
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.1);
  box-shadow:
    0 30px 80px -20px rgba(0,0,0,0.6),
    0 60px 120px -40px rgba(37,99,235,0.15),
    inset 0 1px 0 rgba(255,255,255,0.12);
  transform: perspective(1800px) rotateY(-6deg) rotateX(2deg);
  transition: transform .6s cubic-bezier(0.4,0,0.2,1);
}
.app-mockup:hover {
  transform: perspective(1800px) rotateY(-3deg) rotateX(1deg) translateY(-4px);
}

.mockup-chrome {
  background: #1a1f2e;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.mockup-url {
  flex: 1;
  text-align: center;
  background: rgba(255,255,255,0.05);
  border-radius: 6px;
  padding: 4px 12px;
  margin: 0 14px;
  font-size: .7rem;
  color: rgba(255,255,255,0.55);
  font-family: var(--font-mono);
}

.mockup-content {
  padding: 1.2rem 1.3rem 1.4rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

/* Split layout : carte + fiche détaillée */
.mockup-content.mockup-split {
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  padding: 1rem;
}

/* Comparator layout (option B) */
.mockup-content.mockup-comparator {
  grid-template-columns: 1fr;
  gap: .85rem;
  padding: 1.1rem 1.2rem 1.3rem;
}
.mcomp-header {
  padding-bottom: .55rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.mcomp-prices {
  display: grid;
  grid-template-columns: 1fr 1px 1fr;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 6px;
  overflow: hidden;
}
.mcomp-price-block {
  padding: .85rem 1rem;
  text-align: center;
}
.mcomp-price-lbl {
  font-family: var(--font-mono);
  font-size: .58rem;
  color: rgba(255,255,255,0.5);
  text-transform: uppercase;
  letter-spacing: .1em;
  font-weight: 600;
  margin-bottom: .35rem;
}
.mcomp-price-val {
  font-family: var(--font-head);
  font-size: 1.4rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.02em;
}
.mcomp-price-sub {
  font-size: .62rem;
  color: rgba(255,255,255,0.55);
  margin-top: .35rem;
  font-weight: 600;
}
.mcomp-verdict {
  display: flex;
  align-items: center;
  gap: .7rem;
  background: rgba(251,146,60,0.08);
  border: 1px solid rgba(251,146,60,0.28);
  border-radius: 6px;
  padding: .7rem .85rem;
}
.mcomp-verdict-icon {
  width: 30px;
  height: 30px;
  border-radius: 6px;
  background: linear-gradient(135deg, #fb923c, #ea580c);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .95rem;
  color: #fff;
  flex-shrink: 0;
  box-shadow: 0 3px 10px rgba(234,88,12,0.35);
}
.mcomp-chart {
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 6px;
  padding: .7rem .85rem;
}
.mcomp-action {
  background: rgba(125,211,252,0.06);
  border: 1px solid rgba(125,211,252,0.22);
  border-radius: 6px;
  padding: .7rem .9rem;
}

/* Colonne carte */
.mockup-map-col {
  display: flex;
  flex-direction: column;
  gap: .6rem;
  min-width: 0;
}
.mockup-search-bar {
  display: flex;
  align-items: center;
  gap: .5rem;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 6px;
  padding: .45rem .6rem;
  font-size: .72rem;
  color: #fff;
}
.mockup-map-inner {
  background: radial-gradient(ellipse at center, rgba(37,99,235,0.15) 0%, transparent 70%);
  border-radius: 6px;
  padding: .3rem;
  flex: 1;
  min-height: 160px;
  border: 1px solid rgba(255,255,255,0.06);
}
.mockup-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .35rem;
}
.mockup-stat {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 6px;
  padding: .4rem;
  text-align: center;
}
.mockup-stat-val {
  font-family: var(--font-head);
  font-size: .85rem;
  font-weight: 900;
  color: #fff;
  line-height: 1;
}
.mockup-stat-lbl {
  font-size: .52rem;
  color: rgba(255,255,255,0.5);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-top: .2rem;
}

/* Colonne fiche détaillée */
.mockup-detail-col {
  display: flex;
  flex-direction: column;
  gap: .6rem;
  min-width: 0;
}
.mockup-photo {
  position: relative;
  height: 135px;
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.08);
}
.mockup-photo-sky {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 65%;
  background: linear-gradient(180deg, #38bdf8 0%, #7dd3fc 45%, #fed7aa 100%);
}
.mockup-photo-ground {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 38%;
  background: linear-gradient(180deg, #84a98c 0%, #52796f 100%);
}
.mockup-photo-mobilhome {
  position: absolute;
  bottom: 15%;
  left: 50%;
  transform: translateX(-50%);
  width: 62%;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,0.25));
}
.mockup-score-badge {
  position: absolute;
  top: .5rem;
  right: .5rem;
  background: linear-gradient(135deg, #7dd3fc, #2563eb);
  color: #0a2540;
  padding: .3rem .55rem;
  border-radius: 6px;
  text-align: center;
  font-family: var(--font-head);
  box-shadow: 0 3px 10px rgba(217,119,6,0.4);
}
.mockup-fav-btn {
  position: absolute;
  top: .5rem;
  left: .5rem;
  width: 26px;
  height: 26px;
  background: rgba(0,0,0,0.4);
  backdrop-filter: blur(8px);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: .9rem;
}
.mockup-detail-info {
  padding: 0 .1rem;
}
.mockup-price-bar {
  position: relative;
  height: 5px;
  background: rgba(255,255,255,0.08);
  border-radius: 3px;
  overflow: visible;
}
.mockup-price-bar-fill {
  position: absolute;
  top: 0; left: 0;
  height: 100%;
  background: linear-gradient(90deg, #22c55e 0%, #7dd3fc 55%, #ef4444 100%);
  border-radius: 3px;
  opacity: 0.5;
}
.mockup-price-bar-marker {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 11px;
  height: 11px;
  background: #fff;
  border: 2px solid #7dd3fc;
  border-radius: 50%;
  box-shadow: 0 2px 6px rgba(0,0,0,0.3);
}
.mockup-specs {
  display: flex;
  gap: .5rem;
  margin-top: .8rem;
}
.mockup-spec {
  display: flex;
  align-items: center;
  gap: .3rem;
  font-size: .65rem;
  color: rgba(255,255,255,0.75);
  background: rgba(255,255,255,0.04);
  padding: .25rem .5rem;
  border-radius: 5px;
  border: 1px solid rgba(255,255,255,0.06);
}

.mockup-header {
  padding-bottom: .6rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.mockup-map {
  background: radial-gradient(ellipse at center, rgba(37,99,235,0.1) 0%, transparent 70%);
  border-radius: 6px;
  padding: .5rem;
  height: 180px;
  border: 1px solid rgba(255,255,255,0.06);
}

.mockup-listings {
  display: flex;
  flex-direction: column;
  gap: .55rem;
}
.mockup-listing-header {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-family: var(--font-mono);
  font-size: .65rem;
  color: rgba(255,255,255,0.55);
  text-transform: uppercase;
  letter-spacing: .1em;
  margin-bottom: .2rem;
}
.mockup-listing-item {
  display: flex;
  align-items: center;
  gap: .75rem;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 6px;
  padding: .55rem .75rem;
  transition: all .2s;
}
.mockup-listing-item:hover {
  background: rgba(255,255,255,0.05);
  border-color: rgba(255,255,255,0.12);
}
.mockup-listing-item.ml-new {
  border-color: rgba(125,211,252,0.35);
  background: rgba(125,211,252,0.06);
  animation: newPop 0.6s ease-out;
}
@keyframes newPop {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}

.ml-icon {
  width: 30px;
  height: 30px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .9rem;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}
.ml-title {
  font-family: var(--font-head);
  font-size: .78rem;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
}
.ml-sub {
  font-size: .65rem;
  color: rgba(255,255,255,0.5);
  margin-top: 1px;
}
.ml-price {
  font-family: var(--font-mono);
  font-size: .78rem;
  font-weight: 800;
  color: #fff;
  white-space: nowrap;
}

/* Responsive : stack on smaller screens */
@media (max-width: 960px) {
  .app-mockup {
    transform: none !important;
  }
}

/* Transport simulator */
.transport-gab-btn{
  flex:1;padding:10px 8px;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.12);
  color:rgba(255,255,255,0.75);
  font-family:var(--font-body);font-size:.82rem;font-weight:600;
  border-radius:6px;cursor:pointer;
  transition:all .2s;
}
.transport-gab-btn:hover{background:rgba(255,255,255,0.08);color:#fff;}
.transport-gab-btn.active{
  background:rgba(37,99,235,0.25);
  border-color:var(--accent2);
  color:#fff;
}

/* Mode recherche active : cacher titre, carte en full viewport */
#page-recherche.search-active .recherche-header {
  opacity: 0;
  max-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  pointer-events: none;
  transition: opacity .4s ease, max-height .5s ease, margin .4s ease, padding .4s ease;
}
.recherche-header {
  transition: opacity .4s ease, max-height .5s ease;
  max-height: 500px;
}
#page-recherche.search-active #annonces-category-selector {
  opacity: 0;
  max-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  pointer-events: none;
  transition: opacity .3s ease, max-height .4s ease;
}
#page-recherche.search-active .photo-bands-bg {
  opacity: 0;
  transition: opacity .4s ease;
}
/* Responsive : sur petit écran, passer en 1 colonne */
@media (max-width: 900px) {
  .recherche-layout {
    grid-template-columns: 1fr !important;
  }
  #annonces-category-selector > div:nth-child(3) {
    grid-template-columns: 1fr !important;
    max-width: 480px !important;
  }
}
#page-recherche.search-active .recherche-map-wrap {
  margin-top: 0;
  transition: margin-top .4s ease;
}
.recherche-map-wrap {
  transition: margin-top .4s ease;
}

/* Annonce category buttons */
.annonce-cat-btn:hover {
  transform: translateY(-4px);
  box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 10px 24px -14px rgba(10,37,64,0.16);
  border-color: #d0cbc5 !important;
}
.annonce-cat-btn.annonce-cat-active {
  background: #fff !important;
  border-color: #1d4ed8 !important;
  box-shadow: 0 8px 32px rgba(29,78,216,0.18), 0 0 0 3px rgba(37,99,235,0.1);
  transform: translateY(-2px);
}
.annonce-cat-btn:not(.annonce-cat-active) {
  background: #fff !important;
  border-color: #e8e3dd !important;
}
.annonce-cat-btn:not(.annonce-cat-active):hover {
  background: #fff !important;
  border-color: #c5c0ba !important;
}

/* PAGES */
.page{display:none;padding-top:64px;min-height:100vh;}
/* Une vue inactive reste masquée dès le premier rendu, avant la navigation JS. */
.page:not(.active){display:none!important;}
.page.active{display:block;}
/* Page recherche : full screen sans scroll */

/* Cream theme overrides for Annonces page */
#page-recherche h1 { color: #1a1a1a; }
#page-recherche p { color: #6b6560; }
#page-recherche .annonce-cat-btn {
  background: rgba(255,255,255,0.12) !important;
  backdrop-filter: blur(10px) saturate(160%);
  -webkit-backdrop-filter: blur(10px) saturate(160%);
  border: 1px solid rgba(255,255,255,0.4) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.08), inset 0 1px 0 rgba(255,255,255,0.45), inset 0 0 0 1px rgba(255,255,255,0.1);
}
#page-recherche .annonce-cat-btn:hover {
  background: rgba(255,255,255,0.2) !important;
  border-color: rgba(255,255,255,0.55) !important;
  box-shadow: 0 16px 44px rgba(0,0,0,0.12), inset 0 1px 0 rgba(255,255,255,0.6) !important;
  transform: translateY(-4px);
}
#page-recherche .annonce-cat-btn.annonce-cat-active {
  background: rgba(255,255,255,0.24) !important;
  border-color: rgba(125,211,252,0.6) !important;
  box-shadow: 0 8px 32px rgba(29,78,216,0.15), inset 0 1px 0 rgba(255,255,255,0.6), 0 0 0 3px rgba(125,211,252,0.18) !important;
}
#page-recherche .annonce-cat-btn div[style*="font-weight:800"] { color: #1a1a1a !important; }
#page-recherche .annonce-cat-btn div[style*="color:var(--muted)"] { color: #8a8480 !important; }
#page-recherche #recherche-cat-label { color: #1a1a1a !important; }
#page-recherche button[onclick="backToCategories()"] { color: #1d4ed8 !important; }
#page-recherche button[onclick="backToCategories()"] + span { color: rgba(0,0,0,0.2) !important; }
/* Filter panel on cream: keep dark card style */
#page-recherche .france-glass-case {
  background: rgba(255,255,255,0.12) !important;
  backdrop-filter: blur(10px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(160%) !important;
  border: 1px solid rgba(255,255,255,0.4) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.08), inset 0 1px 0 rgba(255,255,255,0.45), inset 0 0 0 1px rgba(255,255,255,0.1) !important;
}

/* --- Publier une annonce --- */
.cream-input{background:#fff !important;border:1px solid rgba(0,0,0,0.12) !important;color:#0a2540 !important;}
.cream-input::placeholder{color:#c4beb8;}
.step-dot{width:30px;height:30px;border-radius:50%;background:#fff;border:1px solid rgba(0,0,0,0.12);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:.78rem;font-weight:700;color:#b5afa9;transition:all .25s ease;}
.step-dot.active{background:#2563eb;border-color:#2563eb;color:#fff;}
.step-dot.done{background:#7dd3fc;border-color:#7dd3fc;color:#0c4a6e;}
.step-line{width:22px;height:1px;background:rgba(0,0,0,0.12);}
.publier-step-title{font-family:var(--font-head);font-weight:800;font-size:1.05rem;color:#0a2540;margin:0;}
.radio-card{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;padding:14px 10px;border:1px solid rgba(0,0,0,0.12);border-radius:6px;background:#fff;cursor:pointer;font-size:.85rem;color:#0a2540;font-weight:600;transition:all .2s ease;}
.radio-card input{position:absolute;opacity:0;}
.radio-card small{display:block;font-weight:400;color:#8a8480;font-size:.74rem;margin-top:2px;}
.radio-card:has(input:checked){border-color:#2563eb;background:rgba(37,99,235,0.06);box-shadow:0 0 0 2px rgba(37,99,235,0.18);}
.photo-dropzone{border:2px dashed rgba(0,0,0,0.15);border-radius:6px;padding:2.2rem 1rem;background:#fff;cursor:pointer;transition:border-color .2s;}
.photo-dropzone:hover,.photo-dropzone.dragover{border-color:#2563eb;background:rgba(37,99,235,0.03);}
#cancelListingEdit[hidden]{display:none;}
.photo-thumb{position:relative;border-radius:6px;overflow:hidden;aspect-ratio:1/1;background:#eee;}
.photo-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.photo-thumb .photo-remove{position:absolute;top:4px;right:4px;width:20px;height:20px;border-radius:50%;background:rgba(0,0,0,0.6);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.7rem;cursor:pointer;border:none;}
.photo-thumb .photo-main-badge{position:absolute;bottom:4px;left:4px;background:#7dd3fc;color:#0c4a6e;font-size:.6rem;font-weight:700;padding:2px 6px;border-radius:6px;font-family:var(--font-mono);}
/* — Bouton navbar « Mon compte » — */
.nav-ico-item{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;color:#0a2540;transition:color .18s, transform .18s;}
/* ═══ Liseré bleu marine au survol des cases ═══ */
.nav-ico-item.nav-connect{background:#1e3a8a;color:#fff;flex-direction:row;gap:7px;height:35px;padding:0 16px;border-radius:6px;font-size:.8rem;font-weight:700;box-shadow:0 1px 2px rgba(10,37,64,0.2);}
.nav-ico-item.nav-connect:hover{background:#16306f;color:#fff;transform:none;}
.nav-ico-item.nav-connect svg{width:16px;height:16px;}
.nav-ico-item.nav-connect span{font-size:.8rem;font-weight:700;}
.mt-card:hover,.anres-card:hover,.ana-case:hover,.ma-card:hover,.tr-check:hover,.tb-card:hover,.ter-gate:hover,.stat-card:hover,.clairval-card:hover,.inbox-item:hover,.an-card:hover{outline:1.5px solid #1e3a8a;outline-offset:-1.5px;}

.nav-msg-badge{position:absolute;top:-3px;left:50%;margin-left:9px;width:11px;height:11px;border-radius:50%;background:linear-gradient(135deg,#f43f5e,#dc2626);box-shadow:0 0 0 2px #fff, 0 2px 8px rgba(220,38,38,0.45);}
@keyframes mtBadgePop{from{transform:scale(0);}to{transform:scale(1);}}
.mt-conv-dot{width:9px;height:9px;border-radius:50%;background:linear-gradient(135deg,#f43f5e,#dc2626);box-shadow:0 0 0 3px rgba(225,29,72,0.14), 0 2px 6px rgba(225,29,72,0.5);display:inline-block;flex-shrink:0;animation:mtBadgePop .38s cubic-bezier(.34,1.56,.64,1);}
@media (prefers-reduced-motion: reduce){.mt-conv-dot{animation:none;}}
@media (prefers-reduced-motion: reduce){.nav-msg-badge{animation:none;}}
.nav-ico-item svg{width:27px;height:27px;}
.nav-ico-item span{font-family:var(--font-body);font-size:.76rem;font-weight:600;letter-spacing:.01em;}
.nav-ico-item:hover{color:#2563eb;transform:translateY(-1px);}
@media(max-width:760px){.nav-ico-item span{display:none;}.nav-ico-group{gap:1rem !important;}}
.nav-account{height:38px;padding:0 20px;border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;white-space:nowrap;
  background:linear-gradient(110deg,#bfeaff 0%,#7dd3fc 45%,#38bdf8 120%);background-size:170% 100%;background-position:0% 0;
  color:#0c4a6e;font-family:var(--font-body);font-weight:800;font-size:.78rem;letter-spacing:.02em;
  border:1px solid rgba(255,255,255,0.45);
  box-shadow:0 6px 18px rgba(125,211,252,0.50),inset 0 1px 0 rgba(255,255,255,0.55);
  transition:transform .22s ease, box-shadow .22s ease, background-position .35s ease;}
.nav-account:hover{transform:translateY(-1px);background-position:90% 0;box-shadow:0 10px 26px rgba(56,189,248,0.60),inset 0 1px 0 rgba(255,255,255,0.6);}
.nav-account:active{transform:translateY(0) scale(.98);}
/* ================= COMPTE — bande verticale / grande image ================= */
.cpt-page{background:#f6f8fb !important;padding:0 !important;}
.cpt-split{display:grid;grid-template-columns:clamp(390px,34vw,480px) 1fr;min-height:100vh;}
/* — Bande verticale gauche — */
.cpt-band{background:#f6f8fb;background-image:radial-gradient(560px 320px at 80% -4%, rgba(255,255,255,0.9), transparent 60%),radial-gradient(520px 380px at 6% 30%, rgba(255,252,246,0.75), transparent 65%),radial-gradient(460px 340px at 88% 92%, rgba(240,230,216,0.55), transparent 62%);position:relative;}
.cpt-band::after{content:'';position:absolute;inset:0;background:radial-gradient(520px 300px at 15% 108%, rgba(125,211,252,0.16), transparent 62%);pointer-events:none;}
.cpt-band-in{position:relative;z-index:1;padding:6.4rem 2.3rem 3rem;max-width:440px;margin:0 auto;display:flex;flex-direction:column;min-height:100%;box-sizing:border-box;}
.cpt-eyebrow{font-family:var(--font-mono);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:#2563eb;}
.cpt-h1{font-family:var(--font-head);font-weight:900;font-size:clamp(1.8rem,2.4vw,2.35rem);line-height:1.04;letter-spacing:-0.03em;color:#0a2540;margin:auto 0 1.6rem;text-align:center;}
.cpt-h1 em{font-style:italic;color:#2563eb;}
.cpt-benefits{list-style:none;margin:1.1rem 0 1.7rem;padding:0;display:flex;flex-direction:column;gap:.6rem;}
.cpt-benefits li{display:flex;align-items:center;gap:.6rem;font-size:.84rem;color:#5a534e;}
.cpt-benefits li span{width:20px;height:20px;border-radius:50%;background:rgba(37,99,235,0.10);color:#2563eb;font-size:.7rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.cpt-secure{margin-top:auto;padding-top:1.6rem;border-top:1px solid rgba(10,37,64,0.09);font-size:.7rem;color:#b5afa9;}
/* — Onglets — */
.cpt-tabs{display:flex;background:#f2ede6;border:1px solid rgba(10,37,64,0.05);border-radius:6px;padding:4px;gap:3px;margin-bottom:1.4rem;}
#page-compte .compte-tab{flex:1;border:none;background:transparent;color:#8a8480;padding:10px 0;border-radius:6px;font-family:var(--font-body);font-weight:700;font-size:.84rem;cursor:pointer;transition:all .2s;}
#page-compte .compte-tab:hover{color:#0a2540;}
#page-compte .compte-tab.active{background:#0a2540;color:#f6f9fc;box-shadow:0 4px 12px rgba(10,37,64,0.3);}
/* — Champs — */
.cpt-field{display:flex;flex-direction:column;gap:.4rem;flex:1;}
.cpt-duo{display:flex;gap:.9rem;}
.cpt-label{font-family:var(--font-mono);font-size:.63rem;letter-spacing:.11em;text-transform:uppercase;color:#a79f98;}
.cpt-pwdwrap{position:relative;}
    .cpt-pwdwrap .cpt-input{width:100%;padding-right:44px;box-sizing:border-box;}
    .cpt-eye{position:absolute;right:10px;top:50%;transform:translateY(-50%);border:none;background:none;cursor:pointer;color:rgba(10,37,64,0.4);padding:6px;display:flex;align-items:center;border-radius:6px;transition:color .15s;}
    .cpt-eye:hover{color:#2563eb;}
    .cpt-eye.on{color:#2563eb;}
    .cpt-input{width:100%;padding:12px 14px;background:#fff;border:1px solid rgba(10,37,64,0.12);border-radius:6px;color:#0a2540;font-family:var(--font-body);font-size:.9rem;box-sizing:border-box;outline:none;transition:all .18s;}
.cpt-input:focus{border-color:#7dd3fc;background:#fff;box-shadow:0 0 0 4px rgba(125,211,252,0.28);}
.cpt-input::placeholder{color:#b5afa9;}
.cpt-link{font-size:.78rem;color:#2563eb;text-decoration:none;font-family:var(--font-body);}
.cpt-link:hover{text-decoration:underline;}
.cpt-submit{width:100%;padding:14px !important;margin-top:.2rem;font-weight:700;}
.cpt-cgu{display:flex;align-items:flex-start;gap:9px;font-size:.77rem;color:#8a8480;line-height:1.45;cursor:pointer;}
.cpt-cgu input{margin-top:2px;accent-color:#2563eb;}
.cpt-or{display:flex;align-items:center;gap:.8rem;margin:.15rem 0;}
.cpt-or::before,.cpt-or::after{content:'';flex:1;height:1px;background:rgba(10,37,64,0.10);}
.cpt-or span{font-family:var(--font-mono);font-size:.62rem;text-transform:uppercase;letter-spacing:.12em;color:#b5afa9;}
.cpt-google{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:12px;background:#fff;border:1px solid rgba(10,37,64,0.14);border-radius:6px;color:#0a2540;font-family:var(--font-body);font-weight:700;font-size:.85rem;cursor:pointer;transition:all .18s;box-shadow:0 2px 8px rgba(10,37,64,0.05);}
.cpt-google:hover{transform:translateY(-1px);border-color:rgba(10,37,64,0.25);box-shadow:0 6px 16px rgba(10,37,64,0.10);}
.cpt-google:active{transform:none;}
/* — Tableau de bord connecté (sur fond sombre) — */
.cpt-profile{display:flex;align-items:center;gap:.9rem;background:#fff;border:1px solid rgba(10,37,64,0.07);border-radius:6px;padding:1rem 1.1rem;box-shadow:0 6px 18px rgba(10,37,64,0.06);}
.cpt-avatar{width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,#3b82f6 0%,#1e3a8a 100%);color:#0a2540;display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:800;font-size:1.05rem;flex-shrink:0;}
.cpt-profile-info{flex:1;min-width:0;}
.cpt-profile-name{font-family:var(--font-head);font-weight:800;font-size:1rem;color:#0a2540;letter-spacing:-0.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cpt-profile-mail{font-size:.76rem;color:#8a8480;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cpt-logout{background:none;border:1px solid rgba(10,37,64,0.12);color:#8a8480;font-family:var(--font-body);font-size:.72rem;font-weight:600;padding:7px 12px;border-radius:6px;cursor:pointer;transition:all .18s;flex-shrink:0;}
.cpt-logout:hover{color:#dc2626;border-color:rgba(220,38,38,0.35);}
.cpt-browse{width:100%;margin-top:1rem;padding:14px;background:#2563eb;color:#0a2540;border:none;border-radius:6px;font-family:var(--font-body);font-weight:700;font-size:.88rem;cursor:pointer;box-shadow:0 8px 20px rgba(37,99,235,.4);transition:transform .18s, box-shadow .18s;}
.cpt-browse:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(37,99,235,.5);}
.cpt-section{margin-top:1.8rem;}
.cpt-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.8rem;}
.cpt-section-head h2{font-family:var(--font-head);font-weight:800;font-size:1rem;color:#0a2540;margin:0;letter-spacing:-0.01em;}
.cpt-empty{text-align:center;color:#b5afa9;font-size:.8rem;padding:1.2rem .6rem;background:#fff;border:1px dashed rgba(10,37,64,0.12);border-radius:6px;line-height:1.6;}
/* — Grande image droite — */
.cpt-visual{position:sticky;top:0;height:100vh;overflow:hidden;background:#f6f8fb;}
.cpt-visual img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.02);}
.cpt-visual-callout{position:absolute;right:2.2rem;bottom:2rem;text-align:right;display:flex;flex-direction:column;gap:.45rem;align-items:flex-end;pointer-events:none;user-select:none;}
.cvc-over{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.26em;text-transform:uppercase;color:rgba(246,249,252,0.85);text-shadow:0 2px 12px rgba(0,0,0,0.5);}
.cvc-line{font-family:var(--font-head);font-style:italic;font-weight:800;font-size:clamp(1.7rem,2.6vw,2.6rem);line-height:1.06;letter-spacing:-0.02em;color:#f6f9fc;text-shadow:0 4px 26px rgba(0,0,0,0.55);}
.cvc-line em{font-style:italic;color:#7dd3fc;}
@keyframes cptWordIn{from{opacity:0;transform:translateY(26px) skewY(1.5deg);}to{opacity:1;transform:none;}}
.cpt-word-in{animation:cptWordIn .55s cubic-bezier(.22,.8,.3,1);}
@media (prefers-reduced-motion: reduce){.cpt-word-in{animation:none;}}
/* — Page Mes annonces — */
.map-filters{display:flex;gap:.5rem;align-items:center;margin:1.4rem 0 1.2rem;flex-wrap:wrap;}
.map-chip{border:1.5px solid rgba(10,37,64,0.13);background:#fff;color:#5a534e;font-family:var(--font-body);font-weight:700;font-size:.8rem;padding:9px 18px;border-radius:999px;cursor:pointer;transition:all .18s;}
.map-chip:hover{border-color:#2563eb;color:#2563eb;}
.map-chip.map-chip-active{background:#0a2540;border-color:#0a2540;color:#f6f9fc;}
.map-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:.7rem;align-items:start;}
.anres-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:auto;align-items:start;gap:1rem;}
.anres-grid .anres-card{display:flex;width:100%;margin:0;}
@media(max-width:1100px){.anres-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.anres-grid{grid-template-columns:1fr;}}
.ma-x{grid-column:1 / -1;position:relative;border:1px solid rgba(10,37,64,0.08);border-radius:6px;box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 10px 24px -14px rgba(10,37,64,0.16);padding:1.7rem 2rem;min-height:210px;overflow:hidden;animation:maXIn .3s cubic-bezier(.22,.8,.3,1);}
@keyframes maXIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion: reduce){.ma-x{animation:none;}}
.ma-x-close{position:absolute;top:.9rem;right:.9rem;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,0.92);border:1px solid rgba(10,37,64,0.1);cursor:pointer;font-size:.85rem;color:#0a2540;box-shadow:0 4px 12px rgba(0,0,0,0.12);z-index:2;}
.ma-x-left{max-width:56%;display:flex;flex-direction:column;align-items:flex-start;gap:.45rem;position:relative;z-index:1;}
.ma-x-title{font-family:var(--font-head);font-weight:900;font-size:1.5rem;letter-spacing:-0.02em;color:#0a2540;line-height:1.1;}
.ma-x-meta{font-size:.8rem;color:#8a8480;}
.ma-x-price{font-family:var(--font-head);font-weight:900;font-size:1.7rem;color:#2563eb;letter-spacing:-0.02em;}
.ma-x-stats{display:flex;gap:.6rem;margin-top:.4rem;}
.ma-x-stats > div{background:#f6f8fb;border:1px solid rgba(10,37,64,0.07);border-radius:6px;padding:.65rem 1rem;text-align:center;min-width:82px;}
.ma-x-stats b{display:block;font-family:var(--font-head);font-weight:900;font-size:1.25rem;color:#0a2540;font-variant-numeric:tabular-nums;}
.ma-x-stats span{font-family:var(--font-mono);font-size:.55rem;letter-spacing:.09em;text-transform:uppercase;color:#a79f98;}
.ma-x-actions{display:flex;gap:.5rem;margin-top:.7rem;flex-wrap:wrap;}
@media(max-width:1000px){.ma-x-left{max-width:100%;}.ma-x{padding:1.3rem 1.2rem;}}
@media(max-width:1000px){.map-grid{grid-template-columns:1fr;}}
/* — Page annonce dédiée — */
.an-back{border:1.5px solid rgba(10,37,64,0.13);background:#fff;color:#0a2540;font-family:var(--font-body);font-weight:700;font-size:.82rem;padding:8px 16px;border-radius:999px;cursor:pointer;transition:all .18s;margin-bottom:.8rem;}
.an-back:hover{border-color:#2563eb;color:#2563eb;}
.an-grid{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:.7rem;align-items:start;}
.an-photo-wrap{position:relative;}
.an-photo{width:100%;height:clamp(300px,44vh,400px);border-radius:6px;background:#e6ebf1 center/cover no-repeat;display:flex;align-items:center;justify-content:center;font-size:3.5rem;color:#c9bfb2;box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 10px 24px -14px rgba(10,37,64,0.16);}
.an-fav{position:absolute;top:1rem;right:1rem;width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid rgba(0,0,0,.08);cursor:pointer;font-size:1.2rem;box-shadow:0 6px 18px rgba(0,0,0,.18);display:flex;align-items:center;justify-content:center;transition:transform .15s;}
.an-fav:hover{transform:scale(1.08);}
.an-fav{color:#0a2540;}
.an-fav svg{transition:fill .18s, stroke .18s;fill:none;}
.an-fav.faved{color:#e11d48;border-color:rgba(225,29,72,0.3);}
.an-fav.faved svg{fill:#e11d48;}
@keyframes favPop{0%{transform:scale(1);}45%{transform:scale(1.35);}100%{transform:scale(1);}}
.an-fav.fav-pop svg{animation:favPop .35s cubic-bezier(.3,1.4,.5,1);}
@media (prefers-reduced-motion: reduce){.an-fav.fav-pop svg{animation:none;}}
.an-card{background:#fff;border:1px solid rgba(10,37,64,0.07);border-radius:6px;padding:1.15rem 1.35rem;box-shadow:0 10px 28px rgba(10,37,64,0.06);margin-top:.7rem;}
.an-card-h{font-family:var(--font-head);font-weight:800;font-size:1.1rem;color:#0a2540;margin:0 0 .8rem;letter-spacing:-0.01em;}
.an-side .an-card:first-child{margin-top:0;}
.an-ostats{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;}
.an-ostats > div{background:#f6f8fb;border:1px solid rgba(10,37,64,0.06);border-radius:6px;padding:.75rem .4rem;text-align:center;}
.an-ostats b{display:block;font-family:var(--font-head);font-weight:900;font-size:1.3rem;color:#0a2540;font-variant-numeric:tabular-nums;}
.an-ostats span{font-family:var(--font-mono);font-size:.56rem;letter-spacing:.09em;text-transform:uppercase;color:#a79f98;}
.an-sticky{position:sticky;top:84px;}
@media(max-width:900px){
  .an-grid{grid-template-columns:1fr;gap:1.2rem;}
  .an-photo{height:280px;}
  .an-sticky{position:static;}
}
/* — Dashboard connecté — */
.cpt-dash{min-height:100vh;padding:5.8rem 2rem 4.5rem;box-sizing:border-box;}
.dash-in{max-width:1336px;margin:0 auto;}
/* héro sombre */
.dash-hero{background:#0a2540;border-radius:6px;padding:2.3rem 2.5rem 2rem;position:relative;overflow:hidden;box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 10px 24px -14px rgba(10,37,64,0.16);}
.dash-hero::after{content:'';position:absolute;inset:0;background:radial-gradient(760px 300px at 85% 115%, rgba(125,211,252,0.14), transparent 60%);pointer-events:none;}
.dash-hero-top{display:flex;align-items:center;gap:1.3rem;position:relative;z-index:1;}
.dash-avatar{width:62px;height:62px;font-size:1.25rem;box-shadow:0 10px 26px rgba(37,99,235,0.4);}
.dash-id{flex:1;min-width:0;}
.dash-eyebrow{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;color:#7dd3fc;}
.dash-hello{font-family:var(--font-head);font-weight:900;font-size:clamp(1.7rem,3vw,2.5rem);line-height:1.02;letter-spacing:-0.03em;color:#f6f9fc;margin:.3rem 0 0;}
.dash-hello em{font-style:italic;color:#7dd3fc;}
.dash-meta{font-size:.8rem;color:rgba(246,249,252,0.5);margin-top:.35rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dash-logout{background:none;border:1px solid rgba(255,255,255,0.18);color:rgba(246,249,252,0.65);font-family:var(--font-body);font-size:.74rem;font-weight:600;padding:8px 15px;border-radius:6px;cursor:pointer;transition:all .18s;flex-shrink:0;}
.dash-logout:hover{color:#fca5a5;border-color:rgba(252,165,165,0.4);}
.dash-stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:1.9rem;padding-top:1.6rem;border-top:1px solid rgba(255,255,255,0.09);position:relative;z-index:1;}
.dash-stat{padding:0 1.4rem;border-left:1px solid rgba(255,255,255,0.09);}
.dash-stat:first-child{border-left:none;padding-left:0;}
.dash-stat-num{font-family:var(--font-head);font-weight:900;font-size:2.15rem;line-height:1;letter-spacing:-0.02em;color:#f6f9fc;font-variant-numeric:tabular-nums;}
.dash-stat-lbl{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(125,211,252,0.85);margin-top:.55rem;}
/* tuiles d'action */
.dash-tiles{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem;margin:1.4rem 0 2.6rem;}
.dash-tile-dark{grid-column:1 / -1;}
.dash-tile-dark{background:#0a2540;box-shadow:inset 0 1px 0 rgba(125,211,252,0.15), 0 18px 38px -14px rgba(10,37,64,0.5);position:relative;}
.dash-tile-dark::after{content:'';position:absolute;inset:0;background:radial-gradient(340px 160px at 85% 115%, rgba(125,211,252,0.16), transparent 60%);pointer-events:none;border-radius:6px;}
.dash-tile{border-radius:6px;padding:1.7rem 1.8rem;cursor:pointer;position:relative;overflow:hidden;min-height:96px;display:flex;flex-direction:column;justify-content:center;transition:transform .2s, box-shadow .2s;}
.dash-tile:hover{transform:translateY(-3px);}
.dash-tile-blue{background:linear-gradient(100deg, #2563eb 0%, #4aa8f5 55%, #7dd3fc 100%);clip-path:polygon(0 0, calc(100% - 52px) 0, 100% 52px, 100% 100%, 0 100%);box-shadow:inset 0 2px 0 rgba(255,255,255,0.35), 0 18px 38px -12px rgba(37,99,235,0.45);}
.dash-tile-photo{background-image:linear-gradient(100deg, rgba(15,13,11,0.62) 0%, rgba(15,13,11,0.28) 70%), url(https://gtccynavuqlcvomqjomu.supabase.co/storage/v1/object/public/fond%20mon%20compte/ChatGPT%20Image%2017%20juil.%202026,%2014_52_49.png);background-size:cover;background-position:center 65%;box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 10px 24px -14px rgba(10,37,64,0.16);}
.dash-tile-title{font-family:var(--font-head);font-weight:800;font-size:1.25rem;letter-spacing:-0.02em;color:#0a2540;text-shadow:0 2px 14px rgba(12,18,32,0.35);}
.dash-tile-sub{font-size:.8rem;color:rgba(10,37,64,0.88);margin-top:.3rem;text-shadow:0 1px 10px rgba(12,18,32,0.3);}
/* sections */
.dash-sec-head{display:flex;align-items:center;gap:.7rem;margin-bottom:1rem;}
.dash-sec-head h2{font-family:var(--font-head);font-weight:800;font-size:1.25rem;color:#0a2540;margin:0;letter-spacing:-0.02em;}
.dash-badge{background:#0a2540;color:#f6f9fc;font-size:.66rem;font-weight:700;padding:3px 10px;border-radius:6px;font-family:var(--font-body);}
.dash-badge-red{background:#e11d48;color:#0a2540;}
.dash-badge-blue{background:#2563eb;color:#0a2540;}
.dash-empty{text-align:center;color:#a79f98;font-size:.82rem;padding:1.8rem 1rem;background:#fff;border:1px dashed rgba(10,37,64,0.13);border-radius:6px;line-height:1.7;}
.dash-empty-ico{font-size:1.5rem;margin-bottom:.4rem;}
.dash-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:2.4rem;align-items:start;}

/* ═══ Mon compte — dashboard cockpit v2 (cp2) ═══ */
.cp2-dash{min-height:100vh;padding:5.9rem 2rem 4.5rem;box-sizing:border-box;background:
  radial-gradient(900px 480px at 88% -6%, rgba(125,211,252,0.14), transparent 60%),
  radial-gradient(700px 420px at -6% 30%, rgba(37,99,235,0.07), transparent 60%), #f6f8fb;}
.cp2-in{max-width:1336px;margin:0 auto;}
.cp2-in > *{animation:cp2In .55s cubic-bezier(.22,.8,.3,1) both;}
.cp2-in > *:nth-child(2){animation-delay:.08s;}
.cp2-in > *:nth-child(3){animation-delay:.16s;}
@keyframes cp2In{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}

.cp2-hero{position:relative;overflow:hidden;background:#16130f;border-radius:6px;padding:2.5rem 2.6rem 2.2rem;box-shadow:0 34px 80px -28px rgba(10,37,64,0.55), inset 0 1px 0 rgba(125,211,252,0.14);}
.cp2-hero-orb{position:absolute;right:-140px;bottom:-190px;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle, rgba(125,211,252,0.22), rgba(37,99,235,0.10) 45%, transparent 70%);filter:blur(40px);pointer-events:none;}
.cp2-hero-top{position:relative;z-index:1;display:flex;align-items:center;gap:1.5rem;}
.cp2-avatar-ring{flex-shrink:0;padding:3px;border-radius:50%;background:conic-gradient(from 210deg, #7dd3fc, #2563eb, #1e3a8a, #7dd3fc);box-shadow:0 14px 34px rgba(37,99,235,0.45);}
.cp2-avatar{width:70px;height:70px;border-radius:50%;background:#101418;border:3px solid #16130f;color:#f6f9fc;font-family:var(--font-head);font-weight:900;font-size:1.35rem;letter-spacing:.02em;display:flex;align-items:center;justify-content:center;}
.cp2-id{flex:1;min-width:0;}
.cp2-eyebrow{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:#7dd3fc;}
.cp2-hello{font-family:var(--font-head);font-weight:900;font-size:clamp(1.9rem,3.4vw,2.9rem);line-height:1;letter-spacing:-0.035em;color:#f6f9fc;margin:.4rem 0 0;}
.cp2-hello em{font-style:italic;background:linear-gradient(100deg,#7dd3fc,#3b82f6);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#7dd3fc;}
.cp2-meta{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:rgba(246,249,252,0.5);margin-top:.5rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--font-body);}
.cp2-metadot{color:rgba(125,211,252,0.5);}
.cp2-logout{flex-shrink:0;display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.16);color:rgba(246,249,252,0.7);font-family:var(--font-body);font-size:.74rem;font-weight:700;padding:9px 16px;border-radius:999px;cursor:pointer;transition:all .2s;}
.cp2-logout:hover{color:#fca5a5;border-color:rgba(252,165,165,0.45);background:rgba(220,38,38,0.08);}
.cp2-kpis{position:relative;z-index:1;display:grid;grid-template-columns:repeat(5,1fr);gap:.8rem;margin-top:2rem;}
.cp2-kpi{background:rgba(255,255,255,0.045);border:1px solid rgba(255,255,255,0.09);border-radius:6px;padding:1.05rem 1.2rem;box-shadow:inset 0 1px 0 rgba(255,255,255,0.08);transition:transform .2s, border-color .2s;}
.cp2-kpi:hover{transform:translateY(-2px);border-color:rgba(125,211,252,0.35);}
.cp2-kpi-num{font-family:var(--font-head);font-weight:900;font-size:2.15rem;line-height:1;letter-spacing:-0.02em;color:#f6f9fc;font-variant-numeric:tabular-nums;}
.cp2-kpi-lbl{font-family:var(--font-mono);font-size:.58rem;letter-spacing:.13em;text-transform:uppercase;color:rgba(125,211,252,0.75);margin-top:.5rem;}

/* Barre d'onglets + actions */
.cp2-bar{display:flex;flex-direction:column;align-items:stretch;gap:.9rem;margin:1.5rem 0 1.5rem;}
.cp2-ptabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem;background:transparent;border:none;border-radius:0;padding:0;width:100%;}
.cp2-ptab{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:.7rem;text-align:left;border:1px solid #e6ebf1;background:#fff;color:#425466;font-family:var(--font-body);font-weight:800;font-size:.84rem;padding:1rem 1.1rem 1.05rem;border-radius:6px;cursor:pointer;transition:transform .18s, box-shadow .18s, border-color .18s, background .18s;white-space:normal;box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 10px 24px -16px rgba(10,37,64,0.20);}
.cp2-ptab:hover{color:#0a2540;transform:translateY(-2px);border-color:#c7d2fe;box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 16px 32px -18px rgba(10,37,64,0.32);}
.cp2-ptab-ico{width:34px;height:34px;flex:0 0 34px;border-radius:6px;background:#eef2ff;color:#1e3a8a;display:flex;align-items:center;justify-content:center;transition:background .18s, color .18s;}
.cp2-ptab-ico svg{width:18px;height:18px;}
.cp2-ptab-txt{font-family:var(--font-head);font-weight:900;font-size:.95rem;letter-spacing:-0.01em;color:#0a2540;line-height:1.15;}
.cp2-ptab-sub{font-family:var(--font-body);font-weight:600;font-size:.72rem;color:#8792a2;margin-top:.2rem;line-height:1.35;}
.cp2-ptab .dash-badge{position:absolute;top:.95rem;right:.95rem;}
.cp2-ptab-active{background:#0a2540;border-color:#0a2540;box-shadow:0 1px 2px rgba(10,37,64,0.10), 0 18px 36px -18px rgba(10,37,64,0.55);}
.cp2-ptab-active .cp2-ptab-txt{color:#fff;}
.cp2-ptab-active .cp2-ptab-sub{color:rgba(246,249,252,0.6);}
.cp2-ptab-active .cp2-ptab-ico{background:rgba(125,211,252,0.16);color:#7dd3fc;}
.cp2-actions{display:flex;align-items:center;justify-content:flex-end;gap:.6rem;flex-wrap:wrap;order:-1;}
.cp2-ptab-cta .cp2-ptab-ico{background:rgba(10,37,64,0.06);color:#0a2540;}
.cp2-ptab-pub{background:linear-gradient(135deg,#3b82f6,#1d4ed8);border-color:transparent;box-shadow:0 1px 2px rgba(10,37,64,0.10), 0 16px 32px -18px rgba(37,99,235,0.75);}
.cp2-ptab-pub .cp2-ptab-txt{color:#fff;}
.cp2-ptab-pub .cp2-ptab-sub{color:rgba(255,255,255,0.72);}
.cp2-ptab-pub .cp2-ptab-ico{background:rgba(255,255,255,0.18);color:#fff;}
.cp2-ptab-pub:hover{border-color:transparent;box-shadow:0 1px 2px rgba(10,37,64,0.10), 0 22px 40px -18px rgba(37,99,235,0.85);}
.cp2-act-ghost{border:1.5px solid rgba(10,37,64,0.18);background:#fff;color:#0a2540;font-family:var(--font-body);font-weight:800;font-size:.8rem;padding:11px 18px;border-radius:999px;cursor:pointer;transition:all .18s;box-shadow:0 6px 18px rgba(10,37,64,0.06);white-space:nowrap;}
.cp2-act-ghost:hover{border-color:#2563eb;color:#2563eb;transform:translateY(-1px);}
.cp2-act-primary{border:none;background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#0a2540;font-family:var(--font-body);font-weight:800;font-size:.8rem;padding:12.5px 20px;border-radius:999px;cursor:pointer;box-shadow:0 12px 26px rgba(37,99,235,0.42);transition:transform .18s, box-shadow .18s;white-space:nowrap;}
.cp2-act-primary:hover{transform:translateY(-1px);box-shadow:0 16px 32px rgba(37,99,235,0.52);}

/* Panneaux */
.cp2-panel{animation:cp2In .4s cubic-bezier(.22,.8,.3,1) both;}

/* Badges de compte dans les onglets */
#compteLoggedIn .cp2-ptab .dash-badge{padding:2px 8px;font-size:.62rem;box-shadow:none;background:rgba(10,37,64,0.10);color:#0a2540;}
#compteLoggedIn .cp2-ptab .dash-badge-blue{background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#0a2540;}
#compteLoggedIn .cp2-ptab .dash-badge-red{background:linear-gradient(135deg,#f43f5e,#dc2626);color:#0a2540;}
#compteLoggedIn .cp2-ptab-active .dash-badge{background:rgba(255,255,255,0.18);color:#0a2540;}

/* overrides doux des éléments partagés, scopés au dashboard */
#compteLoggedIn .dash-badge{background:#0a2540;color:#f6f9fc;font-size:.66rem;font-weight:800;padding:4px 11px;border-radius:999px;font-family:var(--font-body);box-shadow:0 6px 14px rgba(10,37,64,0.18);}
#compteLoggedIn .dash-badge-red{background:linear-gradient(135deg,#f43f5e,#dc2626);color:#0a2540;}
#compteLoggedIn .dash-badge-blue{background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#0a2540;}
#compteLoggedIn .dash-empty{text-align:center;color:#8a8480;font-size:.83rem;line-height:1.65;padding:2rem 1.2rem;background:linear-gradient(180deg,#fff,#fbf8f3);border:1px solid rgba(10,37,64,0.07);border-radius:6px;box-shadow:0 10px 26px -14px rgba(10,37,64,0.14);}
#compteLoggedIn .dash-empty-ico{font-size:1.35rem;width:52px;height:52px;margin:0 auto .7rem;border-radius:50%;background:rgba(37,99,235,0.08);display:flex;align-items:center;justify-content:center;}
#compteLoggedIn .inbox-item{border-radius:6px;border-color:rgba(10,37,64,0.08);box-shadow:0 6px 18px -8px rgba(10,37,64,0.10);}
#compteLoggedIn .inbox-item:hover{transform:translateY(-2px);box-shadow:0 14px 30px -10px rgba(10,37,64,0.18);border-color:rgba(37,99,235,0.25);}

@media(max-width:1080px){
  .cp2-dash{padding:5.2rem 1.1rem 3.5rem;}
  .cp2-hero{padding:1.7rem 1.4rem 1.5rem;border-radius:6px;}
  .cp2-hero-top{flex-wrap:wrap;gap:1rem;}
  .cp2-kpis{grid-template-columns:repeat(2,1fr);gap:.7rem;margin-top:1.4rem;}
  .cp2-kpi{padding:.9rem 1rem;}
  .cp2-kpi-num{font-size:1.7rem;}
  .cp2-bar{flex-direction:column;align-items:stretch;margin:1.1rem 0 1rem;}
  .cp2-ptabs{width:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;}
  .cp2-ptab{padding:.85rem .9rem .9rem;font-size:.78rem;}
  .cp2-ptab-txt{font-size:.86rem;}
  .cp2-actions{width:100%;}
  .cp2-act-ghost,.cp2-act-primary{flex:1;text-align:center;}
}
@media (prefers-reduced-motion: reduce){ .cp2-in > *{animation:none !important;} }
/* cartes annonces */
.ma-card{background:#fff;border:1px solid rgba(10,37,64,0.07);border-radius:6px;overflow:hidden;box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 10px 24px -14px rgba(10,37,64,0.16);display:flex;flex-direction:column;transition:transform .18s, box-shadow .18s;}
.ma-card:hover{transform:translateY(-2px);box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 18px 34px -18px rgba(10,37,64,0.32);}
.ma-card.ma-sold{opacity:.68;}
.ma-ph{width:100%;height:190px;background:#eef2f7 center/cover no-repeat;cursor:pointer;position:relative;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:2rem;color:#b8c2ce;}
.ma-ph .ma-chip{position:absolute;top:10px;left:10px;box-shadow:0 2px 8px rgba(10,37,64,0.18);}
.ma-body{flex:1;min-width:0;padding:.9rem 1rem 1rem;cursor:pointer;display:flex;flex-direction:column;gap:.25rem;}
.ma-line1{display:flex;align-items:baseline;gap:.8rem;}
.ma-title{font-family:var(--font-head);font-weight:800;font-size:1rem;color:#0a2540;letter-spacing:-0.01em;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.ma-price{font-family:var(--font-head);font-weight:900;font-size:1.15rem;color:#2563eb;white-space:nowrap;margin-top:.15rem;}
.ma-meta{font-size:.74rem;color:#8a8480;}
.ma-perf{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-top:auto;padding-top:.6rem;}
.ma-views{font-family:var(--font-mono);font-size:.66rem;color:#5a534e;white-space:nowrap;}
.ma-bar{width:100%;height:5px;border-radius:3px;background:rgba(10,37,64,0.08);overflow:hidden;margin-top:.5rem;}
.ma-bar i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#2563eb,#7dd3fc);}
.ma-chip{font-size:.6rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:3px 9px;border-radius:999px;white-space:nowrap;}
.ma-chip-on{background:rgba(74,222,128,0.16);color:#15803d;}
.ma-chip-sold{background:rgba(10,37,64,0.08);color:#5a534e;}
.ma-actions{display:flex;flex-direction:row;gap:.4rem;padding:.7rem .8rem;border-top:1px solid rgba(10,37,64,0.06);background:#fbfcfe;}
.ma-actions .ma-btn{flex:1;text-align:center;}
.ma-x{grid-column:1 / -1;}
.ma-btn{border:1px solid rgba(10,37,64,0.14);background:#fff;border-radius:6px;padding:6px 11px;font-size:.68rem;font-weight:700;cursor:pointer;color:#0a2540;font-family:var(--font-body);white-space:nowrap;transition:all .15s;}
.ma-btn:hover{border-color:#2563eb;color:#2563eb;}
.ma-btn-del{color:#e11d48;border-color:rgba(225,29,72,0.22);}
.ma-btn-del:hover{border-color:#e11d48;color:#e11d48;background:rgba(225,29,72,0.05);}
@media(max-width:900px){
  .cpt-dash{padding:5.2rem 1.1rem 3.5rem;}
  .dash-hero{padding:1.6rem 1.3rem 1.4rem;border-radius:6px;}
  .dash-stats{grid-template-columns:repeat(2,1fr);gap:1.2rem 0;}
  .dash-stat:nth-child(3){border-left:none;padding-left:0;}
  .dash-tiles{grid-template-columns:1fr;}
  .dash-grid{grid-template-columns:1fr;gap:1.8rem;}
  .ma-ph{height:170px;}
}
/* — Responsive — */
@media(max-width:900px){
  .cpt-split{display:flex;flex-direction:column-reverse;min-height:0;}
  .cpt-visual{position:relative;height:32vh;min-height:210px;}
  .cpt-band-in{padding:1.6rem 1.3rem 2.6rem;max-width:520px;}
  .cpt-visual-callout{right:1.1rem;bottom:1rem;}
  .cvc-line{font-size:1.35rem;}
}
/* ================= PUBLIER — design v2 : l'annonce prend vie ================= */
#page-publier{
  background:#f6f8fb !important;
  padding-top:64px;
}
/* --- Bandeau éditorial sombre --- */
.pub-hero{background:#0a2540;padding:5.2rem 2.5rem 4.2rem;position:relative;overflow:hidden;max-width:1400px;margin:5.2rem auto 0;border-radius:6px;box-shadow:0 1px 2px rgba(10,37,64,0.10), 0 18px 40px -22px rgba(10,37,64,0.45);}
#page-publier{background:#f6f8fb;padding-left:2rem;padding-right:2rem;box-sizing:border-box;}
.pub-hero::after{content:'';position:absolute;inset:0;background:radial-gradient(900px 320px at 78% 120%, rgba(125,211,252,0.14), transparent 60%);pointer-events:none;}
.pub-hero-in{max-width:1400px;margin:0 auto;position:relative;z-index:1;}
.pub-hero .pub-eyebrow{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:#7dd3fc;}
.pub-hero h1{font-family:var(--font-head);font-weight:900;color:#f6f9fc;font-size:clamp(2.4rem,5.2vw,4rem);line-height:.98;letter-spacing:-0.035em;margin:.8rem 0 0;max-width:14ch;}
.pub-hero h1 em{font-style:italic;color:#7dd3fc;}
.pub-hero p{color:rgba(246,249,252,0.55);font-size:.95rem;max-width:46ch;margin:1.1rem 0 0;line-height:1.6;}
/* --- Corps : formulaire + aperçu live --- */
.pub-shell{max-width:1400px;margin:-2.2rem auto 0;padding:0 2rem 6rem;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:2.2rem;align-items:start;position:relative;z-index:2;}
/* --- Carte formulaire --- */
.pub-card{background:#fff;border:1px solid rgba(10,37,64,0.07);border-radius:6px;padding:2rem 2.4rem 2.2rem;box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 10px 24px -14px rgba(10,37,64,0.16);}
/* Stepper horizontal en tête de carte */
.pub-steps{display:flex;align-items:flex-start;gap:0;margin:0 0 2rem;padding-bottom:1.6rem;border-bottom:1px solid rgba(10,37,64,0.07);}
.pub-step-row{display:flex;flex-direction:column;align-items:center;gap:.45rem;flex:1;position:relative;cursor:default;}
.pub-step-row:not(:last-child)::before{content:'';position:absolute;top:14px;left:calc(50% + 20px);right:calc(-50% + 20px);height:2px;background:rgba(10,37,64,0.08);transition:background .3s;}
.pub-step-row:has(.step-dot.done)::before{background:#7dd3fc;}
.pub-step-label{text-align:center;line-height:1.15;}
.pub-step-label b{display:block;font-family:var(--font-body);font-weight:700;font-size:.72rem;color:#c4beb8;transition:color .2s;letter-spacing:-0.01em;}
.pub-step-label span{display:none;}
#page-publier .step-dot{width:29px;height:29px;flex-shrink:0;font-size:.78rem;box-shadow:0 1px 3px rgba(0,0,0,0.05);position:relative;z-index:1;}
#page-publier .step-dot.active{background:#2563eb;border-color:#2563eb;color:#0a2540;box-shadow:0 6px 16px rgba(37,99,235,0.35);}
#page-publier .step-dot.done{background:#7dd3fc;border-color:#7dd3fc;color:#0c4a6e;}
#page-publier .pub-step-row:has(.step-dot.active) .pub-step-label b,#page-publier .pub-step-row:has(.step-dot.done) .pub-step-label b{color:#0a2540;}
/* Étapes : entrée animée */
@keyframes pubStepIn{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
#page-publier .publier-step{animation:pubStepIn .38s cubic-bezier(.22,.8,.3,1);}
@media (prefers-reduced-motion: reduce){#page-publier .publier-step{animation:none;}}
#page-publier .publier-step-title{font-family:var(--font-head);font-weight:800;font-size:1.55rem;letter-spacing:-0.02em;color:#0a2540;margin:0 0 .25rem;}
.pub-step-hint{font-size:.85rem;color:#8a8480;margin:0 0 1.4rem;line-height:1.5;}
/* Inputs */
#page-publier .form-label{font-family:var(--font-mono);font-size:.66rem;color:#a79f98 !important;text-transform:uppercase;letter-spacing:.1em;}
#page-publier .form-input,#page-publier .cream-input{background:#f6f8fb !important;border:1px solid rgba(10,37,64,0.12) !important;border-radius:6px;padding:13px 15px;font-size:.9rem;color:#0a2540 !important;transition:border-color .18s,box-shadow .18s,background .18s;}
#page-publier .form-input:focus,#page-publier .cream-input:focus{border-color:#7dd3fc !important;background:#fff !important;box-shadow:0 0 0 4px rgba(125,211,252,0.28) !important;outline:none;}
#page-publier .form-textarea{min-height:130px;line-height:1.55;}
/* Tuiles de choix */
#page-publier .radio-card{flex-direction:column;gap:.3rem;padding:1.4rem 1rem;border:1.5px solid rgba(10,37,64,0.10);border-radius:6px;background:#f6f8fb;transition:all .18s ease;overflow:hidden;}
#page-publier .radio-card:hover{border-color:rgba(125,211,252,0.8);background:#fff;transform:translateY(-1px);}
#page-publier .radio-card .rc-ico{font-size:1.55rem;line-height:1;margin-bottom:.1rem;}
#page-publier .radio-card small{color:#a79f98;font-size:.72rem;}
#page-publier .radio-card:has(input:checked){border-color:#2563eb;background:rgba(37,99,235,0.05);box-shadow:0 0 0 3px rgba(37,99,235,0.15),0 10px 22px -12px rgba(37,99,235,0.45);}
#page-publier .radio-card.rc-photo{position:relative;justify-content:flex-end;align-items:flex-start;text-align:left;min-height:170px;background-size:cover;background-position:center;border-color:rgba(10,37,64,0.14);}
#page-publier .radio-card.rc-photo:hover{background-color:transparent;transform:translateY(-1px);}
#page-publier .radio-card.rc-photo span{font-family:var(--font-head);color:#fff;font-weight:900;font-size:1.75rem;letter-spacing:-0.02em;line-height:1;text-shadow:0 2px 10px rgba(0,0,0,0.65), 0 4px 30px rgba(0,0,0,0.5);position:relative;z-index:1;padding-bottom:.15rem;}
#page-publier .radio-card.rc-photo span::after{content:'';display:block;width:34px;height:3px;border-radius:2px;background:#7dd3fc;margin-top:.5rem;box-shadow:0 1px 8px rgba(0,0,0,0.4);}
:root{--mhp1:url("https://gtccynavuqlcvomqjomu.supabase.co/storage/v1/object/public/vendre%20louer%20publi%20d'annonce/publier-vendre.jpg");--mhp2:url("https://gtccynavuqlcvomqjomu.supabase.co/storage/v1/object/public/vendre%20louer%20publi%20d'annonce/publier-louer.jpg");}
.pub-hero-band{position:absolute;top:-14%;height:132%;width:172px;border-radius:6px;background-size:cover;background-position:center;transform:rotate(14deg);box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 10px 24px -14px rgba(10,37,64,0.16);border:1px solid rgba(255,255,255,0.10);pointer-events:none;overflow:hidden;}
.pub-hero-band::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,37,64,0.30),rgba(10,37,64,0.05) 55%,rgba(10,37,64,0.25));}
.pub-hero-band-1{right:24%;background-image:var(--mhp1);}
.pub-hero-band-2{right:7%;background-image:var(--mhp2);}
@media(max-width:1080px){.pub-hero-band{display:none;}}
#page-publier .radio-card.rc-vendre{background-image:linear-gradient(185deg,rgba(10,37,64,0.02) 38%,rgba(10,37,64,0.82) 100%),var(--mhp1) !important;background-size:cover !important;background-position:center !important;}
#page-publier .radio-card.rc-louer{background-image:linear-gradient(185deg,rgba(10,37,64,0.02) 38%,rgba(10,37,64,0.82) 100%),var(--mhp2) !important;background-size:cover !important;background-position:center !important;}
#page-publier .radio-card.rc-photo:has(input:checked){background-color:transparent;}
#page-publier .radio-card:has(input:checked)::after{content:'✓';position:absolute;top:8px;right:10px;width:19px;height:19px;border-radius:50%;background:#2563eb;color:#0a2540;font-size:.66rem;display:flex;align-items:center;justify-content:center;}
#page-publier .photo-dropzone{border:2px dashed rgba(10,37,64,0.18);border-radius:6px;padding:2.6rem 1rem;background:#f6f8fb;transition:all .2s;}
#page-publier .photo-dropzone:hover,#page-publier .photo-dropzone.dragover{border-color:#7dd3fc;background:rgba(125,211,252,0.08);}
.pub-nav{display:flex;gap:12px;margin-top:2rem;padding-top:1.6rem;border-top:1px solid rgba(10,37,64,0.07);}
/* --- Aperçu live --- */
.pub-preview{position:sticky;top:90px;display:flex;flex-direction:column;gap:.8rem;}
.pub-preview-tag{display:flex;align-items:center;gap:.5rem;font-family:var(--font-mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:#a79f98;}
.pub-preview-tag::before{content:'';width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,0.2);animation:pvPulse 2s infinite;}
@keyframes pvPulse{0%,100%{box-shadow:0 0 0 3px rgba(34,197,94,0.2);}50%{box-shadow:0 0 0 6px rgba(34,197,94,0.08);}}
.pv-card{background:#fff;border:1px solid rgba(10,37,64,0.08);border-radius:6px;overflow:hidden;box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 10px 24px -14px rgba(10,37,64,0.16);transform:rotate(.4deg);transition:transform .3s ease;}
.pv-card:hover{transform:rotate(0deg) translateY(-2px);}
.pv-photo{aspect-ratio:4/3;background:linear-gradient(120deg,#efe9e1,#f7f2ea 40%,#efe9e1 80%);background-size:200% 100%;animation:pvShimmer 2.4s infinite linear;display:flex;align-items:center;justify-content:center;color:#c4beb8;font-size:.78rem;font-family:var(--font-body);position:relative;}
.pv-photo img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0;}
@keyframes pvShimmer{from{background-position:200% 0;}to{background-position:-200% 0;}}
.pv-badge{position:absolute;top:10px;left:10px;background:#0a2540;color:#f6f9fc;font-family:var(--font-mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;padding:4px 9px;border-radius:6px;z-index:2;}
.pv-body{padding:1rem 1.1rem 1.15rem;}
.pv-title{font-family:var(--font-head);font-weight:800;font-size:1rem;color:#0a2540;letter-spacing:-0.015em;line-height:1.25;min-height:2.5em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.pv-title.pv-empty{color:#d8d2ca;}
.pv-price{font-family:var(--font-head);font-weight:900;font-size:1.45rem;color:#2563eb;letter-spacing:-0.02em;margin-top:.35rem;}
.pv-price small{font-size:.72rem;font-weight:600;color:#a79f98;font-family:var(--font-body);letter-spacing:0;}
.pv-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:.7rem;}
.pv-chip{font-size:.68rem;font-weight:600;color:#5a534e;background:#f4efe8;border:1px solid rgba(10,37,64,0.06);padding:4px 9px;border-radius:6px;}
.pv-chip.pv-empty{color:#c4beb8;background:#faf7f2;border-style:dashed;}
.pv-foot{display:flex;align-items:center;justify-content:space-between;margin-top:.85rem;padding-top:.75rem;border-top:1px solid rgba(10,37,64,0.06);font-size:.7rem;color:#a79f98;}
.pv-foot .pv-loc{display:flex;align-items:center;gap:4px;font-weight:600;color:#5a534e;}
.pub-preview-note{font-size:.72rem;color:#b5afa9;line-height:1.5;text-align:center;padding:0 .5rem;}
/* --- Responsive --- */
@media(max-width:1080px){
  .pub-shell{grid-template-columns:1fr;padding:0 1.2rem 5rem;}
  .pub-preview{position:static;order:-1;max-width:380px;margin:0 auto;width:100%;}
  .pub-hero{padding:6rem 1.2rem 3.6rem;}
}
@media(max-width:640px){
  .pub-card{padding:1.5rem 1.2rem;}
  .pub-step-label{display:none;}
  .pub-steps{gap:.2rem;}
}

/* HERO */
.hero{min-height:88vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:5rem 2rem;position:relative;overflow:hidden;}

.hero>div{position:relative;z-index:1;}
.hero-tag{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-mono);font-size:.7rem;color:var(--accent);background:rgba(37,99,235,.08);border:1px solid rgba(37,99,235,.22);padding:6px 16px;border-radius:6px;margin-bottom:1.8rem;letter-spacing:.07em;text-transform:uppercase;}
.hero-tag-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);animation:pulse 2s infinite;}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.35;transform:scale(.8);}}
@keyframes bounceDown{0%,100%{transform:translateX(-50%) translateY(0);}50%{transform:translateX(-50%) translateY(8px);}}
@keyframes scrollDot{0%{top:6px;opacity:1;}60%{top:22px;opacity:0;}100%{top:6px;opacity:0;}}

/* Feature sections (accueil) */
.feature-section{
  position:relative;
  z-index:1;
  max-width:1400px;
  margin:0 auto;
  padding:5rem 2rem;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:4rem;
  align-items:center;
}
.feature-section.reverse .feature-text{order:2;}
.feature-section.reverse .feature-visual{order:1;}
.feature-number{
  font-family:var(--font-head);
  font-size:3.5rem;
  font-weight:900;
  color:rgba(10,37,64,0.08);
  line-height:1;
  margin-bottom:.5rem;
  letter-spacing:-0.04em;
}
.feature-tag{
  font-family:var(--font-mono);
  font-size:.7rem;
  color:var(--accent);
  letter-spacing:.14em;
  text-transform:uppercase;
  margin-bottom:.9rem;
  font-weight:700;
}
.feature-title{
  font-family:var(--font-head);
  font-size:clamp(1.8rem,3.6vw,3rem);
  font-weight:900;
  line-height:1.02;
  letter-spacing:-0.03em;
  color:#0a2540;
  margin:0 0 1.5rem;
}
.feature-desc{
  font-size:1rem;
  color:rgba(220,220,220,0.7);
  line-height:1.65;
  margin:0 0 1.5rem;
  max-width:520px;
}
.feature-bullets{
  list-style:none;
  padding:0;
  margin:0 0 2rem;
}
.feature-bullets li{
  font-size:.9rem;
  color:rgba(10,37,64,0.75);
  padding:.5rem 0 .5rem 1.6rem;
  position:relative;
  line-height:1.45;
}
.feature-bullets li::before{
  content:'';
  position:absolute;
  left:0;
  top:.85rem;
  width:10px;
  height:2px;
  background:var(--accent);
  border-radius:2px;
}
.feature-visual{
  position:relative;
}
@media(max-width:900px){
  .feature-section{grid-template-columns:1fr;gap:2rem;padding:3rem 1.5rem;}
  .feature-section.reverse .feature-text{order:1;}
  .feature-section.reverse .feature-visual{order:2;}
}

/* Mini previews */
.mini-brand-card{
  background:var(--glass-bg);
  backdrop-filter:var(--glass-blur);
  -webkit-backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-border);
  border-radius:6px;
  padding:1.2rem;
  text-align:center;
  color:var(--glass-text);
  box-shadow:var(--glass-shadow);
}
.mini-rank-row{
  display:grid;
  grid-template-columns:30px 1fr auto auto;
  gap:.8rem;
  align-items:center;
  padding:.7rem .4rem;
  border-bottom:1px solid rgba(0,0,0,0.06);
}
.mini-rank{
  font-family:var(--font-head);
  font-size:1.1rem;
  font-weight:800;
  color:var(--accent);
}
.mini-rank-name{
  font-weight:700;
  color:var(--card-text);
  font-size:.9rem;
}
.mini-rank-loc{
  font-size:.75rem;
  color:var(--card-muted);
}
.mini-rank-price{
  font-family:var(--font-mono);
  font-weight:700;
  color:var(--card-text);
  font-size:.85rem;
}
.mini-equip-card{
  background:var(--glass-bg);
  backdrop-filter:var(--glass-blur);
  -webkit-backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-border);
  border-radius:6px;
  padding:1rem .6rem;
  text-align:center;
  color:var(--glass-text);
  font-weight:700;
  font-size:.85rem;
  font-family:var(--font-body);
  box-shadow:var(--glass-shadow);
}
.mini-equip-card > div{margin-top:.4rem;font-size:.75rem;}
.hero h1{font-family:var(--font-head);font-weight:700;font-size:clamp(2rem,5vw,4rem);line-height:1.15;margin-bottom:1.5rem;background:linear-gradient(130deg,#f0f4f8 0%,#2563eb 55%,#3b82f6 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.hero p{font-size:1rem;color:rgba(220,220,220,.75);max-width:460px;margin:0 auto 2.8rem;line-height:1.75;font-weight:400;letter-spacing:.01em;}
.hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;}
.btn-primary{background:var(--accent);color:#0a2540;font-family:var(--font-body);font-weight:700;font-size:.88rem;padding:14px 28px;border-radius:6px;cursor:pointer;transition:all .2s;border:none;}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(37,99,235,.25);}
.btn-secondary{background:var(--bg3);color:var(--text);font-family:var(--font-body);font-size:.88rem;padding:14px 28px;border-radius:6px;cursor:pointer;border:1px solid var(--border2);transition:all .2s;}
.btn-secondary:hover{border-color:var(--accent);color:var(--accent);}

/* TICKER */
.ticker-bar{background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);overflow:hidden;padding:18px 0;}
.ticker-inner{display:flex;gap:4rem;animation:ticker 30s linear infinite;white-space:nowrap;}
@keyframes ticker{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
.ticker-item{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:.95rem;}
.ticker-name{color:var(--muted);font-size:.82rem;letter-spacing:.05em;text-transform:uppercase;}
.ticker-val{color:var(--text);font-weight:600;font-size:1rem;}
.up{color:var(--accent);background:#f0f4f8;padding:1px 6px;border-radius:3px;} .down{color:#1d4ed8;background:#f0f4f8;padding:1px 6px;border-radius:3px;}

/* LAYOUT */
section{padding:5rem 2rem;max-width:1400px;margin:0 auto;}
.section-label{font-family:var(--font-mono);font-size:.7rem;color:var(--accent);letter-spacing:.14em;text-transform:uppercase;margin-bottom:.5rem;}
.section-title{font-family:var(--font-head);font-weight:700;font-size:clamp(1.5rem,3.5vw,2.5rem);line-height:1.15;margin-bottom:1rem;}
.section-sub{font-size:.97rem;color:var(--muted);max-width:480px;line-height:1.65;}

/* STATS */
.stats-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:1rem;}
.stat-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:6px;padding:1.4rem;transition:all .3s cubic-bezier(0.4,0,0.2,1);color:var(--glass-text);box-shadow:var(--glass-shadow);position:relative;overflow:hidden;}
.stat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,0.08) 0%,rgba(255,255,255,0) 100%);pointer-events:none;border-radius:6px 6px 0 0;}
.stat-card:hover{background:var(--glass-bg-hover);border-color:var(--glass-border-hover);box-shadow:var(--glass-shadow-hover);transform:translateY(-2px);}
.stat-card:hover{border-color:var(--border2);}
.stat-label{font-family:var(--font-mono);font-size:.67rem;color:var(--card-label);text-transform:uppercase;letter-spacing:.09em;margin-bottom:.55rem;}
.stat-value{font-family:var(--font-head);font-weight:700;font-size:1.9rem;color:var(--card-text);}
.stat-change{font-family:var(--font-mono);font-size:.7rem;margin-top:.35rem;}

/* REGION */
.region-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(195px,1fr));gap:1rem;margin-top:2.5rem;}
.region-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:6px;color:var(--glass-text);padding:1.4rem;cursor:pointer;transition:all .3s cubic-bezier(0.4,0,0.2,1);position:relative;overflow:hidden;box-shadow:var(--glass-shadow);}
.region-card::before{content:'';position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,0.09) 0%,rgba(255,255,255,0) 100%);pointer-events:none;z-index:1;border-radius:6px 6px 0 0;}
.region-card::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,rgba(125,211,252,.18),transparent 65%);opacity:0;transition:opacity .3s;pointer-events:none;}
.region-card:hover{background:var(--glass-bg-hover);border-color:var(--glass-border-hover);transform:translateY(-3px);box-shadow:var(--glass-shadow-hover);}
.region-card:hover::after{opacity:1;}
.region-flag{font-size:1.9rem;margin-bottom:.65rem;}
.region-name{font-family:var(--font-head);font-weight:700;font-size:.92rem;margin-bottom:.3rem;color:var(--glass-text);}
.region-count{font-family:var(--font-mono);font-size:.72rem;color:var(--accent2);background:rgba(59,130,246,.15);padding:2px 7px;border-radius:4px;display:inline-block;}
.region-change{font-family:var(--font-mono);font-size:.7rem;margin-top:.75rem;color:var(--glass-text-muted);}
.region-bar{height:3px;background:rgba(255,255,255,.10);border-radius:2px;margin-top:.75rem;overflow:hidden;}
.region-bar-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:2px;}

/* CHART */
.chart-wrap{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:6px;padding:1.8rem;margin-top:1.8rem;color:var(--glass-text);box-shadow:var(--glass-shadow);position:relative;overflow:hidden;}
.chart-wrap::before{content:'';position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,0.07) 0%,rgba(255,255,255,0) 100%);pointer-events:none;border-radius:6px 6px 0 0;}
.chart-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.3rem;flex-wrap:wrap;gap:1rem;}
.chart-title{font-family:var(--font-head);font-weight:600;font-size:.97rem;color:var(--card-text);}
.chart-tabs{display:flex;gap:4px;background:var(--bg3);border-radius:6px;padding:3px;}
.chart-tab{font-family:var(--font-mono);font-size:.7rem;padding:5px 12px;border-radius:6px;cursor:pointer;color:var(--muted);transition:all .2s;}
.chart-tab.active{background:var(--bg);color:var(--accent);}

/* TOP 10 */
.top10-table{width:100%;border-collapse:collapse;margin-top:1.8rem;}
.top10-table th{font-family:var(--font-mono);font-size:.65rem;color:var(--card-label);text-transform:uppercase;letter-spacing:.1em;padding:10px 14px;text-align:left;border-bottom:1px solid rgba(0,0,0,.10);}
.top10-table td{padding:13px 14px;border-bottom:1px solid rgba(0,0,0,.07);font-size:.88rem;vertical-align:middle;color:var(--card-text);}
.top10-table tr:hover td{background:rgba(0,0,0,.04);}
.rank-num{font-family:var(--font-mono);font-size:.82rem;color:var(--card-muted);min-width:26px;display:inline-block;}
.rank-1{color:#b8860b;} .rank-2{color:#888;} .rank-3{color:#b07a50;}
.park-name{font-weight:600;color:var(--card-text);}
.park-loc{font-size:.75rem;color:var(--card-muted);margin-top:2px;}
.price{font-family:var(--font-mono);font-weight:500;color:var(--card-text);}
.badge{display:inline-block;padding:3px 9px;border-radius:6px;font-family:var(--font-mono);font-size:.68rem;font-weight:500;}
.badge-up{background:rgba(37,99,235,.12);color:var(--accent);}
.badge-down{background:rgba(29,78,216,.12);color:#1d4ed8;}
.badge-hot{background:rgba(37,99,235,.15);color:var(--accent3);}

/* BACK BTN */
.region-hero{padding:3rem 2rem 1rem;max-width:1400px;margin:0 auto;display:flex;align-items:center;gap:1.2rem;}
.back-btn{font-family:var(--font-mono);font-size:.78rem;color:var(--accent);cursor:pointer;display:flex;align-items:center;gap:5px;padding:8px 14px;background:var(--bg3);border-radius:6px;border:1px solid var(--border2);transition:all .2s;flex-shrink:0;}
.back-btn:hover{border-color:var(--accent);background:rgba(37,99,235,.06);}

/* ABOUT */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:center;margin-top:3rem;}
.about-visual{background:var(--card);border:1px solid rgba(200,160,100,0.20);border-radius:6px;padding:1.8rem;color:var(--card-text);display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
.feature-pill{background:var(--bg3);border:1px solid var(--border2);border-radius:6px;padding:1.2rem;display:flex;flex-direction:column;gap:.45rem;transition:border-color .2s;}
.feature-pill:hover{border-color:rgba(37,99,235,.30);}
.feature-icon{font-size:1.5rem;}
.feature-title{font-family:var(--font-head);font-weight:700;font-size:.85rem;}
.feature-desc{font-size:.76rem;color:var(--muted);line-height:1.55;}
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2rem;}
.team-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:6px;padding:1.6rem 1.2rem;text-align:center;transition:all .3s cubic-bezier(0.4,0,0.2,1);color:var(--glass-text);box-shadow:var(--glass-shadow);position:relative;overflow:hidden;}
.team-card::before{content:'';position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,0.08) 0%,rgba(255,255,255,0) 100%);pointer-events:none;border-radius:6px 6px 0 0;}
.team-card:hover{background:var(--glass-bg-hover);border-color:var(--glass-border-hover);transform:translateY(-2px);box-shadow:var(--glass-shadow-hover);}
.team-card:hover{border-color:var(--border2);}
.avatar{width:60px;height:60px;border-radius:50%;margin:0 auto .9rem;display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:700;font-size:1.1rem;}
.av1{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#0a2540;}
.av2{background:linear-gradient(135deg,var(--accent2),var(--accent3));color:#0a2540;}
.av3{background:linear-gradient(135deg,var(--accent3),#b8860b);color:#0a2540;}
.team-name{font-family:var(--font-head);font-weight:700;font-size:.9rem;color:var(--card-text);}
.team-role{font-size:.73rem;color:var(--card-muted);margin-top:3px;line-height:1.4;}

/* CONTACT */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;margin-top:3rem;}
.contact-form{display:flex;flex-direction:column;gap:1rem;}
.form-field{display:flex;flex-direction:column;gap:6px;}
.form-label{font-family:var(--font-mono);font-size:.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:.09em;}
.form-input{background:var(--bg2);border:1px solid var(--border2);border-radius:6px;padding:12px 15px;color:var(--text);font-family:var(--font-body);font-size:.88rem;outline:none;transition:border-color .2s;width:100%;}
.form-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(37,99,235,.10);}
.form-textarea{min-height:120px;resize:vertical;}
.contact-info{display:flex;flex-direction:column;gap:1.5rem;}
.contact-item{display:flex;gap:1rem;align-items:flex-start;}
.contact-icon{width:42px;height:42px;border-radius:6px;background:var(--bg3);border:1px solid var(--border2);display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;}
.contact-text-head{font-family:var(--font-head);font-weight:600;font-size:.9rem;margin-bottom:2px;}
.contact-text-sub{font-size:.8rem;color:var(--muted);}

/* MOBIL-HOME */
.brands-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:2.5rem;}
.brand-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);color:var(--glass-text);border-radius:6px;padding:2rem 1.5rem;cursor:pointer;transition:all .3s cubic-bezier(0.4,0,0.2,1);position:relative;text-align:center;overflow:hidden;min-height:300px;box-shadow:var(--glass-shadow);}
.brand-card::before{content:'';position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,0.09) 0%,rgba(255,255,255,0) 100%);pointer-events:none;z-index:1;border-radius:6px 6px 0 0;}
.brand-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--accent),var(--accent2));transform:scaleX(0);transition:transform .3s;transform-origin:left;}
.brand-card:hover{border-color:rgba(37,99,235,.35);transform:translateY(-4px);box-shadow:0 12px 30px rgba(0,0,0,.12);}
.brand-card:hover::after{transform:scaleX(1);}
.brand-logo-circle{width:68px;height:68px;border-radius:50%;margin:0 auto 1rem;display:flex;align-items:center;justify-content:center;font-family:var(--font-body);font-weight:700;font-size:.95rem;border:2px solid var(--border2);transition:all .3s;}
.brand-card:hover .brand-logo-circle{border-color:var(--accent);box-shadow:0 0 20px rgba(37,99,235,.18);}
.brand-name{font-family:var(--font-head);font-weight:700;font-size:1.05rem;margin-bottom:.3rem;}
.brand-sub{font-size:.76rem;color:var(--accent);background:#f0f4f8;padding:2px 8px;border-radius:4px;display:inline-block;line-height:1.5;margin-top:.3rem;}
.brand-tag{font-family:var(--font-mono);font-size:.66rem;color:var(--accent);margin-top:.75rem;background:#f0f4f8;padding:2px 8px;border-radius:4px;display:inline-block;}
.gamme-hero{padding:3rem 2rem 1rem;max-width:1400px;margin:0 auto;display:flex;align-items:center;gap:1.2rem;}
.gammes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1.2rem;margin-top:2.5rem;}
.gamme-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:6px;color:var(--glass-text);cursor:pointer;transition:all .3s cubic-bezier(0.4,0,0.2,1);position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:280px;box-shadow:var(--glass-shadow);}
.gamme-card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.25),transparent);pointer-events:none;z-index:1;}
.gamme-card::before{content:'';position:absolute;inset:-2px;border-radius:6px;background:linear-gradient(90deg,#1d4ed8,#60a5fa,#a5f3fc,#60a5fa,#1d4ed8);background-size:400% 100%;opacity:0;transition:opacity .3s;z-index:0;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:borderFlow 1.8s linear infinite paused;}
.gamme-card:hover::before{opacity:1;animation-play-state:running;}
.gamme-card:hover{transform:translateY(-4px);box-shadow:0 0 0 2px #1d4ed8,0 10px 32px rgba(29,78,216,.30);}
@keyframes borderFlow{0%{background-position:0% 50%}100%{background-position:400% 50%}}
.gamme-flower{font-size:2.4rem;}
.gamme-band{position:absolute;bottom:0;left:0;right:0;height:33.33%;background:rgba(15,30,60,0.72);backdrop-filter:blur(4px);padding:.6rem .85rem .7rem;border-top:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;justify-content:space-evenly;}
.gamme-name{font-family:var(--font-head);font-weight:700;font-size:.95rem;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;display:flex;align-items:center;color:#0a2540;text-shadow:0 1px 3px rgba(0,0,0,.4);}
.gamme-range{font-family:var(--font-mono);font-size:.72rem;color:#a8d4ff;flex:1;display:flex;align-items:center;}
.gamme-specs{display:flex;flex-direction:column;gap:4px;margin-top:.9rem;}
.gamme-spec{display:flex;justify-content:space-between;font-size:.78rem;}
.gamme-spec-key{color:var(--muted);}
.gamme-spec-val{font-family:var(--font-mono);font-weight:500;color:var(--text);}
.gamme-bar{height:2px;background:var(--bg3);border-radius:2px;margin-top:1.1rem;overflow:hidden;}
.gamme-bar-fill{height:100%;border-radius:2px;}
.popularity-label{font-family:var(--font-mono);font-size:.65rem;color:var(--muted);margin-top:.4rem;text-transform:uppercase;letter-spacing:.08em;}
.fiche-hero{padding:3rem 2rem 0;max-width:1400px;margin:0 auto;}
.fiche-header{display:flex;align-items:flex-start;gap:2rem;margin-bottom:1.5rem;flex-wrap:wrap;}
.fiche-icon{font-size:3.5rem;}
.fiche-badges{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.6rem;}
.fiche-badge{font-family:var(--font-mono);font-size:.68rem;padding:4px 11px;border-radius:6px;}
.fiche-tabs{display:flex;gap:4px;background:var(--bg3);border-radius:6px;padding:4px;margin-top:2rem;}
.fiche-tab{font-family:var(--font-mono);font-size:.75rem;padding:8px 16px;border-radius:6px;cursor:pointer;color:var(--muted);transition:all .2s;}
.fiche-tab.active{background:var(--bg);color:var(--accent);}
.fiche-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin-top:1.8rem;}
.spec-block{background:var(--card);border:1px solid rgba(200,160,100,0.20);border-radius:6px;padding:1.4rem;color:var(--card-text);}
.spec-block-title{font-family:var(--font-mono);font-size:.67rem;color:var(--card-label);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.9rem;}
.spec-row{display:flex;justify-content:space-between;align-items:center;padding:7px 0;border-bottom:1px solid rgba(0,0,0,.08);}
.spec-row:last-child{border-bottom:none;}
.spec-key{font-size:.83rem;color:var(--card-muted);}
.spec-val{font-family:var(--font-mono);font-size:.83rem;font-weight:500;color:var(--card-text);}

/* FOOTER */
.footer-wrap{border-top:1px solid var(--border);padding:3rem 2rem 2.5rem;max-width:1400px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1.5rem;}
.footer-logo{font-family:var(--font-head);font-weight:700;font-size:1.1rem;display:flex;align-items:center;gap:8px;}
.footer-links{display:flex;gap:1.5rem;flex-wrap:wrap;}
.footer-link{font-size:.8rem;color:var(--muted);cursor:pointer;transition:color .2s;}
.footer-link:hover{color:var(--text);}
.footer-copy{font-family:var(--font-mono);font-size:.68rem;color:var(--muted);}

.charts-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:2rem;}
@keyframes filtreScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
.fbt{font-family:var(--font-mono);font-size:.68rem;padding:4px 9px;border-radius:6px;border:1px solid var(--border2);background:transparent;color:var(--muted);cursor:pointer;transition:all .18s;white-space:nowrap;}
.fbt:hover{color:var(--accent);border-color:var(--accent2);}
.fbt-active,.fbt.on{background:rgba(37,99,235,.15);color:var(--accent);border-color:rgba(37,99,235,.4);}

::-webkit-scrollbar{width:6px;} ::-webkit-scrollbar-track{background:var(--bg);} ::-webkit-scrollbar-thumb{background:var(--bg3);border-radius:3px;}

@media(max-width:720px){.nav-links{display:none;}.about-grid,.contact-grid,.charts-grid-2,.fiche-grid{grid-template-columns:1fr;}}
@media(max-width:600px){section{padding:3rem 1.2rem;}.team-grid{grid-template-columns:1fr 1fr;}}

  .ann-form{display:flex;gap:.7rem;flex-wrap:wrap;align-items:flex-end;margin-bottom:1.5rem;}
  .ann-input-group{display:flex;flex-direction:column;gap:5px;}
  .ann-label{font-family:var(--font-mono);font-size:.65rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;}
  .ann-input{background:var(--bg2);border:1px solid var(--border2);border-radius:6px;padding:9px 13px;color:var(--text);font-family:var(--font-body);font-size:.88rem;outline:none;width:130px;transition:border-color .2s;}
  .ann-input:focus{border-color:var(--accent);}
  .ann-btn{background:var(--accent);color:#0a2540;font-family:var(--font-body);font-weight:700;font-size:.82rem;padding:10px 18px;border-radius:6px;cursor:pointer;border:none;transition:all .2s;white-space:nowrap;}
  .ann-btn:hover{box-shadow:0 4px 14px rgba(37,99,235,.28);}
  .ann-btn-del{background:var(--bg3);color:#1d4ed8;font-family:var(--font-mono);font-size:.7rem;padding:3px 8px;border-radius:5px;cursor:pointer;border:1px solid rgba(29,78,216,.3);transition:all .2s;}
  .ann-btn-del:hover{background:rgba(255,77,109,.1);}
  .ann-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem;max-height:220px;overflow-y:auto;}
  .ann-row{display:flex;align-items:center;justify-content:space-between;background:var(--bg3);border:1px solid var(--border);border-radius:6px;padding:8px 14px;font-size:.85rem;}
  .ann-row-info{display:flex;gap:1.5rem;}
  .ann-row-x{font-family:var(--font-mono);color:var(--muted);font-size:.78rem;}
  .ann-row-y{font-family:var(--font-mono);font-weight:600;color:var(--text);}
  .ann-empty{font-size:.85rem;color:var(--muted);text-align:center;padding:2rem;font-style:italic;}


/* The homepage shares the document scroll with the navigation and other pages. */
body:has(#page-home.active) {
  overflow-x: clip;
  overflow-y: visible;
}
/* Cacher le footer quand on est sur la home (sinon il flotte sous la navbar) */
body:has(#page-home.active) .site-footer,
body:has(#page-home.active) .footer-wrap {
  display: none;
}
/* Bande "Powered by" épinglée en bas — visible uniquement sur la home */
.home-powered-band { display: none; }
body:has(#page-home.active) .home-powered-band { display: flex; }
/* Footer complet : la copie interne à la home reste visible */
body:has(#page-home.active) .home-footer { display: block !important; }
#page-home.active {
  position: relative;
  height: auto;
  padding-top: 64px !important;
  margin-top: 0 !important;
  overflow: visible;
}
#page-home.active > section {
  min-height: 0 !important;
  height: auto !important;
  box-sizing: border-box !important;
  max-height: none !important;
}

/* ═══════ CINEMATIC HERO (style Notosan) ═══════ */
/* Mot-clé géant qui sert de toile de fond derrière le contenu */
.cinematic-keyword {
  position: absolute;
  font-family: var(--font-head);
  font-weight: 900;
  letter-spacing: -0.05em;
  line-height: 0.85;
  pointer-events: none;
  z-index: 1;
  white-space: nowrap;
  user-select: none;
  -webkit-user-select: none;
}
.cinematic-scene {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}

/* ───────── Hero3 — fond photo route de montagne ───────── */
#hero3 {
  background-position: center bottom !important;
  background-size: 100% auto !important;
  background-repeat: no-repeat !important;
  background-color: #0a0d12 !important;
}
#hero3 {
  /* background-image déplacé sur .hero3-road-layer */
  border-bottom-left-radius: 140px;
  border-bottom-right-radius: 140px;
  overflow: hidden;
  box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 10px 24px -14px rgba(10,37,64,0.16);
}
#hero3 .hero3-road-layer {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: none;
  background-position: center bottom;
  background-size: 100% auto;
  background-repeat: no-repeat;
}
/* Masque la scène SVG cinématique : la photo la remplace */
#hero3 .cinematic-scene { display: none !important; }
#hero3::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  /* Voile lisibilité : assombri en bas/gauche où le texte se trouve, plus léger en haut */
  background:
    linear-gradient(180deg, rgba(8,12,20,0.15) 0%, rgba(8,12,20,0.45) 55%, rgba(5,8,14,0.78) 100%),
    linear-gradient(90deg, rgba(5,8,14,0.55) 0%, rgba(5,8,14,0.20) 45%, rgba(5,8,14,0.05) 100%);
}
#hero3::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
  background: radial-gradient(ellipse 130% 90% at 50% 50%, transparent 50%, rgba(0,0,0,0.45) 100%);
}
#hero3 .cinematic-keyword { z-index: 1; }

/* Jonction Hero 3 → Hero 4 : l'ombre suit l'arrondi via box-shadow de #hero3 */
#hero4 { position: relative; margin-top: -140px; padding-top: calc(5rem + 140px) !important; z-index: 0; }
.cinematic-scene svg {
  width: 100%;
  height: 100%;
  display: block;
}
/* Voile global au-dessus de la scène, sous le contenu */
.cinematic-veil {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
}

/* Apparition progressive du keyword géant */
@keyframes keywordAppear {
  0%   { opacity: 0; transform: translateY(40px) scale(0.95); letter-spacing: -0.02em; }
  100% { opacity: 1; transform: none; letter-spacing: -0.05em; }
}
.cinematic-keyword.is-visible {
  animation: keywordAppear 1.6s cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* Layers parallax dans la scène (chacun bouge à sa propre vitesse) */
.parallax-layer {
  position: absolute;
  inset: 0;
  will-change: transform;
}

/* Particules flottantes (lucioles / feuilles) pour intégrer la vidéo */
.floating-particle {
  position: absolute;
  width: 5px;
  height: 5px;
  background: #a7c957;
  border-radius: 50%;
  box-shadow: 0 0 14px currentColor, 0 0 6px #fff;
  opacity: 0.6;
  animation: floatParticle 9s ease-in-out infinite;
}
@keyframes floatParticle {
  0%, 100% {
    transform: translate(0, 0);
    opacity: 0.4;
  }
  25% {
    transform: translate(15px, -25px);
    opacity: 0.9;
  }
  50% {
    transform: translate(-10px, -45px);
    opacity: 1;
  }
  75% {
    transform: translate(20px, -25px);
    opacity: 0.7;
  }
}

/* Hero 4 : vidéo positionnée en bas-gauche, le reste du paysage généré autour */
.hero4-video-frame {
  position: absolute;
  /* Zone vidéo en bas-gauche (la "fenêtre" qui montre le mobil-home) */
  left: 0;
  bottom: 0;
  width: 55%;
  height: 65%;
  z-index: 4;
  overflow: hidden;
}
.hero4-video-frame video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  /* contain pour ne rien couper de la vidéo originale */
  object-fit: cover;
  object-position: center bottom;
  display: block;
  filter: brightness(0.98) saturate(0.95);
}

/* Ombre portée du mobil-home sur le sol */
.hero4-shadow {
  display: none;
}

/* ═══════ APPARITIONS AU SCROLL (HOME) ═══════ */
/* Système réutilisable : ajouter .scroll-reveal-X et un observer JS ajoute .is-visible */

/* Base : invisible, prêt à être animé */
.scroll-reveal,
.scroll-reveal-up,
.scroll-reveal-left,
.scroll-reveal-right,
.scroll-reveal-scale,
.scroll-reveal-fade {
  opacity: 0;
  will-change: opacity, transform;
}

/* États initiaux selon le type — utilisés QUAND .is-visible n'est PAS présent */
.scroll-reveal-up      { transform: translateY(60px); }
.scroll-reveal-left    { transform: translateX(-60px); }
.scroll-reveal-right   { transform: translateX(60px); }
.scroll-reveal-scale   { transform: scale(0.92); }
.scroll-reveal-fade    { transform: none; filter: blur(8px); }

/* Animations d'entrée — se rejouent à chaque ajout de la classe is-visible */
@keyframes srRevealUp {
  from { opacity: 0; transform: translateY(60px); }
  to   { opacity: 1; transform: none; }
}
@keyframes srRevealLeft {
  from { opacity: 0; transform: translateX(-60px); }
  to   { opacity: 1; transform: none; }
}
@keyframes srRevealRight {
  from { opacity: 0; transform: translateX(60px); }
  to   { opacity: 1; transform: none; }
}
@keyframes srRevealScale {
  from { opacity: 0; transform: scale(0.92); }
  to   { opacity: 1; transform: none; }
}
@keyframes srRevealFade {
  from { opacity: 0; filter: blur(8px); }
  to   { opacity: 1; filter: none; }
}
@keyframes srReveal {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.scroll-reveal.is-visible       { animation: srReveal       1s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
.scroll-reveal-up.is-visible    { animation: srRevealUp     1s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
.scroll-reveal-left.is-visible  { animation: srRevealLeft   1s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
.scroll-reveal-right.is-visible { animation: srRevealRight  1s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
.scroll-reveal-scale.is-visible { animation: srRevealScale  1s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
.scroll-reveal-fade.is-visible  { animation: srRevealFade   1s cubic-bezier(0.22, 1, 0.36, 1) forwards; }

/* États initiaux selon le type */
.scroll-reveal-up      { transform: translateY(60px); }
.scroll-reveal-left    { transform: translateX(-60px); }
.scroll-reveal-right   { transform: translateX(60px); }
.scroll-reveal-scale   { transform: scale(0.92); }
.scroll-reveal-fade    { transform: none; filter: blur(8px); }

/* Stagger : enfants qui apparaissent en cascade */
.scroll-stagger > * {
  opacity: 0;
  transform: translateY(30px);
  will-change: opacity, transform;
}
@keyframes srStaggerItem {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: none; }
}
.scroll-stagger.is-visible > * {
  animation: srStaggerItem 0.8s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
.scroll-stagger.is-visible > *:nth-child(1) { animation-delay: 0.05s; }
.scroll-stagger.is-visible > *:nth-child(2) { animation-delay: 0.18s; }
.scroll-stagger.is-visible > *:nth-child(3) { animation-delay: 0.31s; }
.scroll-stagger.is-visible > *:nth-child(4) { animation-delay: 0.44s; }
.scroll-stagger.is-visible > *:nth-child(5) { animation-delay: 0.57s; }
.scroll-stagger.is-visible > *:nth-child(6) { animation-delay: 0.70s; }

/* Délais utilitaires pour éléments individuels */
.delay-100.is-visible { animation-delay: 0.1s; }
.delay-200.is-visible { animation-delay: 0.2s; }
.delay-300.is-visible { animation-delay: 0.3s; }
.delay-400.is-visible { animation-delay: 0.4s; }
.delay-500.is-visible { animation-delay: 0.5s; }
.delay-600.is-visible { animation-delay: 0.6s; }

/* Parallax doux sur les backgrounds */
.scroll-parallax {
  will-change: transform;
  transition: transform 0.1s linear;
}

/* Marqueur indicateur de scroll en bas du Hero 1 (incite à scroller) */
.scroll-hint {
  position: absolute;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .4rem;
  color: rgba(255,255,255,0.55);
  font-size: .7rem;
  font-family: var(--font-mono);
  letter-spacing: .15em;
  text-transform: uppercase;
  font-weight: 700;
  pointer-events: none;
  animation: scrollHintPulse 2.5s ease-in-out infinite;
}
.scroll-hint::after {
  content: '';
  width: 1px;
  height: 30px;
  background: linear-gradient(180deg, rgba(255,255,255,0.55) 0%, transparent 100%);
  animation: scrollHintLine 2s ease-in-out infinite;
}
@keyframes scrollHintPulse {
  0%, 100% { opacity: 0.55; transform: translateX(-50%) translateY(0); }
  50%      { opacity: 1; transform: translateX(-50%) translateY(6px); }
}
@keyframes scrollHintLine {
  0% { transform: scaleY(0); transform-origin: top; }
  50% { transform: scaleY(1); transform-origin: top; }
  51% { transform: scaleY(1); transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; }
}

/* ═══════ CARROUSEL MOCKUP HERO 1 ═══════ */
.mockup-carousel {
  position: relative;
  width: 100%;
  height: 420px;
  background: linear-gradient(180deg, #0f1420 0%, #0b0f1a 100%);
  overflow: hidden;
}
.mockup-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity .6s cubic-bezier(0.4,0,0.2,1);
  pointer-events: none;
  display: flex;
  flex-direction: column;
}
.mockup-slide.mockup-slide-active {
  opacity: 1;
  pointer-events: auto;
}
.mockup-slide-inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.mockup-dots {
  display: flex;
  justify-content: center;
  gap: 6px;
  padding: 10px 0 14px;
  background: #0b0f1a;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.mockup-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255,255,255,0.2);
  transition: all .3s ease;
  cursor: pointer;
}
.mockup-dot.mockup-dot-active {
  background: #2563eb;
  width: 20px;
  border-radius: 3px;
  box-shadow: 0 0 10px rgba(37,99,235,0.5);
}
.mockup-dot:hover {
  background: rgba(255,255,255,0.4);
}

/* Marker pulsation + overrides Leaflet */
@keyframes mtPulse {
  0%   { transform: scale(1); opacity: 0.8; }
  100% { transform: scale(2.2); opacity: 0; }
}
.mobitrack-city-marker { border: none !important; background: transparent !important; }
.leaflet-popup-content-wrapper { background: #fff !important; border-radius: 6px !important; }
.leaflet-popup-tip { background: #fff !important; }
.leaflet-container { background: #1e3a5f !important; font-family: 'Segoe UI', sans-serif !important; }
.leaflet-control-attribution { font-size: 10px !important; background: rgba(255,255,255,0.8) !important; }

/* Sélecteur de style de tuiles */
.tile-style-btn { color: rgba(255,255,255,0.55); }
.tile-style-btn:hover { background: rgba(255,255,255,0.08) !important; color: rgba(255,255,255,0.9); }
.tile-style-btn.tile-style-active { background: rgba(37,99,235,0.2) !important; color: #93c5fd !important; box-shadow: inset 0 0 0 1px rgba(37,99,235,0.35); }

/* Pendant l'animation de zoom, on désactive tous les effets coûteux pour éviter les freezes */
.france-glass-case.animating {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  border-color: rgba(255,255,255,0.08) !important;
}
.france-glass-case.animating::before,
.france-glass-case.animating > div:first-of-type,
.france-glass-case.animating > div:nth-of-type(2) {
  display: none !important; /* cacher le reflet et le halo pendant l'anim */
}

/* ═══════ BALAYAGE NUMÉRIQUE ═══════ */
@keyframes scanLineMove {
  0%   { top: -10%; opacity: 0; }
  10%  { opacity: 1; }
  90%  { opacity: 1; }
  100% { top: 110%; opacity: 0; }
}
@keyframes scanGridFlash {
  0%, 100% { opacity: 0.15; }
  50%      { opacity: 0.3; }
}
@keyframes scanStatusGlow {
  0%, 100% { box-shadow: 0 0 20px rgba(37,99,235,0.3), inset 0 0 0 1px rgba(37,99,235,0.4); }
  50%      { box-shadow: 0 0 35px rgba(37,99,235,0.5), inset 0 0 0 1px rgba(37,99,235,0.7); }
}
@keyframes scanDotBlink {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0.3; }
}
@keyframes scanNoise {
  0%   { transform: translate(0, 0); }
  10%  { transform: translate(-2%, -1%); }
  20%  { transform: translate(1%, 2%); }
  30%  { transform: translate(-1%, 1%); }
  40%  { transform: translate(2%, -2%); }
  50%  { transform: translate(-2%, 1%); }
  60%  { transform: translate(1%, -1%); }
  70%  { transform: translate(-1%, 2%); }
  80%  { transform: translate(2%, 1%); }
  90%  { transform: translate(-2%, -1%); }
  100% { transform: translate(0, 0); }
}

/* Grille numérique de fond (lignes horizontales + verticales très fines) */
.scan-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(90deg, rgba(37,99,235,0.12) 1px, transparent 1px),
    linear-gradient(180deg, rgba(37,99,235,0.12) 1px, transparent 1px);
  background-size: 30px 30px;
  animation: scanGridFlash 1.2s ease-in-out infinite;
  pointer-events: none;
}

/* Ligne lumineuse horizontale qui descend */
.scan-line {
  position: absolute;
  left: -5%;
  right: -5%;
  top: -10%;
  height: 3px;
  background: linear-gradient(90deg, transparent 0%, #2563eb 20%, #60a5fa 50%, #2563eb 80%, transparent 100%);
  box-shadow:0 1px 2px rgba(10,37,64,0.06), 0 10px 24px -14px rgba(10,37,64,0.16);
  animation: scanLineMove 2.2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
  pointer-events: none;
}
.scan-line::before {
  content: '';
  position: absolute;
  inset: -100px 0 0 0;
  background: linear-gradient(180deg, transparent 0%, rgba(37,99,235,0.12) 100%);
  pointer-events: none;
}

/* Bruit numérique (petits points qui bougent) */
.scan-noise {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(96,165,250,0.3) 1px, transparent 2px),
    radial-gradient(circle at 70% 60%, rgba(96,165,250,0.25) 1px, transparent 2px),
    radial-gradient(circle at 45% 80%, rgba(96,165,250,0.3) 1px, transparent 2px),
    radial-gradient(circle at 85% 25%, rgba(96,165,250,0.2) 1px, transparent 2px),
    radial-gradient(circle at 10% 70%, rgba(96,165,250,0.28) 1px, transparent 2px);
  background-size: 150px 150px, 200px 200px, 180px 180px, 220px 220px, 170px 170px;
  animation: scanNoise 0.3s steps(10) infinite;
  pointer-events: none;
  opacity: 0.6;
}

/* Status box en haut centrée */
.scan-status {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
  pointer-events: none;
}
.scan-status-inner {
  display: flex;
  align-items: center;
  gap: .7rem;
  padding: .8rem 1.4rem;
  background: rgba(15, 20, 32, 0.9);
  border: 1px solid rgba(37,99,235,0.4);
  border-radius: 6px;
  font-family: 'Courier New', 'Courier', monospace;
  font-size: .85rem;
  font-weight: 700;
  color: #60a5fa;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  animation: scanStatusGlow 1s ease-in-out infinite;
  white-space: nowrap;
}
.scan-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #2563eb;
  box-shadow: 0 0 12px #2563eb;
  animation: scanDotBlink 0.8s ease-in-out infinite;
}
.scan-text {
  color: #e2e8f0;
}
/* La nav doit rester au-dessus de Leaflet (z-index:999999), l'overlay recherche est à 9998, la map Leaflet intérieure est à 400-999 */

/* ═══════ FOOTER ═══════ */
.site-footer {
  background: #0d0a08;
  border-top: 1px solid rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.6);
  font-family: var(--font-body);
  position: relative;
  z-index: 5;
}
.footer-inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 4rem 2rem 1.5rem;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1.2fr;
  gap: 3rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
@media (max-width: 900px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
}
@media (max-width: 560px) {
  .footer-grid { grid-template-columns: 1fr; }
}
.footer-brand-col { display: flex; flex-direction: column; gap: 1.2rem; }
.footer-logo-block {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}
.footer-logo-mark {
  width: 28px; height: 28px;
  background: var(--accent);
  border-radius: 6px;
  position: relative;
  display: inline-block;
}
.footer-logo-mark::after {
  content: '';
  position: absolute;
  inset: 7px;
  border: 2px solid #fff;
  border-radius: 2px;
}
.footer-logo-text {
  font-family: var(--font-head);
  font-weight: 900;
  font-size: 1.35rem;
  color: #fff;
  letter-spacing: -0.05em;
  line-height: 1;
}
.footer-pitch {
  font-size: 0.88rem;
  line-height: 1.6;
  color: rgba(255,255,255,0.55);
  margin: 0;
  max-width: 380px;
}
.footer-socials {
  display: flex;
  gap: 0.6rem;
  margin-top: 0.5rem;
}
.footer-social {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px; height: 36px;
  border-radius: 6px;
  background: rgba(255,255,255,0.05);
  color: rgba(255,255,255,0.6);
  transition: all 0.2s;
  cursor: pointer;
  text-decoration: none;
}
.footer-social:hover {
  background: var(--accent);
  color: #fff;
  transform: translateY(-2px);
}
.footer-col { display: flex; flex-direction: column; gap: 0.7rem; }
.footer-col-title {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.5rem;
}
.footer-link {
  font-size: 0.86rem;
  color: rgba(255,255,255,0.55);
  cursor: pointer;
  transition: color 0.2s;
  text-decoration: none;
  line-height: 1.5;
  display: inline-block;
}
.footer-link:hover {
  color: var(--accent);
}
.footer-contact-block {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 1rem;
  padding: 1.5rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.footer-copy {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  color: rgba(255,255,255,0.4);
  line-height: 1.7;
}
.footer-meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.78rem;
}
.footer-link-meta { font-size: 0.78rem; }
.footer-sep { color: rgba(255,255,255,0.25); }
.footer-disclaimer {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.35);
  line-height: 1.7;
  padding: 1.2rem 0 0;
  max-width: 1200px;
}
.footer-disclaimer strong {
  color: rgba(255,255,255,0.55);
  font-weight: 600;
}


/* Home hero responsive (porté du 55) */
@media(max-width:860px){
  #hero1 { flex-direction:column !important; }
  .hero-left { flex:none !important; max-width:100% !important; padding:8rem 1.5rem 3rem !important; }
  .hero-left h1 br { display:none; }
  .hero-left > div[style*="grid-template-columns"] { grid-template-columns:1fr !important; }
  .hero-right { flex:none !important; max-width:100% !important; position:relative !important; height:50vh !important; }
  .hero-right video { position:absolute !important; }
}

/* Liquid glass — cartes catégorie recherche (porté du 55) */
#page-recherche .annonce-cat-btn{ position:relative !important; overflow:hidden !important;
  box-shadow: 0 1px 0 0 rgba(255,255,255,0.35) inset, 0 -1px 0 0 rgba(255,255,255,0.08) inset,
    1px 0 0 0 rgba(255,255,255,0.12) inset, -1px 0 0 0 rgba(255,255,255,0.12) inset,
    0 10px 30px -5px rgba(0,0,0,0.18), 0 20px 60px -10px rgba(0,0,0,0.12) !important; }
#page-recherche .annonce-cat-btn::after{ content:''; position:absolute; inset:-4px; border-radius:inherit;
  backdrop-filter:blur(1.5px) saturate(180%) brightness(1.03);
  -webkit-backdrop-filter:blur(1.5px) saturate(180%) brightness(1.03);
  filter:url(#liquidGlassRefract); transform:scale(1.04);
  background:rgba(255,255,255,0.04); z-index:0; pointer-events:none; }
#page-recherche .annonce-cat-btn > *{ position:relative; z-index:1; }

/* ====== Vue recherche : liquid glass (porté du 55) ====== */
#page-recherche button[onclick="backToCategories()"] + span { color: rgba(0,0,0,0.2) !important; }
/* Filter panel on cream: liquid glass like france-glass-case */
/* Garantir que le panneau annonces (recherche) reçoit bien les clics */
#searchAnnoncesPanel{ pointer-events:auto !important; position:relative !important; z-index:9500 !important; }
#searchAnnoncesList{ pointer-events:auto !important; position:relative !important; z-index:9500 !important; }
#searchAnnoncesList > button{ pointer-events:auto !important; position:relative !important; z-index:9501 !important; cursor:pointer !important; }
#searchAnnoncesList > button *{ pointer-events:none; }