/* site.css — shared responsive styles */

html, body { margin: 0; padding: 0; font-family: 'Alegreya Sans', -apple-system, BlinkMacSystemFont, system-ui, sans-serif; background: #f4ead5; color: #2a211a; }
* { box-sizing: border-box; }
img { max-width: 100%; }

/* Nav responsive switch */
.pr-nav-desktop { display: flex; }
.pr-nav-mobile { display: none !important; }
@media (max-width: 820px) {
  .pr-nav-desktop { display: none !important; }
  .pr-nav-mobile { display: flex !important; }
}

/* Hero / sections collapse to one column on mobile */
@media (max-width: 900px) {
  .pr-hero-grid { grid-template-columns: 1fr !important; gap: 32px !important; padding: 40px 20px !important; }
  .pr-about-grid { grid-template-columns: 1fr !important; gap: 32px !important; padding: 48px 20px !important; }
  .pr-demo-grid { grid-template-columns: 1fr !important; }
  .pr-routes-grid { grid-template-columns: 1fr !important; }
  .pr-feat-grid { grid-template-columns: 1fr 1fr !important; gap: 24px !important; }
  .pr-highlights { grid-template-columns: 1fr !important; gap: 14px !important; }
  .pr-highlights > div { border-left: none !important; padding-left: 0 !important; }
  .pr-h1 { font-size: 56px !important; }
  .pr-h2 { font-size: 36px !important; }
}
@media (max-width: 520px) {
  .pr-feat-grid { grid-template-columns: 1fr !important; }
  .pr-h1 { font-size: 44px !important; }
  .pr-h2 { font-size: 30px !important; }
}

/* Section padding for small screens */
@media (max-width: 640px) {
  [data-section-pad] { padding-left: 20px !important; padding-right: 20px !important; }
}