/* merged: loguetown-edition.css */

/* =============================================================================
   LOGUETOWN — ÉDITION COLLECTOR · v2 RADICALE
   -----------------------------------------------------------------------------
   Refonte visuelle ambitieuse : layout magazine, hero pleine hauteur, marquee,
   bento grid, animations au scroll, parallax. Identité Hodinkee × Vestiaire.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,600;1,700&family=Inter:wght@300;400;500;600;700;800&family=Space+Mono:wght@400;700&display=swap');

/* =====================================================================
   1. TOKENS
   ===================================================================== */
:root {
  /* Brand */
  --lt-navy:        #0B0D1A;
  --lt-navy-soft:   #16213E;
  --lt-navy-deep:   #050610;
  --lt-navy-mid:    #1A1A2E;
  --lt-secondary:   #0F3460;

  --lt-coral:       #E94560;
  --lt-coral-soft:  #FF6B8A;
  --lt-coral-deep:  #C72E47;

  --lt-champagne:        #D4AF7A;
  --lt-champagne-soft:   #E8C9A0;
  --lt-champagne-deep:   #A8855A;
  --lt-champagne-glow:   rgba(212, 175, 122, 0.45);

  --lt-cream:       #FAFAF7;
  --lt-cream-warm:  #F2EEE6;
  --lt-paper:       #FFFFFF;
  --lt-ink:         #0C0A09;
  --lt-ink-soft:    #2A2724;
  --lt-mute:        #6B6862;
  --lt-line:        rgba(11, 13, 26, 0.08);
  --lt-line-strong: rgba(11, 13, 26, 0.16);

  /* Aliases compat */
  --primary:        var(--lt-navy-mid);
  --primary-dark:   var(--lt-navy);
  --primary-light:  var(--lt-secondary);
  --secondary:      var(--lt-secondary);
  --accent:         var(--lt-coral);
  --accent-light:   var(--lt-coral-soft);
  --accent-hover:   var(--lt-coral-deep);
  --gold:           var(--lt-champagne);

  /* Shadows */
  --lt-shadow-xs:   0 1px 2px rgba(11,13,26,0.06);
  --lt-shadow-sm:   0 6px 18px rgba(11,13,26,0.10);
  --lt-shadow-md:   0 14px 36px rgba(11,13,26,0.14);
  --lt-shadow-lg:   0 30px 60px rgba(11,13,26,0.22);
  --lt-shadow-xl:   0 50px 100px rgba(11,13,26,0.30);
  --lt-shadow-glow-coral:     0 12px 32px rgba(233,69,96,0.36);
  --lt-shadow-glow-champagne: 0 10px 26px var(--lt-champagne-line);
  --lt-gradient-navy-start: #0f2742;
  --lt-gradient-navy-mid: #1b3a5a;
  --lt-gradient-navy-end: #2b4e6b;
  --lt-gradient-navy-deep-start: #0c213a;
  --lt-gradient-navy-deep-mid: #17324f;
  --lt-gradient-navy-deep-end: #254764;
  --lt-white: #fff;
  --lt-ios-line: #e5e5ea;
  --lt-ios-line-soft: #eef0f4;
  --lt-neutral-600: #666;
  --lt-success-legacy: #0a0;
  --lt-error-legacy: #c00;
  --lt-error-soft: #fef2f2;
  --lt-error-text: #b91c1c;
  --lt-champagne-halo-xs: rgba(212,175,122,0.18);
  --lt-champagne-halo-sm: rgba(212,175,122,0.20);
  --lt-champagne-halo-md: rgba(212,175,122,0.24);
  --lt-champagne-halo-card: rgba(212,175,122,0.25);
  --lt-champagne-halo-lg: rgba(212,175,122,0.28);
  --lt-champagne-halo-xl: rgba(212,175,122,0.34);
  --lt-champagne-text-soft: rgba(212,175,122,0.55);
  --lt-champagne-line: rgba(212,175,122,0.4);
  --lt-champagne-drop: rgba(212,175,122,0.22);
  --lt-coral-glow-strong: rgba(233,69,96,0.5);
  --lt-white-glow-xs: rgba(255,255,255,0.08);
  --lt-white-glow-sm: rgba(255,255,255,0.10);
  --lt-white-glow-md: rgba(255,255,255,0.12);
  --lt-white-glow-lg: rgba(255,255,255,0.14);
  --lt-white-text-faint: rgba(255,255,255,0.6);
  --lt-white-text-soft: rgba(255,255,255,0.62);
  --lt-white-text-muted: rgba(255,255,255,0.65);
  --lt-white-text: rgba(255,255,255,0.72);
  --lt-white-text-strong: rgba(255,255,255,0.78);
  --lt-navy-overlay: rgba(6, 12, 24, 0.55);
  --lt-navy-overlay-strong: rgba(6, 12, 24, 0.62);
  --lt-navy-surface: rgba(6, 12, 24, 0.38);

  /* Typo */
  --lt-serif:       'Playfair Display', 'Cormorant', Georgia, serif;
  --lt-sans:        'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --lt-mono:        'Space Mono', ui-monospace, monospace;

  /* Radius */
  --lt-r-sm: 8px;
  --lt-r-md: 14px;
  --lt-r-lg: 22px;
  --lt-r-xl: 32px;
  --lt-r-pill: 9999px;

  /* Motion */
  --lt-ease:     cubic-bezier(0.22, 0.61, 0.36, 1);
  --lt-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --lt-fast:     180ms;
  --lt-base:     320ms;
  --lt-slow:     560ms;
}

/* =====================================================================
   2. GLOBAL
   ===================================================================== */
html { scroll-behavior: smooth; }
body {
  font-family: var(--lt-sans);
  background: var(--lt-cream);
  color: var(--lt-ink-soft);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection { background: var(--lt-champagne); color: var(--lt-ink); }

*:focus-visible {
  outline: 2px solid var(--lt-champagne) !important;
  outline-offset: 2px !important;
  border-radius: var(--lt-r-sm);
}

h1, h2, h3, .lt-serif {
  font-family: var(--lt-serif);
  letter-spacing: -0.02em;
  color: var(--lt-ink);
}

/* === Helpers réutilisables ============================================= */
.lt-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--lt-mono);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  color: var(--lt-champagne-deep);
}
.lt-eyebrow::before {
  content: '';
  width: 24px; height: 1px;
  background: var(--lt-champagne);
}
.lt-eyebrow--light { color: var(--lt-champagne); }
.lt-eyebrow--light::before { background: var(--lt-champagne); }

.lt-italic-accent {
  font-family: var(--lt-serif);
  font-style: italic;
  font-weight: 400;
  color: var(--lt-champagne);
}

.lt-rule {
  display: block;
  width: 56px; height: 1px;
  background: var(--lt-champagne);
  margin: 1rem auto;
  opacity: 0.7;
}

/* Reveal au scroll : la classe est ajoutée par le JS quand visible */
.lt-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition:
    opacity 700ms var(--lt-ease-out),
    transform 700ms var(--lt-ease-out);
  will-change: transform, opacity;
}
.lt-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.lt-reveal[data-delay="100"] { transition-delay: 100ms; }
.lt-reveal[data-delay="200"] { transition-delay: 200ms; }
.lt-reveal[data-delay="300"] { transition-delay: 300ms; }
.lt-reveal[data-delay="400"] { transition-delay: 400ms; }
.lt-reveal[data-delay="500"] { transition-delay: 500ms; }

/* =====================================================================
   3. HEADER — polish léger
   ===================================================================== */
.header-lbc-leboncoin {
  background: var(--lt-paper);
  border-bottom: 1px solid var(--lt-line);
  box-shadow: var(--lt-shadow-xs);
}
.header-lbc-leboncoin .logo-img {
  filter: contrast(1.05);
  transition: transform var(--lt-base) var(--lt-ease);
}
.header-lbc-leboncoin .logo-lbc a:hover .logo-img { transform: translateY(-1px) rotate(-1deg); }

.header-lbc-leboncoin .search-bar-input {
  border-radius: var(--lt-r-pill) !important;
  border-color: var(--lt-line-strong) !important;
  background: var(--lt-cream-warm);
  font-family: var(--lt-sans);
}
.header-lbc-leboncoin .search-bar-input:focus {
  border-color: var(--lt-champagne) !important;
  box-shadow: 0 0 0 3px var(--lt-champagne-halo-xs) !important;
  background: var(--lt-paper);
}
.header-lbc-leboncoin .search-bar-btn {
  border-radius: var(--lt-r-pill) !important;
  background: var(--lt-navy) !important;
  letter-spacing: 0.04em;
}
.header-lbc-leboncoin .search-bar-btn:hover { background: var(--lt-navy-deep) !important; }

