/* ============================================================================
   topagents.immo — mobile-wahou.css  (v1)
   Lisibilite + finitions + feedback tactile + reveals.
   100% additif : rien ne touche au desktop (tout est sous @media max-width:680px
   ou sur des interactions tactiles/animations qui ne changent pas la mise en page).
   ============================================================================ */

/* ---------- 1. LISIBILITE MOBILE : plancher de taille de police ---------- */
@media (max-width: 680px) {
  /* on remonte tout ce qui est < 12px a un minimum lisible, sans casser la hierarchie */
  body { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

  /* textes courants */
  .en, .sb, .ds, .scl, .lab, .hint, .legal, .cta-sub, .meta,
  .reg-card ul li a span, .foot-bot, .fm,
  footer, footer a, .seo p, .lead, p { font-size: 14px !important; line-height: 1.6 !important; }

  /* mini-labels / monospace / eyebrows : plancher 12px (au lieu de 9-11) */
  .eyebrow, .grp, .live-tag, .wiz-lab, .theme, .badge, .lbadge,
  .hero-stats .l, .hero-pills span, .nav-links a, .cta-n, .back,
  .step .num, .tcard p, .offers-sub { font-size: 12px !important; letter-spacing: .04em !important; }

  /* le tout petit texte decoratif : 11px minimum (jamais en dessous) */
  .scroll-hint .t, .foot-eco a, .bc { font-size: 11px !important; }

  /* ---------- 2. ESPACEMENTS plus aerés ---------- */
  .wrap, .nav-in { padding-left: 18px !important; padding-right: 18px !important; }
  section { padding-top: 44px !important; padding-bottom: 44px !important; }
  .block, .reg-card, .tcard, .offer, .live, .claim, .estim, .eco { border-radius: 16px; }

  /* ---------- 3. ZONES TACTILES : min 44px de hauteur (recommandation Apple/Google) ---------- */
  .btn, .cta, .submit, .ob, .cd-btn, .viewbtn, .nav-cta, .cta-n,
  .err-actions a, .err-actions button, button, .tbtn {
    min-height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
  }
  .nav-links a { padding-top: 12px !important; padding-bottom: 12px !important; }
  .suggest .it { padding-top: 14px !important; padding-bottom: 14px !important; }

  /* liens de listes (departements, villes) plus faciles a toucher */
  .reg-card ul li a, .tv-card, .foot-eco a, .fv-grid a { min-height: 40px; }
}

/* ---------- 4. FEEDBACK TACTILE (appui) — tous ecrans, ne bouge pas le layout ---------- */
@media (hover: none) {
  .btn, .cta, .submit, .ob, .tcard, .reg-card, .offer, .tv-card,
  .choice, .row, .lrow, .eco-card, .cd-btn, .viewbtn, .nav-cta {
    transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease;
    -webkit-tap-highlight-color: transparent;
  }
  .btn:active, .cta:active, .submit:active, .ob:active,
  .cd-btn:active, .viewbtn:active, .nav-cta:active { transform: scale(.96); }
  .tcard:active, .reg-card:active, .offer:active, .tv-card:active,
  .choice:active, .eco-card:active { transform: scale(.985); }
}

/* ---------- 5. REVELATIONS AU SCROLL (pilotees par le JS plus bas) ---------- */
@media (prefers-reduced-motion: no-preference) {
  .wahou-reveal { opacity: 0; transform: translateY(20px); }
  .wahou-reveal.wahou-in {
    opacity: 1; transform: none;
    transition: opacity .6s cubic-bezier(.22,1,.36,1), transform .6s cubic-bezier(.22,1,.36,1);
  }
}

/* ---------- 6. HEADER MOBILE qui se compacte au scroll ---------- */
@media (max-width: 680px) {
  nav.wahou-shrink, .top.wahou-shrink {
    box-shadow: 0 6px 24px rgba(21,44,91,.22);
    transition: padding .25s ease, height .25s ease, box-shadow .25s ease;
  }
  nav.wahou-shrink .brand svg, .top.wahou-shrink .brand svg {
    transform: scale(.82); transition: transform .25s ease;
  }
}

/* ---------- 7. confort lecture longue (pages SEO/commune) ---------- */
@media (max-width: 680px) {
  .seo p, .lead, .block .sub, .intro-sm p { max-width: 100%; }
  img { max-width: 100%; height: auto; }
}