/*
 * FRECUENCIA ARTISTAS · PORTADA COMPACTA · V1.0.9
 *
 * Esta hoja actúa únicamente cuando body tiene la clase catalog-home.
 * No modifica los perfiles individuales.
 */

/* ================================================================
   HERO
   ================================================================ */

.catalog-home .catalog-hero{
    height:clamp(560px,64svh,670px)!important;
    min-height:560px!important;
}

.catalog-home .catalog-hero-content{
    top:47%!important;
    left:9vw!important;
    transform:translateY(-48%)!important;
}

.catalog-home .catalog-hero h1{
    max-width:760px!important;
    font-size:clamp(5.2rem,8.2vw,9.6rem)!important;
    line-height:.8!important;
}

.catalog-home .hero-release{
    margin:14px 0 12px!important;
}

.catalog-home .hero-actions{
    margin-top:16px!important;
}

.catalog-home .hero-sequence{
    bottom:18px!important;
}

.catalog-home .hero-sequence>p{
    margin-bottom:7px!important;
}

.catalog-home .hero-sequence button{
    min-height:62px!important;
    padding:10px 12px!important;
}

.catalog-home .hero-sequence button b{
    font-size:1.35rem!important;
}

/* ================================================================
   INTRODUCCIÓN BLANCA
   ================================================================ */

.catalog-home .catalog-intro{
    grid-template-columns:.32fr 1.6fr .95fr!important;
    min-height:0!important;
    gap:clamp(20px,2.3vw,42px)!important;
    padding:30px 3.8vw!important;
}

.catalog-home .catalog-intro .section-number{
    align-self:center!important;
}

.catalog-home .catalog-intro h2{
    max-width:820px!important;
    font-size:clamp(3.35rem,4.65vw,5.6rem)!important;
    line-height:.88!important;
}

.catalog-home .catalog-intro>div>p{
    max-width:650px!important;
    margin:12px 0 0!important;
    font-size:.9rem!important;
    line-height:1.55!important;
}

.catalog-home .artist-search>label{
    margin-bottom:6px!important;
}

.catalog-home .artist-search-bar{
    min-height:54px!important;
}

.catalog-home .search-go{
    min-height:54px!important;
}

/* ================================================================
   DIRECTORIO Y FILTROS
   ================================================================ */

.catalog-home .catalog-directory{
    padding:28px 3.8vw 24px!important;
}

.catalog-home .filter-bar{
    gap:12px!important;
    margin:0!important;
    padding-bottom:16px!important;
}

.catalog-home .select-wrap label{
    margin-bottom:5px!important;
}

.catalog-home .select-wrap select{
    padding:11px 13px!important;
}

.catalog-home .alphabet button{
    height:30px!important;
}

.catalog-home .directory-heading{
    margin:22px 0 18px!important;
    align-items:flex-end!important;
}

.catalog-home .directory-heading h2{
    font-size:clamp(3.8rem,5vw,5.8rem)!important;
    line-height:.86!important;
}

.catalog-home .directory-heading>p b{
    font-size:1.7rem!important;
}

/* ================================================================
   TARJETAS DEL DIRECTORIO
   ================================================================ */

.catalog-home .catalog-rail{
    align-items:flex-start!important;
    gap:16px!important;
}

.catalog-home .catalog-card{
    flex:0 0 min(360px,82vw)!important;
    align-self:flex-start!important;
}

.catalog-home .card-image{
    height:225px!important;
}

.catalog-home .video-count{
    top:14px!important;
    left:14px!important;
}

.catalog-home .featured-tag{
    top:14px!important;
    right:14px!important;
}

.catalog-home .card-letter{
    font-size:6rem!important;
}

.catalog-home .card-open{
    width:42px!important;
    height:42px!important;
    right:14px!important;
    bottom:14px!important;
}

.catalog-home .card-body{
    padding:16px 18px!important;
}

.catalog-home .card-kicker{
    font-size:.48rem!important;
}

.catalog-home .card-body h3{
    margin:8px 0 6px!important;
    font-size:2.55rem!important;
    line-height:.9!important;
}

.catalog-home .card-body>p{
    min-height:0!important;
    margin:7px 0 12px!important;
    font-size:.76rem!important;
    line-height:1.5!important;
}

.catalog-home .card-meta{
    gap:8px!important;
}

.catalog-home .card-actions{
    margin-top:12px!important;
    padding-top:11px!important;
}

.catalog-home .rail-arrow{
    width:58px!important;
    height:96px!important;
    font-size:2rem!important;
}

.catalog-home .rail-help{
    margin:8px 0 0!important;
}

