/* mobile.css – Studio Consulenza Finanziaria Chiusi
   Includere DOPO style.css:
   <link rel="stylesheet" href="mobile.css">
   ------------------------------------------------- */

/* ── TOUCH & ACCESSIBILITÀ BASE ───────────────────────── */
body { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html { -webkit-overflow-scrolling: touch; }
* { -webkit-tap-highlight-color: rgba(201,168,76,.18); }

/* Touch target minimo 44px (WCAG 2.5.5) */
a, button, .btn, .area-card, .srv-card,
.faq-item summary, .menu-toggle { min-height: 44px; }

/* ── TABLET ≤ 1024px ──────────────────────────────────── */
@media (max-width: 1024px) {
  .hero h1 { font-size: clamp(1.9rem, 4.5vw, 2.8rem); }
  .main-nav ul { gap: 18px; }
  .main-nav a { font-size: .88rem; }
  .authority-grid { grid-template-columns: 1fr 1.4fr; gap: 48px; }
  .two-col { gap: 32px; }
  .contact-grid { gap: 40px; }
}

/* ── LARGE MOBILE ≤ 820px ─────────────────────────────── */
@media (max-width: 820px) {
  .header-inner { padding: 12px 0; }
  .logo-text { font-size: 1rem; }
  .hero { min-height: 100svh; }
  .hero-content { padding: 64px 0 48px; }
  .hero h1 { font-size: clamp(1.75rem, 6vw, 2.4rem); }
  .hero-subtitle { font-size: 1rem; }
  .sec-problem, .sec-services, .sec-auth,
  .sec-areas, .sec-test, .sec-faq, .sec-cta { padding: 64px 0; }
  .page-content { padding: 52px 0; }
  .page-hero { padding: 56px 0; }
  .problem-grid { grid-template-columns: 1fr; gap: 36px; }
  .prob-stats { flex-direction: row; flex-wrap: wrap; }
  .stat-card { flex: 1 1 calc(50% - 12px); min-width: 140px; }
  .authority-grid { grid-template-columns: 1fr; gap: 36px; }
  .auth-img { font-size: 2.8rem; }
  .areas-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; }
  .area-card { padding: 20px 14px; }
  .test-grid { grid-template-columns: 1fr; }
  .contact-grid { grid-template-columns: 1fr; }
  .contact-form { padding: 28px 24px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
}

/* ── MOBILE ≤ 600px ───────────────────────────────────── */
@media (max-width: 600px) {
  .container { padding: 0 16px; }

  /* Hero */
  .hero-content { padding: 56px 0 40px; }
  .hero-badge { font-size: .78rem; padding: 5px 12px; }
  .hero h1 { font-size: clamp(1.6rem, 7.5vw, 2.2rem); line-height: 1.2; }
  .hero-subtitle { font-size: .95rem; margin-bottom: 28px; }
  .hero-cta { flex-direction: column; gap: 12px; }
  .hero-cta .btn { width: 100%; justify-content: center; }
  .hero-trust { flex-direction: column; gap: 8px; }
  .hero-trust span { font-size: .82rem; }

  /* Sections */
  .sec-head h2 { font-size: clamp(1.3rem, 5.5vw, 1.8rem); }
  .sec-head p { font-size: .95rem; }

  /* Stats */
  .stat-card { flex: 1 1 100%; }
  .stat-n { font-size: 1.75rem; }

  /* Services */
  .srv-grid { grid-template-columns: 1fr; gap: 16px; }
  .srv-card { padding: 28px 22px; }
  .srv-icon { font-size: 1.9rem; margin-bottom: 14px; }

  /* Areas */
  .areas-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .area-card { padding: 18px 12px; }
  .area-card h3 { font-size: .95rem; }
  .area-card p { font-size: .75rem; }

  /* Testimonials */
  .test-card { padding: 28px 22px; }
  .test-card p { font-size: .95rem; }

  /* FAQ */
  .faq-item summary { padding: 16px 18px; font-size: .95rem; }
  .faq-item p { padding: 0 18px 16px; font-size: .9rem; }

  /* CTA */
  .cta-btns { flex-direction: column; gap: 12px; }
  .cta-btns .btn { width: 100%; justify-content: center; }

  /* Inner pages */
  .page-hero { padding: 48px 0; }
  .page-hero h1 { font-size: clamp(1.5rem, 6.5vw, 2.2rem); }
  .page-hero p { font-size: .95rem; }
  .page-content h2 { font-size: 1.3rem; }
  .page-content h3 { font-size: 1.1rem; }
  .highlight-box { padding: 18px 20px; }
  .two-col { grid-template-columns: 1fr; gap: 0; }

  /* Form */
  .contact-form { padding: 24px 18px; border-radius: 10px; }
  .form-group label { font-size: .85rem; }
  .form-group input,
  .form-group textarea,
  .form-group select { padding: 11px 14px; font-size: .9rem; }
  .form-submit { padding: 15px; font-size: .95rem; }

  /* Footer */
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 24px; }
  .footer-col h4 { font-size: .9rem; margin-bottom: 12px; }
  .footer-col address p,
  .footer-col ul li { font-size: .83rem; }
  .footer-badge { font-size: .75rem; padding: 5px 10px; }
  .footer-bottom { font-size: .75rem; }

  /* 404 */
  .p404 h1 { font-size: clamp(4rem, 20vw, 7rem); }
  .p404 h2 { font-size: 1.3rem; }

  /* Space for sticky CTA bar */
  body { padding-bottom: 72px; }
}

