/* Micro PC Systems - Homepage Styles */
@media (max-width: 768px) {
      .top-bar {
        display: none !important;
      }
      .header .container {
        height: 64px !important;
        padding: 0 16px !important;
      }
      .logo img {
        height: 38px !important;
      }
      .nav-actions {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
      }
      .nav-actions .btn {
        padding: 8px 14px !important;
        font-size: 13px !important;
        white-space: nowrap !important;
        height: 38px !important;
        line-height: 1 !important;
        border-radius: 8px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
      }
      .nav-menu {
        top: 64px !important;
        height: calc(100vh - 64px) !important;
      }
      .hero-portal,
      .portal-hero {
        margin-top: 64px !important;
      }

      /* Calculator Mobile Styles */
      .calc-section {
        padding: 35px 0 !important;
      }
      .calc-wrapper {
        padding: 16px 12px !important;
        gap: 14px !important;
        border-radius: 14px !important;
      }
      .calc-title {
        font-size: 20px !important;
        font-weight: 700 !important;
        line-height: 1.25 !important;
        margin-bottom: 6px !important;
      }
      .calc-subtitle {
        font-size: 12.5px !important;
        margin-bottom: 14px !important;
        line-height: 1.4 !important;
        color: #94a3b8 !important;
      }
      .calc-input-card {
        padding: 14px 12px !important;
        border-radius: 12px !important;
      }
      .calc-input-label {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 8px !important;
        margin-bottom: 10px !important;
      }
      .calc-input-label span:first-child {
        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        color: #e2e8f0 !important;
      }
      .calc-bill-val {
        font-size: 18px !important;
        font-weight: 800 !important;
        color: #a3e635 !important;
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        letter-spacing: -0.2px !important;
        display: inline-block !important;
      }
      .calc-range-slider {
        margin: 4px 0 8px 0 !important;
      }
      .calc-quick-pills {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
        margin-top: 10px !important;
      }
      .calc-quick-pill {
        flex: 1 1 auto !important;
        padding: 6px 8px !important;
        font-size: 11px !important;
        font-weight: 600 !important;
        white-space: nowrap !important;
        text-align: center !important;
        border-radius: 6px !important;
      }
      .calc-results-card {
        padding: 16px 12px !important;
        border-radius: 12px !important;
        margin-top: 4px !important;
      }
      .calc-results-header {
        padding-bottom: 10px !important;
        margin-bottom: 12px !important;
      }
      .calc-results-badge {
        font-size: 10px !important;
        letter-spacing: 0.5px !important;
        margin-bottom: 4px !important;
      }
      .calc-system-size {
        font-size: 28px !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        margin-bottom: 4px !important;
      }
      .calc-system-sub {
        font-size: 11.5px !important;
        line-height: 1.3 !important;
      }
      .calc-metrics-grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 6px !important;
        margin-bottom: 14px !important;
      }
      .calc-metric-item {
        padding: 8px 8px !important;
        border-radius: 8px !important;
      }
      .calc-metric-lbl {
        font-size: 9.5px !important;
        margin-bottom: 2px !important;
        line-height: 1.2 !important;
      }
      .calc-metric-val {
        font-size: 13.5px !important;
        font-weight: 700 !important;
        white-space: nowrap !important;
        line-height: 1.2 !important;
      }
      .calc-results-card .btn-solar {
        padding: 11px 12px !important;
        font-size: 13px !important;
        width: 100% !important;
        border-radius: 8px !important;
      }
    }