/**
 * Responsive Styles
 */

/* Tablet */
@media (max-width: 1199px) {
    .tools-grid { grid-template-columns: repeat(2, 1fr); }
    .footer-grid { grid-template-columns: repeat(2, 1fr); }
    .calc-sidebar-col { width: 300px; }
    .stats-grid { gap: 2rem; }
    .hero-title { font-size: 2.25rem; }
}

/* Mobile */
@media (max-width: 767px) {
    /* Header */
    .menu-toggle { display: flex; }
    .main-navigation ul {
        display: none;
        flex-direction: column;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: var(--white);
        border-top: 1px solid var(--light-border);
        box-shadow: var(--shadow-lg);
        padding: 1rem;
        gap: 0;
    }
    .main-navigation.toggled ul { display: flex; }
    .main-navigation .menu-item a { padding: 0.75rem 1rem; }
    .main-navigation .sub-menu {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        border: none;
        padding-left: 1rem;
    }
    .header-search-form { width: 100%; left: 0; right: 0; position: fixed; top: 60px; padding: 0.5rem; }

    /* Hero */
    .hero-section { padding: 2.5rem 1rem 2rem; }
    .hero-title { font-size: 1.75rem; }
    .hero-subtitle { font-size: 0.95rem; }
    .hero-badges { gap: 0.75rem; }
    .hero-badge { font-size: 0.8rem; padding: 0.375rem 0.75rem; }

    /* Stats */
    .stats-grid { gap: 1rem; }
    .stat-number { font-size: 1.25rem; }

    /* Tool Cards */
    .tools-grid,
    .tools-grid-full { grid-template-columns: 1fr; }
    .tool-card-arrow { opacity: 1; }

    /* Calculator Layout */
    .calc-layout { flex-direction: column; }
    .calc-sidebar-col { width: 100%; position: static; }
    .calc-page-title { font-size: 1.5rem; }
    .calc-page-meta { flex-direction: column; gap: 0.25rem; }

    /* Calculator Widget */
    .calculator-widget { padding: 1.25rem; }
    .calc-input-row { grid-template-columns: 1fr; }
    .calc-result-value { font-size: 1.5rem; }
    .calc-actions { flex-direction: column; }
    .calc-btn { width: 100%; text-align: center; }

    /* Footer */
    .footer-grid { grid-template-columns: 1fr; }
    .footer-bottom-inner { flex-direction: column; text-align: center; gap: 0.5rem; }

    /* Archive */
    .archive-header { padding: 1rem 0; }
    .archive-title { font-size: 1.5rem; }

    /* Section Headers */
    .section-header { flex-direction: column; align-items: flex-start; gap: 0.75rem; }

    /* Content */
    .calc-content-section { padding: 1.25rem; }
    .calc-faq-section { padding: 1.25rem; }
    .page-content-box { padding: 1.25rem; }

    /* AI Chat */
    .ai-chat-panel { width: calc(100vw - 1.5rem); right: 0.75rem; bottom: 70px; height: 60vh; }
    .ai-chat-fab { bottom: 16px; right: 16px; padding: 0.75rem 1rem; font-size: 0.85rem; }

    /* Amortization */
    .calc-amort-table { font-size: 0.75rem; }
    .calc-amort-table th, .calc-amort-table td { padding: 0.375rem 0.5rem; }
}

/* Small mobile */
@media (max-width: 380px) {
    .hero-title { font-size: 1.5rem; }
    .hero-badges { flex-direction: column; align-items: center; }
    .container { padding: 0 1rem; }
}

/* Ensure 16px min on iOS to prevent zoom */
@media (max-width: 767px) {
    input[type="text"],
    input[type="number"],
    input[type="email"],
    input[type="search"],
    input[type="tel"],
    select,
    textarea { font-size: 16px !important; }
}

/* Touch targets */
@media (pointer: coarse) {
    .calc-input,
    .calc-select,
    .calc-btn,
    .search-field,
    .search-submit,
    .ai-chat-input,
    .ai-chat-send,
    .ai-explain-btn { min-height: 44px; }
}
