/* =================================== */
/*       MEDIA QUERIES - FIXED         */
/* =================================== */

/* Base Responsive */
@media (max-width: 1200px) {
    :root {
        --container-padding: 1.5rem;
        --container-max-width: 1140px;
    }

    .header-wrapper {
        --container-padding: 1.5rem;
        gap: 1rem;
    }
    
    .footer-main-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 2rem;
    }
    
    .nav-list-link span {
        display: none;
    }
    
    .nav-list-link i {
        font-size: 1.3rem;
    }
    
    .hero-title {
        font-size: 3rem;
    }
    
    .about-stats {
        gap: 1.5rem;
    }
}

@media (max-width: 992px) {
    :root {
        --container-padding: 1.25rem;
        --container-max-width: 960px;
    }
    
    .header-wrapper {
        --container-padding: 1.25rem;
        flex-wrap: wrap;
        gap: 1rem;
    }
    
    .brand-block {
        flex: 1;
    }
    
    .main-navigation {
        order: 3;
        width: 100%;
        margin-top: 0.5rem;
    }
    
    .nav-list {
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .mini-ticker {
        display: none;
    }
    
    .header-actions {
        gap: 0.75rem;
    }
    
    .hero-title {
        font-size: 2.5rem;
    }
    
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
    
    .stats-collection {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .page-title {
        font-size: 2.2rem;
    }
    
    .ledger-title {
        font-size: 2.8rem;
    }
    
    .referral-title {
        font-size: 2.8rem;
    }
    
    .about-title {
        font-size: 2.8rem;
    }
    
    .detail-title {
        font-size: 2.5rem;
    }
    
    .withdraw-title {
        font-size: 2.8rem;
    }
    
    .withdrawal-title {
        font-size: 2.8rem;
    }
    
    .faq-title {
        font-size: 2.8rem;
    }
    
    .support-masthead {
        font-size: 2.8rem;
    }
    
    .access-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .faq-collection {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .nexus-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .contact-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .contact-nexus-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    :root {
        --container-padding: 1rem;
        --container-max-width: 720px;
    }
    
    .footer-main-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .footer-bottom-wrapper {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }

    .header-wrapper {
        --container-padding: 1rem;
    }
    
    .profile-info {
        display: none;
    }
    
    .auth-link-primary span,
    .auth-link-accent span {
        display: none;
    }
    
    .auth-link-primary i,
    .auth-link-accent i {
        font-size: 1.2rem;
    }
    
    .hero-title {
        font-size: 2rem;
    }
    
    .hero-description {
        font-size: 1rem;
        max-width: 100%;
    }
    
    .process-strip {
        grid-template-columns: 1fr;
        padding: 1.5rem;
        gap: 2rem;
    }
    
    .process-node:not(:last-child)::after {
        display: none;
    }
    
    .feature-matrix {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .plan-collection {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .stats-dashboard {
        padding: 1.5rem;
    }
    
    .stats-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .testimonial-slider {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .cta-banner {
        padding: 2rem;
        margin: 3rem 0;
    }
    
    .cta-banner h2 {
        font-size: 1.8rem;
    }
    
    .btn-energy, .btn-outline-energy {
        width: 100%;
        justify-content: center;
    }
    
    .greeting-block {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .stats-collection {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .withdrawal-content {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .withdrawal-action {
        width: 100%;
        justify-content: center;
    }
    
    .referral-content {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
    
    .referral-metrics {
        justify-content: center;
    }
    
    .action-strip {
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .insights-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .page-title {
        font-size: 2rem;
        flex-direction: column;
        text-align: center;
    }
    
    .investment-panel-header {
        padding: 1.5rem;
    }
    
    .investment-panel-body {
        padding: 1.5rem;
    }
    
    .payment-display {
        flex-direction: column;
        align-items: center;
    }
    
    .address-box {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .copy-trigger {
        width: 100%;
        justify-content: center;
    }
    
    .action-bar {
        flex-direction: column;
    }
    
    .btn-primary-lg, .btn-secondary-lg {
        width: 100%;
    }
    
    .profit-module {
        flex-direction: column;
        text-align: center;
    }
    
    .tier-showcase {
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .profit-note {
        justify-content: center;
    }
    
    .ledger-title {
        font-size: 2.2rem;
        flex-direction: column;
    }
    
    .ledger-pavilion-header {
        flex-direction: column;
        align-items: flex-start;
        padding: 1.5rem;
    }
    
    .ledger-toolbar {
        width: 100%;
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .ledger-tool-btn {
        width: 100%;
        justify-content: center;
    }
    
    .ledger-filter-panel {
        padding: 1.5rem;
        margin: 1rem;
    }
    
    .ledger-stats-grid {
        grid-template-columns: 1fr;
        padding: 1.5rem;
        gap: 1rem;
    }
    
    .ledger-table-section {
        padding: 0 1rem 1rem;
        overflow-x: auto;
    }
    
    .ledger-table {
        min-width: 750px;
    }
    
    .ledger-empty-vault {
        padding: 3rem 1.5rem;
        margin: 1rem;
    }
    
    .ledger-empty-vault h4 {
        font-size: 1.8rem;
    }
    
    .profile-head-title {
        font-size: 2.2rem;
    }
    
    .profile-edit-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .profile-action-bar {
        flex-direction: column;
    }
    
    .profile-save-btn, .profile-cancel-btn {
        width: 100%;
        justify-content: center;
    }
    
    .profile-image-preview {
        flex-direction: column;
        text-align: center;
    }
    
    .profile-preview-actions {
        width: 100%;
        justify-content: center;
    }
    
    .profile-entry-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .profile-stats-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .profile-form-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .referral-title {
        font-size: 2.2rem;
    }
    
    .referral-link-box {
        flex-direction: column;
    }
    
    .referral-link-action {
        padding: 1rem;
        justify-content: center;
        width: 100%;
    }
    
    .referral-meta {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .referral-steps {
        grid-template-columns: 1fr;
    }
    
    .about-title {
        font-size: 2.2rem;
    }
    
    .about-stats {
        grid-template-columns: 1fr;
        padding: 1.5rem;
        gap: 1.5rem;
    }
    
    .about-grid-2,
    .about-grid-3,
    .about-grid-4 {
        grid-template-columns: 1fr;
    }
    
    .about-revenue-grid {
        grid-template-columns: 1fr;
    }
    
    .about-pillars {
        grid-template-columns: 1fr;
    }
    
    .about-section {
        padding: 1.5rem;
    }
    
    .about-section-header {
        flex-direction: column;
        text-align: center;
    }
    
    .about-foundation-content {
        flex-direction: column;
        text-align: center;
    }
    
    .about-foundation-tags {
        justify-content: center;
    }
    
    .about-cta {
        padding: 2rem;
    }
    
    .about-cta h2 {
        font-size: 1.8rem;
    }
    
    .detail-title {
        font-size: 2rem;
    }
    
    .detail-pavilion-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .detail-info-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .detail-amount-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .detail-transaction-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .detail-timer-content {
        flex-direction: column;
        text-align: center;
    }
    
    .detail-timer-display {
        justify-content: center;
    }
    
    .detail-actions {
        flex-direction: column;
        /* gap: 1rem; */
    }

    .detail-action-group {
        width: 100%;
        flex-direction: column;
    }
    
    .detail-back-btn,
    .detail-reinvest-btn,
    .detail-withdraw-btn {
        width: 100%;
        justify-content: center;
    }
    
    .detail-back-btn, .detail-withdraw-btn {
        width: 100%;
        justify-content: center;
    }
    
    .withdraw-title {
        font-size: 2.2rem;
    }
    
    .withdraw-pavilion-header {
        padding: 1.5rem;
    }
    
    .withdraw-pavilion-header h4 {
        font-size: 1.5rem;
    }
    
    .withdraw-pavilion-body {
        padding: 1.5rem;
    }
    
    .withdraw-alert {
        flex-direction: column;
        text-align: center;
    }
    
    .withdraw-actions {
        flex-direction: column;
    }
    
    .withdraw-submit-btn,
    .withdraw-cancel-btn {
        width: 100%;
    }
    
    .withdraw-balance-amount {
        font-size: 3rem;
    }
    
    .withdrawal-title {
        font-size: 2.2rem;
    }
    
    .withdrawal-stats-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .withdrawal-pavilion-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .faq-title {
        font-size: 2.2rem;
    }
    
    .faq-tab {
        padding: 0.6rem 1.2rem;
        font-size: 0.85rem;
    }
    
    .faq-category-title {
        font-size: 1.6rem;
    }
    
    .faq-question {
        padding: 1rem;
    }
    
    .faq-answer {
        padding: 0 1rem 1rem 2rem;
    }
    
    .faq-contact {
        padding: 2rem 1.5rem;
    }
    
    .faq-contact h2 {
        font-size: 1.8rem;
    }
    
    .faq-contact-buttons {
        flex-direction: column;
        gap: 1rem;
    }
    
    .faq-contact-btn {
        width: 100%;
        justify-content: center;
    }
    
    .support-masthead {
        font-size: 2.2rem;
    }
    
    .support-tagline {
        font-size: 1rem;
    }
    
    .access-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .knowledge-matrix {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .faq-showcase {
        padding: 1.5rem;
    }
    
    .faq-collection {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .contact-nexus {
        padding: 2rem 1.5rem;
    }
    
    .nexus-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .sector-leader h2 {
        font-size: 1.5rem;
    }
    
    .policy-title {
        font-size: 2.2rem;
    }
    
    .chapter-header h2 {
        font-size: 1.6rem;
    }
    
    .security-vault {
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 1.5rem;
    }
    
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .terms-title {
        font-size: 2.2rem;
    }
    
    .article-header h2 {
        font-size: 1.6rem;
    }
    
    .risk-vault, .legal-notice {
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 1.5rem;
    }
    
    .contact-nexus-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .terms-ratification {
        padding: 2rem 1.5rem;
    }
    
    .settings-title {
        font-size: 2.2rem;
    }
    
    .settings-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .status-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .section-header {
        flex-direction: column;
        gap: 0.75rem;
        text-align: center;
    }
    
    .status-banner {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
    
    .quick-actions {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .guide-title {
        font-size: 2.2rem;
    }
    
    .guide-subtitle {
        font-size: 1rem;
    }
    
    .process-ribbon {
        grid-template-columns: 1fr;
        padding: 1.5rem;
        gap: 2rem;
    }
    
    .timeline-block {
        flex-direction: column;
        align-items: flex-start;
        padding: 1.5rem;
    }
    
    .plans-collection {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .features-matrix {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .faq-mini {
        padding: 1.5rem;
    }
    
    .faq-mini-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .register-title {
        font-size: 2.2rem;
    }
    
    .register-progress {
        flex-wrap: wrap;
        gap: 1rem;
    }
    
    .register-progress::before {
        display: none;
    }
    
    .register-step {
        flex: 1 1 40%;
    }
    
    .register-pavilion-header {
        padding: 1.5rem;
    }
    
    .register-pavilion-body {
        padding: 1.5rem;
    }
    
    .register-section {
        padding: 1.5rem;
    }
    
    .register-security {
        flex-direction: column;
        text-align: center;
    }
    
    .login-title {
        font-size: 2.2rem;
    }
    
    .login-pavilion-header {
        padding: 1.5rem;
    }
    
    .login-pavilion-body {
        padding: 1.5rem;
    }
    
    .login-options {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }
    
    .login-security-inner {
        flex-direction: column;
        text-align: center;
    }
    
    .login-trust p {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .login-features {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .login-feature-item {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 576px) {
    :root {
        --container-padding: 0.75rem;
        --container-max-width: 100%;
    }

    .header-wrapper {
        --container-padding: 0.75rem;
        gap: 0.75rem;
    }
    
    .brand-primary {
        font-size: 1rem;
    }
    
    .brand-secondary {
        font-size: 0.7rem;
    }
    
    .brand-emblem {
        width: 40px;
        height: 40px;
    }
    
    .nav-list-link {
        padding: 0.5rem 1rem;
    }
    
    .nav-list-link i {
        font-size: 1.1rem;
    }
    
    .hero-title {
        font-size: 1.8rem;
    }
    
    .hero-description {
        font-size: 0.9rem;
    }
    
    .hero-grand {
        padding: 1rem 0 2rem;
    }
    
    .section-title {
        font-size: 1.8rem;
    }
    
    .section-subtitle {
        font-size: 0.9rem;
    }
    
    .cta-banner h2 {
        font-size: 1.5rem;
    }
    
    .cta-banner p {
        font-size: 0.9rem;
    }
    
    .btn-energy, .btn-outline-energy {
        padding: 0.75rem 1.5rem;
        font-size: 0.9rem;
    }
    
    .page-title {
        font-size: 1.5rem;
    }
    
    .page-subtitle {
        font-size: 0.9rem;
    }
    
    .ledger-title {
        font-size: 1.5rem;
    }
    
    .ledger-subtitle {
        font-size: 0.9rem;
    }
    
    .ledger-empty-vault i {
        font-size: 3rem;
    }
    
    .ledger-empty-vault h4 {
        font-size: 1.2rem;
    }
    
    .ledger-empty-vault p {
        font-size: 0.9rem;
    }
    
    .ledger-page-link {
        padding: 0.4rem 0.8rem;
        font-size: 0.85rem;
    }
    
    .profile-head-title {
        font-size: 1.5rem;
    }
    
    .profile-head-sub {
        font-size: 0.9rem;
    }
    
    .profile-badge-collection {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .profile-badge-item {
        width: 100%;
        justify-content: center;
    }
    
    .profile-wallet-address-box {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .profile-wallet-copy-btn {
        width: 100%;
        justify-content: center;
    }
    
    .profile-edit-body {
        padding: 1rem;
    }
    
    .referral-title {
        font-size: 1.5rem;
    }
    
    .referral-subtitle {
        font-size: 0.9rem;
    }
    
    .referral-stats-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .referral-link-panel {
        padding: 1rem;
    }
    
    .referral-link-header {
        flex-direction: column;
        text-align: center;
    }
    
    .referral-guide {
        padding: 1rem;
    }
    
    .referral-guide-header {
        flex-direction: column;
        text-align: center;
    }
    
    .referral-empty i {
        font-size: 3rem;
    }
    
    .referral-empty h4 {
        font-size: 1.2rem;
    }
    
    .about-title {
        font-size: 1.5rem;
    }
    
    .about-subtitle {
        font-size: 0.9rem;
    }
    
    .about-section-header h2 {
        font-size: 1.3rem;
    }
    
    .about-cta h2 {
        font-size: 1.5rem;
    }
    
    .detail-title {
        font-size: 1.5rem;
    }
    
    .detail-subtitle {
        font-size: 0.9rem;
    }
    
    .detail-pavilion-body {
        padding: 1rem;
    }
    
    .detail-timer-unit {
        min-width: 60px;
        padding: 0.5rem;
    }
    
    .detail-timer-number {
        font-size: 1.2rem;
    }
    
    .withdraw-title {
        font-size: 1.5rem;
    }
    
    .withdraw-subtitle {
        font-size: 0.9rem;
    }
    
    .withdraw-balance-amount {
        font-size: 2rem;
    }
    
    .withdrawal-title {
        font-size: 1.5rem;
    }
    
    .withdrawal-subtitle {
        font-size: 0.9rem;
    }
    
    .withdrawal-pavilion-body {
        padding: 1rem;
    }
    
    .withdrawal-empty i {
        font-size: 3rem;
    }
    
    .withdrawal-empty h4 {
        font-size: 1.2rem;
    }
    
    .withdrawal-primary-btn {
        width: 100%;
        justify-content: center;
    }
    
    .faq-title {
        font-size: 1.5rem;
    }
    
    .faq-subtitle {
        font-size: 0.9rem;
    }
    
    .faq-stats-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .faq-category-title {
        font-size: 1.2rem;
    }
    
    .faq-category-title i {
        font-size: 1rem;
        padding: 0.5rem;
    }
    
    .support-masthead {
        font-size: 1.5rem;
    }
    
    .policy-title {
        font-size: 1.5rem;
    }
    
    .terms-title {
        font-size: 1.5rem;
    }
    
    .settings-title {
        font-size: 1.5rem;
    }
    
    .guide-title {
        font-size: 1.5rem;
    }
    
    .register-title {
        font-size: 1.5rem;
    }
    
    .register-pavilion-header h4 {
        font-size: 1.2rem;
    }
    
    .register-step {
        flex: 1 1 100%;
    }
    
    .register-checkbox {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .login-title {
        font-size: 1.5rem;
    }
    
    .login-pavilion-header h4 {
        font-size: 1.2rem;
    }
    
    .request-title {
        font-size: 1.5rem;
    }
    
    .request-pavilion-header {
        padding: 1rem;
    }
    
    .request-pavilion-header h4 {
        font-size: 1.2rem;
    }
    
    .request-pavilion-body {
        padding: 1rem;
    }
    
    .request-wallet-box {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }
    
    .request-wallet-copy {
        width: 100%;
        justify-content: center;
    }
    
    .chat-capsule {
        width: calc(100vw - 40px);
        right: 20px;
        height: 70vh;
        bottom: 75px;
    }

    .chat-trigger {
        width: 55px;
        height: 55px;
    }

    .chat-trigger i {
        font-size: 1.6rem;
    }

    .action-grid {
        grid-template-columns: 1fr;
        margin-left: 0;
    }

    .action-cell {
        flex-direction: row;
        justify-content: center;
    }
}

/* Tablet Landscape Specific */
@media (min-width: 769px) and (max-width: 992px) {
    .plan-collection {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .stats-collection {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .about-grid-2,
    .about-grid-3 {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Print styles */
@media print {
    .floating-header,
    .market-strip,
    .site-footer,
    .chat-orbital,
    .theme-switcher,
    .alert-container,
    .withdrawal-action,
    .referral-button,
    .action-pill,
    .detail-actions,
    .withdraw-actions,
    .faq-contact,
    .cta-banner,
    .about-cta {
        display: none !important;
    }
    
    body {
        background: white;
        color: black;
    }
    
    .container,
    .container-fluid,
    .dashboard-container,
    .investment-container,
    .ledger-container,
    .profile-zone,
    .referral-zone,
    .about-container,
    .detail-zone,
    .withdraw-zone,
    .withdrawal-zone,
    .request-zone,
    .faq-zone,
    .guide-container,
    .support-arena,
    .policy-domain,
    .terms-realm,
    .settings-nexus,
    .security-settings,
    .notification-settings,
    .wallet-settings {
        padding: 0;
        max-width: 100%;
    }
    
    .dark-surface,
    .dark-bg-tertiary,
    .dark-bg-secondary {
        background: white !important;
        border: 1px solid #ddd !important;
    }
    
    .text-primary-dark,
    .text-secondary-dark {
        color: black !important;
    }
}

/* High Resolution Screens */
@media (min-width: 1920px) {
    :root {
        --container-max-width: 1600px;
        --container-padding: 2.5rem;
    }
    
    .hero-title {
        font-size: 4rem;
    }
    
    .section-title {
        font-size: 3rem;
    }
    
    .stats-collection {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* Dark Mode Print Fix */
@media print {
    .light-theme {
        --dark-bg-primary: white;
        --dark-surface: white;
        --text-primary-dark: black;
        --text-secondary-dark: #333;
    }
}