:root {
    --bg-secondary: #2a2f26;
    --bg-primary: #333b30;
    --bg-brand: #31392e;
}

.bg-secondary {
    background-color: var(--bg-secondary) !important;
}

.bg-primary {
    background-color: var(--bg-primary) !important; 
}
.bg-brand{
    background-color: var(--bg-brand) !important; 
}

/* GLOBAL FONT */
body, * {
    font-family: "Barlow", sans-serif !important;
    font-size: 16px;
    font-weight: 500;
}

html, body {
    scroll-snap-type: y mandatory;
    scroll-behavior: smooth;
    overflow-x: hidden;
    max-width: 100vw;
}

/* Hide floating social bar on small screens */
@media (max-width: 767.98px) {
    .project-image-wrapper, .project-image-wrapper img {
        height: auto !important;
    }
    .full-height {
        height: auto !important;
    }
    .contact-section {
        height: auto !important;
    }
    .column-link {
        height: 50vh !important;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

.btn-primary {
    background-color: #ebeddf !important;
    color: #333b30 !important;
    border: none !important;
}

iframe {
    min-height: 450px;
}

.navbar-expand-lg .navbar-nav { gap: 20px !important; }

body {
    font-size: 16px;
}

.navbar-toggler {
    background: #ebeddf !important;
}

p, p strong, ul li, ul li strong, strong, li {
    font-family: inter !important;
}

.title {
    text-transform: uppercase;
    color: #31392e;
    padding: 5px 15px;
    font-family: "Barlow", sans-serif !important;
}

/* ============================================================
   NAVBAR — Desktop (unchanged behaviour)
   ============================================================ */
a.navbar-brand {
    position: fixed;
    top: 0;
    z-index: 1100;
    background: #31392e;
    padding: 20px 40px;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
}

.navbar {
    position: absolute;
    top: 20px;
    width: 100%;
    background-color: transparent !important;
    padding: 0px;
    z-index: 1000;
}

.navbar .nav-link {
    text-transform: uppercase;
    /*color: #fff !important;*/
}

.navbar .nav-link:hover {
    /*color: #ebeddf !important;*/
    font-weight: bold;
}

/* ============================================================
   NAVBAR — Mobile Fix (applied globally to ALL pages)
   ============================================================ */
@media (max-width: 991.98px) {

    /* Fix navbar to top with solid dark background */
    .navbar {
        position: fixed !important;
        top: 0 !important;
        background-color: #31392e !important;
        padding: 8px 0 !important;
    }

    /* Reset brand pill — sits inside the fixed navbar flow */
    a.navbar-brand {
        position: relative !important;
        top: auto !important;
        border-radius: 0 !important;
        padding: 8px 20px !important;
        z-index: auto !important;
    }

    /* Collapsed dropdown panel gets a solid background */
    .navbar-collapse {
        background-color: #31392e;
        padding: 10px 20px 20px;
        border-top: 1px solid rgba(235, 237, 223, 0.2);
        margin-top: 8px;
    }

    /* Nav links clearly visible on dark background */
    .navbar .nav-link {
        color: #ebeddf !important;
        padding: 10px 0 !important;
        border-bottom: 1px solid rgba(235, 237, 223, 0.1);
    }

    .navbar .nav-link:last-child {
        border-bottom: none;
    }

    .navbar .nav-link:hover,
    .navbar .nav-link.active {
        color: #ffffff !important;
        font-weight: 600;
        padding-left: 8px !important;
    }

    /* Push body content down so it doesn't hide under fixed navbar */
    body {
        padding-top: 70px;
    }

    /* Disable scroll snap on mobile — conflicts with open nav menu */
    html, body {
        scroll-snap-type: none;
    }
}

/* ============================================================
   REST OF ORIGINAL STYLES (unchanged)
   ============================================================ */

.hero-section {
    padding-top: 0px;
}

.full-height {
    height: calc(100vh - 0px);
}

@media (max-width: 767.98px) {
    .bg-home-1, .bg-home-2, .bg-home-3, .bg-home-4, .bg-home-5 {
        min-height: 50vh;
    }
}

.btn-brand {
    background: var(--bg-brand);
    color: white;
}

.column-link {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    text-decoration: none;
    color: white;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    border: 1px solid #ebeddf;
}

/* Home backgrounds */
.bg-home-1 { background-image: url('../../assets/images/home/1.webp'); }
.bg-home-2 { background-image: url('../../assets/images/home/2.webp'); }
.bg-home-3 { background-image: url('../../assets/images/home/3.webp'); }
.bg-home-4 { background-image: url('../../assets/images/home/4.webp'); }
.bg-home-5 { background-image: url('../../assets/images/home/8.webp'); }

/* About backgrounds */
.bg-about-1 { background-image: url('../../assets/images/about/1.jpg'); }
.bg-about-2 { background-image: url('../../assets/images/about/8.jpg'); }
.bg-about-3 { background-image: url('../../assets/images/about/3.jpg'); }
.bg-about-4 { background-image: url('../../assets/images/about/4.jpg'); }
.bg-about-5 { background-image: url('../../assets/images/about/7.jpg'); }
.bg-about-6 { background-image: url('../../assets/images/about/5.jpg'); }

/* Project 0 */
.bg-project0-01 { background-image: url('../../assets/images/project0/01.jpg'); }
.bg-project0-02 { background-image: url('../../assets/images/project0/02.jpg'); }
.bg-project0-03 { background-image: url('../../assets/images/project0/03.jpg'); }
.bg-project0-04 { background-image: url('../../assets/images/project0/04.jpg'); }
.bg-project0-05 { background-image: url('../../assets/images/project0/05.jpg'); }
.bg-project0-06 { background-image: url('../../assets/images/project0/06.jpg'); }
.bg-project0-07 { background-image: url('../../assets/images/project0/07.jpg'); }
.bg-project0-08 { background-image: url('../../assets/images/project0/08.jpg'); }
.bg-project0-09 { background-image: url('../../assets/images/project0/09.jpg'); }

/* Project 1 */
.bg-project1-1  { background-image: url('../../assets/images/project1/1.webp'); }
.bg-project1-2  { background-image: url('../../assets/images/project1/2.webp'); }
.bg-project1-3  { background-image: url('../../assets/images/project1/3.webp'); }
.bg-project1-4  { background-image: url('../../assets/images/project1/4.webp'); }
.bg-project1-5  { background-image: url('../../assets/images/project1/5.webp'); }
.bg-project1-6  { background-image: url('../../assets/images/project1/6.webp'); }
.bg-project1-7  { background-image: url('../../assets/images/project1/7.webp'); }
.bg-project1-8  { background-image: url('../../assets/images/project1/8.webp'); }
.bg-project1-9  { background-image: url('../../assets/images/project1/9.webp'); }
.bg-project1-10 { background-image: url('../../assets/images/project1/10.webp'); }
.bg-project1-11 { background-image: url('../../assets/images/project1/11.webp'); }
.bg-project1-12 { background-image: url('../../assets/images/project1/12.webp'); }
.bg-project1-13 { background-image: url('../../assets/images/project1/13.webp'); }
.bg-project1-14 { background-image: url('../../assets/images/project1/14.webp'); }
.bg-project1-15 { background-image: url('../../assets/images/project1/15.webp'); }
.bg-project1-16 { background-image: url('../../assets/images/project1/16.webp'); }
.bg-project1-17 { background-image: url('../../assets/images/project1/17.webp'); }
.bg-project1-18 { background-image: url('../../assets/images/project1/18.webp'); }
.bg-project1-19 { background-image: url('../../assets/images/project1/19.webp'); }
.bg-project1-20 { background-image: url('../../assets/images/project1/20.webp'); }
.bg-project1-21 { background-image: url('../../assets/images/project1/21.webp'); }
.bg-project1-22 { background-image: url('../../assets/images/project1/22.webp'); }

/* Project 2 */
.bg-project2-1  { background-image: url('../../assets/images/project2/1.webp'); }
.bg-project2-2  { background-image: url('../../assets/images/project2/2.webp'); }
.bg-project2-3  { background-image: url('../../assets/images/project2/3.webp'); }
.bg-project2-4  { background-image: url('../../assets/images/project2/4.webp'); }
.bg-project2-5  { background-image: url('../../assets/images/project2/5.webp'); }
.bg-project2-6  { background-image: url('../../assets/images/project2/6.webp'); }
.bg-project2-7  { background-image: url('../../assets/images/project2/7.webp'); }
.bg-project2-8  { background-image: url('../../assets/images/project2/8.webp'); }
.bg-project2-9  { background-image: url('../../assets/images/project2/9.webp'); }
.bg-project2-10 { background-image: url('../../assets/images/project2/10.webp'); }
.bg-project2-11 { background-image: url('../../assets/images/project2/11.webp'); }
.bg-project2-12 { background-image: url('../../assets/images/project2/12.webp'); }
.bg-project2-13 { background-image: url('../../assets/images/project2/13.webp'); }
.bg-project2-14 { background-image: url('../../assets/images/project2/14.webp'); }
.bg-project2-15 { background-image: url('../../assets/images/project2/15.webp'); }
.bg-project2-16 { background-image: url('../../assets/images/project2/16.webp'); }
.bg-project2-17 { background-image: url('../../assets/images/project2/17.webp'); }
.bg-project2-18 { background-image: url('../../assets/images/project2/18.webp'); }

/* Project 3 */
.bg-project3-1  { background-image: url('../../assets/images/project3/1.webp'); }
.bg-project3-2  { background-image: url('../../assets/images/project3/2.webp'); }
.bg-project3-3  { background-image: url('../../assets/images/project3/3.webp'); }
.bg-project3-4  { background-image: url('../../assets/images/project3/4.webp'); }
.bg-project3-5  { background-image: url('../../assets/images/project3/5.webp'); }
.bg-project3-6  { background-image: url('../../assets/images/project3/6.webp'); }
.bg-project3-7  { background-image: url('../../assets/images/project3/7.webp'); }
.bg-project3-8  { background-image: url('../../assets/images/project3/8.webp'); }
.bg-project3-9  { background-image: url('../../assets/images/project3/9.webp'); }
.bg-project3-10 { background-image: url('../../assets/images/project3/10.webp'); }
.bg-project3-11 { background-image: url('../../assets/images/project3/11.webp'); }
.bg-project3-12 { background-image: url('../../assets/images/project3/12.webp'); }
.bg-project3-13 { background-image: url('../../assets/images/project3/13.webp'); }
.bg-project3-14 { background-image: url('../../assets/images/project3/14.webp'); }
.bg-project3-15 { background-image: url('../../assets/images/project3/15.webp'); }
.bg-project3-16 { background-image: url('../../assets/images/project3/16.webp'); }
.bg-project3-17 { background-image: url('../../assets/images/project3/17.webp'); }
.bg-project3-18 { background-image: url('../../assets/images/project3/18.webp'); }
.bg-project3-19 { background-image: url('../../assets/images/project3/19.webp'); }
.bg-project3-20 { background-image: url('../../assets/images/project3/20.webp'); }
.bg-project3-21 { background-image: url('../../assets/images/project3/21.webp'); }

/* Project 4 */
.bg-project4-1  { background-image: url('../../assets/images/project4/1.webp'); }
.bg-project4-2  { background-image: url('../../assets/images/project4/2.webp'); }
.bg-project4-3  { background-image: url('../../assets/images/project4/3.webp'); }
.bg-project4-4  { background-image: url('../../assets/images/project4/4.webp'); }
.bg-project4-5  { background-image: url('../../assets/images/project4/5.webp'); }
.bg-project4-6  { background-image: url('../../assets/images/project4/6.webp'); }
.bg-project4-7  { background-image: url('../../assets/images/project4/7.webp'); }
.bg-project4-8  { background-image: url('../../assets/images/project4/8.webp'); }
.bg-project4-9  { background-image: url('../../assets/images/project4/9.webp'); }
.bg-project4-10 { background-image: url('../../assets/images/project4/10.webp'); }
.bg-project4-11 { background-image: url('../../assets/images/project4/11.webp'); }
.bg-project4-12 { background-image: url('../../assets/images/project4/12.webp'); }
.bg-project4-13 { background-image: url('../../assets/images/project4/13.webp'); }

/* Project 5 */
.bg-project5-1  { background-image: url('../../assets/images/project5/1.webp'); }
.bg-project5-2  { background-image: url('../../assets/images/project5/2.webp'); }
.bg-project5-3  { background-image: url('../../assets/images/project5/3.webp'); }
.bg-project5-4  { background-image: url('../../assets/images/project5/4.webp'); }
.bg-project5-5  { background-image: url('../../assets/images/project5/5.webp'); }
.bg-project5-6  { background-image: url('../../assets/images/project5/6.webp'); }
.bg-project5-7  { background-image: url('../../assets/images/project5/7.webp'); }
.bg-project5-8  { background-image: url('../../assets/images/project5/8.webp'); }
.bg-project5-9  { background-image: url('../../assets/images/project5/9.webp'); }
.bg-project5-10 { background-image: url('../../assets/images/project5/10.webp'); }
.bg-project5-11 { background-image: url('../../assets/images/project5/11.webp'); }

/* Project 6 */
.bg-project6-1  { background-image: url('../../assets/images/project6/1.webp'); }
.bg-project6-2  { background-image: url('../../assets/images/project6/2.webp'); }
.bg-project6-3  { background-image: url('../../assets/images/project6/3.webp'); }
.bg-project6-4  { background-image: url('../../assets/images/project6/4.webp'); }
.bg-project6-5  { background-image: url('../../assets/images/project6/5.webp'); }
.bg-project6-6  { background-image: url('../../assets/images/project6/6.webp'); }
.bg-project6-7  { background-image: url('../../assets/images/project6/7.webp'); }
.bg-project6-8  { background-image: url('../../assets/images/project6/8.webp'); }
.bg-project6-9  { background-image: url('../../assets/images/project6/9.webp'); }
.bg-project6-10 { background-image: url('../../assets/images/project6/10.webp'); }
.bg-project6-11 { background-image: url('../../assets/images/project6/11.webp'); }

/* Project 7 */
.bg-project7-1 { background-image: url('../../assets/images/project7/1.webp'); }
.bg-project7-2 { background-image: url('../../assets/images/project7/2.webp'); }
.bg-project7-3 { background-image: url('../../assets/images/project7/3.webp'); }
.bg-project7-4 { background-image: url('../../assets/images/project7/4.webp'); }
.bg-project7-5 { background-image: url('../../assets/images/project7/5.webp'); }
.bg-project7-6 { background-image: url('../../assets/images/project7/6.webp'); }
.bg-project7-7 { background-image: url('../../assets/images/project7/7.webp'); }
.bg-project7-8 { background-image: url('../../assets/images/project7/8.webp'); }

/* Project 8 */
.bg-project8-1 { background-image: url('../../assets/images/project8/1.webp'); }
.bg-project8-2 { background-image: url('../../assets/images/project8/2.webp'); }
.bg-project8-3 { background-image: url('../../assets/images/project8/3.webp'); }
.bg-project8-4 { background-image: url('../../assets/images/project8/4.webp'); }
.bg-project8-5 { background-image: url('../../assets/images/project8/5.webp'); }
.bg-project8-6 { background-image: url('../../assets/images/project8/6.webp'); }
.bg-project8-7 { background-image: url('../../assets/images/project8/7.webp'); }
.bg-project8-8 { background-image: url('../../assets/images/project8/8.webp'); }

/* Project 9 */
.bg-project9-1  { background-image: url('../../assets/images/project9/1.webp'); }
.bg-project9-2  { background-image: url('../../assets/images/project9/2.webp'); }
.bg-project9-3  { background-image: url('../../assets/images/project9/3.webp'); }
.bg-project9-4  { background-image: url('../../assets/images/project9/4.webp'); }
.bg-project9-5  { background-image: url('../../assets/images/project9/5.webp'); }
.bg-project9-6  { background-image: url('../../assets/images/project9/6.webp'); }
.bg-project9-7  { background-image: url('../../assets/images/project9/7.webp'); }
.bg-project9-8  { background-image: url('../../assets/images/project9/8.webp'); }
.bg-project9-9  { background-image: url('../../assets/images/project9/9.webp'); }
.bg-project9-10 { background-image: url('../../assets/images/project9/10.webp'); }
.bg-project9-11 { background-image: url('../../assets/images/project9/11.webp'); }
.bg-project9-12 { background-image: url('../../assets/images/project9/12.webp'); }
.bg-project9-13 { background-image: url('../../assets/images/project9/13.webp'); }
.bg-project9-14 { background-image: url('../../assets/images/project9/14.webp'); }
.bg-project9-15 { background-image: url('../../assets/images/project9/15.webp'); }
.bg-project9-16 { background-image: url('../../assets/images/project9/16.webp'); }

/* Project 10 */
.bg-project10-1 { background-image: url('../../assets/images/project10/1.jpg'); }
.bg-project10-2 { background-image: url('../../assets/images/project10/2.jpg'); }
.bg-project10-3 { background-image: url('../../assets/images/project10/3.jpg'); }
.bg-project10-4 { background-image: url('../../assets/images/project10/4.jpg'); }
.bg-project10-5 { background-image: url('../../assets/images/project10/5.jpg'); }
.bg-project10-6 { background-image: url('../../assets/images/project10/6.jpg'); }

/* Project 11 */
.bg-project11-1  { background-image: url('../../assets/images/project11/1.jpg'); }
.bg-project11-2  { background-image: url('../../assets/images/project11/2.jpg'); }
.bg-project11-3  { background-image: url('../../assets/images/project11/3.jpg'); }
.bg-project11-4  { background-image: url('../../assets/images/project11/4.jpg'); }
.bg-project11-5  { background-image: url('../../assets/images/project11/5.jpg'); }
.bg-project11-6  { background-image: url('../../assets/images/project11/6.jpg'); }
.bg-project11-7  { background-image: url('../../assets/images/project11/7.jpg'); }
.bg-project11-8  { background-image: url('../../assets/images/project11/8.jpg'); }
.bg-project11-9  { background-image: url('../../assets/images/project11/9.jpg'); }
.bg-project11-10 { background-image: url('../../assets/images/project11/10.jpg'); }
.bg-project11-11 { background-image: url('../../assets/images/project11/11.jpg'); }
.bg-project11-12 { background-image: url('../../assets/images/project11/12.jpg'); }
.bg-project11-13 { background-image: url('../../assets/images/project11/13.jpg'); }

/* Project 12 */
.bg-project12-1  { background-image: url('../../assets/images/project12/1.jpg'); }
.bg-project12-2  { background-image: url('../../assets/images/project12/2.jpg'); }
.bg-project12-3  { background-image: url('../../assets/images/project12/3.jpg'); }
.bg-project12-4  { background-image: url('../../assets/images/project12/4.jpg'); }
.bg-project12-5  { background-image: url('../../assets/images/project12/5.jpg'); }
.bg-project12-6  { background-image: url('../../assets/images/project12/6.jpg'); }
.bg-project12-7  { background-image: url('../../assets/images/project12/7.jpg'); }
.bg-project12-8  { background-image: url('../../assets/images/project12/8.jpg'); }
.bg-project12-9  { background-image: url('../../assets/images/project12/9.jpg'); }


/* Project 13 */
  .bg-project13-1 { background-image: url('../../assets/images/project13/1.jpg'); }
  .bg-project13-2 { background-image: url('../../assets/images/project13/2.jpg'); }
  .bg-project13-3 { background-image: url('../../assets/images/project13/3.jpg'); }
  .bg-project13-4 { background-image: url('../../assets/images/project13/4.jpg'); }
  .bg-project13-5 { background-image: url('../../assets/images/project13/5.jpg'); }
  .bg-project13-6 { background-image: url('../../assets/images/project13/6.jpg'); }
  .bg-project13-7 { background-image: url('../../assets/images/project13/7.jpg'); }
  .bg-project13-8 { background-image: url('../../assets/images/project13/8.jpg'); }
  .bg-project13-9 { background-image: url('../../assets/images/project13/9.jpg'); }
  .bg-project13-10 { background-image: url('../../assets/images/project13/10.jpg'); }
  .bg-project13-11 { background-image: url('../../assets/images/project13/11.jpg'); }
  .bg-project13-12 { background-image: url('../../assets/images/project13/12.jpg'); }
  .bg-project13-13 { background-image: url('../../assets/images/project13/13.jpg'); }
  .bg-project13-14 { background-image: url('../../assets/images/project13/14.jpg'); }
  .bg-project13-15 { background-image: url('../../assets/images/project13/15.jpg'); }
  .bg-project13-16 { background-image: url('../../assets/images/project13/16.jpg'); }
  .bg-project13-17 { background-image: url('../../assets/images/project13/17.jpg'); }
  .bg-project13-18 { background-image: url('../../assets/images/project13/18.jpg'); }
  .bg-project13-19 { background-image: url('../../assets/images/project13/19.jpg'); }
  .bg-project13-20 { background-image: url('../../assets/images/project13/20.jpg'); }
  .bg-project13-21 { background-image: url('../../assets/images/project13/21.jpg'); }
  .bg-project13-22 { background-image: url('../../assets/images/project13/22.jpg'); }
  .bg-project13-23 { background-image: url('../../assets/images/project13/23.jpg'); }
  .bg-project13-24 { background-image: url('../../assets/images/project13/24.jpg'); }
  .bg-project13-25 { background-image: url('../../assets/images/project13/25.jpg'); }
  .bg-project13-26 { background-image: url('../../assets/images/project13/26.jpg'); }
  .bg-project13-27 { background-image: url('../../assets/images/project13/27.jpg'); }


/* Project 14 */
.bg-project14-1  { background-image: url('../../assets/images/project14/1.jpg'); }
.bg-project14-2  { background-image: url('../../assets/images/project14/2.jpg'); }
.bg-project14-3  { background-image: url('../../assets/images/project14/3.jpg'); }
.bg-project14-4  { background-image: url('../../assets/images/project14/4.jpg'); }
.bg-project14-5  { background-image: url('../../assets/images/project14/5.jpg'); }
.bg-project14-6  { background-image: url('../../assets/images/project14/6.jpg'); }
.bg-project14-7  { background-image: url('../../assets/images/project14/7.jpg'); }
.bg-project14-8  { background-image: url('../../assets/images/project14/8.jpg'); }
.bg-project14-9  { background-image: url('../../assets/images/project14/9.jpg'); }
.bg-project14-10 { background-image: url('../../assets/images/project14/10.jpg'); }
.bg-project14-11 { background-image: url('../../assets/images/project14/11.jpg'); }
.bg-project14-12 { background-image: url('../../assets/images/project14/12.jpg'); }
.bg-project14-13 { background-image: url('../../assets/images/project14/13.jpg'); }
.bg-project14-14 { background-image: url('../../assets/images/project14/14.jpg'); }
.bg-project14-15 { background-image: url('../../assets/images/project14/15.jpg'); }
.bg-project14-16 { background-image: url('../../assets/images/project14/16.jpg'); }
.bg-project14-17 { background-image: url('../../assets/images/project14/17.jpg'); }

/* Project 15 */
.bg-project15-1  { background-image: url('../../assets/images/project15/1.jpg'); }
.bg-project15-2  { background-image: url('../../assets/images/project15/2.jpg'); }
.bg-project15-3  { background-image: url('../../assets/images/project15/3.jpg'); }
.bg-project15-4  { background-image: url('../../assets/images/project15/4.jpg'); }
.bg-project15-5  { background-image: url('../../assets/images/project15/5.jpg'); }
.bg-project15-6  { background-image: url('../../assets/images/project15/6.jpg'); }
.bg-project15-7  { background-image: url('../../assets/images/project15/7.jpg'); }
.bg-project15-8  { background-image: url('../../assets/images/project15/8.jpg'); }
.bg-project15-9  { background-image: url('../../assets/images/project15/9.jpg'); }
.bg-project15-10 { background-image: url('../../assets/images/project15/10.jpg'); }
.bg-project15-11 { background-image: url('../../assets/images/project15/11.jpg'); }
.bg-project15-12 { background-image: url('../../assets/images/project15/12.jpg'); }
.bg-project15-13 { background-image: url('../../assets/images/project15/13.jpg'); }
.bg-project15-14 { background-image: url('../../assets/images/project15/14.jpg'); }
.bg-project15-15 { background-image: url('../../assets/images/project15/15.jpg'); }
.bg-project15-16 { background-image: url('../../assets/images/project15/16.jpg'); }
.bg-project15-17 { background-image: url('../../assets/images/project15/17.jpg'); }
.bg-project15-18 { background-image: url('../../assets/images/project15/18.jpg'); }
.bg-project15-19 { background-image: url('../../assets/images/project15/19.jpg'); }
.bg-project15-20 { background-image: url('../../assets/images/project15/20.jpg'); }
.bg-project15-21 { background-image: url('../../assets/images/project15/21.jpg'); }
.bg-project15-22 { background-image: url('../../assets/images/project15/22.jpg'); }
.bg-project15-23 { background-image: url('../../assets/images/project15/23.jpg'); }
.bg-project15-24 { background-image: url('../../assets/images/project15/24.jpg'); }
.bg-project15-25 { background-image: url('../../assets/images/project15/25.jpg'); }
.bg-project15-26 { background-image: url('../../assets/images/project15/26.jpg'); }
.bg-project15-27 { background-image: url('../../assets/images/project15/27.jpg'); }

/* Project 16 */
.bg-project16-1  { background-image: url('../../assets/images/project16/1.jpg'); }
.bg-project16-2  { background-image: url('../../assets/images/project16/2.jpg'); }
.bg-project16-3  { background-image: url('../../assets/images/project16/3.jpg'); }
.bg-project16-4  { background-image: url('../../assets/images/project16/4.jpg'); }
.bg-project16-5  { background-image: url('../../assets/images/project16/5.jpg'); }
.bg-project16-6  { background-image: url('../../assets/images/project16/6.jpg'); }
.bg-project16-7  { background-image: url('../../assets/images/project16/7.jpg'); }
.bg-project16-8  { background-image: url('../../assets/images/project16/8.jpg'); }
.bg-project16-9  { background-image: url('../../assets/images/project16/9.jpg'); }
.bg-project16-10 { background-image: url('../../assets/images/project16/10.jpg'); }
.bg-project16-11 { background-image: url('../../assets/images/project16/11.jpg'); }
.bg-project16-12 { background-image: url('../../assets/images/project16/12.jpg'); }
.bg-project16-13 { background-image: url('../../assets/images/project16/13.jpg'); }
.bg-project16-14 { background-image: url('../../assets/images/project16/14.jpg'); }
.bg-project16-15 { background-image: url('../../assets/images/project16/15.jpg'); }
.bg-project16-16 { background-image: url('../../assets/images/project16/16.jpg'); }
.bg-project16-17 { background-image: url('../../assets/images/project16/17.jpg'); }
.bg-project16-18 { background-image: url('../../assets/images/project16/18.jpg'); }
.bg-project16-19 { background-image: url('../../assets/images/project16/19.jpg'); }
.bg-project16-20 { background-image: url('../../assets/images/project16/20.jpg'); }
.bg-project16-21 { background-image: url('../../assets/images/project16/21.jpg'); }
.bg-project16-22 { background-image: url('../../assets/images/project16/22.jpg'); }
.bg-project16-23 { background-image: url('../../assets/images/project16/23.jpg'); }
.bg-project16-24 { background-image: url('../../assets/images/project16/24.jpg'); }
.bg-project16-25 { background-image: url('../../assets/images/project16/25.jpg'); }
.bg-project16-26 { background-image: url('../../assets/images/project16/26.jpg'); }
.bg-project16-27 { background-image: url('../../assets/images/project16/27.jpg'); }


/* Overlay hover effects */
.overlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    transition: opacity 0.5s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.overlay-content {
    font-size: 1rem;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.5s ease;
    text-align: center;
    padding: 20px;
    text-transform: uppercase;
    letter-spacing: 4px;
}

.column-link:hover .overlay { opacity: 1; }
.column-link:hover .overlay-content { opacity: 1; transform: translateY(0); }
.column-link:hover .overlay-content {
    background: #333b30 !important;
    padding: 3px 5px;
}

/* Projects page */
.projects-section {
    max-width: 1600px;
    margin: auto;
}

.projects-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2px;
}

.project {
    text-decoration: none;
    color: #000;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.project-image-wrapper {
    height: 100vh;
    overflow: hidden;
    position: relative;
}

.project-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease-in-out;
}