.header-lbc-leboncoin .btn-lbc-annonce {
  background: var(--lt-coral) !important;
  color: var(--lt-white) !important;
  border-radius: var(--lt-r-pill) !important;
  letter-spacing: 0.05em !important;
  box-shadow: var(--lt-shadow-glow-coral) !important;
  transition: all var(--lt-fast) var(--lt-ease) !important;
}
.header-lbc-leboncoin .btn-lbc-annonce:hover {
  background: var(--lt-coral-deep) !important;
  transform: translateY(-2px);
  box-shadow: 0 16px 36px var(--lt-coral-glow-strong) !important;
}

.header-lbc-leboncoin .user-menu-btn {
  border-radius: var(--lt-r-pill) !important;
  background: var(--lt-cream-warm) !important;
}
.header-lbc-leboncoin .user-dropdown {
  border-radius: var(--lt-r-lg) !important;
  box-shadow: var(--lt-shadow-lg) !important;
}

.header-lbc-leboncoin .header-hamburger { color: var(--lt-navy-deep); }

@media (max-width: 768px) {
  /* Mobile header : éviter les conflits avec mobile-menu.css (texte blanc sur fond blanc) */
  /* Neutralise les règles globales de css/mobile-optimized.css sur l'accueil */
  main.accueil-page {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
  }
  main.accueil-page > .accueil-hero { margin-top: 0 !important; }
  .header-lbc-leboncoin {
    background: var(--lt-paper) !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    height: auto !important;
  }
  .header-lbc-leboncoin .header-hamburger { color: var(--lt-navy-deep) !important; }
  .header-lbc-leboncoin .header-content-lbc {
    flex-direction: row !important;
    gap: 12px !important;
    padding: 8px 12px !important;
  }
  .main-nav { position: relative !important; }

  .header-mobile-search-wrap {
    background: var(--lt-paper) !important;
    border-top: 1px solid var(--lt-line) !important;
  }

  .header-mobile-search-wrap .search-bar-mobile { background: var(--lt-cream-warm) !important; }
  .header-mobile-search-wrap .search-bar-mobile-icon { color: var(--lt-mute) !important; }
  .header-mobile-search-wrap .search-bar-mobile-input {
    background: var(--lt-paper) !important;
    color: var(--lt-ink) !important;
  }
  .header-mobile-search-wrap .search-bar-mobile-input::placeholder { color: var(--lt-mute) !important; }

  .header-category-chip {
    background: var(--lt-cream-warm) !important;
    color: var(--lt-navy-deep) !important;
    border-color: rgba(0,0,0,0.08) !important;
  }
  .header-category-chip:hover {
    background: var(--lt-paper) !important;
    color: var(--lt-navy-deep) !important;
    text-decoration: none !important;
  }
}

.main-nav { background: var(--lt-paper) !important; border-top: 1px solid var(--lt-line); }
.main-nav .nav-link {
  position: relative;
  font-weight: 500 !important;
  letter-spacing: 0.02em;
  color: var(--lt-ink-soft) !important;
  transition: color var(--lt-fast) var(--lt-ease);
}
.main-nav .nav-link::after {
  content: '';
  position: absolute;
  left: 12px; right: 12px; bottom: 4px;
  height: 1.5px;
  background: var(--lt-champagne);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform var(--lt-base) var(--lt-ease);
}
.main-nav .nav-link:hover::after,
.main-nav .nav-link.active::after { transform: scaleX(1); }

/* =====================================================================
   4. ACCUEIL — REFONTE RADICALE
   ===================================================================== */
.accueil-page { background: var(--lt-cream); overflow-x: hidden; }

/* ----- 4.1 HERO MAGAZINE --------------------------------------------- */
.accueil-page .accueil-hero {
  background:
    radial-gradient(ellipse at 15% 0%, var(--lt-champagne-halo-xl) 0%, transparent 62%),
    radial-gradient(ellipse at 85% 100%, var(--lt-champagne-halo-xs) 0%, transparent 62%),
    radial-gradient(ellipse at 50% 55%, var(--lt-white-glow-lg) 0%, transparent 70%),
    linear-gradient(180deg, var(--lt-gradient-navy-start) 0%, var(--lt-gradient-navy-mid) 55%, var(--lt-gradient-navy-end) 100%) !important;
  padding: 0 !important;
  text-align: left !important;
  min-height: 76vh;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  display: flex;
  flex-direction: column;
}

