/* Contenedor principal para centrar el perfil */
.profile-main {
    padding: 120px 10% 80px;
    background-color: var(--bg-color);
}

.profile-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

/* Marco de la imagen similar al de los productos */
.image-frame {
    border: 8px solid #000000;
    padding: 0;
    position: relative;
    box-shadow: 20px 20px 0px var(--accent-gold);
}

.profile-img {
    width: 92%;
    display: block;
    filter: grayscale(20%);
    transition: filter 0.5s ease;
}

.profile-img:hover {
    filter: grayscale(0%);
}

.section-subtitle {
    text-transform: uppercase;
    letter-spacing: 4px;
    font-size: 0.8rem;
    color: var(--accent-gold);
    margin-bottom: 10px;
}

.profile-name {
    font-size: 3rem;
    margin-bottom: 20px;
    font-weight: 500;
    text-transform: uppercase;
}

.profile-divider {
    width: 60px;
    height: 3px;
    background-color: var(--accent-gold);
    margin-bottom: 30px;
}

.profile-bio {
    font-family: 'Raleway', sans-serif;
    line-height: 1.8;
    color: var(--text-main);
    margin-bottom: 30px;
}

/* Estadísticas rápidas */
.stats-grid {
    display: flex;
    gap: 30px;
    margin-bottom: 40px;
}

.stat-item {
    display: flex;
    flex-direction: column;
}

.stat-number {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--accent-gold);
}

.stat-label {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Lista de especialidades */
.specialties h3 {
    font-size: 1rem;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.specialties ul {
    list-style: none;
    margin-bottom: 40px;
}

.specialties li {
    margin-bottom: 10px;
    font-size: 0.95rem;
    display: flex;
    align-items: center;
    gap: 10px;
}

.specialties i {
    color: var(--accent-gold);
    font-size: 0.8rem;
}



/* Responsive */
/* Responsive optimizado */
/* Responsive - Ajustes para que se vea estático y centrado en móvil */
@media (max-width: 968px) {
    .profile-main {
        padding: 100px 5% 60px; /* Reducimos padding lateral para ganar espacio */
    }

    .profile-grid {
        display: flex; /* Cambiamos de grid a flex para mejor control de centrado */
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 40px;
    }
    
    /* Control del tamaño de la foto */
    .profile-image-section {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .image-frame {
        width: 260px; /* Tamaño fijo para que se vea pequeña y elegante */
        max-width: 80%; /* Evita que choque con los bordes en pantallas muy pequeñas */
        margin: 0 auto;
        box-shadow: 12px 12px 0px var(--accent-gold); /* Sombra proporcional al tamaño */
    }

    .profile-img {
        width: 100%; /* Ocupa el 100% de su contenedor (los 260px) */
        filter: grayscale(0%); /* En móvil suele ser mejor mostrar el color directo */
    }

    /* Ajustes de Texto */
    .profile-info-section {
        width: 100%;
    }

    .profile-name {
        font-size: 2rem; /* Tamaño más cómodo para lectura en móvil */
        margin-bottom: 15px;
    }
    
    .profile-divider {
        margin: 0 auto 30px;
    }
    
    .profile-bio {
        max-width: 95%;
        margin-left: auto;
        margin-right: auto;
    }
    
    .stats-grid {
        justify-content: center;
        gap: 20px;
    }
    
    .specialties ul {
        display: flex;
        flex-direction: column;
        align-items: center; /* Centra la lista de especialidades */
        padding: 0;
    }

    .specialties li {
        justify-content: center;
    }
}