/* ============================================================
   Immobilier59 - Couche responsive (non destructive)
   Chargee APRES style.css. Ne s'applique QU'EN DESSOUS de 980px.
   Le rendu desktop (> 980px) reste strictement identique.
   Premiere passe : page d'accueil (header, nav, carte, recherche, footer).
   ============================================================ */

@media (max-width: 980px) {

  /* --- Conteneurs a largeur fixe -> fluides --- */
  .wrapper { min-width: 0; }
  header .main,
  header .principale .main,
  nav.principale .main,
  .content .main,
  .ariane,
  .titre,
  footer .main,
  footer .liens,
  footer .main .partenaires {
    width: auto !important;
    max-width: 100%;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
  }

  /* --- Header : hauteur libre, logo fluide, decoration "59" masquee --- */
  header { height: auto; }
  header .main { height: auto; padding-top: 6px; padding-bottom: 6px; }
  header a.logo {
    float: none;
    width: 100%;
    max-width: 507px;
    height: 96px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    margin: 8px auto 0;
    padding: 0;
  }
  header .ai59, header .ai62, header .aiBE { display: none; }

  /* --- Menu principal : items empiles ; sous-menus (survol) masques sur tactile --- */
  nav.principale { height: auto; }
  nav.principale .main ul.nav-principale {
    width: 100% !important;
    height: auto;
    border-left: none;
  }
  nav.principale .main ul.nav-principale > li {
    float: none;
    width: 100%;
    position: static;
  }
  nav.principale .main ul.nav-principale > li > a {
    float: none;
    display: block;
    width: 100%;
    box-sizing: border-box;
    height: auto;
    padding: 14px 12px;
    border-right: none;
    border-bottom: 1px solid #A8A297;
    text-align: left;
  }
  /* Les sous-menus deroulants au survol ne sont pas accessibles au doigt */
  ul.nav-principale ul,
  ul.nav-principale li:hover ul { display: none !important; }

  /* --- Contenu : bannieres laterales masquees, carte en pleine largeur --- */
  .banniere { display: none; }
  .carte-recherche {
    float: none;
    width: auto !important;
    max-width: 100%;
    margin: 12px 0;
    min-height: 0;
    background-image: none !important; /* on retire l'image de carte fixe */
    background-color: #969084;
  }

  /* --- LA CARTE -> LISTE : les labels positionnes en absolu deviennent des liens en flux --- */
  .carte-recherche .villes {
    position: static;
    height: auto !important;
    width: auto !important;
    text-align: center;
    padding: 6px 0;
  }
  .carte-recherche .villes a,
  .villes a.villeH1,
  .villes a.villeH2,
  .villes a.villeH2pti {
    position: static !important;
    left: auto !important;
    top: auto !important;
    display: inline-block;
    height: auto;
    line-height: 1.2;
    margin: 5px;
    padding: 8px 12px;
    font-size: 0.95em !important;
    text-transform: none;
    background: #EFEBE3;
    border-radius: 6px;
    color: #CE3000;
  }
  .carte-recherche .villes a:hover { background: #FFFFFF; }

  /* --- Champ de recherche par ville : pleine largeur --- */
  .champ-recherche-carte { width: auto !important; max-width: 100%; }
  .champ-recherche-carte label input#ville {
    width: 70% !important;
    max-width: 320px;
    box-sizing: border-box;
    margin: 0;
  }
  #search_ville { margin-left: 0 !important; }

  /* --- Footer : colonnes empilees --- */
  footer .main .liens .column {
    float: none;
    width: auto !important;
    margin: 0 0 16px 0;
  }
  footer .main .partenaires { width: auto !important; }
  footer .main .partenaires a { float: none; display: inline-block; margin: 6px 12px 6px 0; }

  /* --- Boite reseaux sociaux fixe : masquee sur mobile --- */
  .likeBox { display: none; }
}

/* --- Petits ecrans (telephone) --- */
@media (max-width: 480px) {
  header a.logo { height: 64px; }
  .carte-recherche .villes a { font-size: 0.85em !important; padding: 7px 10px; }
  .champ-recherche-carte label input#ville { width: 62% !important; }
}

/* ============================================================
   Passe 2 : pages VILLE (liste-agences.php)
   Conteneur de liste fluide + grille de logos d'agences adaptee.
   Le lien "+ d'infos" (au survol sur desktop) devient toute la carte
   cliquable sur mobile ; le nom de l'agence est rendu visible.
   ============================================================ */
