*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{

    font-family:'Poppins',sans-serif;
    background:#f5f7fa;
    color:#333;

}

/* ===========================
   HEADER
=========================== */

.gallery-header{

    background: linear-gradient(
        90deg,
        #ffffff 0%,
        #dbeeff 30%,
        #2c5ea8 65%,
        #123d73 100%
    );

    border-bottom:4px solid #d4af37;

    padding:15px 40px;

    display:flex;

    justify-content:space-between;

    align-items:center;

}

/* Left */

.brand{

    display:flex;

    align-items:center;

    gap:12px;

    text-decoration:none;

    color:white;

    width:25%;

}

.brand img{

    width:75px;
    height:75px;
    object-fit:contain;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.15));

}

.brand-text h2{

    color:#123d73;

    font-size:20px;

    font-weight:700;

}

.brand-text p{

    color:#d4af37;

    font-size:13px;

    font-weight:600;

}

.brand-text span{

    color:#d4af37;

    font-size:11px;

}

/* Center */

.page-title{

    width:50%;

    text-align:center;

}

.page-title h1{

    color:white;

    font-size:36px;

    font-weight:700;

}

/* Right */

.header-right{

    width:25%;

    display:flex;

    justify-content:flex-end;

}

.home-btn{

    padding:10px 22px;

    border:2px solid #d4af37;

    border-radius:30px;

    color:white;

    text-decoration:none;

    font-weight:600;

    transition:.3s;

}

.home-btn:hover{

    background:#d4af37;

    color:#123d73;

}

/* Responsive */

@media(max-width:768px){

.gallery-header{

    flex-direction:column;

    gap:15px;

    text-align:center;

}

.brand,
.page-title,
.header-right{

    width:100%;
    justify-content:center;

}

.page-title h1{

    font-size:28px;

}

}
/* GALLERY */

.gallery{

    width:90%;

    margin:50px auto;

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}

.gallery img{

    width:100%;

    border-radius:12px;

    cursor:pointer;

    box-shadow:0 10px 25px rgba(0,0,0,.12);

    transition:.35s;

}

.gallery img:hover{

    transform:translateY(-8px) scale(1.03);

    box-shadow:0 18px 40px rgba(0,0,0,.22);

}

/* LIGHTBOX */

#lightbox{

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.92);

    display:none;

    justify-content:center;

    align-items:center;

    flex-direction:column;

    z-index:9999;

}

#lightbox img{

    max-width:82%;

    max-height:82vh;

    border-radius:12px;

    box-shadow:0 20px 50px rgba(0,0,0,.6);

}

#close{

    position:absolute;

    top:25px;
    right:40px;

    font-size:45px;

    color:white;

    cursor:pointer;

}

#prev,
#next{

    position:absolute;

    top:50%;

    transform:translateY(-50%);

    background:white;

    border:none;

    width:55px;
    height:55px;

    border-radius:50%;

    font-size:28px;

    cursor:pointer;

    transition:.3s;

}

#prev:hover,
#next:hover{

    background:#C89B3C;
    color:white;

}

#prev{

    left:40px;

}

#next{

    right:40px;

}

#counter{

    color:white;

    margin-top:25px;

    font-size:20px;

    letter-spacing:1px;

}

/* TABLET */

@media(max-width:991px){

.gallery{

grid-template-columns:repeat(2,1fr);

}

}

/* MOBILE */

@media(max-width:600px){

header{

flex-direction:column;

gap:20px;

text-align:center;

}

.gallery{

grid-template-columns:1fr;

}

#prev{

left:10px;

}

#next{

right:10px;

}

}

/* ======================================
   FLOATING WHATSAPP
====================================== */

.whatsapp-float{

    position:fixed;

    bottom:25px;

    right:25px;

    width:70px;

    height:70px;

    background:#25D366;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    box-shadow:0 8px 25px rgba(0,0,0,.35);

    z-index:9999;

    transition:.3s;

    animation:whatsappPulse 2s infinite;

}

