/* Стили для страницы девушки */
.girl-profile {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 4rem;
    margin-bottom: 4rem;
}

.gallery-section {
    /* Стили галереи */
}

.info-section {
    /* Стили информационной секции */
}

.thumbnails-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: 0.75rem;
}

.thumbnail {
    width: 100%;
    height: 100px;
    object-fit: cover;
    border-radius: 12px;
    cursor: pointer;
    border: 3px solid transparent;
    transition: all 0.3s;
    opacity: 0.7;
}

.thumbnail.active {
    border: 3px solid #e74c3c;
    opacity: 1;
}

/* Адаптивность для страницы девушки */
@media (max-width: 768px) {
    .girl-profile {
        display: block !important;
    }
    
    .girl-profile > div {
        margin-bottom: 3rem;
    }
    
    .gallery-section {
        margin-bottom: 2rem;
    }
    
    div[style*="grid-template-columns: repeat(2, 1fr)"] {
        grid-template-columns: 1fr 1fr !important;
        gap: 0.75rem !important;
    }
    
    div[style*="grid-template-columns: 1fr 1fr"] {
        display: block !important;
    }
    
    div[style*="grid-template-columns: 1fr 1fr"] > div {
        margin-bottom: 2rem;
    }

    .thumbnails-container {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}

@media (max-width: 480px) {
    div[style*="grid-template-columns: repeat(2, 1fr)"] {
        grid-template-columns: 1fr !important;
    }
}

/* Анимация для кнопки звонка */
a[href^="tel"]:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 12px 40px rgba(238, 90, 36, 0.4) !important;
}

/* Анимация для кнопок навигации по фото */
#prev-btn:hover, #next-btn:hover {
    background: rgba(0,0,0,0.8) !important;
    transform: translateY(-50%) scale(1.1) !important;
}

/* Анимации появления */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-10px);
    }
    60% {
        transform: translateY(-5px);
    }
}