/* ==========================================
   influences.css  (AEL/css/influences.css)
   Page : Caravage > Influences
   - Reprise INTÉGRALE du <style> inline
   - + Masquage du footer UNIQUEMENT sur iPhone
   ========================================== */

/* Invisible sur ordinateur */
.iphone-artist-title { display: none; }

@media (max-width: 767px) {

  /* Navbar non fixe sur iPhone */
  body.caravage-influences .navbar.fixed-top {
    position: static !important;
  }

  body.caravage-influences .navbar.py-3 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Hamburger visible + menu fermé */
  body.caravage-influences .navbar-toggler {
    display: inline-block !important;
  }

  body.caravage-influences #navbarCollapse {
    display: none !important;
  }

  body.caravage-influences #navbarCollapse.show {
    display: block !important;
  }

  /* Titre iPhone : rouge, centré, souligné */
  body.caravage-influences .iphone-artist-title {
    display: block !important;
    text-align: center !important;
    margin: 2px 0 6px !important;
  }

  body.caravage-influences .iphone-artist-title a {
    color: #dc3545 !important;
    text-decoration: underline !important;
    font-weight: 700 !important;
  }

  body.caravage-influences h1.iphone-artist-title {
    display: block !important;
    font-size: 1.15rem !important;
    line-height: 1.25 !important;
  }

  /* Largeur pleine + remonter le contenu */
  body.caravage-influences .container.bio {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* ===== Alignement horizontal images / flèche / images ===== */

  body.caravage-influences .row.portfolio-container {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Neutraliser les effets qui peuvent masquer les éléments */
  body.caravage-influences .row.portfolio-container .portfolio-item {
    position: static !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  /* 2 images larges + flèche étroite */
  body.caravage-influences .row.portfolio-container .portfolio-item.first,
  body.caravage-influences .row.portfolio-container .portfolio-item.third {
    flex: 0 0 45% !important;
    max-width: 45% !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
  }

  body.caravage-influences .row.portfolio-container .portfolio-item.second {
    flex: 0 0 10% !important;
    max-width: 10% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Réduire l’espace vertical */
  body.caravage-influences .row.portfolio-container .mb-4 {
    margin-bottom: 6px !important;
  }

  /* Images visibles */
  body.caravage-influences .row.portfolio-container img {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    max-width: 100% !important;
    height: auto !important;
  }

  /* Flèches centrées */
  body.caravage-influences .row.portfolio-container .portfolio-item.second img {
    width: 100% !important;
    max-width: 46px !important;
    margin: 0 auto !important;
  }

  /* ===== Désactiver les clics sur les images (iPhone uniquement) ===== */
  body.caravage-influences .portfolio-container a {
    pointer-events: none !important;
    cursor: default !important;
  }

  /* ==========================================
     MASQUAGE FOOTER (iPhone uniquement)
     On cible un wrapper dédié .ael-footer ajouté dans le HTML
     ========================================== */
  body.caravage-influences .ael-footer {
    display: none !important;
  }
}