/* ============================================================
   GODAVARI INTERNATIONALS — RESPONSIVE RULES
   Mobile-first overrides, largest breakpoint first for readability.
   Breakpoints: 1240 / 1024 / 960 / 900 / 768 / 700 / 640 / 560
============================================================ */

/* ---------- section number sits inside the trade-route margin on wide screens ---------- */
@media (min-width:1240px){
  .section-number{ left:calc(50% + 26px); }
}

/* ---------- ≤1024px ---------- */
@media (max-width:1024px){
  .why-grid{ grid-template-columns:repeat(3,1fr); }
  .spec-grid{ grid-template-columns:repeat(2,1fr); }
}

/* ---------- ≤960px ---------- */
@media (max-width:960px){
  nav.links{ display:none; }
  .menu-toggle{ display:flex; }

  .hero-grid{ grid-template-columns:1fr; }
  .product-grid{ grid-template-columns:1fr; }
  .process-track{ grid-template-columns:repeat(2,1fr); gap:30px; }
  .process-track::before{ display:none; }
}

/* ---------- ≤900px ---------- */
@media (max-width:900px){
  .quality-row{ grid-template-columns:1fr; gap:28px; }
  .quality-row::before{ display:none; }
  .pack-grid{ grid-template-columns:1fr; }
  .markets-grid{ grid-template-columns:1fr; }
  .contact-grid{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}

/* ---------- ≤768px ---------- */
@media (max-width:768px){
  .section-pad{ padding:72px 0; }
}

/* ---------- ≤700px ---------- */
@media (max-width:700px){
  .converter-card{ grid-template-columns:1fr; }
}

/* ---------- ≤640px ---------- */
@media (max-width:640px){
  .why-grid{ grid-template-columns:repeat(2,1fr); }
}

/* ---------- ≤560px ---------- */
@media (max-width:560px){
  .mv-grid{ grid-template-columns:1fr; }
  .spec-grid{ grid-template-columns:1fr; }
  .form-grid{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr; }
}

@media (max-width:480px){
  .spec-grid{ grid-template-columns:1fr; }
  .hero{ padding:150px 0 90px; }
  .converter-card{ padding:28px 22px; }
  .form-card{ padding:26px 20px; }
}

/* ============================================================
   PRODUCT PORTFOLIO — responsive overrides
============================================================ */

/* ≤1024: 3 cards per row */
@media (max-width:1024px){
  .pp-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ≤900: stack featured card vertically */
@media (max-width:900px){
  .pp-featured {
    grid-template-columns: 1fr;
  }
  .pp-featured-visual {
    min-height: 340px;
  }
  .pp-featured-info {
    padding: 34px 32px 36px;
  }
}

/* ≤768: 2 cards per row */
@media (max-width:768px){
  .pp-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .pp-spec-grid { grid-template-columns: 1fr; }
  .pp-spec-even { border-right: 1px solid var(--line); }
  .pp-spec-item:nth-last-child(2) { border-bottom: 1px solid var(--line); }
}

/* ≤560: 1 card per row on mobile */
@media (max-width:560px){
  .pp-grid { grid-template-columns: 1fr; gap: 18px; }
  .pp-featured-info { padding: 28px 22px 32px; }
  .pp-feat-ctas { flex-direction: column; }
  .pp-feat-ctas .btn { width: 100%; justify-content: center; }
}

/* ============================================================
   MODAL RESPONSIVE (v3)
============================================================ */

/* ≤860px: stack image above info */
@media (max-width: 860px) {
  .pm-inner {
    grid-template-columns: 1fr;
  }
  .pm-image-col {
    padding: 28px 28px 0;
  }
  .pm-img-wrap {
    aspect-ratio: 16 / 9;
    max-height: 280px;
  }
  .pm-info-col {
    padding: 24px 28px 32px;
  }
}

/* ≤560px: tighter mobile modal */
@media (max-width: 560px) {
  .pm-overlay { padding: 0; align-items: flex-end; }
  .pm-panel {
    border-radius: 22px 22px 0 0;
    max-height: 92vh;
  }
  .pm-overlay.open .pm-panel { transform: translateY(0) scale(1); }
  .pm-overlay .pm-panel { transform: translateY(100%); }

  .pm-image-col { padding: 22px 20px 0; }
  .pm-img-wrap { aspect-ratio: 4 / 3; max-height: 220px; }
  .pm-info-col { padding: 18px 20px 28px; }
  .pm-name { font-size: 1.3rem; }

  /* spec table: stack label above value on small screens */
  .pm-spec-row { grid-template-columns: 1fr; }
  .pm-spec-k {
    border-right: none;
    border-bottom: 1px solid var(--line);
    padding: 8px 12px 5px;
  }
  .pm-spec-v { padding: 6px 12px 10px; }

  .pm-ctas { flex-direction: column; }
  .pm-ctas .btn { width: 100%; justify-content: center; }

  /* card actions stack on very small screens */
  .pp-card-actions { flex-direction: column; }
  .pp-card-actions .btn { width: 100%; }
}