.project:hover .project-image-wrapper {
    border: 20px solid #333b30;
    transition: border 0.5s ease 0.3s, transform 0.8s ease;
}

.project-title {
    padding: 20px 10px 30px;
    font-size: 1rem;
    text-align: center;
    text-transform: uppercase;
}

@media (max-width: 992px) {
    .projects-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 576px) {
    .projects-grid { grid-template-columns: 1fr; }
}

/* Contact page */
.contact-section {
    max-width: 900px;
    overflow-y: auto;
    height: 100vh;
    scroll-behavior: smooth;
    background-color: #fff;
}

.contact-section::-webkit-scrollbar { width: 6px; }
.contact-section::-webkit-scrollbar-thumb {
    background: #ebeddf;
    border-radius: 5px;
}

.contact-section h2 {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 40px;
}

.contact-item { margin-bottom: 24px; }
.contact-item .title { padding: 0px; }

.contact-detail {
    font-size: 1.125rem;
    font-weight: 400;
}

.contact-detail a { color: inherit; text-decoration: none; }
.contact-detail a:hover { text-decoration: underline; }

/* Floating social sidebar */
.fl-fl {
    background: #ebeddf;
    color: #343a2f;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 5px;
    width: 190px;
    position: fixed;
    right: -145px;
    z-index: 1000;
    font: normal normal 12px Arial;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    border-radius: 30px 0 0 30px;
}