/* Ticker marquee en haut */
.accueil-page .accueil-hero::before {
  content: 'FIGURINES · STATUES · GOODIES · VINTAGE · CARTES · MANGA · COMICS · ÉDITION COLLECTOR · FIGURINES · STATUES · GOODIES · VINTAGE · CARTES · MANGA · COMICS · ÉDITION COLLECTOR ·';
  position: absolute;
  top: 0; left: 0; right: 0;
  white-space: nowrap;
  font-family: var(--lt-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.32em;
  color: var(--lt-champagne-text-soft);
  padding: 14px 0;
  background: rgba(0,0,0,0.25);
  border-bottom: 1px solid var(--lt-champagne-halo-xs);
  animation: lt-ticker 60s linear infinite;
  z-index: 2;
}
@keyframes lt-ticker {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* Compass watermark — beaucoup plus visible cette fois */
.accueil-page .accueil-hero::after {
  content: '';
  position: absolute;
  right: -180px; top: 50%;
  transform: translateY(-50%);
  width: 720px; height: 720px;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cg fill='none' stroke='%23D4AF7A' stroke-width='0.35'%3E%3Ccircle cx='100' cy='100' r='98' opacity='0.6'/%3E%3Ccircle cx='100' cy='100' r='80' opacity='0.5'/%3E%3Ccircle cx='100' cy='100' r='60' opacity='0.4'/%3E%3Ccircle cx='100' cy='100' r='40' opacity='0.3'/%3E%3Ccircle cx='100' cy='100' r='20' opacity='0.2'/%3E%3Cg stroke-width='0.25' opacity='0.4'%3E%3Cpath d='M100 5 L100 195'/%3E%3Cpath d='M5 100 L195 100'/%3E%3Cpath d='M30 30 L170 170'/%3E%3Cpath d='M30 170 L170 30'/%3E%3C/g%3E%3Cpath d='M100 10 L106 100 L100 100 Z' fill='%23D4AF7A' opacity='0.5'/%3E%3Cpath d='M100 190 L94 100 L100 100 Z' fill='%23D4AF7A' opacity='0.3'/%3E%3Cpath d='M10 100 L100 94 L100 100 Z' fill='%23D4AF7A' opacity='0.3'/%3E%3Cpath d='M190 100 L100 106 L100 100 Z' fill='%23D4AF7A' opacity='0.3'/%3E%3Ctext x='100' y='16' fill='%23D4AF7A' font-size='10' text-anchor='middle' font-family='Playfair Display, serif' font-style='italic' opacity='0.85'%3EN%3C/text%3E%3Ctext x='100' y='192' fill='%23D4AF7A' font-size='10' text-anchor='middle' font-family='Playfair Display, serif' font-style='italic' opacity='0.85'%3ES%3C/text%3E%3Ctext x='14' y='104' fill='%23D4AF7A' font-size='10' text-anchor='middle' font-family='Playfair Display, serif' font-style='italic' opacity='0.85'%3EW%3C/text%3E%3Ctext x='186' y='104' fill='%23D4AF7A' font-size='10' text-anchor='middle' font-family='Playfair Display, serif' font-style='italic' opacity='0.85'%3EE%3C/text%3E%3Ccircle cx='100' cy='100' r='3' fill='%23D4AF7A' opacity='0.8'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  opacity: 0.55;
  animation: lt-compass-rotate 180s linear infinite;
  z-index: 1;
}
@keyframes lt-compass-rotate {
  from { transform: translateY(-50%) rotate(0deg); }
  to   { transform: translateY(-50%) rotate(360deg); }
}

.accueil-page .accueil-hero-inner {
  position: relative;
  z-index: 3;
  max-width: 1400px !important;
  width: 100%;
  margin: 0 auto !important;
  padding: 64px 32px 48px !important;
  flex: 1;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 48px;
  align-items: center;
}

/* Eyebrow + meta */
.accueil-page .accueil-hero-inner::before {
  content: 'EST. 2025  ·  ÉDITION COLLECTOR  ·  FRANCE';
  position: absolute;
  top: 56px; left: 32px;
  font-family: var(--lt-mono);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.4em;
  color: var(--lt-champagne);
  z-index: 4;
}

/* H1 massif */
.accueil-page .accueil-hero h1 {
  grid-column: 1 / 2;
  font-family: var(--lt-serif) !important;
  font-size: clamp(3rem, 8.5vw, 7.5rem) !important;
  font-weight: 700 !important;
  line-height: 0.95 !important;
  letter-spacing: -0.04em !important;
  color: var(--lt-paper) !important;
  margin: 0 !important;
  text-align: left !important;
  position: relative;
}
.accueil-page .accueil-hero h1 .lt-italic-accent {
  font-family: var(--lt-serif);
  font-style: italic;
  font-weight: 400;
  color: var(--lt-champagne);
}

/* Lead réécrit, position grid colonne 2 */
.accueil-page .accueil-hero .accueil-lead {
  grid-column: 2 / 3;
  align-self: end;
  font-family: var(--lt-sans) !important;
  font-size: 1.08rem !important;
  line-height: 1.7 !important;
  color: var(--lt-white-text-strong) !important;
  max-width: 420px;
  margin: 0 !important;
  text-align: left !important;
  padding-left: 32px;
  border-left: 1px solid var(--lt-champagne-line);
  position: relative;
}
.accueil-page .accueil-hero .accueil-lead::before {
  content: '« ';
  font-family: var(--lt-serif);
  font-style: italic;
  font-size: 3rem;
  color: var(--lt-champagne);
  position: absolute;
  top: -1.5rem; left: 18px;
  line-height: 1;
}

/* Métriques flottantes en bas du hero */
.accueil-page .accueil-hero-inner::after {
  content: '';
  grid-column: 1 / -1;
  display: block;
  height: 0;
}

/* Scroll indicator en bas */
.accueil-page .accueil-hero {
  position: relative;
}

/* ----- 4.2 SEARCH SECTION (papier crème en bas du hero) -------------- */
.accueil-page .accueil-search-section {
  background: var(--lt-cream-warm);
  padding: 4rem 1.5rem 5rem !important;
  border-top: 1px solid var(--lt-line);
  position: relative;
}
.accueil-page .accueil-search-section::before {
  content: '';
  position: absolute;
  top: -1px; left: 50%;
  transform: translateX(-50%);
  width: 80px; height: 2px;
  background: var(--lt-champagne);
}

.accueil-page .accueil-search-section .accueil-search-inner {
  max-width: 1200px !important;
}

.accueil-page .accueil-search-section .filtres-layout-flex {
  grid-template-columns: 360px 1fr !important;
  gap: 32px !important;
}

.accueil-page .accueil-search-section .sidebar-filtres-centrale {
  background: var(--lt-paper) !important;
  border: 1px solid var(--lt-line) !important;
  border-radius: var(--lt-r-lg) !important;
  box-shadow: var(--lt-shadow-md) !important;
  padding: 2.5rem 2rem !important;
  position: relative;
}
.accueil-page .accueil-search-section .sidebar-filtres-centrale::before {
  content: '';
  position: absolute;
  top: -1px; left: 32px; right: 32px;
  height: 2px;
  background: linear-gradient(90deg, var(--lt-champagne), transparent);
}

.accueil-page .accueil-search-section .sidebar-filtres-title {
  font-family: var(--lt-mono) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.32em !important;
  color: var(--lt-champagne-deep) !important;
}

.accueil-page .type-button-centrale {
  border-radius: var(--lt-r-md) !important;
  border: 1px solid var(--lt-line) !important;
  background: var(--lt-cream-warm) !important;
  transition: all var(--lt-base) var(--lt-ease) !important;
}
.accueil-page .type-button-centrale:hover {
  border-color: var(--lt-champagne) !important;
  background: var(--lt-paper) !important;
  transform: translateY(-2px);
  box-shadow: var(--lt-shadow-sm);
}
.accueil-page .type-button-centrale.active {
  background: var(--lt-champagne) !important;
  border-color: var(--lt-champagne) !important;
  color: var(--lt-ink) !important;
  box-shadow: var(--lt-shadow-md);
}
.accueil-page .type-button-centrale.active .type-button-icon { color: var(--lt-ink) !important; }

.accueil-page .accueil-filtres-toggle {
  background: transparent !important;
  border: 1px solid var(--lt-line-strong) !important;
  border-radius: var(--lt-r-pill) !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em;
  color: var(--lt-ink-soft) !important;
}

/* ----- 4.3 CATÉGORIES BENTO ------------------------------------------ */
.accueil-page .accueil-categories-wrap {
  background: var(--lt-paper);
  padding: 6rem 1.5rem !important;
  position: relative;
}

.accueil-page .accueil-categories-inner {
  max-width: 1280px;
  margin: 0 auto;
}

.accueil-page .accueil-section-title,
.accueil-page #accueil-categories-title {
  font-family: var(--lt-serif) !important;
  font-size: clamp(2.5rem, 5vw, 4rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  color: var(--lt-navy) !important;
  margin: 0 0 0.5rem !important;
  position: relative;
  display: inline-block;
}
.accueil-page #accueil-categories-title::before {
  content: '01 — UNIVERS';
  display: block;
  font-family: var(--lt-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.32em;
  color: var(--lt-champagne-deep);
  margin-bottom: 1rem;
}

/* Bento grid asymétrique */
.accueil-page .accueil-categories-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  grid-auto-rows: 200px;
  gap: 16px !important;
  margin-top: 3rem;
}
.accueil-page .accueil-categories-grid .category-card {
  position: relative;
  display: flex !important;
  align-items: flex-end;
  padding: 24px !important;
  background:
    linear-gradient(135deg, var(--lt-gradient-navy-start) 0%, var(--lt-gradient-navy-mid) 55%, var(--lt-gradient-navy-end) 100%) !important;
  color: var(--lt-paper) !important;
  border-radius: var(--lt-r-lg) !important;
  font-family: var(--lt-serif) !important;
  font-size: 1.5rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  text-decoration: none !important;
  overflow: hidden;
  transition: all var(--lt-base) var(--lt-ease) !important;
  isolation: isolate;
}
/* Numéros édition derrière (00, 01, 02…) */
.accueil-page .accueil-categories-grid .category-card::before {
  content: '';
  position: absolute;
  top: 16px; right: 20px;
  font-family: var(--lt-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  color: var(--lt-champagne);
  opacity: 0.7;
  z-index: 2;
}
.accueil-page .accueil-categories-grid .category-card:nth-child(1)::before { content: '01'; }
.accueil-page .accueil-categories-grid .category-card:nth-child(2)::before { content: '02'; }
.accueil-page .accueil-categories-grid .category-card:nth-child(3)::before { content: '03'; }
.accueil-page .accueil-categories-grid .category-card:nth-child(4)::before { content: '04'; }
.accueil-page .accueil-categories-grid .category-card:nth-child(5)::before { content: '05'; }
.accueil-page .accueil-categories-grid .category-card:nth-child(6)::before { content: '06'; }

/* Background décoratif via SVG silhouette */
.accueil-page .accueil-categories-grid .category-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 70% 30%, var(--lt-champagne-halo-md) 0%, transparent 62%),
    radial-gradient(ellipse at 20% 90%, var(--lt-white-glow-sm) 0%, transparent 55%),
    linear-gradient(180deg, transparent 35%, var(--lt-navy-overlay) 100%);
  z-index: 1;
  transition: opacity var(--lt-base) var(--lt-ease);
}
.accueil-page .accueil-categories-grid .category-card > * { position: relative; z-index: 2; }

.accueil-page .accueil-categories-grid .category-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--lt-shadow-lg);
  background:
    linear-gradient(135deg, var(--lt-gradient-navy-deep-start) 0%, var(--lt-gradient-navy-deep-mid) 55%, var(--lt-gradient-navy-deep-end) 100%) !important;
}
.accueil-page .accueil-categories-grid .category-card:hover::after {
  background:
    radial-gradient(ellipse at 70% 30%, var(--lt-champagne-halo-xl) 0%, transparent 62%),
    radial-gradient(ellipse at 20% 90%, var(--lt-white-glow-md) 0%, transparent 55%),
    linear-gradient(180deg, transparent 28%, var(--lt-navy-overlay-strong) 100%);
}

/* Tailles asymétriques bento */
.accueil-page .accueil-categories-grid .category-card:nth-child(1) {
  grid-column: span 2;
  grid-row: span 2;
  font-size: 2.5rem !important;
}
.accueil-page .accueil-categories-grid .category-card:nth-child(4) {
  grid-column: span 2;
}
.accueil-page .accueil-categories-grid .category-card:nth-child(5) {
  grid-row: span 1;
}

