/* ============================================
LAYOUT SYSTEM (.med-* classes)
============================================ */
.med-container {
width: 100%;
max-width: var(--med-container);
margin: 0 auto;
padding: 0 1.5rem;
}
.med-section {
padding: 5rem 0;
position: relative;
}
.med-grid {
display: grid;
gap: 1.5rem;
}
.med-flex {
display: flex;
gap: 1rem;
align-items: center;
}
/* Grid Responsive - поддержка 320px (WCAG 1.4.10) */
@media (min-width: 1025px) {
.med-grid-4 { grid-template-columns: repeat(4, 1fr); }
.med-grid-3 { grid-template-columns: repeat(3, 1fr); }
.med-grid-2 { grid-template-columns: repeat(2, 1fr); }
.med-grid-6 { grid-template-columns: repeat(6, 1fr); }
}
@media (min-width: 769px) and (max-width: 1024px) {
.med-grid-6 { grid-template-columns: repeat(3, 1fr); }
.med-grid-4 { grid-template-columns: repeat(2, 1fr); }
.med-grid-3 { grid-template-columns: repeat(2, 1fr); }
.med-grid-2 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
.med-section { padding: 3rem 0; }
.med-grid { grid-template-columns: 1fr !important; }
.med-flex { flex-direction: column; }
.med-hide-mobile { display: none !important; }
.med-full-width-mobile { width: 100% !important; }
}
/* WCAG: Адаптация для очень узких экранов (320px) */
@media (max-width: 375px) {
.med-container { padding: 0 1rem; }
.med-card { padding: 1.5rem; }
}