/* Mobile polish — Les Plats de Manya
 * Refonte esthétique mobile : typo douce, espacements aerés, cartes propres.
 * Charge en derniere position pour ecraser les media queries inline du theme.
 */

@media (max-width: 768px) {

  /* ===== TYPOGRAPHIE GENERALE ===== */
  html { font-size: 15px; }
  body { line-height: 1.55; }

  /* ===== NAV — compact mobile, pas de wrap du logo ===== */
  nav {
    padding: 0.75rem 0.9rem !important;
    gap: 0.5rem;
  }
  nav.scrolled { padding: 0.6rem 0.9rem !important; }
  .nav-logo {
    gap: 0.5rem !important;
    flex-shrink: 0;
  }
  .nav-logo-img {
    height: 38px !important;
    width: 38px !important;
    border-width: 1.5px;
    flex-shrink: 0;
  }
  .nav-logo-text {
    display: none !important; /* sur mobile on cache le texte, le logo suffit */
  }
  .nav-cart-btn, .auth-nav-btn {
    padding: 0.4rem 0.7rem !important;
    font-size: 0.68rem !important;
    border-radius: 100px;
    white-space: nowrap;
  }
  .nav-cart-btn { gap: 0.3rem; }
  .auth-text { display: none; } /* on garde juste l'icone profile */
  .user-nav-info { gap: 0.4rem; }
  .user-nav-avatar { width: 24px !important; height: 24px !important; }
  .user-nav-name { max-width: 55px; font-size: 0.68rem; }
  .user-nav-logout { font-size: 0.6rem !important; }
  .nav-actions { gap: 0.4rem; flex-shrink: 0; }

  /* ===== HERO — refonte complete pour mobile : layout vertical centre ===== */
  .hero {
    min-height: 95vh !important;
    padding: 5rem 1.2rem 3rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important; /* centre verticalement au lieu de flex-end */
  }
  /* On vire l'absolute du hero-top : tout passe en flow normal sur mobile */
  .hero-top {
    position: static !important;
    padding: 0 !important;
    margin-bottom: 1.5rem !important;
    text-align: center;
  }
  .hero-tag {
    font-size: 0.62rem !important;
    letter-spacing: 0.22em !important;
    margin-bottom: 0 !important;
    justify-content: center;
    color: rgba(255,255,255,0.9) !important;
  }
  .hero-tag::before { width: 20px !important; }
  .hero-main {
    margin: 0 0 2rem !important;
    padding: 0 !important;
    text-align: center;
    position: relative !important;
    z-index: 4;
  }
  .hero-title {
    font-size: clamp(2.2rem, 9vw, 3.2rem) !important;
    line-height: 1.05 !important;
    text-align: center !important;
    letter-spacing: -0.01em;
    max-width: 100% !important;
  }
  .hero-title .line1,
  .hero-title .line2,
  .hero-title .line3 {
    display: block;
    margin-top: 0.08em !important;
  }
  .hero-subtitle-row {
    margin-top: 1.8rem !important;
    min-height: unset !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 1.4rem;
    position: static !important;
  }
  .hero-sub {
    position: static !important;
    max-width: 92% !important;
    font-size: 0.92rem !important;
    text-align: center !important;
    margin: 0 auto !important;
    line-height: 1.5;
  }
  .hero-actions {
    position: static !important;
    flex-direction: column !important;
    gap: 0.7rem !important;
    width: 100%;
    align-items: stretch !important;
  }
  .hero-actions .btn-fire,
  .hero-actions a.btn-fire {
    width: 100%;
    text-align: center;
    padding: 1rem 1.5rem !important;
    font-size: 0.92rem !important;
    border-radius: 8px !important;
    letter-spacing: 0.08em;
  }
  .hero-actions .btn-ghost {
    padding: 0.85rem 1rem !important;
    border: 1px solid rgba(255,255,255,0.5) !important;
    border-radius: 8px !important;
    text-align: center;
    font-size: 0.85rem !important;
  }
  .hero-slider-dots { bottom: 1.2rem !important; right: 1.2rem !important; }
  .hero-slider-counter { display: none !important; }
  .hero-scroll-line { display: none !important; }

  /* ===== TICKER ===== */
  .ticker { padding: 0.65rem 0; }
  .ticker-item { padding: 0 1.5rem; font-size: 0.62rem; }

  /* ===== SECTIONS — padding aere ===== */
  .about,
  .services,
  .menu-section,
  .manifesto,
  .testi,
  .zone,
  .insta,
  .cta,
  .google-reviews,
  .presta-section {
    padding: 3.5rem 1.2rem !important;
  }
  .s-title {
    font-size: clamp(1.9rem, 8vw, 2.6rem) !important;
    line-height: 1.1 !important;
    letter-spacing: -0.01em;
  }
  .s-label { font-size: 0.6rem; letter-spacing: 0.2em; }
  .s-label::before { width: 20px; }

  /* ===== ABOUT ===== */
  .about {
    grid-template-columns: 1fr !important;
    gap: 2.5rem !important;
  }
  .about-photo-wrap {
    padding-right: 0 !important;
    padding-bottom: 1.5rem !important;
    max-width: 85%;
    margin: 0 auto;
  }
  .about-float {
    position: relative !important;
    bottom: auto !important;
    right: auto !important;
    max-width: 100% !important;
    margin-top: 1.5rem;
    padding: 1.2rem 1.5rem;
    border-radius: 10px;
  }
  .about-float q { font-size: 0.95rem; }
  .about-text { font-size: 0.95rem; line-height: 1.85; }
  .about-sig { gap: 1rem; padding-top: 1.2rem; margin-top: 1.8rem; }

  /* ===== NUMBERS ===== */
  .numbers {
    grid-template-columns: repeat(2, 1fr) !important;
    padding: 3rem 1.2rem !important;
    gap: 0;
  }
  .number-item {
    padding: 1.5rem 1rem !important;
    border-bottom: 1px solid rgba(255,255,255,0.12);
  }
  .number-item:nth-child(2) { border-right: none !important; }
  .number-item:nth-child(3),
  .number-item:nth-child(4) { border-bottom: none; }
  .number-val { font-size: 2.4rem !important; }
  .number-val sub { font-size: 1.1rem; }
  .number-label { font-size: 0.6rem; margin-top: 0.4rem; }

  /* ===== SERVICES ===== */
  .services-header {
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
    margin-bottom: 2.5rem !important;
  }
  .services-grid {
    grid-template-columns: 1fr !important;
    gap: 1px !important;
  }
  .svc { padding: 2.2rem 1.5rem !important; }
  .svc-num { font-size: 3.5rem; top: 1rem; right: 1.2rem; opacity: 0.05; }
  .svc-name { font-size: 1.5rem; }
  .svc-desc { font-size: 0.88rem; margin-bottom: 1.4rem; }
  .svc-features li { font-size: 0.8rem; }

  /* ===== MENU HEBDO (vitrine) ===== */
  .shop-category-label { font-size: 0.68rem; }
  .shop-grid {
    grid-template-columns: 1fr !important;
    gap: 0.9rem !important;
  }
  .shop-item { padding: 1.2rem; border-radius: 12px; }
  .shop-item-name { font-size: 1.05rem; }
  .shop-item-price { font-size: 1.1rem; }
  .shop-item-desc { font-size: 0.78rem; }
  .menu-header {
    flex-direction: column !important;
    gap: 1.5rem;
    align-items: flex-start !important;
  }
  .menu-footer {
    flex-direction: column !important;
    text-align: center;
    gap: 1.2rem !important;
    padding: 1.8rem 1.3rem !important;
  }
  .menu-footer p { max-width: 100% !important; }

  /* ===== MANIFESTO ===== */
  .manifesto-quote {
    font-size: clamp(1.3rem, 6vw, 1.8rem) !important;
    line-height: 1.4 !important;
    margin-bottom: 2rem;
  }
  .manifesto-quote::before { font-size: 5rem; margin-bottom: 0.5rem; }
  .values-row {
    grid-template-columns: 1fr !important;
    margin-top: 3rem !important;
  }
  .val {
    padding: 2rem 1.5rem !important;
    border-right: none !important;
    border-bottom: 1px solid rgba(255,255,255,0.08);
  }
  .val:last-child { border-bottom: none; }
  .val-icon { width: 42px; height: 42px; font-size: 1.1rem; margin-bottom: 1rem; }
  .val-name { font-size: 1.2rem; }
  .val-text { font-size: 0.85rem; }

  /* ===== PRESTATIONS ===== */
  .presta-header { gap: 1.5rem; flex-direction: column; }
  .presta-icon { font-size: 2rem; margin-bottom: 0.6rem; }
  .presta-header-right p { font-size: 0.88rem; }
  .presta-grid { grid-template-columns: 1fr !important; gap: 1rem; }
  .presta-card { padding: 1.4rem !important; border-radius: 12px; }
  .presta-card-title { font-size: 1.05rem; }
  .presta-card-price { font-size: 1.15rem; }
  .presta-card-desc { font-size: 0.82rem; line-height: 1.6; }
  .presta-cta { flex-direction: column; gap: 0.7rem; align-items: stretch; }
  .presta-cta .btn-fire { width: 100%; text-align: center; padding: 1rem 1.5rem !important; border-radius: 8px; }

  /* ===== TESTIMONIALS / AVIS ===== */
  .testi-grid,
  .google-reviews-grid {
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
    margin-top: 2.5rem;
  }
  .tcard, .g-review { padding: 1.6rem 1.4rem; }
  .tcard-text { font-size: 0.95rem; }

  /* ===== ZONE LIVRAISON ===== */
  .zone {
    grid-template-columns: 1fr !important;
    gap: 2.5rem !important;
  }
  .zone-cities { gap: 0.4rem; }
  .city-pill { font-size: 0.65rem; padding: 0.3rem 0.7rem; }

  /* ===== INSTAGRAM ===== */
  .insta-header { flex-direction: column; gap: 1rem; align-items: flex-start; margin-bottom: 1.8rem; }
  .insta-grid { grid-template-columns: repeat(3, 1fr) !important; gap: 1px; }

  /* ===== CTA ===== */
  .cta {
    grid-template-columns: 1fr !important;
    gap: 2.5rem !important;
  }
  .cta-sub { font-size: 0.92rem; max-width: 100%; margin-top: 1rem; }
  .ccard { padding: 1.1rem 1.3rem; gap: 1rem; border-radius: 10px; }
  .ccard-val { font-size: 0.9rem; }
  .ccard-icon { width: 38px; height: 38px; font-size: 1rem; }
  .cta-social { padding: 1.1rem 1.3rem; }

  /* ===== FOOTER ===== */
  .footer-top {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
    padding: 2.2rem 1.5rem !important;
    text-align: center;
  }
  .footer-brand p { max-width: 100%; margin: 1rem auto 0; }
  .footer-col h4 { margin-top: 0.5rem; }
  .footer-bottom {
    flex-direction: column;
    gap: 1rem;
    text-align: center;
    padding: 1.2rem 1.5rem !important;
  }

  /* ===== TOAST ===== */
  .manya-toast {
    bottom: 1rem;
    left: 1rem;
    right: 1rem;
    transform: translateY(100px);
    width: calc(100% - 2rem);
    max-width: 100%;
    border-radius: 12px;
    font-size: 0.85rem;
    padding: 0.9rem 1.2rem;
  }
  .manya-toast.show { transform: translateY(0); }

  /* ===== BOUTIQUE (page-boutique) — touchables plus gros ===== */
  .add-btn,
  .shop-add-btn {
    padding: 0.7rem 1.3rem !important;
    font-size: 0.82rem !important;
    border-radius: 100px;
    min-height: 44px;
  }
  .qty-btn, .shop-qty-btn {
    width: 36px !important;
    height: 36px !important;
    font-size: 1.05rem;
  }
  .plat-card, .formule-card {
    border-radius: 14px;
  }

  /* ===== MODAL — pleine largeur sur mobile ===== */
  .formule-modal {
    width: calc(100% - 1.5rem) !important;
    max-width: calc(100% - 1.5rem) !important;
    padding: 1.5rem !important;
    border-radius: 16px 16px 0 0;
    margin-top: auto;
    align-self: flex-end;
  }
  .formule-modal-overlay { align-items: flex-end; }

  /* ===== UTILITAIRES ===== */
  /* Cache les decorations parfois moches sur mobile */
  .hero-grid-lines,
  .about-photo-corner { display: none; }

  /* Smooth scroll vers les ancres */
  html { scroll-padding-top: 4rem; }
}

/* ===== TRES PETIT MOBILE (iPhone SE et co) ===== */
@media (max-width: 380px) {
  .hero-title { font-size: clamp(2.1rem, 11vw, 2.8rem) !important; }
  .s-title { font-size: 1.7rem !important; }
  .hero { padding: 0 0.9rem 2.5rem !important; }
  .hero-top { padding: 5rem 0.9rem 0 !important; }
}