/* ============================================================
   AJIT CONSTRUCTION — Responsive Overrides
   Cascade order: this file loads AFTER main.css so it wins ties.
   Inline styles still beat us, so for inline grid-template-columns
   we use !important media queries.
   ============================================================ */

/* ── 1200px and below ───────────────────────────────────── */
@media (max-width: 1200px) {
  .container, .container-sm, .container-wide { padding-left: 1.75rem; padding-right: 1.75rem; }
}

/* ── 1100px – tablet landscape ──────────────────────────── */
@media (max-width: 1100px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 3rem; }
  .feature-grid, .project-grid, .gallery-project-grid { grid-template-columns: 1fr 1fr; }
  .stats-grid, .grid-4, .process-grid { grid-template-columns: repeat(2, 1fr); }
  .split { grid-template-columns: 1fr !important; min-height: auto; }
  .split-media { height: 420px; }
  .split-content { padding: 4rem 2.5rem; }
  .split.reverse > .split-media,
  .split.reverse > .split-content { order: unset; }

  .timeline::before { left: 28px; }
  .timeline-item { grid-template-columns: 60px 1fr; }
  .timeline-item:nth-child(odd) .tl-content,
  .timeline-item:nth-child(even) .tl-content { grid-column: 2; grid-row: 1; text-align: left; padding-left: 1.5rem; padding-right: 0; }
  .timeline-item:nth-child(odd) .tl-dot,
  .timeline-item:nth-child(even) .tl-dot { grid-column: 1; grid-row: 1; }
  .timeline-item:nth-child(odd) .tl-empty,
  .timeline-item:nth-child(even) .tl-empty { display: none; }

  .amenity-grid { grid-template-columns: repeat(3, 1fr); }
  .usp-strip { grid-template-columns: 1fr 1fr; }
  .usp-strip-item:nth-child(2) { border-right: none; }
  .project-hero-info { grid-template-columns: 1fr 1fr; }

  /* Section spacing */
  .section { padding: 5rem 0; }
}

