/* =========================================================
   INSTAGRAM / TRUSTED BY THOUSANDS
   ========================================================= */

.instagram-section {
    width: 100%;

    background:
        #001b10;

    padding:
        clamp(22px, 2.5vw, 38px)
        0
        clamp(28px, 3vw, 45px);

    box-sizing: border-box;

    overflow: hidden;
}


/* =========================================================
   MAIN CONTAINER
   ========================================================= */

.instagram-container {
    width: calc(100% - 0px);

    max-width: 1500px;

    margin: 0 auto;

    box-sizing: border-box;
}


/* =========================================================
   HEADER
   ========================================================= */

.instagram-header {
    width: 100%;

    display: grid;

    grid-template-columns:
        1fr 1.5fr;

    align-items: center;

    margin-bottom:
        clamp(15px, 1.5vw, 22px);

    box-sizing: border-box;
}


/* =========================================================
   LEFT INSTAGRAM CONTENT
   ========================================================= */

.instagram-follow {
    min-width: 0;
}


.instagram-title {
    display: flex;

    align-items: center;

    gap: 6px;

    color: #f4c542;

    font-family:
        "Inter",
        Arial,
        sans-serif;

    font-size:
        clamp(8px, 0.8vw, 12px);

    font-weight: 700;

    line-height: 1.2;

    white-space: nowrap;
}


.instagram-icon {
    width:
        clamp(14px, 1.4vw, 20px);

    height:
        clamp(14px, 1.4vw, 20px);

    display: inline-flex;

    align-items: center;

    justify-content: center;

    color: #f4c542;

    border:
        1px solid #f4c542;

    border-radius: 4px;

    font-size:
        clamp(8px, 0.8vw, 12px);

    flex-shrink: 0;
}


.instagram-follow p {
    margin:
        5px 0 0;

    color:
        rgba(255, 255, 255, 0.72);

    font-family:
        "Inter",
        Arial,
        sans-serif;

    font-size:
        clamp(6px, 0.6vw, 9px);

    line-height: 1.3;
}


/* =========================================================
   MAIN TITLE
   ========================================================= */

.instagram-header h2 {
    margin: 0;

    color: #f4c542;

    font-family: "Playfair Display",Georgia, serif;

    font-size: clamp(30px, 3.2vw, 48px);

    font-weight: 700;

    line-height: 1;

    white-space: nowrap;
	text-align: left;
	   padding-left: 1.5vw;
}


/* =========================================================
   IMAGE GALLERY
   ========================================================= */

.instagram-gallery {
    width: 100%;

    display: grid;

    grid-template-columns:
        repeat(6, minmax(0, 1fr));

    gap:
        clamp(5px, 0.7vw, 10px);

    box-sizing: border-box;
}


/* =========================================================
   IMAGE CARD
   ========================================================= */

.instagram-card {
    width: 100%;
    aspect-ratio: 1 / 1;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #b99524;
    border-radius: 8px;
    background: #00351f;
    box-sizing: border-box;
    transition: box-shadow 0.25s ease, border-color 0.25s ease;
}

/* =========================================================
   IMAGE
   ========================================================= */

.instagram-card img {
    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center;

    margin: 0;

    padding: 0;

    border: 0;

    transition:
        transform 0.35s ease;
}


/* =========================================================
   HOVER
   NO MOVEMENT OF CARD
   ONLY IMAGE + GOLDEN SHINE
   ========================================================= */

.instagram-card:hover {
    border-color: #f4c542;

    box-shadow:
        0 0 8px rgba(244, 197, 66, 0.38),
        0 0 18px rgba(244, 197, 66, 0.20);
}


.instagram-card:hover img {
    transform: scale(1.03);
}


/* =========================================================
   LARGE TABLETS
   ========================================================= */

@media (max-width: 1100px) {

    .instagram-header {
        grid-template-columns:
            0.85fr 1.5fr;
    }

    .instagram-header h2 {
        font-size:
            clamp(25px, 3.2vw, 38px);
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .instagram-section {
        padding:
            18px 0 25px;
    }


    .instagram-header {

        /*
         * STILL TWO AREAS
         * LEFT = INSTAGRAM
         * RIGHT = TITLE
         */

        grid-template-columns:
            0.85fr 1.5fr;

        margin-bottom: 10px;
    }


    .instagram-title {
        font-size:
            clamp(6px, 1.3vw, 9px);

        gap: 3px;
    }


    .instagram-icon {
        width:
            clamp(11px, 2vw, 15px);

        height:
            clamp(11px, 2vw, 15px);

        font-size: 7px;
    }


    .instagram-follow p {
        font-size:
            clamp(4px, 0.9vw, 7px);

        margin-top: 3px;
    }


    .instagram-header h2 {
        font-size:
            clamp(20px, 4.5vw, 32px);

        white-space: nowrap;
    }


    /*
     * IMPORTANT:
     * SIX IMAGES ALWAYS STAY IN ONE ROW
     */

    .instagram-gallery {
        grid-template-columns:
            repeat(6, minmax(0, 1fr));

        gap: 3px;
    }


    .instagram-card {
        border-radius: 4px;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 480px) {

    .instagram-section {
        padding:
            14px 0 20px;
    }


    .instagram-header {
        margin-bottom: 7px;
    }


    .instagram-title {
        font-size: 5px;

        gap: 2px;
    }


    .instagram-icon {
        width: 10px;

        height: 10px;

        font-size: 5px;
    }


    .instagram-follow p {
        font-size: 3.5px;

        margin-top: 2px;
    }


    .instagram-header h2 {
        font-size: 17px;
    }


    .instagram-gallery {
        gap: 2px;
    }


    .instagram-card {
        border-radius: 3px;
    }

}/* Show the complete uploaded post, including any account header and action bar. */
.instagram-card.instagram-uploaded { background:#fff; }
.instagram-card.instagram-uploaded img { width:100%; height:100%; object-fit:contain; object-position:center; }
.instagram-card:hover img { transform:none; }

.instagram-card > a { display:block; width:100%; height:100%; }