/* ============================================================
   Conexão Abrolhos — Tema "Bitácula" · Responsivo
   Breakpoints 1024 / 768 / 560 + movimento reduzido
   ============================================================ */

/* --- MOVIMENTO REDUZIDO --- */
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    * { transition: none !important; }
    .about__section:hover,
    .tourism-card:hover,
    .attraction-card:hover,
    .tip:hover { translate: none; }
}

/* --- TABLET 768px --- */
@media (min-width: 768px) {
    .about, .tourism, .attractions, .tips { padding: 4.2rem 2rem; }

    .about__content { grid-template-columns: repeat(3, 1fr); }
    .tourism__grid { grid-template-columns: repeat(3, 1fr); }
    .attractions__grid { grid-template-columns: repeat(2, 1fr); }
    .tips__list { grid-template-columns: repeat(2, 1fr); }

    .hero { padding: 5.4rem 2rem 5.8rem; }
}

/* --- DESKTOP 1024px --- */
@media (min-width: 1024px) {
    .attractions__grid { grid-template-columns: repeat(4, 1fr); }
    .tips__list { grid-template-columns: repeat(3, 1fr); }
    .header { padding: 0.95rem 2rem; }
}

/* --- CELULAR 560px --- */
@media (max-width: 560px) {
    .header { padding: 0.75rem 0.9rem; }
    .nav__container { justify-content: center; }
    .nav__menu { display: none; } /* paridade com o layout original */

    .hero { padding: 3.4rem 1rem 3.9rem; }
    .hero__stats { flex-direction: column; align-items: center; }
    .stat { width: 100%; max-width: 300px; }

    .about, .tourism, .attractions, .tips { padding: 2.8rem 1rem; }
    .hero p { font-size: 0.98rem; }
    .tip { padding: 1.2rem 1.1rem; }
    .attraction-card::after { width: 20px; height: 20px; top: 8px; right: 8px; }
}