
/* === OYO.PLUS responsive overrides (autogenerated) === */
:root{
  --mx: min(1120px, 92vw);
  --gap: 16px;
  --fs-base: clamp(14px, 1.1vw + 11px, 18px);
  --fs-h1: clamp(28px, 3.8vw + 12px, 48px);
  --fs-h2: clamp(22px, 2.8vw + 10px, 36px);
  --radius: 16px;
}
html, body { max-width: 100%; overflow-x: hidden; }
body { font-size: var(--fs-base); line-height: 1.5; -webkit-text-size-adjust: 100%; }

/* containers */
.container, .wrap, .max, .page, .section-inner {
  width: 100%;
  max-width: var(--mx);
  margin-inline: auto;
  padding-inline: clamp(12px, 3vw, 24px);
}

h1 { font-size: var(--fs-h1); line-height: 1.1; }
h2 { font-size: var(--fs-h2); line-height: 1.15; }

img, video, canvas, svg { max-width: 100%; height: auto; display: block; }

/* grids/cards */
.grid, .cards {
  display: grid;
  gap: var(--gap);
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.card, .tile {
  border-radius: var(--radius);
  overflow: hidden;
}

/* navigation: mobile menu */
.menu-toggle { cursor: pointer; }
.main-nav { display: flex; gap: 16px; align-items: center; }
.main-nav a { text-decoration: none; }
@media (max-width: 900px) {
  .menu-toggle { display: none; }
  .main-nav { display: none; }
}

/* tables on small screens */
.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: .75rem .6rem; }

/* forms */
input, select, textarea, button { font-size: 1rem; }
button { border-radius: 12px; padding: .7rem 1rem; }

/* hero sections */
.hero { padding: clamp(24px, 6vw, 72px) 0; }
.hero h1 { margin-bottom: .6em; }

/* footer */
footer { padding-block: 24px; }
