/* =====================================================
   DIRECTORIO DE RETIROS
   LISTADO DE RETIROS
===================================================== */


/* ---------- CABECERA ---------- */

.archive-retreats{

    padding:4rem 0 6rem;

}

.archive-header{

    text-align:center;

    max-width:700px;

    margin:0 auto 4rem;

}

.archive-header h1{

    margin-bottom:1rem;

}

.archive-header p{

    color:var(--color-text-light);

}


/* ---------- GRID ---------- */

.retreat-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit, minmax(360px,1fr));

    gap:2rem;

}


/* ---------- TARJETA ---------- */

.retreat-card{

    background:var(--color-surface);

    border:1px solid var(--color-border);

    border-radius:var(--radius);

    overflow:hidden;

    transition:.25s;

}

.retreat-card:hover{

    transform:translateY(-4px);

    box-shadow:var(--shadow);

}


/* ---------- ENLACE ---------- */

.retreat-card__link{

    display:block;

    color:inherit;

}


/* ---------- IMAGEN ---------- */

.retreat-card__image{

    aspect-ratio:16/10;

    overflow:hidden;

}

.retreat-card__image img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.35s;

}

.retreat-card:hover img{

    transform:scale(1.04);

}


/* ---------- CONTENIDO ---------- */

.retreat-card__content{

    padding:1.5rem;

}

.retreat-card__title{

    font-size:2rem;

    margin:1rem 0 .75rem;

}

.retreat-card__location{

    color:var(--color-text-light);

    margin-bottom:1.5rem;

}


/* ---------- PIE ---------- */

.retreat-card__footer{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding-top:1rem;

    border-top:1px solid var(--color-border);

}

.retreat-card__footer span{

    color:var(--color-text-light);

}

.retreat-card__footer strong{

    color:var(--color-primary);

}


/* ---------- RESPONSIVE ---------- */

@media(max-width:768px){

    .archive-retreats{

        padding:2rem 0 4rem;

    }

    .retreat-grid{

        grid-template-columns:1fr;

    }

}