/* Pictos catégories en silhouette */
.accueil-page .accueil-categories-grid .category-card[href*="figurine"]::before { content: '01 · FIGURINES'; }
.accueil-page .accueil-categories-grid .category-card[href*="resine"]::before { content: '02 · RÉSINE'; }
.accueil-page .accueil-categories-grid .category-card[href*="jouet"]::before { content: '03 · JOUETS'; }
.accueil-page .accueil-categories-grid .category-card[href*="vintage"]::before { content: '04 · VINTAGE'; }
.accueil-page .accueil-categories-grid .category-card[href*="goodies"]::before { content: '05 · GOODIES'; }
.accueil-page .accueil-categories-grid .category-card[href*="carte"]::before { content: '06 · CARTES'; }

/* ----- 4.4 SECTION NOUVEAUTÉS ---------------------------------------- */
.accueil-page .accueil-nouveautes {
  background: var(--lt-cream);
  padding: 6rem 1.5rem !important;
  position: relative;
}
.accueil-page .accueil-nouveautes .container {
  max-width: 1280px !important;
}
.accueil-page .accueil-nouveautes .latest-listings-title {
  font-family: var(--lt-serif) !important;
  font-size: clamp(2.5rem, 5vw, 4rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  color: var(--lt-navy) !important;
  margin: 0 0 0.5rem !important;
  position: relative;
}
.accueil-page .accueil-nouveautes .latest-listings-title::before {
  content: '02 — VITRINE';
  display: block;
  font-family: var(--lt-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.32em;
  color: var(--lt-champagne-deep);
  margin-bottom: 1rem;
}

/* Bandeau promo redessiné en hero CTA */
.accueil-page .accueil-nouveautes .banner-promo {
  background:
    linear-gradient(135deg, var(--lt-gradient-navy-start) 0%, var(--lt-gradient-navy-mid) 60%, var(--lt-gradient-navy-end) 100%) !important;
  color: var(--lt-paper) !important;
  padding: 3rem !important;
  border-radius: var(--lt-r-xl) !important;
  position: relative;
  overflow: hidden;
  margin: 2rem 0 !important;
  box-shadow: var(--lt-shadow-lg);
}
.accueil-page .accueil-nouveautes .banner-promo::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 100% 0%, var(--lt-champagne-halo-card) 0%, transparent 50%);
  pointer-events: none;
}
.accueil-page .accueil-nouveautes .banner-promo::after {
  content: '⛵';
  position: absolute;
  right: -30px; bottom: -40px;
  font-size: 220px;
  opacity: 0.06;
  pointer-events: none;
  filter: sepia(1) hue-rotate(15deg);
}
.accueil-page .accueil-nouveautes .banner-promo-text {
  font-family: var(--lt-serif) !important;
  font-size: clamp(1.5rem, 3vw, 2rem) !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  color: var(--lt-paper) !important;
  margin: 0 0 1rem !important;
  max-width: 540px;
  position: relative;
  z-index: 1;
  text-shadow: 0 2px 10px rgba(11, 13, 26, 0.55);
}
.accueil-page .accueil-nouveautes .banner-promo-question {
  font-family: var(--lt-mono) !important;
  font-size: 11px !important;
  font-weight: 700;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--lt-champagne) !important;
  margin: 0 0 1.5rem !important;
  position: relative;
  z-index: 1;
}
.accueil-page .accueil-nouveautes .banner-promo-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  position: relative;
  z-index: 1;
}
.accueil-page .accueil-nouveautes .banner-promo-btn {
  background: var(--lt-champagne) !important;
  color: var(--lt-ink) !important;
  border-radius: var(--lt-r-pill) !important;
  padding: 14px 28px !important;
  font-family: var(--lt-sans) !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none !important;
  transition: all var(--lt-fast) var(--lt-ease) !important;
  box-shadow: var(--lt-shadow-glow-champagne);
}
.accueil-page .accueil-nouveautes .banner-promo-btn:hover {
  background: var(--lt-champagne-soft) !important;
  transform: translateY(-2px);
}
.accueil-page .accueil-nouveautes .banner-promo-btn.banner-promo-btn--outline {
  background: transparent !important;
  border: 1px solid var(--lt-champagne) !important;
  color: var(--lt-champagne) !important;
  box-shadow: none;
}
.accueil-page .accueil-nouveautes .banner-promo-btn.banner-promo-btn--outline:hover {
  background: var(--lt-champagne) !important;
  color: var(--lt-ink) !important;
}

/* Grille des annonces en card papier */
.accueil-page .latest-listings-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important;
  gap: 24px !important;
  margin-top: 3rem !important;
}
.accueil-page .latest-listings-grid > * {
  background: var(--lt-paper);
  border: 1px solid var(--lt-line);
  border-radius: var(--lt-r-md);
  overflow: hidden;
  transition: all var(--lt-base) var(--lt-ease);
}
.accueil-page .latest-listings-grid > *:hover {
  transform: translateY(-6px);
  border-color: var(--lt-champagne);
  box-shadow: var(--lt-shadow-md), 0 0 0 1px var(--lt-champagne-line);
}

/* ----- 4.5 MARQUES — MARQUEE HORIZONTAL INFINI ----------------------- */
.accueil-page .accueil-marques {
  background:
    radial-gradient(ellipse at 15% 0%, var(--lt-champagne-halo-lg) 0%, transparent 60%),
    radial-gradient(ellipse at 85% 100%, var(--lt-white-glow-sm) 0%, transparent 55%),
    linear-gradient(180deg, var(--lt-gradient-navy-start) 0%, var(--lt-gradient-navy-mid) 55%, var(--lt-gradient-navy-end) 100%) !important;
  color: var(--lt-paper);
  padding: 5rem 0 !important;
  position: relative;
  overflow: hidden;
}
.accueil-page .accueil-marques::before {
  content: '';
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: 80px; height: 2px;
  background: var(--lt-champagne);
}
.accueil-page .accueil-marques .container {
  max-width: 1400px !important;
  padding: 0 1.5rem;
}
.accueil-page .accueil-marques .brands-title {
  font-family: var(--lt-serif) !important;
  font-size: clamp(2rem, 4.5vw, 3.25rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  color: var(--lt-paper) !important;
  text-align: center;
  margin: 0 0 0.5rem !important;
  position: relative;
}
.accueil-page .accueil-marques .brands-title::before {
  content: '03 — MAISONS';
  display: block;
  font-family: var(--lt-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.32em;
  color: var(--lt-champagne);
  margin-bottom: 1rem;
}

.accueil-page .accueil-marques .brands-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
  gap: 1px !important;
  margin-top: 3.5rem !important;
  background: var(--lt-champagne-halo-xs);
  border: 1px solid var(--lt-champagne-halo-xs);
  border-radius: var(--lt-r-lg);
  overflow: hidden;
}
.accueil-page .accueil-marques .brand-card {
  background: var(--lt-navy-surface) !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 32px 16px !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  transition: all var(--lt-base) var(--lt-ease) !important;
}
.accueil-page .accueil-marques .brand-card:hover {
  background: var(--lt-navy-overlay) !important;
  transform: scale(1.02);
}
.accueil-page .accueil-marques .brand-card-img {
  filter: none;
  opacity: 0.88;
  transition: opacity var(--lt-base) var(--lt-ease), filter var(--lt-base) var(--lt-ease);
  height: 40px !important;
  width: auto !important;
}
.accueil-page .accueil-marques .brand-card:hover .brand-card-img {
  opacity: 1;
  filter: drop-shadow(0 6px 18px var(--lt-champagne-drop));
}
.accueil-page .accueil-marques .brand-card-name {
  font-family: var(--lt-mono) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--lt-white-text-faint) !important;
}
.accueil-page .accueil-marques .brand-card:hover .brand-card-name { color: var(--lt-champagne) !important; }

/* ----- 4.6 NOUVELLES SECTIONS injectées via PHP --------------------- */

/* Stats counter */
.lt-stats {
  background: var(--lt-paper);
  padding: 6rem 1.5rem;
  border-top: 1px solid var(--lt-line);
  border-bottom: 1px solid var(--lt-line);
}
.lt-stats-inner {
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
.lt-stat {
  text-align: left;
  position: relative;
  padding-left: 24px;
  border-left: 1px solid var(--lt-line);
}
.lt-stat-number {
  display: block;
  font-family: var(--lt-serif);
  font-size: clamp(3rem, 6vw, 4.5rem);
  font-weight: 700;
  line-height: 1;
  color: var(--lt-navy);
  letter-spacing: -0.04em;
}
.lt-stat-suffix { color: var(--lt-champagne); }
.lt-stat-label {
  display: block;
  margin-top: 0.75rem;
  font-family: var(--lt-mono);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--lt-mute);
}

