/* JAYA site — mobile responsiveness.
   Media queries only (cannot be expressed inline). Desktop is unchanged;
   all rules live inside max-width breakpoints. Selectors target the existing
   inline-styled elements by style substring so no base markup styling moves. */

/* Hamburger button is hidden on desktop via its own inline display:none. */

@media (max-width: 820px) {

  /* ---------- NAV → hamburger dropdown ---------- */
  [data-navbar] { position: relative; flex-wrap: wrap; }
  [data-navtoggle] { display: inline-flex !important; align-items: center; }
  [data-navmenu] {
    display: none !important;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 22px !important;
    padding: 26px 24px !important;
    background: #F5F1E8;
    border-bottom: 1px solid rgba(15,32,62,0.12);
    box-shadow: 0 24px 44px rgba(0,0,0,0.16);
    z-index: 60;
  }
  [data-navmenu].open { display: flex !important; }

  /* ---------- Collapse multi-column layouts to a single column ---------- */
  [style*="1.05fr 0.95fr"],
  [style*="0.85fr 1.15fr"],
  [style*="0.9fr 1.1fr"],
  [style*="0.82fr 1.18fr"],
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns: repeat(2, 1fr)"],
  [style*="grid-template-columns: repeat(3, 1fr)"] {
    grid-template-columns: 1fr !important;
  }

  /* ---------- Reduce oversized section padding ---------- */
  [style*="56px"] { padding-left: 24px !important; padding-right: 24px !important; }

  /* ---------- Tame large gaps ---------- */
  [style*="gap: 64px"] { gap: 34px !important; }
  [style*="gap: 60px"] { gap: 34px !important; }

  /* ---------- Let space-between rows wrap ---------- */
  [style*="justify-content: space-between"] { flex-wrap: wrap; }

  /* ---------- Drop the tall hero panel min-height ---------- */
  [style*="min-height: 560px"] { min-height: 320px !important; }

  /* ---------- Headlines scale down ---------- */
  h1 { font-size: 36px !important; line-height: 1.08 !important; }
  h2 { font-size: 29px !important; line-height: 1.14 !important; }
}

@media (max-width: 480px) {
  h1 { font-size: 30px !important; }
  h2 { font-size: 26px !important; }
  /* Vertical section padding tightened on the smallest screens */
  [style*="padding: 92px 56px"],
  [style*="padding: 88px 56px"],
  [style*="padding: 84px 56px"],
  [style*="padding: 72px 56px"],
  [style*="padding: 80px 56px"] { padding-top: 52px !important; padding-bottom: 52px !important; }
}
