/* Preserve readable cards on narrow screens without hiding horizontal overflow. */
.overview-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.overview-grid>a{min-width:0}
.es-materials-note{margin:0 0 24px;color:#294c39;font-size:16px;line-height:1.7}
.es-materials-note a{color:#126738;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
@media(max-width:1150px){.overview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.overview-grid{grid-template-columns:1fr}.overview-grid h3{margin-top:18px}.overview-grid p{font-size:15px}}
/* The full header navigation needs about 1280px in Russian and Kazakh and 1060px in English; narrower screens use the menu button instead of letting the header overflow. */
@media (min-width:901px) and (max-width:1279px){html:not([lang="en"]) header>nav{display:none}html:not([lang="en"]) .menu-button{display:flex;flex-direction:column;gap:5px}html:not([lang="en"]) .menu-button span{margin:0}}
@media (min-width:901px) and (max-width:1060px){html[lang="en"] header>nav{display:none}html[lang="en"] .menu-button{display:flex;flex-direction:column;gap:5px}html[lang="en"] .menu-button span{margin:0}}
/* Long Kazakh and Russian words must not push headings past the screen edge on small phones. */
h1,h2,h3,h4,.eyebrow,.project-tag{overflow-wrap:break-word}
@media (max-width:420px){html[lang="kk"] h2{font-size:30px;letter-spacing:-.8px}}
/* Home hero with the self-hosted Noto Sans: the longest Russian/Kazakh words fit the column, and the
   block grows with its content on short screens instead of running into the bottom captions. */
@media (min-width:901px){.page-home .brand-hero{height:auto;max-height:none;min-height:clamp(660px,calc(100vh - 86px),820px)}.page-home .brand-hero h1{font-size:clamp(40px,4.2vw,72px)}}