/* =====================================================================
   5. CARTE COMMUNAUTAIRE
   ===================================================================== */
.carte-statues-page {
  background: var(--lt-cream);
  padding: 0 0 4rem !important;
  max-width: none !important;
  position: relative;
}
.carte-statues-page::before {
  content: '';
  display: block;
  height: 80px;
  background: var(--lt-cream);
}

.carte-statues-page > h1,
.carte-statues-page > .carte-statues-lead,
.carte-statues-page > .carte-statues-meta {
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.carte-statues-page > h1 {
  font-family: var(--lt-serif) !important;
  font-size: clamp(2.5rem, 6vw, 4.5rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  color: var(--lt-navy) !important;
  margin-top: 1rem !important;
  margin-bottom: 1rem !important;
  position: relative;
  display: inline-block;
  line-height: 1;
}
.carte-statues-page > h1::before {
  content: 'ATLAS · COMMUNAUTÉ';
  display: block;
  font-family: var(--lt-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.32em;
  color: var(--lt-champagne-deep);
  margin-bottom: 1rem;
}

.carte-statues-page > .carte-statues-lead {
  font-size: 1.1rem !important;
  color: var(--lt-mute) !important;
  line-height: 1.75;
  max-width: 720px;
  margin-bottom: 2rem !important;
}
.carte-statues-page > .carte-statues-lead a {
  color: var(--lt-champagne-deep);
  text-decoration: underline;
  text-decoration-color: var(--lt-champagne);
  text-underline-offset: 3px;
}

.carte-statues-page .carte-filtres {
  max-width: 1080px;
  margin: 1rem auto 1.5rem;
  padding: 1.5rem 1.75rem;
  background: var(--lt-paper);
  border: 1px solid var(--lt-line);
  border-radius: var(--lt-r-lg);
  box-shadow: var(--lt-shadow-md);
  position: relative;
}
.carte-statues-page .carte-filtres::before {
  content: '';
  position: absolute;
  top: -1px; left: 32px; right: 32px;
  height: 2px;
  background: linear-gradient(90deg, var(--lt-champagne), transparent);
}

.carte-statues-page .carte-filtres-row {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) auto !important;
  gap: 1.25rem !important;
  align-items: end;
}

.carte-statues-page .carte-filtre label {
  font-family: var(--lt-mono);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--lt-champagne-deep);
  margin-bottom: 0.5rem;
  display: block;
}

.carte-statues-page .carte-filtre input,
.carte-statues-page .carte-filtre select {
  width: 100%;
  height: 46px;
  padding: 0 1rem;
  border: 1px solid var(--lt-line-strong);
  border-radius: var(--lt-r-md);
  background: var(--lt-cream-warm);
  font-family: var(--lt-sans);
  font-size: 14px;
  color: var(--lt-ink);
  transition: all var(--lt-fast) var(--lt-ease);
}
.carte-statues-page .carte-filtre input:focus,
.carte-statues-page .carte-filtre select:focus {
  outline: none;
  border-color: var(--lt-champagne);
  background: var(--lt-paper);
  box-shadow: 0 0 0 3px var(--lt-champagne-halo-xs);
}

.carte-statues-page .carte-statues-btn {
  background: var(--lt-navy) !important;
  color: var(--lt-paper) !important;
  border: none !important;
  height: 46px;
  padding: 0 1.75rem !important;
  border-radius: var(--lt-r-pill) !important;
  font-family: var(--lt-sans) !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  letter-spacing: 0.06em !important;
  cursor: pointer;
  transition: all var(--lt-fast) var(--lt-ease) !important;
}
.carte-statues-page .carte-statues-btn:hover {
  background: var(--lt-navy-deep) !important;
  transform: translateY(-2px);
  box-shadow: var(--lt-shadow-md);
}
.carte-statues-page .carte-statues-btn#flt_reset {
  background: transparent !important;
  color: var(--lt-ink-soft) !important;
  border: 1px solid var(--lt-line-strong) !important;
}

.carte-statues-page .carte-statues-map {
  max-width: 1400px !important;
  margin: 1.5rem auto !important;
  height: 75vh !important;
  min-height: 600px !important;
  border-radius: var(--lt-r-xl) !important;
  border: 1px solid var(--lt-line-strong) !important;
  box-shadow: var(--lt-shadow-lg) !important;
  overflow: hidden;
}

.leaflet-popup-content-wrapper {
  border-radius: var(--lt-r-md) !important;
  background: var(--lt-paper) !important;
  border: 1px solid var(--lt-line-strong);
  box-shadow: var(--lt-shadow-md) !important;
}
.leaflet-popup-content {
  font-family: var(--lt-sans) !important;
  color: var(--lt-ink) !important;
}
.leaflet-popup-tip { background: var(--lt-paper) !important; }

.carte-statues-page .carte-statues-actions {
  max-width: 1080px;
  margin: 0 auto 0.5rem;
  padding: 0 1.5rem;
  display: flex;
  align-items: center;
  gap: 1rem;
}
.carte-statues-page #carte-status {
  font-family: var(--lt-sans);
  font-size: 12.5px;
  color: var(--lt-mute);
  font-style: italic;
}

/* =====================================================================
   6. VITRINE — BOUTIQUE éditoriale
   ===================================================================== */
.compte-layout { background: var(--lt-cream) !important; }

.compte-layout h1,
.compte-layout .compte-page-title {
  font-family: var(--lt-serif) !important;
  font-size: clamp(2rem, 4.5vw, 3rem) !important;
  letter-spacing: -0.025em !important;
  color: var(--lt-navy) !important;
}

.vitrine-section, .vitrine-mosaic, .ma-vitrine-page {
  background: var(--lt-cream);
  padding: 3rem 1.5rem;
  position: relative;
}

.vitrine-section .vitrine-hero,
.ma-vitrine-page .vitrine-hero {
  background: linear-gradient(180deg, var(--lt-navy-deep) 0%, var(--lt-navy) 100%);
  color: var(--lt-paper);
  padding: 5rem 2.5rem 6rem;
  border-radius: var(--lt-r-xl);
  position: relative;
  overflow: hidden;
  margin-bottom: 3rem;
}
.vitrine-section .vitrine-hero::before,
.ma-vitrine-page .vitrine-hero::before {
  content: '— VITRINE PERSONNELLE —';
  display: block;
  font-family: var(--lt-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.32em;
  color: var(--lt-champagne);
  margin-bottom: 1.25rem;
}

.vitrine-card,
.annonce-card,
.listing-card,
.product-card,
.boutique-card,
.ma-vitrine-card {
  background: var(--lt-paper) !important;
  border: 1px solid var(--lt-line) !important;
  border-radius: var(--lt-r-md) !important;
  overflow: hidden;
  transition: transform var(--lt-base) var(--lt-ease),
              box-shadow var(--lt-base) var(--lt-ease),
              border-color var(--lt-base) var(--lt-ease) !important;
  box-shadow: var(--lt-shadow-xs);
  position: relative;
}
.vitrine-card:hover, .annonce-card:hover, .listing-card:hover,
.product-card:hover, .boutique-card:hover, .ma-vitrine-card:hover {
  transform: translateY(-6px);
  border-color: var(--lt-champagne) !important;
  box-shadow: var(--lt-shadow-md), 0 0 0 1px var(--lt-champagne-line) !important;
}

.vitrine-card .price, .annonce-card .price,
.listing-card .price, .product-card .price,
.product-price, .annonce-prix {
  color: var(--lt-champagne-deep) !important;
  font-family: var(--lt-sans);
  font-weight: 700 !important;
  letter-spacing: -0.01em;
}

.vitrine-card .title, .annonce-card .title,
.listing-card h3, .product-card h3, .annonce-card h3 {
  font-family: var(--lt-serif) !important;
  font-weight: 600;
  color: var(--lt-ink);
  letter-spacing: -0.01em;
}

.vitrine-card.is-featured::before,
.product-card.is-featured::before,
.annonce-card.is-featured::before {
  content: 'EN VEDETTE';
  position: absolute;
  top: 12px; left: 12px;
  z-index: 2;
  background: var(--lt-champagne);
  color: var(--lt-ink);
  font-family: var(--lt-mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.18em;
  padding: 5px 10px;
  border-radius: var(--lt-r-pill);
  box-shadow: var(--lt-shadow-glow-champagne);
}

.vitrine-mosaic, .vitrine-grid, .ma-vitrine-grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}

.vitrine-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 1rem;
  background: var(--lt-paper);
  border: 1px solid var(--lt-line);
  border-radius: var(--lt-r-lg);
  padding: 1.5rem;
  margin-bottom: 2rem;
}
.vitrine-stat { text-align: center; position: relative; }
.vitrine-stat-value {
  font-family: var(--lt-serif);
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--lt-champagne-deep);
  letter-spacing: -0.02em;
  display: block;
}
.vitrine-stat-label {
  display: block;
  font-family: var(--lt-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--lt-mute);
  margin-top: 0.25rem;
}