/* ── 1024px ──────────────────────────────────────────── */
@media (max-width: 1024px) {
  /* Override inline 5-column on NRI process */
  [style*="grid-template-columns:repeat(5,1fr)"],
  [style*="grid-template-columns: repeat(5,1fr)"],
  [style*="grid-template-columns: repeat(5, 1fr)"] {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  /* Override inline 6-column hero amenity grid */
  [style*="grid-template-columns:repeat(6,1fr)"],
  [style*="grid-template-columns: repeat(6, 1fr)"] {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  /* Override inline 4-column */
  [style*="grid-template-columns:repeat(4,1fr)"],
  [style*="grid-template-columns: repeat(4, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* Project detail page sidebar collapses */
  [style*="grid-template-columns:1fr 360px"],
  [style*="grid-template-columns: 1fr 360px"] {
    grid-template-columns: 1fr !important;
  }
  .proj-side { position: static !important; margin-top: 2.5rem; }
}

/* ── 900px – mobile nav kicks in ─────────────────────────── */
@media (max-width: 900px) {
  /* Hamburger menu */
  .hamburger { display: flex !important; }
  .nav-menu {
    display: flex !important; flex-direction: column; align-items: stretch;
    position: fixed; top: 0; right: -340px; width: 320px; max-width: 85vw; height: 100vh;
    background: #fff; z-index: 1000; padding: 5.5rem 1.5rem 2rem;
    box-shadow: -8px 0 40px rgba(0,0,0,0.15); transition: right 0.35s ease;
    overflow-y: auto; gap: 0.15rem;
  }
  .nav-menu.open { right: 0; }
  .nav-link { padding: 0.85rem 1rem; font-size: 0.95rem; border-radius: 8px; }
  .dropdown-menu { display: block !important; position: static; box-shadow: none; border: none; background: var(--warm-gray); border-radius: 8px; margin-top: 0.25rem; padding: 0.4rem; min-width: 0; }
  .btn-nav-cta { margin: 0.75rem 0 0 !important; text-align: center; justify-content: center; }
  .top-bar-left { display: none; }
  .top-bar-right { justify-content: center; width: 100%; }
  .top-bar { font-size: 0.72rem; }

  /* 3-column inline grids → 2 columns */
  [style*="grid-template-columns:repeat(3,1fr)"],
  [style*="grid-template-columns: repeat(3, 1fr)"],
  [style*="grid-template-columns: repeat(3,1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  /* 1.1fr 0.9fr / 1fr 1fr asymmetric splits */
  [style*="grid-template-columns:1.1fr 0.9fr"],
  [style*="grid-template-columns: 1.1fr 0.9fr"] {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }
}

/* ── 768px – tablet portrait ──────────────────────────── */
@media (max-width: 768px) {
  .container, .container-sm, .container-wide { padding: 0 1.25rem; }
  .section { padding: 4rem 0; }
  .section-tight, .section-sm { padding: 3rem 0; }

  /* All multi-column inline grids → single column on tablet portrait */
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
  [style*="grid-template-columns:repeat(2,1fr)"],
  [style*="grid-template-columns: repeat(2, 1fr)"] {
    grid-template-columns: 1fr !important;
  }

  .feature-grid, .project-grid, .gallery-project-grid { grid-template-columns: 1fr; }
  .grid-2, .grid-3, .grid-4, .process-grid { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }
  .form-row, .form-row-3 { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .footer-bottom { flex-direction: column; text-align: center; }
  .footer-bottom-links { justify-content: center; flex-wrap: wrap; }
  .amenity-grid { grid-template-columns: repeat(2, 1fr); }
  .nearby-grid { grid-template-columns: 1fr; }
  .usp-strip { grid-template-columns: 1fr; }
  .usp-strip-item { border-right: none !important; border-bottom: 1px solid rgba(255,255,255,0.08); padding: 1.5rem 1.25rem; }
  .usp-strip-item:last-child { border-bottom: none; }

  .project-hero-info { grid-template-columns: 1fr 1fr; gap: 1.5rem; }
  .split-content { padding: 3rem 1.5rem; }
  .split-media { height: 320px; }

  .enquiry-card, .proj-side { position: static !important; margin-top: 2rem; }

  .hero-stats { gap: 1.5rem; }
  .hero-stats > div[style*="width:1px"] { display: none; }
  .hero-ctas { flex-direction: column; align-items: stretch; width: 100%; }
  .hero-ctas .btn { width: 100%; justify-content: center; }

  .gallery-grid-3, .gallery-grid-4 { grid-template-columns: 1fr 1fr; }
  .cta-strip-inner { justify-content: center; text-align: center; flex-direction: column; }
  .cta-inline { padding: 2rem 1.5rem; margin: 2rem 0; }

  /* Project detail enhancements */
  .amenity-grid2, .gx-grid, .near-grid { grid-template-columns: 1fr 1fr !important; }
  .facts { grid-template-columns: 1fr 1fr !important; }
  .proj-bar-inner { gap: 0; }
  .proj-bar a { padding: 0.8rem 1rem; font-size: 0.75rem; }

  /* Article and blog */
  .blog-grid { grid-template-columns: 1fr !important; }
  .blog-feat { grid-template-columns: 1fr !important; }
  .blog-feat-body { padding: 2rem 1.5rem; }
  .blog-feat-img { min-height: 240px; }
  .related-grid { grid-template-columns: 1fr 1fr !important; }
  .article-body h2 { font-size: 1.4rem; }
  .article-body h3 { font-size: 1.15rem; }
  .article-body p { font-size: 0.98rem; }
  .article-hero h1 { font-size: 1.7rem !important; }

  /* Gallery */
  .gal-grid { grid-template-columns: 1fr 1fr !important; }
  .gal-tabs { gap: 0.4rem; }
  .gal-tab { padding: 0.5rem 1rem; font-size: 0.78rem; }

  /* Spec table → cards */
  .spec-tbl td { padding: 0.75rem 1rem; font-size: 0.85rem; }

  /* Section titles smaller */
  .section-title, .h2 { font-size: clamp(1.5rem, 5vw, 1.9rem); }
  .hero-title { font-size: clamp(2rem, 7vw, 2.6rem); }
  .page-hero h1 { font-size: clamp(1.7rem, 6vw, 2.2rem); }

  /* Page hero shrink */
  .page-hero { min-height: 38vh; }
  .page-hero .page-hero-content { padding: 2.5rem 0; }

  /* Floating buttons reposition */
  .floating-whatsapp, .floating-call { width: 50px; height: 50px; right: 1rem; }
  .floating-whatsapp { bottom: 4.75rem; }
  .floating-call { bottom: 1rem; }
  .back-to-top { bottom: 1rem; left: 1rem; width: 40px; height: 40px; }

  /* Loyalty/NRI numbered step circles - reduce inline padding */
  [style*="padding:2.5rem"] { padding: 1.75rem !important; }
  [style*="padding: 2.5rem"] { padding: 1.75rem !important; }
  [style*="padding:3rem"] { padding: 2rem !important; }
  [style*="padding: 3rem"] { padding: 2rem !important; }

  /* Cta section padding */
  .cta-section { padding: 4rem 0; }
  .cta-section h2 { font-size: clamp(1.6rem, 5vw, 2rem); }
  .cta-section p { font-size: 0.95rem; }
}

/* ── 600px – small tablet / large mobile ───────────────── */
@media (max-width: 600px) {
  .container, .container-sm { padding: 0 1rem; }
  .section { padding: 3.5rem 0; }

  /* All 2-col grids → single column */
  [style*="grid-template-columns:repeat(2,1fr)"],
  [style*="grid-template-columns: repeat(2, 1fr)"] {
    grid-template-columns: 1fr !important;
  }
  .amenity-grid, .amenity-grid2, .gx-grid, .near-grid, .gal-grid,
  .related-grid, .stats-grid {
    grid-template-columns: 1fr !important;
  }
  .stats-grid { grid-template-columns: 1fr 1fr !important; gap: 1rem; }
  .facts { grid-template-columns: 1fr 1fr !important; gap: 0.75rem; }
  .fact { padding: 1rem !important; }

  .gallery-grid-3, .gallery-grid-4 { grid-template-columns: 1fr; }

  /* Project hero smaller */
  .project-hero { min-height: 60vh; }

  /* Split content tighter */
  .split-content { padding: 2.5rem 1.25rem; }
  .split-media { height: 260px; }

  /* Breadcrumb wrap */
  .breadcrumb-list { font-size: 0.75rem; gap: 0.4rem; }

  /* Sticky project bar - hide a couple anchors */
  .proj-bar { top: 64px; }
  .proj-bar a { padding: 0.65rem 0.8rem; font-size: 0.7rem; }

  /* Buttons tighter */
  .btn { padding: 0.7rem 1.3rem; font-size: 0.82rem; }
  .btn-lg { padding: 0.85rem 1.6rem; font-size: 0.85rem; }

  /* Top bar minimal */
  .top-bar { padding: 0.4rem 0; }
  .top-bar-right { gap: 0.75rem !important; font-size: 0.7rem; }

  /* Hero text */
  .hero { min-height: auto; padding: 5rem 0 4rem; }
  .hero-title { font-size: clamp(1.9rem, 8vw, 2.4rem); }
  .hero-sub { font-size: 0.95rem; }

  /* Page hero */
  .page-hero { min-height: 32vh; }

  /* Hero stats compact */
  .hero-stats { gap: 1rem; }
  .hero-stat-num { font-size: 1.6rem; }
  .hero-stat-label { font-size: 0.65rem; }

  /* Forms */
  .form-control { padding: 0.7rem 0.9rem; font-size: 0.92rem; }

  /* Logo trim */
  .logo-mark { width: 38px; height: 38px; font-size: 1.1rem; }
  .logo-text .logo-name { font-size: 1.1rem; }
  .logo-text .logo-tagline { display: none; }

  /* Inline circles in process steps */
  [style*="width:54px;height:54px;border-radius:50%"],
  [style*="width: 54px"] { width: 46px !important; height: 46px !important; font-size: 1.1rem !important; }

  /* Reduce inline padding more aggressively */
  [style*="padding:2rem"] { padding: 1.5rem !important; }
  [style*="padding: 2rem"] { padding: 1.5rem !important; }
}

/* ── 480px – phone ──────────────────────────────────────── */
@media (max-width: 480px) {
  .container, .container-sm { padding: 0 0.875rem; }
  .section { padding: 3rem 0; }
  .navbar { height: 64px; }
  .hero-title { font-size: 2rem; line-height: 1.15; }
  .hero-eyebrow, .hero-badge { font-size: 0.65rem; padding: 0.3rem 0.7rem; }
  .stat-num { font-size: 1.8rem; }
  .btn { padding: 0.65rem 1.15rem; font-size: 0.78rem; letter-spacing: 0.03em; }
  .btn-lg { padding: 0.8rem 1.4rem; font-size: 0.8rem; }

  /* No more 2-col stats on smallest */
  .stats-grid { gap: 0.75rem; }
  .stats-strip { padding: 2rem 0; }

  /* Hide top bar entirely on smallest screens */
  .top-bar { display: none; }

  /* Page heroes tighter */
  .page-hero h1 { font-size: 1.6rem; line-height: 1.2; }
  .page-hero p { font-size: 0.9rem; }
  .hero-badge-sm { font-size: 0.65rem; padding: 0.3rem 0.75rem; }

  /* Section titles */
  .section-title { font-size: clamp(1.4rem, 6vw, 1.7rem); }
  .h1 { font-size: 1.85rem; }

  /* Article hero */
  .article-hero h1 { font-size: 1.4rem !important; }
  .article-meta { font-size: 0.78rem; gap: 0.6rem; }
  .article-body h2 { font-size: 1.25rem; }

  /* Project bar — hide it on phones, content is right below anyway */
  .proj-bar { display: none; }

  /* Lightbox close better positioned */
  .lightbox-close { top: 1rem; right: 1rem; font-size: 2rem; }
  .lightbox img { max-width: 95%; }

  /* Inline padding aggressive override */
  [style*="padding:2rem"] { padding: 1.25rem !important; }
  [style*="padding: 2rem"] { padding: 1.25rem !important; }
  [style*="padding:2.5rem"] { padding: 1.5rem !important; }
  [style*="padding: 2.5rem"] { padding: 1.5rem !important; }
  [style*="padding:3rem"] { padding: 1.75rem !important; }
  [style*="padding: 3rem"] { padding: 1.75rem !important; }

  /* Inline gap reduce */
  [style*="gap:3.5rem"] { gap: 1.5rem !important; }
  [style*="gap: 3.5rem"] { gap: 1.5rem !important; }
  [style*="gap:3rem"] { gap: 1.5rem !important; }
  [style*="gap: 3rem"] { gap: 1.5rem !important; }
  [style*="gap:4rem"] { gap: 1.75rem !important; }
  [style*="gap: 4rem"] { gap: 1.75rem !important; }

  /* Inline columns:2 → 1 on small screens */
  [style*="columns:2"] { columns: 1 !important; column-gap: 0 !important; }

  /* Project hero buttons stack */
  .project-hero [style*="display:flex"] { flex-direction: column; align-items: stretch; }
  .project-hero [style*="display:flex"] .btn { width: 100%; justify-content: center; }

  /* Page hero badge buttons stack */
  .page-hero [style*="display:flex"][style*="gap"] .btn { width: 100%; justify-content: center; }
}

/* ── 380px – very small ─────────────────────────────────── */
@media (max-width: 380px) {
  .hero-title { font-size: 1.7rem; }
  .section-title { font-size: 1.4rem; }
  .stat-num, .hero-stat-num { font-size: 1.5rem; }
  .nav-menu { width: 280px; }
}

/* ── General safety: prevent overflow ───────────────────── */
html, body { overflow-x: hidden; max-width: 100vw; }
img, video, iframe { max-width: 100%; height: auto; }
.map-embed iframe { height: 300px; }
@media (max-width: 600px) {
  .map-embed iframe { height: 250px; }
}

/* Tables and pre overflow scroll */
table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (min-width: 700px) {
  table { display: table; overflow-x: visible; }
}
.spec-tbl { display: table !important; }

/* Buttons in flex rows should wrap properly */
.hero-ctas, .page-hero-content > div[style*="display:flex"] { flex-wrap: wrap; }
