/* Optimized CSS - Faster Load & SEO Friendly */
:root {
    --primary: #B78D65;
    --light: #F8F8F8;
    --dark: #252525;
}

/* Typography */
h1, h2, .h1, .h2, .fw-bold   { font-weight: 600 !important; }
h3, h4, .h3, .h4, .fw-medium { font-weight: 500 !important; }
h5, h6, .h5, .h6, .fw-normal { font-weight: 400 !important; }

/* Utility */
.back-to-top {
    position: fixed;
    display: none;
    right: 30px;
    bottom: 30px;
    z-index: 99;
    will-change: opacity;
}

/* Spinner */
#spinner {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s ease-out, visibility 0s step-end .5s;
    z-index: 99999;
}
#spinner.show {
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
}

/* Buttons */
.btn {
    font-weight: 500;
    transition: .4s ease;
}
.btn-primary, .btn-secondary, #seeMoreBtn { color: #fff; background: var(--primary); border: none; }
.btn-square, .btn-sm-square, .btn-lg-square {
    display: flex; align-items: center; justify-content: center; padding: 0;
}
.btn-square { width: 38px; height: 38px; }
.btn-sm-square { width: 32px; height: 32px; }
.btn-lg-square { width: 48px; height: 48px; }

.btn-outline-body {
    color: var(--primary);
    border: 1px solid #777;
}
.btn-outline-body:hover {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

/* Navbar */
.navbar .dropdown-toggle::after {
    content: "\f107";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-left: 8px;
}
.navbar-nav .nav-link {
    margin-right: 30px;
    padding: 30px 0;
    color: #252525;
    font-weight: 500;
    text-transform: uppercase;
}
.nav-link:hover, .nav-link.active { color: var(--primary); }

@media (max-width: 992px) {
    .navbar-nav .nav-link { margin: 0; padding: 10px 0; }
    .navbar-nav { border-top: 1px solid #eee; }
}

/* 3D Dropdown Optimization */
@media (min-width: 992px) {
    .dropdown-menu {
        opacity: 0;
        transform: rotateX(-75deg);
        visibility: hidden;
        transform-origin: top;
        transition: .4s ease;
    }
    .nav-item:hover .dropdown-menu {
        opacity: 1;
        transform: rotateX(0);
        visibility: visible;
    }
}

/* Slider Section */
.slider_section {
    display: flex;
    align-items: center;
    position: relative;
    padding-bottom: 90px;
    color: #3b3a3a;
}
.slider_section .detail_box { color: #000; }
.slider_section .detail_box h1 { text-transform: uppercase; font-weight: 700; }

/* Slider Buttons */
.slider_section a {
    padding: 10px 40px;
    background: #4b208c;
    color: #fff;
    border-radius: 35px;
    margin-top: 35px;
    display: inline-block;
}
.slider_section a:hover { background: #5625a1; }

/* Circular Image Slider */
.img_container {
    border: 7px solid #7b57b2;
    border-radius: 50%;
    overflow: hidden;
}

/* About Section */
.hbout-section {
    display: flex;
    justify-content: center;
    padding: 60px 40px;
}
.hbout-container {
    max-width: 1400px;
    display: flex;
    gap: 50px;
}
.hbout-left h2 {
    font-size: 36px;
    margin-bottom: 20px;
}
.hbout-left p {
    font-size: 18px;
    line-height: 1.7;
    margin-bottom: 25px;
}

/* About Image */
.hbout-right img {
    width: 600px;
    height: 380px;
    object-fit: cover;
    border-radius: 6px;
    margin-top: 100px;
}

@media (max-width: 992px) {
    .hbout-container { flex-direction: column; }
    .hbout-right img { width: 100%; height: 222px; margin: 0; }
}

/* Team Section */
.team-container {
    display: grid;
    gap: 30px;
    max-width: 1100px;
}

.team-box {
    opacity: 0;
    transform: translateY(40px);
    transition: .5s ease;
}
.team-box.show { opacity: 1; transform: translateY(0); }

@media (max-width: 600px) {
    .team-container { grid-template-columns: repeat(2, 1fr); }
    .team-box { display: none; }
    .team-box:nth-child(-n+4) { display: block; }
}

/* Full Rectangle Image */
.full-rect {
    width: 100%;
    height: 300px;
    background: url(/img/towerrr.png) center/cover;
}

/* Clients Infinite Scroll */
.clients-track {
    display: flex;
    gap: 90px;
    animation: scroll 40s linear infinite;
    will-change: transform;
    transform: translateZ(0); /* GPU boost */
}
@keyframes scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* Client Images */
.client-card img {
    width: 220px;
    height: 220px;
    object-fit: fill;
    background: #fff;
    transition: transform .35s ease;
}
.client-card img:hover { transform: scale(1.3); }