/* ── SMALL MOBILE ≤ 400px ─────────────────────────────── */
@media (max-width: 400px) {
  .container { padding: 0 12px; }
  .hero h1 { font-size: 1.55rem; }
  .areas-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .btn-lg { padding: 15px 22px; font-size: 1rem; }
  .srv-card, .test-card { padding: 24px 18px; }
}

/* ── STICKY CTA BAR (solo mobile) ────────────────────── */
.mobile-cta-bar {
  display: none;
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 200;
  background: #0b1f4a; border-top: 2px solid #c9a84c;
  padding: 10px 16px; gap: 10px;
  box-shadow: 0 -4px 20px rgba(0,0,0,.25);
}
.mobile-cta-bar a {
  flex: 1; display: flex; align-items: center; justify-content: center;
  gap: 6px; padding: 12px 8px; border-radius: 8px;
  font-weight: 700; font-size: .88rem; min-height: 48px;
}
.mobile-cta-bar .cta-call { background: #c9a84c; color: #0b1f4a; }
.mobile-cta-bar .cta-contact {
  background: transparent; color: #fff;
  border: 1.5px solid rgba(255,255,255,.45);
}
@media (min-width: 601px) { .mobile-cta-bar { display: none !important; } }
@media (max-width: 600px)  { .mobile-cta-bar { display: flex; } }

/* ── REDUCED MOTION ───────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ── DARK MODE (sistema) ──────────────────────────────── */
@media (prefers-color-scheme: dark) {
  .sec-services, .sec-test { background: var(--D); }
  .srv-card { background: #1e293b; border-color: #334155; }
  .srv-card h3 { color: #e2e8f5; }
  .srv-card p { color: #94a3b8; }
  .test-card { background: #1e293b; }
  .test-card p { color: #94a3b8; }
  .test-card footer strong { color: #e2e8f5; }
  .faq-item { background: #1e293b; border-color: #334155; }
  .faq-item summary { color: #e2e8f5; }
  .faq-item p { color: #94a3b8; }
  .highlight-box { background: #1e293b; }
  .highlight-box p { color: #94a3b8; }
  .contact-form { background: #1e293b; }
  .form-group input,
  .form-group textarea,
  .form-group select {
    background: #0f172a; border-color: #334155; color: #e2e8f5;
  }
}