/* ===========================================================================
   Wide screens. Loaded LAST, so these :root steps are the final word — a
   later :root block anywhere would silently beat the whole ladder.

   A wide grid gains columns; it does not stretch its cards into placemats.
   =========================================================================== */

@media (min-width:1600px){
  :root{--container:1380px;--section-y:clamp(6rem, 3rem + 4vw, 8.5rem)}
  html{font-size:17px}
  .mega-in{max-width:1300px}
}
@media (min-width:2000px){
  :root{--container:1600px;--header-h:96px}
  html{font-size:18px}
  .mgrid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
  .deals{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
  .mrail{grid-auto-columns:minmax(300px,330px)}
  body .elementor .lede p{max-width:56ch}
}
@media (min-width:2400px){
  :root{--container:1820px}
  html{font-size:19px}
  .tiles{grid-auto-rows:minmax(240px,auto)}
}
@media (min-width:2800px){
  :root{--container:2000px}
  html{font-size:20px}
}

/* Elementor's own boxed container follows the same ladder, or builder pages
   stay at 1240 on a 27-inch display while the theme's templates widen. */
@media (min-width:1600px){
  body .elementor .elementor-section.elementor-section-boxed > .elementor-container{max-width:var(--container)}
}

/* short landscape phones: nothing should demand a full screen */
@media (max-height:560px) and (orientation:landscape){
  body .elementor .hero{padding-top:3rem;padding-bottom:3rem}
  .callbar{display:none}
}