@media (max-width: 980px) {

  /* Conteneur de la liste d'agences : fluide */
  .encart1 {
    width: auto !important;
    max-width: 100%;
    min-height: 0;
    padding: 8px;
    box-sizing: border-box;
    background-image: none;        /* on retire l'image de fond fixe */
    background-color: #969084;
  }

  /* Images / iframes / cartes : jamais plus larges que l'ecran */
  .content img, .content iframe, .encart1 img { max-width: 100%; height: auto; }

  /* Grille de logos d'agences : cartes centrees, en flux */
  .logos-agences { text-align: center; }
  .view, .view.view-third {
    float: none;
    display: inline-block;
    vertical-align: top;
    width: 212px;
    max-width: 90%;
    height: auto;
    margin: 10px;
    padding: 10px 0 0;
    position: relative;
  }
  .view img {
    position: static !important;
    width: 100%;
    max-width: 212px;
    height: auto;
    padding: 0;
    margin: 0 auto;
  }
  /* Nom de l'agence : visible (remplace l'apparition au survol) */
  .view h3 {
    position: static !important;
    display: block;
    font-size: 0.8em;
    text-align: center;
    margin: 8px 0 0;
    color: #373125;
  }
  /* Lien "+ d'infos" : toute la carte cliquable, sans animation de survol */
  .view a.info,
  .view-third:hover a.info {
    position: absolute !important;
    top: 0; left: 0;
    width: 100% !important;
    height: 100% !important;
    transform: none !important;
    opacity: 0 !important;          /* overlay transparent = carte entierement cliquable */
    background: transparent !important;
    border: none !important;
  }
}

/* ============================================================
   Correctifs titres : sur desktop certains h2/.titre ont
   height:20px + overflow:hidden (titres sur 1 ligne). Sur mobile
   ils passent sur plusieurs lignes -> on les laisse respirer.
   ============================================================ */
@media (max-width: 980px) {
  h2, .parth2, h2.liste, #tinymce h2, .tinymce h2,
  .titre h1, .titre-agence h1, h1.blc1 {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    line-height: 1.25 !important;
  }
  /* Bloc titre de page : le lien www ne chevauche pas le H1 */
  .titre, .titre-agence { height: auto !important; }
  .www59net, .wwwBEnet { float: none; display: block; font-size: 1em; margin-top: 4px; }
}

/* ============================================================
   Passe 2b : FICHE AGENCE (agence.php, .encart-agence)
   Composite positionne en absolu (logo / coordonnees / capture /
   bouton CTA) -> on remet tout en flux vertical sur mobile.
   ============================================================ */
@media (max-width: 980px) {
  .encart-agence {
    width: auto !important;
    max-width: 100%;
    margin: 16px 8px;
    box-sizing: border-box;
  }
  /* Logo de l'agence */
  .encart-agence h2.logo-agence { margin: 0 !important; height: auto !important; text-align: center; }
  .encart-agence .logo-agence a {
    position: static !important;
    display: inline-block;
    left: auto; top: auto;
    width: 212px; max-width: 100%; height: auto;
    text-indent: 0;
  }
  /* Capture d'ecran du site de l'agence */
  .encart-agence .ecran-site {
    position: static !important;
    left: auto; top: auto;
    width: auto !important; max-width: 100%; height: auto !important;
    margin: 12px auto;
  }
  .encart-agence .ecran-site img { max-width: 100%; height: auto; }
  /* Coordonnees (schema.org LocalBusiness) */
  .encart-agence .coor {
    position: static !important;
    width: auto !important;
    padding: 12px !important;
    box-sizing: border-box;
  }
  /* Encart "voir les annonces" -> bouton simple centre */
  .encart-agence .encart-www {
    position: static !important;
    right: auto; top: auto;
    width: auto !important; height: auto !important;
    background-image: none !important;
    text-align: center;
    margin: 12px 0;
  }
  .encart-agence .encart-www a.btn-www {
    position: static !important;
    right: auto; bottom: auto;
    width: auto !important; height: auto !important;
    display: inline-block;
    background-image: none !important;
    background-color: #CE3000;
    color: #FFFFFF;
    border-radius: 6px;
    padding: 12px 20px;
    line-height: 1.3;
  }
  .encart-agence .encart-www a.btn-www img { display: none; }
  /* Texte descriptif */
  .encart-agence .texte { width: auto !important; max-width: 100%; margin: 20px 0 0; padding: 0 12px; box-sizing: border-box; }
}