/* =====================================================================
   7. UTILITAIRES BUTTONS
   ===================================================================== */
.lt-btn,
.lt-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  height: 50px;
  padding: 0 2rem;
  border-radius: var(--lt-r-pill);
  background: var(--lt-coral);
  color: var(--lt-white);
  font-family: var(--lt-sans);
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.05em;
  border: none;
  cursor: pointer;
  text-decoration: none;
  box-shadow: var(--lt-shadow-glow-coral);
  transition: all var(--lt-fast) var(--lt-ease);
}
.lt-btn-primary:hover {
  background: var(--lt-coral-deep);
  transform: translateY(-2px);
  box-shadow: 0 16px 32px var(--lt-coral-glow-strong);
}
.lt-btn-champagne { background: var(--lt-champagne); color: var(--lt-ink); box-shadow: var(--lt-shadow-glow-champagne); }
.lt-btn-champagne:hover { background: var(--lt-champagne-soft); }
.lt-btn-ghost {
  background: transparent;
  color: var(--lt-navy);
  border: 1px solid var(--lt-line-strong);
  box-shadow: none;
}
.lt-btn-ghost:hover { border-color: var(--lt-champagne); background: var(--lt-cream-warm); }

/* =====================================================================
   8. FOOTER ÉDITORIAL
   ===================================================================== */
.footer-lbc-modern {
  background:
    radial-gradient(ellipse at 15% 0%, var(--lt-champagne-halo-sm) 0%, transparent 55%),
    radial-gradient(ellipse at 85% 100%, var(--lt-white-glow-xs) 0%, transparent 55%),
    linear-gradient(180deg, var(--lt-gradient-navy-start) 0%, var(--lt-gradient-navy-mid) 55%, var(--lt-gradient-navy-end) 100%) !important;
  color: var(--lt-white-text) !important;
  position: relative;
  padding: 3rem 0 1.25rem !important;
  margin-top: 2.5rem;
  overflow: hidden;
}
.footer-lbc-modern::before {
  content: '';
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: 50%; height: 1px;
  background: linear-gradient(90deg, transparent, var(--lt-champagne) 50%, transparent);
}
.footer-lbc-modern h4 {
  color: var(--lt-champagne) !important;
  font-family: var(--lt-mono) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.28em !important;
  text-transform: uppercase;
}
.footer-lbc-modern a {
  color: var(--lt-white-text-muted) !important;
  font-family: var(--lt-sans);
  font-size: 14px;
  transition: color var(--lt-fast) var(--lt-ease);
}
.footer-lbc-modern a:hover { color: var(--lt-champagne) !important; text-decoration: none; }
.footer-lbc-modern .footer-desc { color: var(--lt-white-text-soft) !important; font-size: 13.5px; line-height: 1.7; }

.footer-lbc-modern .footer-flex { gap: 24px; }
.footer-lbc-modern .footer-logo img,
.footer-lbc-modern .footer-logo .responsive-img { height: 44px !important; }
.footer-lbc-modern .footer-bottom { margin-top: 20px; padding-top: 16px; }

.footer-lbc-modern::after {
  content: 'Au bout du voyage · Loguetown · ' attr(data-year);
  display: block;
  text-align: center;
  font-family: var(--lt-serif);
  font-style: italic;
  font-size: 12px;
  color: var(--lt-champagne);
  letter-spacing: 0.04em;
  padding: 1.5rem 1rem 0;
  border-top: 1px solid var(--lt-champagne-halo-xs);
  margin-top: 1.5rem;
  opacity: 0.9;
}

/* =====================================================================
   9. RESPONSIVE
   ===================================================================== */
@media (max-width: 768px) {
  /* Empêche tout débordement horizontal */
  .accueil-page { overflow-x: hidden; }

  /* HERO */
  .accueil-page .accueil-hero { min-height: 64vh; }
  .accueil-page .accueil-hero-inner {
    padding: 72px 18px 40px !important;
    gap: 1.25rem !important;
  }
  .accueil-page .accueil-hero h1 {
    font-size: clamp(2.25rem, 9.5vw, 4.25rem) !important;
  }

  /* SEARCH */
  .accueil-page .accueil-search-section {
    padding: 2.25rem 1rem 3rem !important;
  }
  .accueil-page .accueil-search-section .filtres-layout-flex {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
  .accueil-page .accueil-search-section .sidebar-filtres-centrale {
    padding: 1.5rem 1.25rem !important;
  }

  /* Type selector : scroll horizontal (tuiles) */
  .accueil-page .accueil-search-section .type-selector-centrale {
    display: flex !important;
    gap: 10px !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 6px;
    scrollbar-width: none;
  }
  .accueil-page .accueil-search-section .type-selector-centrale::-webkit-scrollbar { display: none; }
  .accueil-page .accueil-search-section .type-button-centrale {
    flex: 0 0 auto;
    min-width: 92px;
  }

  /* Catégories (bento) : densité mobile */
  .accueil-page .accueil-categories-wrap { padding: 3.5rem 1rem !important; }
  .accueil-page .accueil-categories-grid { gap: 12px !important; }

  /* Marques : grille plus serrée */
  .accueil-page .accueil-marques { padding: 3.5rem 0 !important; }
  .accueil-page .accueil-marques .brands-list {
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)) !important;
    margin-top: 2rem !important;
  }
  .accueil-page .accueil-marques .brand-card { padding: 22px 12px !important; }
  .accueil-page .accueil-marques .brand-card-img { height: 34px !important; }
}

@media (max-width: 480px) {
  .accueil-page .accueil-hero { min-height: 58vh; }
  .accueil-page .accueil-hero-inner { padding: 64px 14px 34px !important; }
  .accueil-page .accueil-search-section { padding: 2rem 0.75rem 2.5rem !important; }
  .accueil-page .accueil-search-section .sidebar-filtres-centrale { padding: 1.25rem 1rem !important; }
  .accueil-page .accueil-search-section .type-button-centrale { min-width: 84px; }
  .accueil-page .accueil-categories-grid { grid-auto-rows: 150px; }
}

@media (max-width: 980px) {
  .accueil-page .accueil-hero-inner {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
    padding: 80px 24px 44px !important;
  }
  .accueil-page .accueil-hero h1::after {
    font-size: clamp(2.5rem, 12vw, 4.5rem);
  }
  .accueil-page .accueil-hero .accueil-lead {
    grid-column: 1 !important;
    border-left: none !important;
    padding-left: 0 !important;
    border-top: 1px solid var(--lt-champagne-line);
    padding-top: 1.5rem !important;
  }
  .accueil-page .accueil-hero .accueil-lead::before { display: none; }

  .accueil-page .accueil-categories-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    grid-auto-rows: 160px;
  }
  .accueil-page .accueil-categories-grid .category-card:nth-child(1) {
    grid-column: span 2;
    grid-row: span 1;
    font-size: 1.75rem !important;
  }
  .accueil-page .accueil-categories-grid .category-card:nth-child(4) { grid-column: span 1; }

  .lt-stats-inner { grid-template-columns: repeat(2, 1fr) !important; }

  .accueil-page .accueil-search-section .filtres-layout-flex {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 640px) {
  .accueil-page .accueil-hero { min-height: 68vh; }
  .accueil-page .accueil-hero::after { right: -120px; width: 480px; height: 480px; opacity: 0.35; }
  .lt-stats-inner { grid-template-columns: 1fr !important; }
  .carte-statues-page .carte-statues-map { height: 60vh !important; min-height: 420px !important; border-radius: var(--lt-r-lg) !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}


/* merged: loguetown-mobile.css */

/* =============================================================================
   LOGUETOWN — Mobile responsive master overrides
   Chargé EN DERNIER pour gagner la cascade. Toutes les règles sont scopées
   sous un breakpoint (max-width: 1024px / 768px / 480px) — aucun impact desktop.
   ========================================================================== */

/* ============================================================
   1. Garde-fous globaux (safe-area iOS, overflow, tap targets)
   ============================================================ */
@media (max-width: 1024px) {
  html, body {
    max-width: 100vw;
    overflow-x: hidden;
  }
  body {
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(212, 175, 122, 0.18);
  }
  img, video, canvas, svg, iframe {
    max-width: 100%;
    height: auto;
  }
  /* iOS : empêche le zoom involontaire sur focus input (font-size >= 16px) */
  input, select, textarea {
    font-size: 16px;
  }
  /* Cibles tactiles : mini 44x44 */
  button, .btn, .btn-lbc-annonce, a.btn, a.btn-lbc-annonce,
  .header-action-icon, .nav-link, .footer-link, .pagination a, .pagination button {
    min-height: 44px;
  }
  /* Conteneurs : padding mobile cohérent */
  .container, .container-1100, .container-fluid, main, .main-content {
    padding-left: 16px;
    padding-right: 16px;
    max-width: 100%;
    box-sizing: border-box;
  }
  /* Tableaux génériques scrollables horizontalement si trop larges */
  .table-responsive, .estimation-table, .data-table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    display: block;
  }
}