.whatsapp-float:hover{

    transform:scale(1.1);

}

.whatsapp-float img{

    width:38px;

    height:38px;

}

@keyframes whatsappPulse{

0%{

    transform:scale(1);

}

50%{

    transform:scale(1.08);

}

100%{

    transform:scale(1);

}

}

@media(max-width:768px){

.whatsapp-float{

    width:60px;

    height:60px;

    bottom:18px;

    right:18px;

}

.whatsapp-float img{

    width:32px;

    height:32px;

}

}

.whatsapp-tooltip{

    position:absolute;

    right:85px;

    white-space:nowrap;

    background:#1f2937;

    color:#fff;

    padding:10px 14px;

    border-radius:8px;

    font-size:14px;

    font-weight:600;

    opacity:0;

    visibility:hidden;

    transform:translateX(10px);

    transition:all .3s ease;

    box-shadow:0 5px 15px rgba(0,0,0,.25);

}

.whatsapp-float:hover .whatsapp-tooltip{

    opacity:1;

    visibility:visible;

    transform:translateX(0);

}

@media(max-width:768px){

.whatsapp-tooltip{

    display:none;

}

}

/* ======================================
   PROTECT GALLERY
====================================== */

.gallery-grid img{

    user-select:none;

    -webkit-user-select:none;

    -moz-user-select:none;

    -ms-user-select:none;

    -webkit-user-drag:none;

    pointer-events:auto;

}

.gallery-grid img{

    -webkit-touch-callout:none;

}

/*==================================
   PDF DOWNLOAD
==================================*/

.catalogue-download{

    text-align:center;

    padding:22px 0 10px;

    background:#f7f9fc;

}

.catalogue-download a{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:14px 30px;

    border-radius:50px;

    background:linear-gradient(135deg,#f4c542,#d9a404);

    color:#123d73;

    text-decoration:none;

    font-weight:700;

    font-size:16px;

    transition:.3s;

    box-shadow:0 8px 20px rgba(0,0,0,.15);

}

.catalogue-download a:hover{

    transform:translateY(-3px);

    box-shadow:0 12px 24px rgba(0,0,0,.25);

}

/*==================================
    DOWNLOAD DIGITAL CATALOGUE
==================================*/

.catalogue-download{

    display:flex;

    justify-content:center;

    padding:25px 0 20px;

    background:#f8f9fb;

}

.catalogue-download a{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:16px 42px;
font-size:18px;
font-weight:700;

    border-radius:999px;

    background:linear-gradient(135deg,#0d5db8,#003f8c);

    color:#fff;

    text-decoration:none;

    font-size:17px;

    font-weight:600;

    letter-spacing:.3px;

    transition:all .3s ease;

    box-shadow:0 10px 25px rgba(13,93,184,.25);

}

.catalogue-download a:hover{

    transform:translateY(-3px);

    box-shadow:0 15px 35px rgba(13,93,184,.35);

}

.catalogue-download a:active{

    transform:translateY(0);

}

/*==================================
    DOWNLOAD ICON
==================================*/

.download-icon{

    width:40px;

    height: 40px;

    margin-right:10px;

    vertical-align:middle;

}

/*==================================
        GALLERY FOOTER
==================================*/

.gallery-footer{

    background:#123d73;

    color:#ffffff;

    text-align:center;

    padding:22px 15px;

    margin-top:50px;

    border-top:4px solid #d8a100;

}

.footer-contact{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:18px;

    flex-wrap:wrap;

    font-size:15px;

    color:#f5c84c;

    margin-bottom:12px;

}

.footer-brand{

    font-size:22px;

    font-weight:700;

    letter-spacing:1px;

    margin-bottom:8px;

}

.footer-copy{

    font-size:14px;

    color:#d8d8d8;

}

/* Mobile */

@media(max-width:768px){

.footer-contact{

    flex-direction:column;

    gap:8px;

}

.footer-contact span:nth-child(even){

    display:none;

}

.footer-brand{

    font-size:18px;

}

.footer-copy{

    font-size:13px;

}

}