/* =========================================
   TARIFFS STYLES
   ========================================= */

/* --- ОБЩИЕ СТИЛИ СЕКЦИИ --- */
.tariffs-section, .page-section {
    padding-bottom: var(--space-xl) ;
    
}


/* --- КАРТОЧКА ТАРИФА --- */
.tariff-card {
    display: flex;
    flex-direction: column;
    background: var(--color-background-card-light);
    border-radius: 16px;
    padding: var(--space-lg);
    box-shadow: var(--shadow-sm);
    border: 2px solid transparent;
    transition: all 0.3s ease;
    height: 100%;
}

.tariff-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-lg);
}

/* --- Шапка тарифа --- */
.tariff-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-sm);
}
.tariff-title h3 { font-size: var(--font-size-h3); margin: 0 0 5px 0; color: var(--color-text-main); } /* ИСПРАВЛЕНО */
.tariff-title p { display: flex; align-items: center; gap: 8px; font-size: var(--font-size-body-large); margin: 0; color: var(--color-text-secondary); } /* ИСПРАВЛЕНО */
.tariff-title p .fa-bolt { color: #f44a22; }
.tariff-tag { background-color: #e8f4fd; color: var(--color-primary); padding: 5px 12px; border-radius: 50px; font-size: var(--font-size-small); font-weight: var(--font-weight-semibold); } /* ИСПРАВЛЕНО */

/* --- Цена --- */
.tariff-price {
    font-size: var(--font-size-h1); /* ИСПРАВЛЕНО */
    font-weight: var(--font-weight-bold);
    color: var(--color-text-main);
    margin-bottom: var(--space-md);
}
.tariff-price span { font-size: var(--font-size-body); font-weight: var(--font-weight-medium); color: var(--color-text-secondary); } /* ИСПРАВЛЕНО */

/* --- Список преимуществ --- */
.tariff-features {
    list-style: none; padding: 0;
    margin: 0 0 var(--space-lg) 0;
    flex-grow: 1;
}
.feature-item {
    display: flex; gap: var(--space-md);
    padding: var(--space-xs) 0;
}
.feature-item .icon { font-size: var(--font-size-body-icon-small); color: var(--color-primary); flex-shrink: 0; width: 30px; text-align: center; } /* ИСПРАВЛЕНО */
.feature-item-body h4 { font-size: var(--font-size-body); margin: 0 0 4px 0; color: var(--color-text-main); } /* ИСПРАВЛЕНО */
.feature-item-body p { font-size: var(--font-size-body); margin: 0; color: var(--color-text-secondary);  } /* ИСПРАВЛЕНО */

/* --- Табы --- */
.tariff-tabs {
    margin-bottom: var(--space-lg);
}
.tab-buttons {
    display: flex; background: var(--color-background-light);
    border-radius: var(--border-radius-md); padding: 5px;
}
.tab-button {
    flex: 1; padding: 10px; border: none; background: transparent; cursor: pointer;
    font-size: var(--font-size-body); font-weight: var(--font-weight-semibold); color: var(--color-text-secondary);
    border-radius: var(--border-radius-sm); transition: all 0.3s ease;
}
.tab-button.active { background: var(--color-background-card-light); color: var(--color-text-main); box-shadow: var(--shadow-xs); }

.tab-content { display: none; padding: var(--space-md) 0 0 0; }
.tab-content.active { display: block; }

.tab-content-item {
    font-size: var(--font-size-body); color: var(--color-text-secondary);
     padding: var(--space-xs);
    border-radius: var(--border-radius-sm);
}
.tab-content-item:not(:last-child) { margin-bottom: var(--space-xs); }
.tab-content-item strong { color: var(--color-text-main); }

/* --- Кнопка с эффектом блика --- */
.tariff-card .btn {
    width: 100%; background: var(--gradient-dark);
    color: #fff; text-decoration: none;
    position: relative; overflow: hidden; font-size: var(--font-size-base);
}
.tariff-card .btn::after {
    content: ''; position: absolute; top: 0; left: -150%;
    width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    transition: left 0.6s ease-in-out;
}
.tariff-card .btn:hover::after { left: 150%; }
 .tariff-card .btn:hover { text-decoration: none; }

/* --- СТИЛИ ДЛЯ ПОПУЛЯРНОГО ТАРИФА --- */
.tariff-card.popular {
    background: var(--gradient-dark);
    border-color: var(--color-primary);
}
.tariff-card.popular .tariff-title h3, 
.tariff-card.popular .tariff-title p, 
.tariff-card.popular .feature-icon , 
.tariff-card.popular .tariff-price,
.tariff-card.popular .tariff-price span,
.tariff-card.popular .feature-item-body h4,
.tariff-card.popular .tab-content-item strong {
    color: #fff;
}
.tariff-card.popular .feature-item-body p {
    color: #95a5a6;
}

.tariff-card.popular .tariff-tag { background: var(--gradient-accent); color: #fff; }
.tariff-card.popular .feature-item .icon { color: #fff; }
.tariff-card.popular .tab-buttons { background: rgba(0,0,0,0.3); }
.tariff-card.popular .tab-button { color: rgba(255,255,255,0.7); }
.tariff-card.popular .tab-button.active { background: #333; color: #fff; }
.tariff-card.popular .tab-content-item { color: rgba(255,255,255,0.8); }
.tariff-card.popular .btn { background: var(--gradient-accent); }


/* --- АДАПТИВНОСТЬ --- */

/* Слайдер */
.tariffs-slider { 
    padding: 10px;
    margin: -10px;
}
swiper-slide {
    height: auto;
}

/* Сетка */
.tariffs-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-lg);
}

@media (max-width: 1023px) {
    .tariffs-container { width: 100%; }
    .tariffs-grid { grid-template-columns: 1fr 1fr; } 
}

@media (max-width: 639px) { 
    .tariffs-grid { grid-template-columns: 1fr; }
	 .tariff-features .feature-item i { font-size: 1em; }
	.combo-tariff-card {        padding-top: 70px;     height: auto;}
	 
}