/*=========================================================
=                       INSTAGRAM                         =
=========================================================*/

/*---------- Section ----------*/

.instagram{
    text-align:center;
}

/*---------- Container ----------*/

.instagram__container{}

/*---------- Header ----------*/

.instagram__header{
    margin-bottom:0;
}

.instagram__title{}

.instagram__description{
    margin-inline:auto;
}

.instagram__header::after{
    content:"";
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:46px;
    height:46px;
    margin-top:var(--space-3);
    border-radius:50%;
    border:1.5px solid var(--border-strong);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F6E45' stroke-width='1.6'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.2' cy='6.8' r='1' fill='%232F6E45' stroke='none'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:center;
    background-size:20px;
}

/*---------- Grid: 3 espacios para reels/posts ----------*/

.instagram__grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:var(--space-3);
    margin-top:var(--space-4);
}

/*---------- Post ----------*/

.instagram-post{
    position:relative;
    display:block;
    aspect-ratio:9/13;
    overflow:hidden;
    border-radius:var(--radius-lg);
    background:var(--primary-soft);
    box-shadow:var(--shadow-sm);
}

.instagram-post__image{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform var(--transition-slow);
}

.instagram-post:hover .instagram-post__image{
    transform:scale(1.08);
}

.instagram-post::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, transparent 55%, rgba(30,74,47,.55) 100%);
    opacity:0;
    transition:opacity var(--transition);
}

.instagram-post:hover::before{
    opacity:1;
}

.instagram-post__icon{
    position:absolute;
    top:12px;
    right:12px;
    width:30px;
    height:30px;
    border-radius:50%;
    background:rgba(251,249,242,.9);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231E4A2F' stroke-width='1.8'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.2' cy='6.8' r='1' fill='%231E4A2F' stroke='none'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:center;
    background-size:16px;
}

.instagram-post__icon--reel{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231E4A2F' stroke-width='1.8'%3E%3Cpath d='M8 5v14l11-7Z'/%3E%3C/svg%3E");
}

/*---------- Responsive ----------*/

@media(max-width:700px){

    .instagram__grid{
        grid-template-columns:1fr;
        max-width:280px;
        margin-inline:auto;
        margin-top:var(--space-4);
    }

}