﻿
.info-section { max-width: 100%; margin: auto; padding: 80px 40px; display: grid; grid-template-columns: 1fr 2fr; gap: 60px; align-items: start; }

.info-section .left-title { font-size: 48px; font-weight: 700; line-height: 1.1; }

.info-section .right-text { font-size: 30px; line-height: 1.4; color: #222; }

.info-section .button { display: inline-block; margin-top: 30px; padding: 12px 22px; border: 2px solid #e85a5a; border-radius: 30px; color: #222; text-decoration: none; font-weight: 600; transition: 0.2s; }

    .info-section .button:hover { background: #e85a5a; color: white; }

@media (max-width: 1200px) {
    .info-section { padding: 60px 30px; gap: 50px; }
    .info-section .left-title { font-size: 42px; }
    .info-section .right-text { font-size: 26px; }
}

@media (max-width: 992px) {
    .info-section { padding: 50px 25px; gap: 40px; }
    .info-section .left-title { font-size: 36px; }
    .info-section .right-text { font-size: 22px; }
    .info-section .button { padding: 10px 20px; font-size: 0.95rem; }
}

@media (max-width: 768px) {
    .info-section { grid-template-columns: 1fr; gap: 30px; padding: 40px 20px; }
    .info-section .left-title { font-size: 36px; }
    .info-section .right-text { font-size: 22px; line-height: 1.5; }
    .info-section .button { margin-top: 20px; }
}

@media (max-width: 576px) {
    .info-section { padding: 30px 16px; gap: 24px; }
    .info-section .left-title { font-size: 28px; }
    .info-section .right-text { font-size: 18px; }
    .info-section .button { padding: 10px 20px; font-size: 1rem; margin-top: 16px; }
}

@media (max-width: 400px) {
    .info-section { padding: 24px 12px; }
    .info-section .left-title { font-size: 24px; }
    .info-section .right-text { font-size: 16px; }
}
