/* ============================================================
   AQUA MART — CAMADA RESPONSIVA DO SITE PÚBLICO
   Carregada logo depois do style.css (includes/header.php).
   ============================================================ */
html { -webkit-text-size-adjust: 100%; }
img, video, iframe { max-width: 100%; }
@supports (overflow: clip) { body { overflow-x: clip; } }

/* Menu "hambúrguer" vira X quando aberto */
.nav-toggle span { transition: transform .25s, opacity .2s; }
.nav-toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2) { opacity: 0; }
.nav-toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Tablet: menu um pouco mais compacto para caber em uma linha */
@media (max-width: 1024px) and (min-width: 901px) {
    .nav-container { padding: 0 1.25rem; gap: 1rem; }
    .nav-menu a { padding: .5rem .6rem; font-size: .7rem; letter-spacing: .5px; }
}

/* Até 900px o menu vira gaveta (antes só acontecia em 640px e estourava no tablet) */
@media (max-width: 900px) {
    .navbar { height: 64px; }
    .nav-container { padding: 0 1.1rem; }
    .nav-toggle { display: flex; min-width: 44px; min-height: 44px; align-items: center; justify-content: center; }
    .nav-menu {
        display: none; position: fixed; top: 64px; left: 0; right: 0;
        background: rgba(10,22,40,.99); flex-direction: column; align-items: stretch;
        padding: .75rem 1.1rem 1.25rem; gap: .2rem;
        border-bottom: 1px solid rgba(26,122,191,.2); z-index: 999;
        max-height: calc(100vh - 64px); overflow-y: auto;
        box-shadow: 0 18px 40px rgba(0,0,0,.45);
    }
    .nav-menu.open { display: flex; }
    .nav-menu a { padding: .85rem .6rem; font-size: .82rem; border-radius: 8px; }
    .nav-menu a.active::after { display: none; }
    .nav-menu a.active { background: rgba(33,150,243,.12); }
    .nav-sep { display: none; }
    .nav-btn-cadastro { text-align: center; margin: .35rem 0; }
    .hero-index { padding-top: 64px; }
    .page-hero { padding-top: 110px; }
    .footer-inner { grid-template-columns: 1fr 1fr; gap: 2rem; }
}

@media (max-width: 640px) {
    .logo-sub { display: none; }
    .nav-logo-img { height: 34px !important; }
    .site-footer { padding: 2.5rem 1.25rem 1.5rem; }
    .footer-inner { grid-template-columns: 1fr; gap: 1.75rem; }
    .footer-dev { flex-direction: column-reverse; justify-content: center; text-align: center; gap: .7rem; padding-bottom: 72px; }
    .footer-copy { font-size: .76rem; max-width: 300px; }
    .footer-dev-logo { height: 40px; }
    .page-hero { min-height: 0; padding: 100px 1.25rem 40px; }
    /* campos com 16px = sem zoom automático no iPhone */
    input, select, textarea, .form-control { font-size: 16px !important; }
    .cadastro-card { padding: 1.6rem 1.2rem; border-radius: 14px; }
    .btn-primary { padding: .9rem 1.2rem; letter-spacing: 1px; }
}