html { width: 100%; min-width: 0; -webkit-text-size-adjust: 100%; }
*, *::before, *::after { box-sizing: border-box; }
body { width: 100%; min-width: 0; margin: 0; }
img, svg, video, canvas { max-width: 100%; height: auto; }
iframe { max-width: 100%; }

/* Contenedores generales, sin alterar la paleta propia de cada perfil */
.tablet-container,
.sec-layout-secretaria,
.alumno-container,
.container-fluid,
main,
.docente-content,
.content-wrap,
.sec-main {
  min-width: 0;
}

.tablet-container {
  width: min(100% - (var(--lj-shell-gap) * 2), 1440px);
}

.content-wrap,
.docente-content,
.sec-main {
  padding-inline: var(--lj-page-pad);
}

/* Tipografía fluida */
h1, .page-title, .school-name, .sec-hero-title { font-size: var(--lj-title); overflow-wrap: anywhere; }
h2, .section-title, .card-title { font-size: var(--lj-subtitle); overflow-wrap: anywhere; }
p, label, input, select, textarea, button, a { overflow-wrap: anywhere; }

/* Evita que flex/grid desborden por contenido largo */
.row > *,
[class*="col-"],
.d-flex > *,
.grid > *,
.cards-grid > *,
.dashboard-grid > * { min-width: 0; }