/* --- ГЛОБАЛЬНЫЕ СТИЛИ И ПЕРЕМЕННЫЕ --- */
:root {
    --color-bg: #F8F9FA;
    --color-bg-light: #FFFFFF;
    --color-primary: #FFC107; /* Желтый */
    --color-secondary: #E53935; /* Красный */
    --color-text-dark: #343A40;
    --color-text-light: #6C757D;
    --color-green: #28a745;
    --font-heading: 'Montserrat', sans-serif;
    --font-body: 'Open Sans', sans-serif;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-body);
    color: var(--color-text-dark);
    background-color: var(--color-bg);
    line-height: 1.6;
}

.container {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 20px;
}

.section { padding: 80px 0; }
.section-light { background-color: var(--color-bg-light); }
.section-title {
    font-family: var(--font-heading);
    font-size: 2.5rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 50px;
}

.btn {
    display: inline-block;
    padding: 12px 28px;
    border-radius: 8px;
    text-decoration: none;
    font-family: var(--font-heading);
    font-weight: 600;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}
.btn-primary { background-color: var(--color-primary); color: var(--color-text-dark); }
.btn-secondary { background-color: var(--color-secondary); color: #fff; border: none; }

/* --- СТИЛИ ДЛЯ ВНУТРЕННИХ СТРАНИЦ --- */
.subpage-header {
    margin-top: 30px;
    background-color: var(--color-bg-light);
    padding: 40px 0;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}
.logo-link {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--color-text-dark);
    text-decoration: none;
}
.legal-text { max-width: 800px; margin: 0 auto; line-height: 1.8; }

