@media (max-width: 1100px) { .auth-shell { grid-template-columns: 1fr; gap: 18px; padding: 18px; } .auth-visual { min-height: 260px; padding: 28px; } .brand-text { max-width: none; } .visual-card { height: 145px; } .car-shape { width: 170px; height: 62px; } .car-shape::before { width: 88px; height: 28px; left: 31px; } .wheel { width: 26px; height: 26px; border-width: 4px; } } @media (max-width: 768px) { .auth-shell { min-height: auto; padding: 14px; gap: 12px; } .auth-visual { border-radius: 20px; padding: 20px; min-height: auto; } .brand-kicker { font-size: 0.76rem; margin-bottom: 8px; } .brand-wrap h1 { font-size: 1.65rem; } .brand-text { margin-top: 10px; font-size: 0.9rem; line-height: 1.6; } .brand-badges { margin-top: 14px; gap: 8px; } .brand-badges span { font-size: 0.72rem; padding: 6px 10px; } .visual-card { display: none; } .auth-card { width: 100%; border-radius: 18px; padding: 18px; } .auth-card--wide { width: 100%; } .auth-card h2 { font-size: 1.34rem; } .auth-subtitle { font-size: 0.9rem; } .field-group input { min-height: 46px; font-size: 16px; } .toggle-password { min-height: 32px; min-width: 50px; } .btn-primary { min-height: 48px; width: 100%; } .btn-secondary { min-height: 48px; width: 100%; } .form-grid--two { grid-template-columns: 1fr; } .section-card { padding: 14px; } .info-box { padding: 16px; } .auth-switch, .back-link { font-size: 0.85rem; } } @media (max-width: 420px) { .auth-shell { padding: 10px; } .auth-visual { padding: 16px; } .auth-card { padding: 14px; } .auth-brand p { font-size: 0.84rem; } .check-wrap { font-size: 0.84rem; } }