/* ============================================================
   UNPOP — Artist Profile Photo — v1.5.3
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700;900&display=swap');

.unpop-artist-photo-wrap {
    display: flex;
    justify-content: center;
    width: 100%;
    /* max-width injecté via Elementor selector */
}

/* ── CONTENEUR ── */
.unpop-artist-photo {
    position: relative;
    width: 100%;
    /* ← SUPPRIMÉ : max-height: 420px — cassait le ratio */
    /* aspect-ratio injecté via Elementor selector */
    overflow: hidden;
    background-color: #0d1e2e;
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 4px 24px rgba(1, 11, 19, 0.6);
    transition: box-shadow 0.35s ease;
}

.unpop-artist-photo:hover {
    box-shadow:
        0 20px 60px rgba(180, 210, 255, 0.18),
        0 8px 32px rgba(180, 210, 255, 0.10),
        0 0 0 1px rgba(180, 210, 255, 0.12);
}

/* ── PSEUDO-ÉLÉMENT pour l'animation scale au hover ── */
.unpop-artist-photo__bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    background-image: inherit;
    transition: transform 0.5s ease;
    border-radius: inherit;
}

.unpop-artist-photo:hover .unpop-artist-photo__bg {
    transform: scale(1.05);
}

/* ── TEXTURE GRAIN ── */
.unpop-artist-photo::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23noise)' opacity='0.06'/%3E%3C/svg%3E");
    background-repeat: repeat;
    background-size: 200px 200px;
    mix-blend-mode: overlay;
    z-index: 2;
    pointer-events: none;
    border-radius: inherit;
}

/* ── HALO LUMINEUX ── */
.unpop-artist-photo::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse at 60% 80%,
        rgba(180, 210, 255, 0.10) 0%,
        transparent 70%
    );
    z-index: 1;
    pointer-events: none;
    border-radius: inherit;
}

/* ── OMBRE PORTÉE (toggle) ── */
.unpop-artist-photo--shadow {
    box-shadow:
        0 20px 60px rgba(180, 210, 255, 0.18),
        0 8px 32px rgba(180, 210, 255, 0.10),
        0 0 0 1px rgba(180, 210, 255, 0.12);
}

/* ── PLACEHOLDER ── */
.unpop-artist-photo__placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, 0.15);
    font-size: 48px;
    border: 2px dashed rgba(255, 255, 255, 0.08);
    border-radius: inherit;
    z-index: 3;
}