/* --- HERO SECTION --- */
.hero-section {
    padding: 200px 0;
    background: linear-gradient(135deg, #FFFBEB 0%, #F8F9FA 100%);
}
.hero-container { display: flex; align-items: center; gap: 40px; }
.hero-text { flex: 1; }
.hero-text h1 { font-family: var(--font-heading); font-size: 3.5rem; line-height: 1.2; margin-bottom: 20px; }
.hero-text h2 { font-family: var(--font-heading); font-weight: 400; font-size: 1.5rem; margin-bottom: 20px; color: var(--color-text-light); }
.highlight-red { color: var(--color-secondary); font-weight: 700; }
.highlight-red-text { color: var(--color-secondary); font-weight: 600; }
.highlight-yellow { color: var(--color-primary); font-weight: 600; background: #fff8e1; padding: 2px 5px; border-radius: 4px; }
.hero-text p { font-size: 1.1rem; margin-bottom: 30px; }
.hero-visual { flex: 0.8; display: flex; justify-content: center; align-items: center; }
.chat-widget { width: 350px; background: var(--color-bg-light); border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,0.1); transform: rotate(3deg); }
.chat-header { background-color: var(--color-text-dark); color: #fff; padding: 10px 15px; border-top-left-radius: 12px; border-top-right-radius: 12px; font-family: var(--font-heading); }
.chat-body { padding: 20px; display: flex; flex-direction: column; gap: 15px; }
.chat-message { padding: 10px 15px; border-radius: 18px; max-width: 80%; }
.chat-message.bot { background-color: #e9ecef; align-self: flex-start; border-bottom-left-radius: 4px; }
.chat-message.user { background-color: var(--color-primary); align-self: flex-end; border-bottom-right-radius: 4px; }
.typing span { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background-color: #adb5bd; animation: typing-anim 1s infinite; }
.typing span:nth-child(2) { animation-delay: 0.2s; }
.typing span:nth-child(3) { animation-delay: 0.4s; }
@keyframes typing-anim { 0%, 100% { opacity: 0.3; } 50% { opacity: 1; } }

/* --- Секции Process, Uniqueness, Benefits без изменений --- */
.process-container { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; }
.process-card { background: var(--color-bg-light); padding: 30px; border-radius: 12px; text-align: center; box-shadow: 0 4px 15px rgba(0,0,0,0.05); transition: transform 0.3s ease; }
.process-card:hover { transform: translateY(-10px); }
.process-card h3 { font-family: var(--font-heading); margin: 15px 0 10px; }
.icon-circle { width: 60px; height: 60px; border-radius: 50%; display: flex; justify-content: center; align-items: center; font-size: 1.8rem; margin: 0 auto; }
.icon-yellow { background-color: rgba(255, 193, 7, 0.1); }
.icon-red { background-color: rgba(229, 57, 53, 0.1); }
.uniqueness-container { display: flex; align-items: center; gap: 60px; }
.uniqueness-text { flex: 1; }
.uniqueness-text .section-title { text-align: left; }
.uniqueness-text ul { list-style: none; margin-top: 20px; }
.uniqueness-text li { font-size: 1.1rem; margin-bottom: 15px; display: flex; align-items: center; }
.icon-list { font-size: 1.5rem; margin-right: 15px; }
.uniqueness-visual { flex: 1; position: relative; display: flex; justify-content: space-around; align-items: center; height: 250px; }
.brain-static, .brain-dynamic { width: 150px; height: 150px; border-radius: 50%; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 20px; }
.brain-static { background-color: #e9ecef; border: 2px solid var(--color-text-light); }
.brain-dynamic { background-color: rgba(255, 193, 7, 0.2); border: 2px solid var(--color-primary); }
.flow { position: absolute; width: 10px; height: 10px; border-radius: 50%; background: var(--color-secondary); animation: flow-anim 4s infinite; }
.flow-1 { top: 20%; left: 45%; animation-delay: 0s; }
.flow-2 { top: 50%; left: 50%; animation-delay: 1.5s; }
.flow-3 { top: 80%; left: 40%; animation-delay: 3s; }
@keyframes flow-anim { 0% { transform: scale(0); opacity: 1; } 100% { transform: scale(10); opacity: 0; } }
.benefits-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px; }
.benefit-card { background: var(--color-bg-light); padding: 30px; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); }
.benefit-card h3 { font-family: var(--font-heading); margin: 15px 0 10px; }

/* --- НОВЫЙ БЛОК: PRICING --- */
.pricing-container {
    display: flex;
    gap: 40px;
    align-items: stretch;
    background-color: var(--color-bg-light);
    padding: 40px;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}
.pricing-card {
    flex: 1;
    text-align: center;
    border-right: 1px solid #e9ecef;
    padding-right: 40px;
}
.price {
    font-family: var(--font-heading);
    font-size: 4rem;
    font-weight: 700;
    color: var(--color-secondary);
}
.price-desc {
    color: var(--color-text-light);
    margin-bottom: 20px;
}
.timeline {
    margin-bottom: 30px;
    font-size: 1.1rem;
}
.timeline small { display: block; color: var(--color-text-light); }
.features-card {
    flex: 1.5;
}
.features-card h3 {
    font-family: var(--font-heading);
    margin-bottom: 20px;
}
.features-card ul {
    list-style: none;
}
.features-card li {
    margin-bottom: 10px;
    display: flex;
    align-items: center;
}
.icon-list-green {
    color: var(--color-green);
    font-size: 1.2rem;
    margin-right: 10px;
}

/* --- НОВЫЙ БЛОК: CREATOR --- */
.creator-container {
    max-width: 800px;
    text-align: center;
}
.creator-content {
    background: var(--color-bg-light);
    padding: 40px;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}
.creator-content p {
    font-size: 1.2rem;
    line-height: 1.7;
}
.creator-content p:not(:last-child) {
    margin-bottom: 20px;
}

/* --- CONTACTS PAGE --- */
.contact-page-container {
    display: flex;
    gap: 60px;
    align-items: flex-start;
    max-width: 900px;
    margin: 0 auto;
}
.contact-form { flex: 1; }
.contact-form h3, .contact-info h3 { font-family: var(--font-heading); margin-bottom: 20px; }
.contact-form input, .contact-form textarea {
    width: 100%; padding: 12px; margin-bottom: 15px; border-radius: 8px;
    border: 1px solid #ced4da; font-family: var(--font-body); font-size: 1rem;
}
.contact-form input:focus, .contact-form textarea:focus {
    outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(255, 193, 7, 0.25);
}
.contact-info {
    flex: 1;
    background-color: #FFFBEB;
    padding: 30px;
    border-radius: 12px;
}
.contact-info ul { list-style: none; }
.contact-info li { margin-bottom: 10px; }
.contact-info a { color: var(--color-secondary); text-decoration: none; }

/* --- FOOTER --- */
.footer { background-color: var(--color-text-dark); color: #fff; padding: 40px 0; }
.footer-container { display: flex; justify-content: space-between; align-items: center; }
.footer a { color: #fff; text-decoration: none; margin: 0 10px; transition: color 0.3s ease; }
.footer a:hover { color: var(--color-primary); }
.footer-copy h4 { font-family: var(--font-heading); margin-bottom: 5px; }
.footer-copy p { color: var(--color-text-light); }

/* --- COOKIE BANNER --- */
.cookie-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: var(--color-text-dark);
    color: #fff;
    padding: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    z-index: 1000;
    transform: translateY(0);
    transition: transform 0.5s ease;
}
.cookie-banner.hidden {
    transform: translateY(100%);
}
.cookie-banner p { margin: 0; }
.cookie-banner a { color: var(--color-primary); }

/* --- АНИМАЦИИ ПРИ СКРОЛЛЕ --- */
.fade-in { opacity: 0; transform: translateY(30px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
.fade-in.visible { opacity: 1; transform: translateY(0); }

/* --- АДАПТИВНОСТЬ --- */
@media (max-width: 992px) {
    .section-title { font-size: 2rem; }
    .hero-container, .uniqueness-container, .pricing-container, .contact-page-container { flex-direction: column; }
    .hero-text { text-align: center; }
    .hero-text h1 { font-size: 2.8rem; }
    .hero-visual { margin-top: 40px; }
    .uniqueness-text .section-title { text-align: center; }
    .uniqueness-visual { order: -1; }
    .pricing-card { border-right: none; border-bottom: 1px solid #e9ecef; padding-right: 0; padding-bottom: 30px; }
    .process-container { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
    .benefits-grid { grid-template-columns: 1fr; }
    .footer-container { flex-direction: column; gap: 20px; text-align: center; }
    .cookie-banner { flex-direction: column; text-align: center; }
}

@media (max-width: 576px) {
    .process-container { grid-template-columns: 1fr; }
    .hero-text h1 { font-size: 2.2rem; }
    .hero-text h2 { font-size: 1.2rem; }
    .chat-widget { width: 100%; transform: rotate(0); }
    .price { font-size: 3rem; }
}

/* --- СТИЛИ ДЛЯ ЮРИДИЧЕСКИХ СТРАНИЦ (ДОПОЛНЕНИЕ) --- */
.legal-text .header {
    text-align: center;
    margin-bottom: 40px;
}
.legal-text .header h1 {
    font-size: 2rem;
    margin-bottom: 10px;
}
.legal-text h3 {
    font-family: var(--font-heading);
    margin-top: 30px;
    margin-bottom: 15px;
    border-bottom: 2px solid var(--color-primary);
    padding-bottom: 5px;
}
.legal-text .highlight {
    font-weight: 600;
}
.legal-text a {
    color: var(--color-secondary);
}
.legal-text ul, .legal-text ol {
    padding-left: 20px;
    margin-bottom: 15px;
}
.legal-text li {
    margin-bottom: 10px;
}
.legal-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    font-size: 0.9rem;
}
.legal-table th, .legal-table td {
    border: 1px solid #dee2e6;
    padding: 8px 12px;
    text-align: left;
}
.legal-table thead {
    background-color: #e9ecef;
    font-weight: 600;
}

/* Стили для красивого хедера на внутренних страницах */
.logo-wrapper {
    text-decoration: none;
    display: inline-block;
}
.logo-link {
    font-family: var(--font-heading);
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--color-text-dark);
}
.logo-yellow { color: var(--color-primary); }
.logo-red { color: var(--color-secondary); }
.logo-tagline {
    display: block;
    font-size: 0.9rem;
    color: var(--color-text-light);
    margin-top: -5px;
}

/* Стили для обновленной страницы контактов */
.contact-info li {
    display: flex;
    align-items: center;
}
.contact-icon {
    font-size: 1.5rem;
    margin-right: 15px;
}

/* Стили для нового блока "От создателя" */
#creator {
    background-color: var(--color-bg-light);
}
.creator-grid {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 40px;
    align-items: center;
}
.creator-card {
    background: #fff;
    padding: 30px;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 10px 30px rgba(0,0,0,0.07);
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.creator-icon {
    font-size: 3rem;
    margin-bottom: 15px;
}
.creator-card h3 {
    font-family: var(--font-heading);
    margin-bottom: 15px;
}
.creator-card p {
    color: var(--color-text-light);
    margin-bottom: 25px;
}
.btn-outline {
    border: 2px solid var(--color-primary);
    background: transparent;
    color: var(--color-text-dark);
}
.btn-outline:hover {
    background: var(--color-primary);
}

.creator-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
.stat-item {
    text-align: center;
    background: linear-gradient(135deg, #fff, #f9f9f9);
    padding: 25px;
    border-radius: 12px;
}
.stat-number {
    font-family: var(--font-heading);
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--color-secondary);
}
.stat-label {
    font-size: 1rem;
    color: var(--color-text-light);
}

/* Стили для обновленного футера */
.footer-copy p {
    font-size: 0.8rem; /* Уменьшаем шрифт */
    color: var(--color-text-light);
    line-height: 1.5;
}

/* Адаптивность для новых блоков */
@media (max-width: 992px) {
    .creator-grid {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 576px) {
    .creator-stats {
        grid-template-columns: 1fr;
    }
    .stat-number {
        font-size: 2rem;
    }
}

/* Стили для сообщений формы */
#form-status {
    margin-top: 15px;
    padding: 10px;
    border-radius: 8px;
    font-weight: 600;
    display: none; /* Сначала скрыт */
}
#form-status.success {
    display: block;
    background-color: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}
#form-status.error {
    display: block;
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}
.g-recaptcha {
    margin-bottom: 15px;
}

/* --- СТИЛИ ДЛЯ ОБНОВЛЕННОГО БЛОКА ЦЕНЫ --- */
.price-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin-bottom: 5px;
}

.price {
    font-family: var(--font-heading);
    font-size: 3rem;
    font-weight: 700;
    color: var(--color-secondary);
}

.old-price {
    font-size: 1.2rem;
    color: var(--color-text-light);
    text-decoration: line-through;
    opacity: 0.7;
}

/* Адаптивность для блока с ценой */
@media (max-width: 576px) {
    .price {
        font-size: 3rem;
    }
    .old-price {
        font-size: 1.8rem;
    }
}

/* --- СТИЛИ ДЛЯ БЛОКА FAQ --- */
#faq {
    background-color: var(--color-bg-light);
}

.faq-container h3 {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    margin-top: 30px;
    margin-bottom: 15px;
    padding-bottom: 5px;
    border-bottom: 2px solid var(--color-primary);
}

.faq-container h3:first-child {
    margin-top: 0;
}

.faq-item {
    background-color: #fff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    margin-bottom: 10px;
    transition: box-shadow 0.3s ease;
}

.faq-item:hover {
    box-shadow: 0 4px 15px rgba(0,0,0,0.07);
}

.faq-item summary {
    font-family: var(--font-heading);
    font-weight: 600;
    font-size: 1.1rem;
    padding: 15px 20px;
    cursor: pointer;
    list-style: none; /* Убираем стандартный маркер */
    position: relative;
    color: var(--color-text-dark);
}

.faq-item summary::-webkit-details-marker {
    display: none; /* Убираем стандартный маркер для Chrome/Safari */
}

/* Создаем свой маркер "+" */
.faq-item summary::after {
    content: '+';
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--color-primary);
    transition: transform 0.3s ease;
}

/* При открытии элемента, маркер "+" превращается в "×" */
.faq-item[open] summary::after {
    content: '\00d7'; /* Символ "умножить" */
    transform: translateY(-50%) rotate(180deg);
}

.faq-item[open] summary {
    border-bottom: 1px solid #e9ecef;
    color: var(--color-secondary);
}

.faq-item p {
    padding: 20px;
    line-height: 1.7;
    color: var(--color-text-light);
}

.faq-item p a {
    color: var(--color-secondary);
    font-weight: 600;
    text-decoration: underline;
}

/* Контейнер .hero-visual теперь будет точкой отсчета */
.hero-visual {
    position: relative;
}

/* Общий контейнер для подсказки */
.chat-prompt {
    position: absolute;
    top: -90px; /* Располагаем над виджетом, можно подстроить */
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    z-index: 10; /* Чтобы было поверх других элементов */
    width: 220px; /* Фиксированная ширина для стабильности */
}

/* Стили для текста "Поговорите со мной..." */
.prompt-text {
    background-color: var(--color-primary); /* Используем ваш желтый цвет */
    color: var(--color-text-dark);
    padding: 6px 15px;
    border-radius: 20px;
    font-family: var(--font-heading);
    font-weight: 600;
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
    white-space: nowrap; /* Чтобы текст не переносился */
    font-size: 25px;
}

/* Стили для стрелки, созданной через CSS */
.prompt-arrow {
    width: 15px;
    height: 15px;
    /* Создаем стрелку с помощью границ */
    border-bottom: 3px solid var(--color-secondary); /* Используем ваш красный цвет */
    border-right: 3px solid var(--color-secondary);
    transform: rotate(45deg);
    /* Добавляем анимацию "пульсации" */
    animation: bounce-arrow 2s infinite;
}

/* Ключевые кадры для анимации стрелки */
@keyframes bounce-arrow {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0) rotate(45deg);
    }
    40% {
        transform: translateY(8px) rotate(45deg);
    }
    60% {
        transform: translateY(4px) rotate(45deg);
    }
}