/* ============================================================
   2. Header leboncoin : compact mobile
   ============================================================ */
@media (max-width: 1024px) {
  .header-lbc-leboncoin .header-content-lbc {
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 12px;
  }
  .header-lbc-leboncoin .logo-lbc img {
    max-height: 36px;
    width: auto;
  }
  .header-lbc-leboncoin .search-bar-lbc {
    order: 99;
    flex: 1 1 100%;
    margin: 8px 0 0;
  }
  .header-lbc-leboncoin .search-bar-input {
    width: 100%;
    font-size: 16px;
  }
  .header-actions-lbc {
    gap: 4px;
    flex-wrap: nowrap;
  }
  /* Cache "Déposer une annonce" textuel sur mobile, on garde l'icône via FAB ou bottom-nav */
  .header-actions-lbc .btn-lbc-annonce {
    padding: 8px 12px;
    font-size: 13px;
    white-space: nowrap;
  }
  .user-name {
    display: none;
  }
}

@media (max-width: 600px) {
  .header-actions-lbc .btn-lbc-annonce {
    display: none;
  }
}

/* Nav principale : bascule horizontale scrollable sous 1024px */
@media (max-width: 1024px) {
  .main-nav {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .main-nav::-webkit-scrollbar { display: none; }
  .nav-container {
    padding: 0 12px;
  }
  .nav-menu {
    display: flex;
    flex-wrap: nowrap;
    white-space: nowrap;
    gap: 4px;
  }
  .nav-item.has-dropdown .dropdown-menu {
    position: static;
    box-shadow: none;
    background: transparent;
    display: none;
  }
  .nav-link {
    padding: 12px 14px;
    font-size: 14px;
  }
}

/* ============================================================
   3. Accueil — Hero, bento, sections édition collector
   ============================================================ */
@media (max-width: 768px) {
  .accueil-page .accueil-hero,
  .lt-hero {
    min-height: auto !important;
    padding: 32px 16px 28px !important;
  }
  .lt-hero-grid,
  .accueil-hero-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  .lt-hero h1, .accueil-hero h1, .accueil-page h1 {
    font-size: clamp(1.85rem, 8vw, 2.6rem) !important;
    line-height: 1.1 !important;
  }
  .lt-hero p, .accueil-hero p {
    font-size: 1rem !important;
  }
  .lt-ticker, .lt-marquee {
    font-size: 11px !important;
  }
  .lt-compass, .lt-hero-compass {
    width: 60vw !important;
    max-width: 280px !important;
    margin: 0 auto !important;
  }
  /* Bento / grilles catégories */
  .lt-bento, .lt-categories-grid, .lt-category-bento,
  .accueil-categories-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  /* Stats section : 2 col puis 1 col en très petit */
  .lt-stats, .lt-stats-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 18px !important;
  }
  .lt-stat-number {
    font-size: clamp(1.6rem, 7vw, 2.2rem) !important;
  }
  /* Marques row */
  .lt-brands-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
  }
  /* Story (split image/texte) */
  .lt-story, .lt-story-grid, .lt-split {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  /* Newsletter band */
  .lt-newsletter {
    padding: 36px 16px !important;
  }
  .lt-newsletter form, .lt-newsletter-form {
    flex-direction: column !important;
    gap: 10px !important;
  }
  .lt-newsletter input[type=email],
  .lt-newsletter button {
    width: 100% !important;
  }
  /* Espacements verticaux des sections */
  section, .lt-section, .accueil-section {
    padding-top: 36px;
    padding-bottom: 36px;
  }
}

