/* =======================================================
   RIDE MY WAY — RESPONSIVE-ONLY (à coller APRÈS votre CSS)
   ======================================================= */

/* ≤1100px ------------------------------------------------*/
@media (max-width:1100px){
  /* Features premium : 3 → 2 colonnes */
  .cards.cards-premium{ grid-template-columns: 1fr 1fr; }

  /* Footer top : 4 → 2 colonnes */
  .footer-top{ grid-template-columns: 1fr 1fr; }
}

/* ≤1024px ------------------------------------------------*/
@media (max-width:1024px){
  /* Fleet : 3 → 2 colonnes */
  .fleet-grid{ grid-template-columns: repeat(2, 1fr); }
}

/* ≤980px -------------------------------------------------*/
@media (max-width:980px){
  /* Grille download */
  .dl-grid{ grid-template-columns: 1fr; }
  /* Visuels avant le texte sur mobile/tablette */
  .dl-visuals{ order: -1; margin-bottom: 1rem; }

  /* Contact : 2 → 1 colonne */
  .contact-grid{ grid-template-columns: 1fr; }

  /* Download V2 (cartes “devices”) empilées */
  .device-stack{ aspect-ratio:auto; height:auto; padding:8px 0 0; }
  .device-card{ position:relative; width:min(380px, 82vw); margin:10px auto; transform:none; }
  .device-card + .device-card{ margin-top:16px; }
  .device-stack:hover .device-card{ transform:none; }
  .device-stack .rays{ width:100%; height:60%; }
}

/* ≤900px -------------------------------------------------*/
@media (max-width:900px){
  /* Grilles 2 colonnes → 1 colonne */
  .grid-2{ grid-template-columns: 1fr; }

  /* Hero slider : plein largeur + ratio plus haut */
  .hero-slider{ width:100%; aspect-ratio: 4 / 3; }

  /* How it works : image au-dessus des étapes */
  .how-grid{ grid-template-columns: 1fr; }
  .how-illustration{ order:-1; aspect-ratio: 3 / 4; }
  .steps-premium{ order:2; }

  /* (Déjà en place) Alignement du hero conservé */
  .hero .grid-2{ align-items: flex-start; }
}

/* ≤700px -------------------------------------------------*/
@media (max-width:700px){
  /* Galerie : 2 → 1 colonne */
  .gallery{ grid-template-columns: 1fr; }

  /* Footer simple colonne */
  .footer-grid{ grid-template-columns: 1fr; }

  /* FAQ paddings compacts */
  .faq-q{ padding: .9rem .95rem; }
  .faq-a{ padding: 0 .95rem .9rem; }

  /* Bas de page en pile */
  .footer-bottom{ flex-direction:column; align-items:flex-start; }

  /* Points forts du hero : 2 → 1 colonne + wrap autorisé */
  .trust{ grid-template-columns: 1fr; column-gap: 0; }
  .trust li{ white-space: normal; }

  /* Features premium : 2/3 → 1 colonne */
  .cards.cards-premium{ grid-template-columns: 1fr; }
}

/* ≤680px -------------------------------------------------*/
@media (max-width:680px){
  /* Footer top : 2 → 1 colonne */
  .footer-top{ grid-template-columns: 1fr; }
}

/* ≤640px -------------------------------------------------*/
@media (max-width:640px){
  /* Fleet : 2 → 1 colonne */
  .fleet-grid{ grid-template-columns: 1fr; }
}