/* Адаптация для мобильных устройств, чтобы подсказка не мешала */
@media (max-width: 992px) {
    .chat-prompt {
        top: -45px; /* Немного ближе к виджету на мобильных */
    }
}

@media (max-width: 576px) {
    .chat-widget {
        transform: rotate(0); /* Убираем наклон на маленьких экранах */
    }
    .chat-prompt {
        /* Можно скрыть подсказку на очень маленьких экранах, если она будет мешать */
        /* display: none; */
    }
}

/* --- СТИЛИ ДЛЯ БЛОКА "ПОЧЕМУ МЫ МОЖЕМ" --- */
#why-us {
    background-color: var(--color-bg);
}

.section-subtitle {
    text-align: center;
    font-size: 1.2rem;
    color: var(--color-text-light);
    margin-top: -30px;
    margin-bottom: 50px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.why-us-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: stretch; /* Колонки одинаковой высоты */
}

.problem-column, .solution-column {
    background-color: var(--color-bg-light);
    border-radius: 12px;
    padding: 30px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
}

.column-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}

.column-header h3 {
    font-family: var(--font-heading);
    font-size: 1.3rem;
    margin: 0;
}

.column-icon {
    font-size: 1.8rem;
}

.problem-column {
    border-top: 5px solid var(--color-secondary); /* Красная линия */
}

