/* ===== RESPONSIVE DESIGN ===== */

/* Tablet */
@media (max-width: 1024px) {
  .features-grid { grid-template-columns: repeat(2, 1fr); }
  .pricing-grid { grid-template-columns: repeat(2, 1fr); }
  .pricing-card.popular { transform: none; }
  .testimonials-grid { grid-template-columns: repeat(2, 1fr); }
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .dashboard-grid { grid-template-columns: repeat(2, 1fr); }
  .dashboard-grid-3 { grid-template-columns: repeat(2, 1fr); }
  .dashboard-grid-4 { grid-template-columns: repeat(2, 1fr); }
  .dashboard-grid-6 { grid-template-columns: repeat(3, 1fr); }

  .split-layout { flex-direction: column; height: auto; }
  .split-left { width: 100%; height: auto; max-height: 50vh; border-right: none; border-bottom: 1px solid var(--border); }
  .split-right { width: 100%; height: 50vh; }

  .footer-grid { grid-template-columns: repeat(2, 1fr); }

  .sidebar { transform: translateX(-100%); }
  .sidebar.open { transform: translateX(0); }
  .main-content.with-sidebar { margin-left: 0; }

  .header-nav { display: none; }
  .header-mobile-toggle { display: flex; }

  /* Landing tablet */
  .hero-split { grid-template-columns: 1fr; gap: var(--space-8); }
  .hero-visual { display: none; }
  .landing-how-grid { grid-template-columns: 1fr; gap: var(--space-8); }
  .landing-how-visual { order: -1; }
  .landing-how-img { height: 300px; max-width: 100%; }
  .landing-role-features { grid-template-columns: 1fr; }
  .landing-services-grid { grid-template-columns: 1fr; gap: var(--space-8); }
  .landing-carnet-grid { grid-template-columns: 1fr; gap: var(--space-8); }
  .landing-carnet-mockup { order: -1; }
  .landing-eco-grid { grid-template-columns: 1fr; gap: var(--space-8); }
  .landing-eco-stat { margin-bottom: var(--space-4); }
  .landing-cta-grid { grid-template-columns: 1fr; gap: var(--space-8); text-align: center; }
  .landing-cta-text { text-align: center; }
  .landing-stats-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-4); }
}