@media (max-width: 480px) {
  .lt-stats, .lt-stats-grid {
    grid-template-columns: 1fr !important;
  }
  .lt-brands-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ============================================================
   4. Cartes annonce (acheter, favoris, vitrine)
   ============================================================ */
@media (max-width: 768px) {
  .annonces-grid, .listings-grid, .acheter-grid, .favoris-grid,
  .vitrine-grid, .ma-vitrine-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  .annonce-card, .listing-card {
    border-radius: 12px;
  }
  .annonce-card img, .listing-card img {
    aspect-ratio: 1 / 1;
    object-fit: cover;
  }
  .annonce-card-title, .listing-card-title {
    font-size: 13px;
    line-height: 1.3;
  }
  .annonce-card-price, .listing-card-price {
    font-size: 14px;
  }
}

@media (max-width: 380px) {
  .annonces-grid, .listings-grid, .acheter-grid, .favoris-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================
   5. Filtres latéraux (acheter, vitrine) → bottom sheet / accordéon
   ============================================================ */
@media (max-width: 1024px) {
  .acheter-layout, .vitrine-layout, .layout-with-sidebar {
    grid-template-columns: 1fr !important;
    display: block !important;
  }
  .filter-sidebar, .acheter-filters, .filters-aside {
    width: 100% !important;
    position: static !important;
    margin-bottom: 16px;
  }
  /* Filtres collapsibles via <details> si présent */
  .filter-group summary, .filtre-group summary {
    padding: 12px 0;
    font-weight: 600;
  }
}

/* ============================================================
   6. Page annonce (détail)
   ============================================================ */
@media (max-width: 768px) {
  .annonce-detail-layout, .annonce-detail-grid {
    grid-template-columns: 1fr !important;
    display: block !important;
  }
  .annonce-detail-gallery img,
  .annonce-detail-image {
    width: 100%;
    border-radius: 12px;
  }
  .annonce-detail-thumbs {
    overflow-x: auto;
    display: flex;
    gap: 8px;
    -webkit-overflow-scrolling: touch;
  }
  .annonce-detail-thumbs img {
    flex: 0 0 64px;
    height: 64px;
    object-fit: cover;
  }
  .annonce-detail-side, .annonce-detail-aside {
    margin-top: 18px;
  }
  .annonce-detail-actions {
    position: sticky;
    bottom: 0;
    background: var(--lt-white);
    padding: 10px 12px;
    border-top: 1px solid var(--lt-ios-line);
    z-index: 30;
    margin-left: -16px;
    margin-right: -16px;
  }
}

/* ============================================================
   7. Carte communautaire
   ============================================================ */
@media (max-width: 768px) {
  .carte-statues-page h1 {
    font-size: 1.5rem;
  }
  .carte-statues-lead {
    font-size: 14px;
  }
  .carte-filtres .carte-filtres-row {
    grid-template-columns: 1fr !important;
    display: grid !important;
    gap: 10px !important;
  }
  .carte-filtre {
    width: 100%;
  }
  .carte-filtre input, .carte-filtre select {
    width: 100%;
  }
  .carte-filtre--actions {
    display: flex;
    gap: 8px;
  }
  .carte-filtre--actions .carte-statues-btn {
    flex: 1 1 50%;
  }
  .carte-statues-map {
    height: calc(100vh - 280px);
    height: calc(100dvh - 280px);
    min-height: 360px;
    border-radius: 12px;
  }
  .carte-statues-actions {
    flex-wrap: wrap;
    gap: 8px;
  }
  /* Suggestions autocomplete */
  .suggestions-list {
    max-height: 200px;
    overflow-y: auto;
  }
  /* Popups Leaflet */
  .leaflet-popup-content {
    font-size: 13px;
    margin: 10px 12px;
  }
}

/* ============================================================
   8. Formulaires (dépôt, estimation, profil, etc.)
   ============================================================ */
@media (max-width: 768px) {
  .form-container, .form-wrap {
    padding: 12px;
  }
  /* Tableaux de formulaire (estimation-table) → blocs empilés */
  .estimation-table,
  .estimation-table tbody,
  .estimation-table tr,
  .estimation-table td,
  .estimation-table th {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
  .estimation-table tr {
    margin-bottom: 14px;
    border-bottom: 1px solid var(--lt-ios-line-soft);
    padding-bottom: 10px;
  }
  .estimation-table td.table-label,
  .estimation-table th.table-section-title {
    padding: 8px 0 4px;
    font-weight: 600;
  }
  .estimation-table th.table-section-title {
    font-size: 1rem;
    margin-top: 8px;
    background: transparent;
    border-bottom: 1px solid #d4af7a40;
  }
  .estimation-table td {
    padding: 4px 0;
  }
  .form-input, .form-select, .form-textarea, input[type=text], input[type=email],
  input[type=password], input[type=number], input[type=tel], select, textarea {
    width: 100%;
    box-sizing: border-box;
  }
  .submit-section {
    flex-direction: column;
    gap: 10px;
  }
  .submit-section .btn-cancel,
  .submit-section .btn-submit {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
  .livraison-options {
    flex-direction: column;
  }
  /* Photo manager */
  .photo-manager__list {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px;
  }
  /* Taxonomy request modal/details */
  .taxonomy-request-row {
    flex-direction: column;
    align-items: stretch;
  }
  .taxonomy-request-label {
    margin-bottom: 4px;
  }
}

/* ============================================================
   9. Auth (connexion / inscription)
   ============================================================ */
@media (max-width: 768px) {
  .auth-card, .auth-container, .auth-page-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin: 16px 0 !important;
    padding: 20px 16px !important;
    border-radius: 12px !important;
  }
  .auth-page, .auth-bg {
    padding: 16px !important;
  }
}

/* ============================================================
   10. Mon-espace / dashboard / vitrine privée
   ============================================================ */
@media (max-width: 1024px) {
  .me-dashboard, .mon-espace-layout, .compte-layout {
    grid-template-columns: 1fr !important;
    display: block !important;
  }
  .me-sidebar, .compte-sidebar {
    width: 100% !important;
    position: static !important;
    margin-bottom: 14px;
  }
  .me-sidebar-nav, .compte-sidebar-nav {
    display: flex !important;
    flex-direction: row !important;
    overflow-x: auto;
    gap: 6px;
    padding: 8px;
    -webkit-overflow-scrolling: touch;
  }
  .me-sidebar-nav a, .compte-sidebar-nav a {
    flex: 0 0 auto;
    white-space: nowrap;
    padding: 10px 14px;
    font-size: 14px;
    border-radius: 999px;
  }
}

/* Stats dashboard cards */
@media (max-width: 768px) {
  .dashboard-stats, .stats-grid, .me-stats {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }
}

/* ============================================================
   11. Messagerie
   ============================================================ */
@media (max-width: 768px) {
  .messages-layout, .chat-layout {
    grid-template-columns: 1fr !important;
    display: block !important;
  }
  .messages-list, .conversations-list {
    width: 100% !important;
    border-right: none !important;
    border-bottom: 1px solid var(--lt-ios-line);
  }
  .messages-thread, .chat-thread {
    width: 100% !important;
    height: calc(100vh - 220px);
    height: calc(100dvh - 220px);
    min-height: 420px;
  }
  .chat-input-bar, .message-input-form {
    position: sticky;
    bottom: 0;
    background: var(--lt-white);
    padding: 8px;
  }
}

/* ============================================================
   12. Communauté / forum / événements / guides
   ============================================================ */
@media (max-width: 768px) {
  .community-grid, .community-cards, .events-grid, .forum-list {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .breadcrumbs, .breadcrumb {
    font-size: 12px;
    flex-wrap: wrap;
  }
}

/* ============================================================
   13. Footer
   ============================================================ */
@media (max-width: 768px) {
  .footer-lbc-modern, .site-footer {
    padding: 28px 16px !important;
  }
  .footer-lbc-modern .footer-content,
  .footer-lbc-modern .footer-grid,
  .site-footer .footer-grid {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
    text-align: left;
  }
  .footer-lbc-modern .footer-col h4,
  .site-footer .footer-col h4 {
    font-size: 14px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 10px;
  }
  .footer-lbc-modern ul, .site-footer ul {
    padding-left: 0;
    list-style: none;
  }
  .footer-lbc-modern a, .site-footer a {
    display: inline-block;
    padding: 6px 0;
  }
  .footer-bottom, .footer-legal {
    flex-direction: column;
    gap: 8px;
    text-align: center;
    font-size: 12px;
  }
}

/* ============================================================
   14. Suggestions de recherche en surcouche
   ============================================================ */
@media (max-width: 768px) {
  .search-suggestions {
    left: 16px !important;
    right: 16px !important;
    width: auto !important;
    max-width: none !important;
  }
}

/* ============================================================
   15. Modales / overlays — full-screen mobile
   ============================================================ */
@media (max-width: 600px) {
  .modal, .modal-dialog, .lt-modal {
    margin: 0 !important;
    border-radius: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-width: 100vw !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
    left: 0 !important;
    top: 0 !important;
  }
  .modal-content {
    height: 100%;
    overflow-y: auto;
    border-radius: 0;
  }
}

/* ============================================================
   16. Bottom nav mobile : compense le contenu
   (si bottom-nav-mobile.css est actif sur la page)
   ============================================================ */
@media (max-width: 768px) {
  body.has-bottom-nav main,
  body.has-bottom-nav .main-content {
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
  }
}

/* ============================================================
   17. Easter-egg toast (Konami) — déjà inline mais on l'ajuste
   ============================================================ */
@media (max-width: 480px) {
  #lt-egg-toast {
    right: 12px !important;
    bottom: 12px !important;
    left: 12px !important;
    max-width: none !important;
  }
}

/* ============================================================
   18. Dépôt d'annonce — UI carte communautaire ajoutée
   ============================================================ */
@media (max-width: 600px) {
  .depot-map-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .depot-map-actions .btn-cancel {
    width: 100%;
    text-align: center;
  }
}

/* ============================================================
   19. Réduction des animations si l'utilisateur le souhaite
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ============================================================
   Auth (connexion / reset mdp) — évite <style> inline (CSP)
   ============================================================ */
.auth-page-container {
  min-height: 60vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px;
}

.auth-card {
  background: var(--lt-white);
  border-radius: 16px;
  padding: 40px;
  max-width: 420px;
  width: 100%;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.auth-card h1 {
  font-size: 24px;
  margin-bottom: 12px;
}

.auth-card p {
  color: var(--lt-neutral-600);
  margin-bottom: 24px;
}

.auth-message.success { color: var(--lt-success-legacy); }
.auth-message.error { color: var(--lt-error-legacy); }

.auth-footer-link {
  margin-top: 24px;
  text-align: center;
}

.auth-footer-link a {
  color: var(--accent, #f2deb9);
  text-decoration: none;
}

.auth-footer-link a:hover { text-decoration: underline; }

/* Connexion (variante) */
.auth-page-connexion {
  min-height: 60vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  padding-bottom: calc(80px + env(safe-area-inset-bottom));
}

.auth-card-connexion {
  background: var(--lt-white);
  border-radius: 16px;
  padding: 28px 24px;
  max-width: 420px;
  width: 100%;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.auth-card-title {
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--primary-dark);
  margin: 0 0 4px 0;
}

.auth-card-subtitle {
  color: #6b7280;
  font-size: 0.9375rem;
  margin: 0 0 20px 0;
}

.auth-page-connexion .auth-form label {
  display: block;
  font-weight: 600;
  margin-bottom: 6px;
}

.auth-page-connexion .auth-form input[type="email"],
.auth-page-connexion .auth-form input[type="password"] {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  font-size: 16px;
  box-sizing: border-box;
}

.auth-remember {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 10px 0 16px 0;
  font-weight: 500;
}

.btn-connexion-submit {
  width: 100%;
  padding: 14px 20px;
  min-height: 48px;
  font-size: 1rem;
  box-sizing: border-box;
}

.auth-page-connexion .auth-footer-link {
  text-align: center;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid #eee;
  font-size: 0.9375rem;
}

.auth-page-connexion .auth-footer-link a {
  color: var(--primary);
  text-decoration: none;
}

.auth-page-connexion .auth-footer-link a:hover { text-decoration: underline; }

.auth-page-connexion .alert-error {
  background: var(--lt-error-soft);
  color: var(--lt-error-text);
  padding: 12px 14px;
  border-radius: 10px;
  margin-bottom: 16px;
  font-size: 0.9375rem;
}

@media (max-width: 768px) {
  .auth-page-container { padding: 24px 16px; padding-bottom: calc(80px + env(safe-area-inset-bottom)); }
  .auth-card { padding: 28px 20px; }
}

@media (max-width: 420px) {
  .auth-card { padding: 22px 16px; border-radius: 14px; }
}