/* ==========================
   GALLERY PAGE
========================== */

.gallery-page-card {
    background: rgba(255,255,255,.04);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,.08);
    width: 85%;
    margin: 25px auto;
    padding: 45px;
    border-radius: 35px;
    text-align: center;
    box-shadow: 0 10px 25px rgba(0,0,0,.18);
}


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

    .gallery-page-card h1 {
        color: white;
        font-size: 42px;
        font-weight: 900;
        margin-bottom: 15px;
        text-shadow: 0 0 8px rgba(168,216,255,.85), 0 0 18px rgba(168,216,255,.55), 0 0 30px rgba(120,190,255,.35);
    }


/* ==========================
   INTRO
========================== */

.gallery-intro {
    color: #CFEFFF;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.7;
    margin: 0 auto 40px;
    max-width: 720px;
}


/* ==========================
   FEATURED GALLERY
========================== */

.featured-gallery {
    margin: 35px auto 45px;
}


.featured-main {
    max-width: 720px;
    margin: 0 auto 28px;
    padding: 20px;
}


    .featured-main img {
        height: 460px;
    }


.featured-secondary-grid {
    display: grid;
    grid-template-columns: minmax(0, 340px);
    justify-content: center;
    gap: 28px;
    margin-top: 28px;
}


.featured-secondary {
    padding: 16px;
}


    .featured-secondary img {
        height: 320px;
    }


/* ==========================
   MAIN GALLERY GRID
========================== */

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 24px;
    margin-top: 35px;
}


/* ==========================
   PHOTO FRAMES
========================== */

.gallery-frame {
    position: relative;
    background: #FFF8EE;
    border-radius: 32px;
    padding: 14px;
    box-shadow: 0 8px 18px rgba(0,0,0,.18), inset 0 0 16px rgba(255,255,255,.35);
    transition: .3s;
}


    .gallery-frame::before {
        content: "✦";
        position: absolute;
        top: 10px;
        right: 16px;
        z-index: 3;
        color: #f8a51b;
        font-size: 24px;
        font-weight: 900;
        text-shadow: 0 0 8px rgba(248,165,27,.55), 0 0 16px rgba(255,213,106,.35);
    }


    .gallery-frame::after {
        content: "";
        position: absolute;
        inset: 8px;
        border-radius: 26px;
        border: 1px solid rgba(28,63,130,.18);
        pointer-events: none;
    }


    .gallery-frame:hover {
        transform: translateY(-5px);
        box-shadow: 0 0 18px rgba(248,165,27,.35), 0 12px 28px rgba(0,0,0,.22), inset 0 0 18px rgba(255,255,255,.45);
    }


    .gallery-frame img {
        display: block;
        width: 100%;
        height: 280px;
        object-fit: cover;
        border-radius: 24px;
        position: relative;
        z-index: 2;
    }


/* ==========================
   GALLERY CTA
========================== */

.gallery-cta {
    background: rgba(6, 14, 48, 0.92);
    border: 1px solid rgba(120,180,255,.18);
    border-radius: 35px;
    padding: 35px;
    margin: 45px auto 0;
    box-shadow: 0 0 20px rgba(90,150,255,.12), 0 10px 30px rgba(0,0,0,.28), inset 0 0 18px rgba(120,180,255,.06);
}


    .gallery-cta h2 {
        color: white;
        font-size: 30px;
        font-weight: 900;
        line-height: 1.4;
        margin: 0 0 25px;
        text-shadow: 0 0 8px rgba(168,216,255,.85), 0 0 18px rgba(168,216,255,.55), 0 0 30px rgba(120,190,255,.35);
    }


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

@media(max-width:768px) {

    .gallery-page-card {
        width: 92%;
        padding: 25px;
    }

        .gallery-page-card h1 {
            font-size: 34px;
        }

    .gallery-intro {
        font-size: 18px;
    }

    .featured-main {
        padding: 14px;
    }

        .featured-main img {
            height: 330px;
        }

    .featured-secondary-grid,
    .gallery-grid {
        grid-template-columns: 1fr;
    }

    .featured-secondary img,
    .gallery-frame img {
        height: 300px;
    }

    .gallery-cta {
        padding: 28px;
    }

        .gallery-cta h2 {
            font-size: 25px;
        }
}


/* ==========================
   FINAL GALLERY FRAME FIX
   Natural photo frames
========================== */

.gallery-frame {
    position: relative;
    overflow: hidden;
    background: #FFF8EE;
    border-radius: 30px;
    padding: 14px;
    border: 2px solid rgba(255,248,238,.85);
    box-shadow: 0 8px 18px rgba(0,0,0,.18);
    transition: .3s ease;
}

    /* remove decorative star/inner border */
    .gallery-frame::before,
    .gallery-frame::after {
        content: none;
    }

    /* let photos keep their natural proportions */
    .gallery-frame img {
        display: block;
        width: 100%;
        height: auto;
        object-fit: unset;
        border-radius: 22px;
        background: transparent;
    }

    /* hover glow for every photo */
    .gallery-frame:hover {
        transform: translateY(-5px);
        box-shadow: 0 0 18px rgba(248,165,27,.45), 0 0 32px rgba(255,213,106,.28), 0 12px 28px rgba(0,0,0,.24);
    }


/* ==========================
   FEATURED PHOTO SECTION
========================== */

.featured-gallery {
    margin: 40px auto 55px;
}

/* main featured photo */
.featured-main.gallery-frame {
    max-width: 620px;
    margin: 0 auto 34px;
    padding: 16px;
    border: 4px solid #f8a51b;
    border-radius: 38px;
    box-shadow: 0 0 22px rgba(248,165,27,.42), 0 12px 30px rgba(0,0,0,.28);
}

/* secondary featured photos */
.featured-secondary-grid {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 28px;
    margin-top: 28px;
}

.featured-secondary.gallery-frame {
    padding: 15px;
    border: 3px solid #f8a51b;
    border-radius: 35px;
    box-shadow: 0 0 16px rgba(248,165,27,.32), 0 10px 24px rgba(0,0,0,.22);
}

    /* make first three glow stronger on hover */
    .featured-main.gallery-frame:hover,
    .featured-secondary.gallery-frame:hover {
        box-shadow: 0 0 24px rgba(248,165,27,.65), 0 0 42px rgba(255,213,106,.35), 0 14px 32px rgba(0,0,0,.30);
    }


/* ==========================
   MAIN GALLERY GRID
========================== */

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 28px;
    align-items: start;
    margin-top: 45px;
}


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

@media(max-width:768px) {

    .featured-main.gallery-frame {
        max-width: 100%;
    }

    .featured-secondary-grid,
    .gallery-grid {
        grid-template-columns: 1fr;
    }
}

/* ==========================
   CENTER SINGLE FEATURED PHOTO
========================== */

.featured-secondary-grid {
    display: grid;
    grid-template-columns: minmax(0, 360px);
    justify-content: center;
    gap: 28px;
    margin-top: 28px;
}

.featured-secondary.gallery-frame {
    width: 100%;
}



/* ==========================
   GALLERY TITLE FINAL POLISH
========================== */

.gallery-page-card h1 {
    color: #f8a51b;
}