/* Mobile */
@media (max-width: 768px) {
  :root {
    --header-height: 56px;
    --text-4xl: 1.875rem;
    --text-3xl: 1.5rem;
    --text-2xl: 1.25rem;
  }

  .hero { padding: var(--space-12) 0 var(--space-8); }
  .hero h1 { font-size: var(--text-3xl); }
  .hero-stats { flex-direction: column; gap: var(--space-4); }
  .hero-cta { flex-direction: column; }
  .hero-cta .btn { width: 100%; }

  /* Landing mobile */
  .hero-search-bar { flex-direction: column; gap: var(--space-2); padding: var(--space-3); }
  .hero-search-bar .btn { width: 100%; }
  .hero-trust { flex-direction: column; gap: var(--space-3); }
  .social-proof-row { justify-content: flex-start; gap: var(--space-6); padding: 0 var(--space-4); overflow-x: auto; flex-wrap: nowrap; }
  .landing-how-visual { display: none; }
  .landing-how-grid { grid-template-columns: 1fr; }
  .landing-services-cards { grid-template-columns: 1fr; }
  .landing-eco-number { font-size: 3.5rem; }
  .landing-carnet-checklist { grid-template-columns: 1fr; }
  .landing-property-card { min-width: 260px; }
  .landing-stats-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-2); }
  .landing-stat-number { font-size: 2rem; }

  .features-grid { grid-template-columns: 1fr; }
  .testimonials-grid { grid-template-columns: 1fr; }
  .pricing-grid { grid-template-columns: 1fr; }
  .services-grid { grid-template-columns: 1fr; }
  .dashboard-grid { grid-template-columns: 1fr; }
  .dashboard-grid-3 { grid-template-columns: 1fr; }
  .dashboard-grid-4 { grid-template-columns: repeat(2, 1fr); }
  .dashboard-grid-6 { grid-template-columns: repeat(2, 1fr); }
  .grid-2 { grid-template-columns: 1fr; }
  .grid-3 { grid-template-columns: 1fr; }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }

  .footer-grid { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; gap: var(--space-4); text-align: center; }

  /* Auth */
  .auth-page { flex-direction: column; }
  .auth-left { display: none; }
  .auth-right { padding: var(--space-4); }
  .role-cards { grid-template-columns: 1fr; }

  /* Property Cards */
  .property-list { grid-template-columns: 1fr; }
  .property-card-image { height: 180px; }

  /* Marketplace - override inline styles */
  .marketplace-layout {
    flex-direction: column !important;
    height: auto !important;
    overflow: visible !important;
    min-height: calc(100vh - var(--header-height) - var(--mobile-nav-height, 0px));
  }
  .marketplace-left {
    width: 100% !important;
    border-right: none !important;
    border-bottom: 1px solid var(--border);
    overflow: visible !important;
    max-height: none !important;
  }
  .marketplace-right {
    width: 100% !important;
    height: 300px !important;
    order: -1;
  }
  .split-left { max-height: none; }
  .split-right { height: 300px; }

  /* Modal */
  .modal {
    max-width: 100%;
    max-height: 100vh;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    margin-top: auto;
  }

  .modal-overlay { align-items: flex-end; padding: 0; }

  /* Stepper */
  .stepper { overflow-x: auto; }
  .step-label { display: none; }

  /* Tabs */
  .tabs { overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* Table to Card */
  .table-mobile-card .table thead { display: none; }
  .table-mobile-card .table tr { display: block; border: 1px solid var(--border); border-radius: var(--radius-lg); margin-bottom: var(--space-3); padding: var(--space-3); }
  .table-mobile-card .table td { display: flex; justify-content: space-between; padding: var(--space-2); border: none; }
  .table-mobile-card .table td::before { content: attr(data-label); font-weight: var(--font-semibold); color: var(--text-muted); font-size: var(--text-xs); text-transform: uppercase; }

  /* Maya Chat */
  .maya-panel { width: calc(100vw - var(--space-8)); right: calc(-1 * var(--space-6) + var(--space-4)); }

  /* Show mobile nav on small screens */
  .mobile-nav { display: flex; }

  /* Bottom padding for mobile nav */
  .main-content { padding-bottom: var(--mobile-nav-height); }

  /* Move role switcher above mobile nav */
  .role-switcher { bottom: calc(var(--mobile-nav-height) + var(--space-3)); }

  /* OTP */
  .otp-input { width: 40px; height: 48px; font-size: var(--text-xl); }

  /* Kanban - horizontal scroll */
  .kanban-board { flex-wrap: nowrap; }
  .kanban-column { min-width: 260px; }

  .document-grid { grid-template-columns: repeat(2, 1fr); }

  /* Property Detail */
  .property-detail-hero { height: 250px; }
  .property-detail-grid { grid-template-columns: 1fr; }
  .property-detail-grid .contact-card-col { position: static; }
  .detail-grid-2 { grid-template-columns: 1fr; }
  .profile-grid { grid-template-columns: 1fr; }
}

/* Small Mobile */
@media (max-width: 480px) {
  .dashboard-grid-3 { grid-template-columns: 1fr; }
  .dashboard-grid-4 { grid-template-columns: 1fr; }
  .dashboard-grid-6 { grid-template-columns: 1fr; }
  .document-grid { grid-template-columns: 1fr; }
  .otp-inputs { gap: var(--space-2); }
  .otp-input { width: 36px; height: 44px; }
}

/* Desktop Large */
@media (min-width: 1440px) {
  .container { padding: 0 var(--space-8); }
}

/* Print */
@media print {
  .header, .sidebar, .mobile-nav, .maya-chat, .role-switcher, .toast-container { display: none !important; }
  .main-content { margin-left: 0 !important; }
  body { color: #000; background: #fff; }
}