.solution-column {
    border-top: 5px solid var(--color-primary); /* Желтая линия */
}

.column-content {
    flex-grow: 1; /* Чтобы контент занимал все место */
    display: flex;
    flex-direction: column;
}

.column-content p {
    color: var(--color-text-light);
    line-height: 1.7;
}

.column-content ul, .column-content ol {
    margin-top: 15px;
    margin-bottom: 15px;
    padding-left: 20px;
}

.column-content li {
    margin-bottom: 10px;
}

.column-content h4 {
    font-family: var(--font-heading);
    margin-top: 20px;
    color: var(--color-text-dark);
}

.column-summary {
    margin-top: auto; /* Прижимает итоговый текст к низу */
    padding: 15px;
    border-radius: 8px;
    font-weight: 600;
}

.problem-summary {
    background-color: #f8d7da; /* Светло-красный фон */
    color: #721c24;
}

.solution-summary {
    background-color: #d4edda; /* Светло-зеленый фон */
    color: #155724;
}

/* Адаптивность для блока */
@media (max-width: 992px) {
    .why-us-container {
        grid-template-columns: 1fr;
    }
}

/* --- СТИЛИ ДЛЯ БЛОКА "НЕОСПОРИМЫЕ ДОВОДЫ" --- */
#arguments {
    background-color: var(--color-bg-light);
}