.catalog-home .rail-controls{
    margin-top:8px!important;
}

/* ================================================================
   LLAMADO FINAL
   ================================================================ */

.catalog-home .join-cta{
    min-height:0!important;
    padding:34px 3.8vw 38px!important;
}

.catalog-home .join-copy{
    max-width:660px!important;
}

.catalog-home .join-copy h2{
    margin:10px 0 12px!important;
    font-size:clamp(3.8rem,5.25vw,6.3rem)!important;
    line-height:.86!important;
}

.catalog-home .join-copy>p:not(.eyebrow){
    max-width:550px!important;
    margin:0!important;
    line-height:1.5!important;
}

.catalog-home .join-copy .primary-button{
    margin-top:16px!important;
}

.catalog-home .join-word{
    font-size:24vw!important;
    bottom:-4vw!important;
}

/* ================================================================
   FOOTER EXCLUSIVO DE PORTADA
   ================================================================ */

.catalog-home footer{
    grid-template-columns:.9fr 1.35fr .7fr!important;
    align-items:center!important;
    gap:22px!important;
    padding:22px 3.8vw 16px!important;
}

.catalog-home footer>p{
    line-height:1.5!important;
}

.catalog-home footer>div{
    gap:6px!important;
}

.catalog-home footer>small{
    margin-top:14px!important;
    padding-top:12px!important;
}

/* ================================================================
   RENDERIZADO PHP INICIAL
   ================================================================ */

.catalog-home .ssr-catalog-hero{
    min-height:0!important;
    padding:48px 3.8vw 34px!important;
}

.catalog-home .ssr-catalog-hero h1{
    font-size:clamp(4.8rem,8vw,9rem)!important;
}

.catalog-home .ssr-section{
    min-height:0!important;
    padding:30px 3.8vw!important;
}

.catalog-home .ssr-section-head{
    margin:0 0 20px!important;
}

.catalog-home .ssr-artist-grid{
    gap:16px!important;
}

.catalog-home .ssr-artist-card>div{
    padding:16px!important;
}

.catalog-home .ssr-footer{
    min-height:0!important;
    padding:22px 3.8vw 16px!important;
}

/* ================================================================
   TABLET
   ================================================================ */

@media(max-width:1050px){
    .catalog-home .catalog-intro{
        grid-template-columns:.3fr 1.7fr!important;
        padding-top:32px!important;
        padding-bottom:32px!important;
    }

    .catalog-home .catalog-intro .artist-search{
        grid-column:2!important;
    }

    .catalog-home .catalog-card{
        flex-basis:min(340px,82vw)!important;
    }

    .catalog-home footer{
        grid-template-columns:1fr 1.3fr .7fr!important;
    }
}

/* ================================================================
   MÓVIL
   ================================================================ */

@media(max-width:720px){
    .catalog-home .catalog-hero{
        height:610px!important;
        min-height:610px!important;
    }

    .catalog-home .catalog-hero-content{
        inset:auto 18px 154px!important;
        transform:none!important;
    }

    .catalog-home .catalog-hero h1{
        font-size:clamp(4.4rem,20vw,6.5rem)!important;
    }

    .catalog-home .hero-sequence{
        left:18px!important;
        right:18px!important;
        bottom:14px!important;
    }

    .catalog-home .catalog-intro{
        grid-template-columns:1fr!important;
        gap:18px!important;
        padding:28px 18px!important;
    }

    .catalog-home .catalog-intro .section-number{
        align-self:auto!important;
    }

    .catalog-home .catalog-intro h2{
        font-size:3.55rem!important;
    }

    .catalog-home .catalog-intro .artist-search{
        grid-column:auto!important;
    }

    .catalog-home .catalog-directory{
        padding:24px 18px 22px!important;
    }

    .catalog-home .filter-bar{
        grid-template-columns:1fr 1fr!important;
    }

    .catalog-home .directory-heading{
        margin:20px 0 16px!important;
    }

    .catalog-home .directory-heading h2{
        font-size:3.7rem!important;
    }

    .catalog-home .catalog-card{
        flex-basis:84vw!important;
    }

    .catalog-home .card-image{
        height:215px!important;
    }

    .catalog-home .card-body h3{
        font-size:2.4rem!important;
    }

    .catalog-home .join-cta{
        padding:30px 18px 34px!important;
    }

    .catalog-home .join-copy h2{
        font-size:4.1rem!important;
    }

    .catalog-home footer{
        grid-template-columns:1fr!important;
        align-items:start!important;
        padding:22px 18px 16px!important;
    }
}