.fl-fl:hover { right: 0; }

.fl-fl i {
    font-size: 20px;
    color: #fff;
    background-color: #343a2f;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    margin-right: 10px;
    border-radius: 50%;
}

.fl-fl a { color: #343a2f; text-decoration: none; font-weight: bold; }

.float-yt:hover i { background-color: #FF0000; color: #fff; }
.float-ig:hover i { background-color: #E1306C; color: #fff; }
.float-li:hover i { background-color: #0077B5; color: #fff; }
.float-fb:hover i { background-color: #3b5998; color: #fff; }
.float-wa:hover i { background-color: #25D366; color: #fff; }

.float-yt { top: 160px; }
.float-ig { top: 215px; }
.float-li { top: 270px; }
.float-fb { top: 325px; }
.float-wa { top: 380px; }

/* Hide floating bar on mobile */
@media (max-width: 767.98px) {
    .fl-fl { display: none; }
}

/* Footer */
.footer { background-color: #333b30; padding: 40px 0; }
footer.footer { background-color: #333b30 !important; }

.social-icons { display: flex; gap: 15px; }

.social-icons a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    color: white !important;
    text-decoration: none;
    transition: all 0.3s ease;
}

.social-icons a i {
    font-size: 18px;
    line-height: 1;
    color: white !important;
}

.social-icons a.facebook:hover  { background: #1877f2 !important; }
.social-icons a.instagram:hover { background: #e4405f !important; }
.social-icons a.linkedin:hover  { background: #0a66c2 !important; }
.social-icons a.youtube:hover   { background: #ff0000 !important; }
.social-icons a.whatsapp:hover  { background: #25d366 !important; }

.social-icons a:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
}

@media (max-width: 768px) {
    .social-icons { gap: 10px; }
    .social-icons a { width: 35px; height: 35px; }
    .social-icons a i { font-size: 16px; }
}

.fab, .fa-brands {
    font-family: "Font Awesome 6 Brands" !important;
    font-weight: 400;
    font-style: normal;
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
}
.fab .fa-whatsapp{font-size:36px;}