.arguments-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.argument-card {
    background-color: #fff;
    border-radius: 12px;
    padding: 30px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    border-top: 4px solid; /* Цвет будет меняться */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.argument-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}

/* Назначаем цвета для рамки через иконку */
.argument-card .icon-yellow {
    border-top-color: var(--color-primary);
}
.argument-card .icon-red {
    border-top-color: var(--color-secondary);
}

.argument-icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 2rem;
    margin-bottom: 20px;
}
/* Используем уже существующие стили .icon-yellow и .icon-red для фона иконки */

.argument-number {
    font-family: var(--font-heading);
    font-weight: 700;
    color: var(--color-text-light);
    font-size: 0.9rem;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.argument-card h3 {
    font-family: var(--font-heading);
    font-size: 1.3rem;
    margin-bottom: 15px;
    color: var(--color-text-dark);
}

.argument-card p {
    color: var(--color-text-light);
    line-height: 1.7;
}

/* Адаптивность для блока */
@media (max-width: 992px) {
    .arguments-grid {
        grid-template-columns: 1fr;
    }
}

/* --- СТИЛИ ДЛЯ БЛОКА "РАЗРУШАЕМ МИФЫ" --- */
#myths {
    background-color: var(--color-bg); /* Используем основной фон */
}

.section-subtitle {
    text-align: center;
    max-width: 800px;
    margin: -30px auto 50px;
    font-size: 1.1rem;
    color: var(--color-text-light);
}

