/* ==========================================================================
   BLZR — responsive.css
   Mobile-first breakpoints
   ========================================================================== */

/* ---- Tablette : max-width 1024px ---- */
@media (max-width: 1024px){
  .hero-grid{ grid-template-columns:1fr; gap:52px; }
  .hero-visual{ max-width:520px; margin:0 auto; }
  .offer-wrap{ grid-template-columns:1fr; }
  .pricing-card{ position:static; max-width:460px; margin:0 auto; }
  .grid-3{ grid-template-columns:repeat(2,1fr); }
  .footer-grid{ grid-template-columns:1fr 1fr; gap:32px; }
  .admin-stats{ grid-template-columns:repeat(2,1fr); }
}

/* ---- Tablette portrait / large mobile : max-width 820px ---- */
@media (max-width: 820px){
  .nav-links{ display:none; }
  .nav-cta .btn-secondary{ display:none; }
  .nav-toggle{ display:flex; }
  .compare-wrap{ grid-template-columns:1fr; }
  .timeline{ grid-template-columns:1fr 1fr; row-gap:36px; }
  .timeline::before{ display:none; }
  .offer-list{ grid-template-columns:1fr; }
}

/* ---- Mobile : max-width 768px ---- */
@media (max-width: 768px){
  section{ padding:64px 0; }
  .section-head{ margin-bottom:36px; }
  .grid-3, .grid-2{ grid-template-columns:1fr; }
  .hero{ padding-top:calc(var(--nav-h) + 40px); padding-bottom:56px; }
  .hero-actions{ flex-direction:column; align-items:stretch; }
  .hero-actions .btn{ width:100%; }
  .hero-trust{ flex-direction:column; align-items:flex-start; gap:12px; }
  .mock-products{ grid-template-columns:repeat(3,1fr); }
  .footer-grid{ grid-template-columns:1fr; gap:28px; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; }
  .final-cta{ padding:52px 22px; }
  .admin-stats{ grid-template-columns:1fr 1fr; }
  .admin-toolbar{ flex-direction:column; align-items:stretch; }
  .step-indicator .step span.label{ display:none; }
}

/* ---- Petits mobiles : max-width 430px ---- */
@media (max-width: 430px){
  .container{ padding:0 18px; }
  .btn{ padding:14px 20px; font-size:14.5px; }
  .hero-copy h1{ font-size:clamp(28px,8vw,36px); }
  .card{ padding:22px; }
  .pricing-card{ padding:24px; }
  .final-cta{ padding:44px 18px; }
  .badge-live, .badge-speed{ padding:9px 12px; font-size:12px; }
  .badge-live{ right:4%; }
  .mock-products{ gap:8px; }
}

/* ---- Très petits mobiles : max-width 360px ---- */
@media (max-width: 360px){
  .hero-copy h1{ font-size:26px; }
  .section-head h2{ font-size:24px; }
  .pricing-card .price{ font-size:38px; }
  .timeline{ grid-template-columns:1fr; }
}

/* ---- Grands écrans : min-width 1440px ---- */
@media (min-width: 1440px){
  :root{ --container: 1280px; }
  .hero-copy p.lead{ max-width:560px; }
}
@media (min-width: 1920px){
  :root{ --container: 1400px; }
  body{ font-size:17px; }
}