/* Layout — page scaffolding. Tokens only. */

.ivy-wrap { width: 100%; max-width: var(--ivy-width-wide); margin-inline: auto; padding-inline: var(--ivy-gutter); }
.ivy-wrap--content { max-width: var(--ivy-width-content); }
.ivy-wrap--full { max-width: var(--ivy-width-full); }

.ivy-section { padding-block: var(--ivy-space-xl); }
.ivy-section--tight { padding-block: var(--ivy-space-lg); }
.ivy-section--loose { padding-block: var(--ivy-space-2xl); }
.ivy-section--tinted { background: var(--ivy-c-brand-tint); }
.ivy-section--surface { background: var(--ivy-c-surface); }

.ivy-site { display: flex; flex-direction: column; min-height: 100vh; }
.ivy-main { flex: 1; }

.ivy-grid { display: grid; gap: var(--ivy-space-md); }
.ivy-grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(20rem, 100%), 1fr)); }
.ivy-grid--3 { grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr)); }
.ivy-grid--4 { grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr)); }

.ivy-stack > * + * { margin-top: var(--ivy-space-sm); }
.ivy-stack--lg > * + * { margin-top: var(--ivy-space-lg); }

.ivy-cluster { display: flex; flex-wrap: wrap; gap: var(--ivy-space-2xs); align-items: center; }

/* ---------------------------------------------------------------------------
   Responsive guarantees. STRUCTURAL — a skin tunes appearance, never whether
   the site works at a given width. Breakpoints are literal on purpose.
   --------------------------------------------------------------------------- */

/* nothing may cause a horizontal scrollbar */
html, body { overflow-x: clip; max-width: 100%; }
img, video, iframe, table, pre { max-width: 100%; }
table { display: block; overflow-x: auto; }   /* wide tables scroll themselves */

/* grids already collapse via auto-fit; enforce single column on small screens */
@media (max-width: 40rem) {
  .ivy-grid--2, .ivy-grid--3, .ivy-grid--4 { grid-template-columns: 1fr; }
  .ivy-section { padding-block: var(--ivy-space-lg); }
  .ivy-section--loose { padding-block: var(--ivy-space-xl); }
  .ivy-footer__cols { gap: var(--ivy-space-md); }
}

/* keep tap targets usable */
@media (pointer: coarse) {
  .ivy-nav a, .ivy-btn, .ivy-menu-btn, .ivy-nav__toggle { min-height: 2.75rem; }
  .ivy-btn { display: inline-flex; align-items: center; }
}