.myths-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.myth-card {
    background: var(--color-bg-light);
    border: 1px solid #e9ecef;
    border-left: 5px solid var(--color-primary); /* Акцентная полоса слева */
    border-radius: 8px;
    padding: 30px;
    display: flex;
    flex-direction: column;
}

.myth-card:nth-child(2n) { /* Чередуем цвет акцентной полосы */
    border-left-color: var(--color-secondary);
}

.myth-icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 2rem;
    margin-bottom: 20px;
}

.myth-statement {
    color: var(--color-text-light);
    font-style: italic;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px dashed #ced4da;
    text-decoration: line-through; /* Зачеркиваем миф */
}

.myth-statement span {
    font-weight: 600;
    color: var(--color-secondary);
    text-decoration: none; /* Убираем зачеркивание у слова "Миф:" */
    margin-right: 5px;
}

.myth-reality h4 {
    font-family: var(--font-heading);
    font-size: 1.2rem;
    margin-bottom: 10px;
    color: var(--color-text-dark);
}

.myth-reality p {
    line-height: 1.7;
    color: #495057; /* Чуть темнее, чем обычный light-text */
}

/* Адаптивность для блока с мифами */
@media (max-width: 992px) {
    .myths-grid {
        grid-template-columns: 1fr;
    }
}