/* Width-aware layouts: retain a usable reading column in split desktop windows. */
.nav > a:first-child { flex: 0 0 auto; }
.nav > a:first-child img { display: block; flex: none; height: 48px; width: auto; max-width: none; object-fit: contain; }
.navlinks { min-width: 0; }
.navbtn { flex: 0 0 48px; }
.titlebox { box-sizing: border-box; max-width: 100% !important; }
.rg > *, .mx > * { min-width: 0; }
.btnrow { flex-wrap: wrap; }
.card-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)) !important; }
.team-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr)) !important; }
.campaign-detail { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)) !important; }
.homepage-layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
.homepage-layout .hero-art img { width: 100% !important; max-width: 600px !important; height: auto !important; object-fit: contain; }

@media (max-width: 1250px) {
  .px, .nav, .footer { padding-left: clamp(20px, 3.2vw, 40px) !important; padding-right: clamp(20px, 3.2vw, 40px) !important; }
  .mx { margin-left: clamp(20px, 3.2vw, 40px) !important; margin-right: clamp(20px, 3.2vw, 40px) !important; padding: 32px !important; gap: 28px !important; }
  .campaign-layout, .faq-layout, .homepage-layout { grid-template-columns: minmax(0, 1fr) !important; gap: 32px !important; }
  .homepage-layout .hero-art { min-height: auto !important; padding: 24px 0 !important; }
  .homepage-layout .hero-art img { max-width: 440px !important; margin: 0 auto !important; }
  .nav { flex-wrap: wrap; gap: 16px !important; }
  .navbtn { display: inline-flex !important; }
  .navlinks { display: none !important; flex-direction: column !important; align-items: flex-start !important; width: 100%; gap: 4px !important; padding: 4px 0 8px; }
  .navlinks a { display: block; box-sizing: border-box; width: 100%; padding: 12px 0; border-bottom: 1px solid #F3F2EE; }
  .nav.open .navlinks { display: flex !important; }
  h1 { font-size: clamp(38px, 6.5vw, 76px) !important; }
  h2 { font-size: clamp(30px, 4.2vw, 48px) !important; }
  .cols { column-count: 1 !important; }
}
@media (min-width: 901px) and (max-width: 1250px) {
  .card-grid .card { padding: 26px !important; }
  .mx { grid-template-columns: minmax(0, 1fr) !important; }
}
@media (max-width: 1000px) {
  #cga-rates .panel { grid-template-columns: minmax(0, 1fr); gap: 0; }
  #cga-rates .panel .scene, #cga-rates .panel .villa-scene { grid-column: 1; grid-row: auto; margin-top: 22px; width: 100%; max-width: 420px; justify-self: center; }
  #cga-rates .panel p { grid-row: auto; }
  #cga-rates .argument, #cga-rates .benefit { grid-template-columns: minmax(0, 1fr); }
  #cga-rates .argument p + p { border-left: 0; border-top: 1px solid #5e5b52; padding: 23px 0 0; }
  #cga-rates .benefit .scene { width: 100%; max-width: 420px; justify-self: center; }
}
@media (max-width: 600px) {
  .card-grid, .team-grid, .campaign-detail { grid-template-columns: minmax(0, 1fr) !important; }
  .mx { padding: 28px 24px !important; }
}
