/* ================================================================
   theme.css — Full dark theme for V16 Designz & Build
   Loaded after style.css. Palette:
     bg:      #111111   surface:  #1a1a1a   border: #2e2e2e
     text:    #f0f0f0   muted:    #aaaaaa   accent: #f5c518
================================================================ */

/* ── 1. CSS variable overrides (propagates to all var() usages) ── */
:root {
    --cr-orange1: #f5c518;
    --cr-gold1:   #f5c518;
    --cr-brown1:  #c8a415;
    --cr-green1:  #f5c518;
    --cr-light1:  #1a1a1a;
    --cr-light2:  #1a1a1a;
    --cr-light3:  #222222;
    --cr-dark1:   #f0f0f0;
}

/* ── 2. Base ── */
body {
    background-color: #111111 !important;
    color: #f0f0f0 !important;
}

html::-webkit-scrollbar { background: #1a1a1a !important; }
html::-webkit-scrollbar-thumb { background: #444 !important; }

a, span, p, h1, h2, h3, h4, h5, h6, li, label, small, strong {
    color: inherit;
}

/* ── 3. Navbar ── */
.tc-navbar-st1 {
    background-color: transparent !important;
    transition: background-color 0.3s ease !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1030 !important;
    width: 100% !important;
}

.tc-navbar-st1.scrolled {
    background-color: #1a1a1a !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important;
}
.tc-navbar-st1 .navbar-nav .nav-item .nav-link {
    color: #f0f0f0 !important;
}
.tc-navbar-st1 .navbar-nav .nav-item .nav-link:hover,
.tc-navbar-st1 .navbar-nav .nav-item .nav-link:focus {
    color: #f5c518 !important;
}
.tc-navbar-st1 .dropdown-menu {
    background-color: #1a1a1a !important;
    border-color: #2e2e2e !important;
}
.tc-navbar-st1 .dropdown-menu .dropdown-item { color: #f0f0f0 !important; }
.tc-navbar-st1 .dropdown-menu .dropdown-item:hover {
    background-color: #f5c518 !important;
    color: #111 !important;
}
.tc-navbar-st1 .nav-side a { color: #f0f0f0 !important; }
.tc-navbar-st1 .nav-side a:hover { color: #f5c518 !important; }
.tc-navbar-st1 .navbar-toggler { border-color: #ffffff33 !important; }
.tc-navbar-st1 .navbar-toggler-icon { filter: invert(1) !important; }

/* ── 4. Offcanvas ── */
.offcanvas {
    background-color: #1a1a1a !important;
    color: #f0f0f0 !important;
}
.offcanvas .accordion-button,
.offcanvas .accordion-link {
    color: #f0f0f0 !important;
    background-color: transparent !important;
}
.offcanvas .accordion-button:hover,
.offcanvas .accordion-link:hover { color: #f5c518 !important; }
.offcanvas .accordion-item {
    border-color: #2e2e2e !important;
    background-color: transparent !important;
}
.offcanvas .sub-links a { color: #aaaaaa !important; }
.offcanvas .sub-links a:hover { color: #f5c518 !important; }
.offcanvas .contact-links a,
.offcanvas .social-icons a { color: #f0f0f0 !important; }
.offcanvas .social-icons a:hover { color: #f5c518 !important; }
.offcanvas .btn-close { filter: invert(1) !important; }

/* ── 5. Inner page header ── */
.tc-innerheader-st16 {
    background-color: #111111 !important;
    background-image: radial-gradient(circle, #ffffff0a 1px, transparent 1px),
                      radial-gradient(circle, #ffffff0a 1px, transparent 1px) !important;
}
.tc-innerheader-st16 .bg-box {
    background-color: #1a1a1a !important;
    border-color: #2e2e2e !important;
    color: #f0f0f0 !important;
}

/* ── 6. Hero ── */
.tc-hero-st1 .numbers-pagination .slide-mark { background-color: #f0f0f0 !important; }
.tc-hero-st1 .float-arrow { background-color: #f0f0f0 !important; color: #111 !important; }
.tc-hero-st1 .float-arrow:hover { background-color: #f5c518 !important; }

/* ── 7. About ── */
.tc-about-st1 .numbers-wrapper .item { border-color: #2e2e2e !important; }
.tc-about-st7 .rotate-box { border-color: #2e2e2e !important; }
.tc-about-st7 .lg-arrow { border-color: #2e2e2e !important; }
.tc-about-st7 .lg-arrow:hover { border-color: #f5c518 !important; }

/* ── 8. Service cards ── */
.service-card-st1 {
    border-color: #2e2e2e !important;
    background-color: #1a1a1a !important;
    color: #f0f0f0 !important;
}
.service-card-st1 .icon { background-color: #2e2e2e !important; }
.service-card-st1:hover { background-color: #222 !important; }
.service-card-st1:hover .icon { background-color: #f5c518 !important; }

/* ── 9. Video section ── */
.tc-video-st1 { background-color: #111111 !important; }
.tc-video-st1 .video-content::after { background-color: #1a1a1a !important; }
.tc-video-st1 .vid-card .play-btn {
    background-color: #f0f0f0 !important;
    color: #111 !important;
}

/* ── 10. Portfolio ── */
.portfolio-card-st1 .info { color: #f0f0f0 !important; }
.portfolio-card-st20 .arrow-cir-st1 { background-color: #ffffff22 !important; }

/* ── 11. Testimonials ── */
.tc-testimonials-st1 .testi-content {
    background-image: radial-gradient(circle, #ffffff0a 1px, transparent 1px),
                      radial-gradient(circle, #ffffff0a 1px, transparent 1px) !important;
}
.tc-testimonials-st3 .op-txt { color: #f0f0f0 !important; }

/* ── 12. Blog / Post cards ── */
.post-card-st1 .info {
    background-color: #1a1a1a !important;
    color: #f0f0f0 !important;
}
.post-card-st3 .info {
    background-color: #1a1a1a !important;
    color: #f0f0f0 !important;
}

/* ── 13. Clients ── */
.tc-clients-st1 .line-title .txt,
.tc-clients-st2 .line-title .txt {
    background-color: #111111 !important;
    color: #f0f0f0 !important;
}
.tc-clients-st1 .line-title::before,
.tc-clients-st2 .line-title::before { background-color: #2e2e2e !important; }

/* ── 14. Footer ── */
.tc-footer-st1 {
    background-color: #0a0a0a !important;
    color: #f0f0f0 !important;
}
.tc-footer-st1 .main-footer .social-links a { color: #f0f0f0 !important; }
.tc-footer-st1 .main-footer .links-group .links a { color: #aaaaaa !important; }
.tc-footer-st1 .main-footer .links-group .links a:hover { color: #f5c518 !important; }

/* ── 15. Sections with white/light backgrounds ── */
.tc-about-st1,
.tc-services-st1,
.tc-portfolio-st1,
.tc-testimonials-st1,
.tc-blog-st1,
.tc-contact-st1,
.tc-about-st7,
.tc-features-st7,
.tc-portfolio-st7,
.tc-team-st7,
.tc-faq-st4,
.tc-faq-st7,
.tc-faq-st22,
.tc-contact-st7,
.tc-contact-st8,
.tc-contact-st27,
.tc-map-st27,
.tc-blog-st3,
.tc-blog-st5,
.tc-blog-st10,
.tc-numbers-st3,
.tc-numbers-st4,
.tc-process-st4,
.tc-process-st10,
.tc-awards-st3,
.tc-awards-st10,
.tc-team-st2,
.tc-team-st8,
.tc-team-st10,
.tc-team-st17,
.tc-portfolio-st3,
.tc-portfolio-st4,
.tc-portfolio-st5,
.tc-portfolio-st8,
.tc-portfolio-st10,
.tc-portfolio-st20,
.tc-services-st8,
.tc-services-st10,
.tc-layout-st2,
.tc-features-st2,
.tc-features-st6,
.tc-about-st2,
.tc-about-st4,
.tc-about-st5,
.tc-about-st8,
.tc-about-st10,
.tc-about-st11,
.tc-experince-st3,
.tc-banners-st6,
.tc-products-st6,
.tc-blog-st24,
.tc-faq-st5 {
    background-color: #111111 !important;
    color: #f0f0f0 !important;
}

/* ── 16. Dot-pattern backgrounds ── */
.bg-dots,
.tc-about-st2 .main-img,
.tc-clients-st2 .content,
.tc-portfolio-st8,
.tc-contact-st8,
.tc-footer-st8,
.tc-process-st5 .content::before,
.tc-about-st5 .imgs .dots,
.tc-hero-st5 .dots {
    background-image: radial-gradient(circle, #ffffff0a 1px, transparent 1px),
                      radial-gradient(circle, #ffffff0a 1px, transparent 1px) !important;
}

/* ── 17. Cards & surfaces ── */
.service-card-st8 {
    background-color: #1a1a1a !important;
    border-color: #2e2e2e !important;
    color: #f0f0f0 !important;
}
.service-card-st8:hover {
    background-color: #f5c518 !important;
    border-color: #f5c518 !important;
    color: #111 !important;
}
.service-card-st10 {
    background-color: #1a1a1a !important;
    border-color: #2e2e2e !important;
    color: #f0f0f0 !important;
}
.service-card-st10:hover { background-color: #222 !important; }

.port-card-st8 .info-card {
    background-color: #1a1a1a !important;
    color: #f0f0f0 !important;
}

/* ── 18. Widget box ── */
.widget-box {
    background-color: #1a1a1a !important;
    border-color: #2e2e2e !important;
    color: #f0f0f0 !important;
}
.widget-box .wid-title { border-color: #2e2e2e !important; }
.widget-box .list-arrows li .list-link { border-color: #2e2e2e !important; }
.widget-box .list-arrows li .list-link:hover { color: #f5c518 !important; border-color: #f5c518 !important; }
.widget-box .form-control {
    background-color: transparent !important;
    border-color: #2e2e2e !important;
    color: #f0f0f0 !important;
}
.widget-box .search-group { border-color: #2e2e2e !important; }
.widget-box .search-group .search-btn { background-color: #f5c518 !important; color: #111 !important; }
.widget-box .social-list .social-links a { border-color: #2e2e2e !important; color: #f0f0f0 !important; }
.widget-box .social-list .social-links a:hover { background-color: #f5c518 !important; color: #111 !important; border-color: #f5c518 !important; }
.widget-box .social-links-st2 a { border-color: #2e2e2e !important; color: #f0f0f0 !important; }
.widget-box .social-links-st2 a:hover { background-color: #f5c518 !important; color: #111 !important; }

/* ── 19. FAQ accordions ── */
.tc-faq-st4 .accordion .accordion-item,
.tc-faq-st5 .accordion .accordion-item,
.tc-faq-st7 .accordion .accordion-item,
.tc-faq-st22 .accordion .accordion-item {
    background-color: #1a1a1a !important;
    border-color: #2e2e2e !important;
}
.tc-faq-st4 .accordion .accordion-item .accordion-button,
.tc-faq-st5 .accordion .accordion-item .accordion-button,
.tc-faq-st7 .accordion .accordion-item .accordion-button,
.tc-faq-st22 .accordion .accordion-item .accordion-button {
    background-color: #1a1a1a !important;
    color: #f0f0f0 !important;
    border-color: #2e2e2e !important;
}
.tc-faq-st4 .accordion .accordion-item .accordion-button::after,
.tc-faq-st5 .accordion .accordion-item .accordion-button::after,
.tc-faq-st7 .accordion .accordion-item .accordion-button::after,
.tc-faq-st22 .accordion .accordion-item .accordion-button::after {
    filter: invert(1) !important;
}
.tc-faq-st4 .accordion .accordion-item .accordion-button:not(.collapsed),
.tc-faq-st22 .accordion .accordion-item .accordion-button:not(.collapsed) {
    color: #f5c518 !important;
    background-color: #1a1a1a !important;
}
.tc-faq-st5 .accordion .accordion-item .accordion-button:not(.collapsed),
.tc-faq-st7 .accordion .accordion-item .accordion-button:not(.collapsed) {
    background-color: #f5c518 !important;
    color: #111 !important;
}
.tc-faq-st5 .accordion .accordion-item .accordion-button:not(.collapsed)::after,
.tc-faq-st7 .accordion .accordion-item .accordion-button:not(.collapsed)::after {
    filter: none !important;
}
.tc-faq-st4 .accordion .accordion-item .accordion-body,
.tc-faq-st5 .accordion .accordion-item .accordion-body,
.tc-faq-st7 .accordion .accordion-item .accordion-body,
.tc-faq-st22 .accordion .accordion-item .accordion-body {
    background-color: #1a1a1a !important;
    color: #aaaaaa !important;
    border-color: #2e2e2e !important;
}
.tc-faq-st5 .accordion .accordion-item .show .accordion-body,
.tc-faq-st7 .accordion .accordion-item .show .accordion-body {
    background-color: #f5c518 !important;
}
.tc-faq-st5 .accordion .accordion-item .show .accordion-body *,
.tc-faq-st7 .accordion .accordion-item .show .accordion-body * {
    color: #111 !important;
}
.tc-faq-st22 .accordion .accordion-item .accordion-body {
    background-color: #1a1a1a !important;
}
.tc-faq-st22 .accordion .accordion-item .accordion-body * { color: #aaaaaa !important; }

/* ── 20. Contact forms ── */
.tc-contact-st7 .contact-card { background-color: #1a1a1a !important; }
.tc-contact-st8 .form-control,
.tc-contact-st27 .form-control {
    background-color: transparent !important;
    border-color: #2e2e2e !important;
    color: #f0f0f0 !important;
}
.tc-contact-st8 .form-control::placeholder,
.tc-contact-st27 .form-control::placeholder { color: #666 !important; }
.tc-contact-st8 .form-control:focus,
.tc-contact-st27 .form-control:focus { border-color: #f5c518 !important; }

/* ── 21. Buttons ── */
.butn { color: inherit; }
.pagination-st1 a { border-color: #2e2e2e !important; color: #f0f0f0 !important; }
.pagination-st1 a:hover,
.pagination-st1 a.active { background-color: #f5c518 !important; color: #111 !important; border-color: #f5c518 !important; }

/* ── 22. Swiper / slider controls ── */
.swiper-button-next::after,
.swiper-button-prev::after { color: #f0f0f0 !important; }
.swiper-pagination .swiper-pagination-bullet { background-color: #f0f0f0 !important; }
.swiper-controls-st1 { background-color: #1a1a1a !important; border-color: #2e2e2e !important; }
.swiper-controls-st1 .swiper-pagination-progressbar { background-color: #2e2e2e !important; }
.swiper-controls-st1 .swiper-button-next::after,
.swiper-controls-st1 .swiper-button-prev::after { color: #aaaaaa !important; }

/* ── 23. Borders & dividers ── */
.border-gray { border-color: #2e2e2e !important; }
.border-dr-1, .border-dr-2, .border-dr-3,
.border-dr-4, .border-dr-5, .border-dr-6 { border-color: #2e2e2e !important; }

/* ── 24. Utility bg overrides ── */
.bg-f0, .bg-f1, .bg-f2, .bg-f3, .bg-f4,
.bg-f5, .bg-f6, .bg-f7, .bg-f8, .bg-f9 { background-color: #1a1a1a !important; }
.bg-light1, .bg-light2, .bg-light3 { background-color: #1a1a1a !important; color: #f0f0f0 !important; }

/* ── 25. Loader ── */
.loader-wrap svg { fill: #111111 !important; }

/* ── 26. To-top button ── */
.to_top { color: #aaaaaa !important; border-color: #2e2e2e !important; }
.to_top:hover { color: #f5c518 !important; border-color: #f5c518 !important; }

/* ── 26a. Chatbot widget ── */
#cms-chat {
    background-color: #ffffff !important;
    color: #111111 !important;
}
#cms-chat header {
    background-color: #111111 !important;
    color: #ffffff !important;
}
#cms-chat-messages {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    color: #111111 !important;
}
#cms-chat-messages .msg-user,
#cms-chat-messages .msg-bot {
    display: inline-flex !important;
    align-items: flex-start !important;
    padding: 10px 12px !important;
    border-radius: 16px !important;
    max-width: calc(100% - 20px) !important;
    white-space: pre-wrap !important;
    word-break: break-word !important;
}
#cms-chat-messages .msg-user {
    background-color: #111111 !important;
    color: #ffffff !important;
    align-self: flex-end !important;
}
#cms-chat-messages .msg-bot {
    background-color: #f4f4f4 !important;
    color: #111111 !important;
    align-self: flex-start !important;
}
#cms-chat-input input {
    background-color: #ffffff !important;
}
#cms-chat-input button {
    background-color: #111111 !important;
}

/* ── 27. Dropdown (global) ── */
.dropdown .dropdown-menu {
    background-color: #1a1a1a !important;
    color: #f0f0f0 !important;
}
.dropdown .dropdown-menu .dropdown-item { color: #f0f0f0 !important; border-color: #2e2e2e !important; }
.dropdown .dropdown-menu .dropdown-item:hover { background-color: #f5c518 !important; color: #111 !important; }

/* ── 28. Progress bars ── */
.tc-about-st2 .progress,
.tc-about-st11 .progress { background-color: #2e2e2e !important; }

/* ── 29. Aside navbar (st8) ── */
.aside-navbar-st8 {
    background-color: #1a1a1a !important;
    border-color: #2e2e2e !important;
    color: #f0f0f0 !important;
}
.aside-navbar-st8 .nav-links .nav-link { border-color: #2e2e2e !important; color: #f0f0f0 !important; }
.aside-navbar-st8 .nav-links .nav-link:hover { color: #f5c518 !important; border-color: #f5c518 !important; }
.aside-navbar-st8 .accordion .accordion-item .accordion-header .accordion-button { color: #f0f0f0 !important; }
.aside-navbar-st8 .accordion .accordion-item .accordion-header .accordion-button::after { filter: invert(1) !important; }
.aside-navbar-st8 .accordion .accordion-item .accordion-body .sub-links a { color: #aaaaaa !important; }
.aside-navbar-st8 .accordion .accordion-item .accordion-body .sub-links a:hover { color: #f5c518 !important; }

/* ── 30. tc-portfolio-st8 arrows ── */
.tc-portfolio-st8 .arrows { background-color: #1a1a1a !important; }
.tc-portfolio-st8 .arrows .swiper-button-prev,
.tc-portfolio-st8 .arrows .swiper-button-next { border-color: #2e2e2e !important; }

/* ── 31. tc-hero-st8 arrows ── */
.tc-hero-st8 .arrows { background-color: #1a1a1a !important; }

/* ── 32. Search nav (st6) ── */
.search-nav .search-form { border-color: #2e2e2e !important; background-color: #1a1a1a !important; }
.search-nav .search-form select,
.search-nav .search-form input {
    background-color: #1a1a1a !important;
    color: #f0f0f0 !important;
    border-color: #2e2e2e !important;
}
.search-nav .search-form .search-btn { background-color: #f5c518 !important; color: #111 !important; }

/* ── 33. tc-layout-st2 list ── */
.tc-layout-st2 .layout-list li { border-color: #2e2e2e !important; color: #f0f0f0 !important; }

/* ── 34. Pagination (Bootstrap) ── */
.pagination .page-item .page-link {
    background-color: #1a1a1a !important;
    border-color: #2e2e2e !important;
    color: #f0f0f0 !important;
}
.pagination .page-item .page-link.active,
.pagination .page-item .page-link:hover {
    background-color: #f5c518 !important;
    border-color: #f5c518 !important;
    color: #111 !important;
}

/* ── 35. Misc text colour helpers used inline ── */
.cr-111, .cr-222, .cr-333, .cr-444, .cr-555 { color: #f0f0f0 !important; }
.cr-666, .cr-777, .cr-888, .cr-999, .cr-ccc { color: #aaaaaa !important; }

/* ── 36. Footer High-Contrast Styling ── */
.tc-footer-st1 {
    background-color: #0d0d0d !important;
    color: #e0e0e0 !important;
}
.tc-footer-st1 h6 {
    color: #ffffff !important;
}
.tc-footer-st1 a,
.tc-footer-st1 .contact-links a {
    color: #d1d5db !important;
    text-decoration: none;
    transition: color 0.2s ease-in-out;
}
.tc-footer-st1 a:hover,
.tc-footer-st1 .contact-links a:hover,
.hover-text-orange1:hover {
    color: #f5c518 !important;
}
.tc-footer-st1 .text-muted,
.tc-footer-st1 p,
.tc-footer-st1 .cr-999 {
    color: #9ca3af !important;
}
.tc-footer-st1 .foot-social a {
    border-color: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
}
.tc-footer-st1 .foot-social a:hover {
    background-color: #f5c518 !important;
    border-color: #f5c518 !important;
    color: #111111 !important;
}

/* ── 37. Detail Headings & Paragraph Contrast ── */
.realestate-detail-heading,
.service-detail-heading {
    color: #ffffff !important;
}
.realestate-detail-text,
.service-detail-text {
    color: #d1d5db !important;
}

/* ── 38. Mobile Navbar Collapse (Fix Transparent Mobile Menu) ── */
@media (max-width: 991.98px) {
    .tc-navbar-st1 .navbar-collapse {
        background-color: #1a1a1a !important;
        border: 1px solid #2e2e2e !important;
        border-radius: 16px !important;
        padding: 20px 24px !important;
        margin-top: 15px !important;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.85) !important;
    }
    
    .tc-navbar-st1 .navbar-collapse .navbar-nav .nav-item {
        border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
        padding: 8px 0 !important;
    }
    
    .tc-navbar-st1 .navbar-collapse .navbar-nav .nav-item:last-child {
        border-bottom: none !important;
    }

    .tc-navbar-st1 .navbar-collapse .navbar-nav .nav-link {
        color: #ffffff !important;
        font-weight: 500 !important;
        font-size: 16px !important;
    }

    .tc-navbar-st1 .navbar-collapse .dropdown-menu {
        background-color: #111111 !important;
        border: 1px solid #333333 !important;
        margin-top: 8px !important;
        padding: 10px !important;
        border-radius: 10px !important;
    }

    .tc-navbar-st1 .navbar-collapse .dropdown-item {
        color: #d1d5db !important;
        padding: 8px 12px !important;
    }

    .tc-navbar-st1 .navbar-collapse .dropdown-item:hover,
    .tc-navbar-st1 .navbar-collapse .dropdown-item.active {
        background-color: #f5c518 !important;
        color: #111111 !important;
    }
}

/* Card Body Dark Overrides */
.card-body.bg-dark,
.card.bg-dark {
    background-color: #0c0c0c !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}
.card-body.bg-dark h5,
.card-body.bg-dark h6 {
    color: #ffffff !important;
}
.card-body.bg-dark p {
    color: #a3a3a3 !important;
}

/* ================================================================
   LIVE FIXES — logos, blog overlay, buttons, heroes, CTA, etc.
================================================================ */

/* Bigger navbar + footer logos */
nav.tc-navbar-st1 .navbar-brand img.logo,
nav.tc-navbar-st1 .navbar-brand img.logo.th-80,
.tc-navbar-st1 .navbar-brand img,
.tc-navbar-st1 .navbar-brand img.th-80,
nav.tc-navbar-st1 a.navbar-brand img {
    height: 96px !important;
    max-height: 96px !important;
    width: auto !important;
}
.tc-navbar-st1 .navbar-brand .th-80 {
    height: 96px !important;
    max-height: 96px !important;
}
.tc-footer-st1 a.logo img,
.tc-footer-st1 .logo img {
    max-height: 110px !important;
    height: 110px !important;
    width: auto !important;
}
@media (max-width: 991px) {
    nav.tc-navbar-st1 .navbar-brand img.logo,
    nav.tc-navbar-st1 .navbar-brand img.logo.th-80,
    .tc-navbar-st1 .navbar-brand img {
        height: 72px !important;
        max-height: 72px !important;
    }
}

/* Navbar scrolled — solid black */
.tc-navbar-st1.scrolled {
    background-color: #0a0a0a !important;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45) !important;
    backdrop-filter: blur(8px);
}

/* Blog cards — bottom gradient, not full black cover */
.tc-blog-st1 .blog-slider .swiper-slide-active .post-card-st1 .info {
    opacity: 1 !important;
}
.post-card-st1 .info {
    top: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 42% !important;
    padding: 48px 28px 28px !important;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.92)) !important;
    opacity: 1 !important;
    justify-content: flex-end !important;
}
.post-card-st1 .info .date,
.post-card-st1 .info h6 {
    color: #f0f0f0 !important;
}
.post-card-st1:hover .img img {
    transform: scale(1.06);
    transition: transform 0.7s ease;
}
.post-card-st1 .img {
    overflow: hidden;
}
.post-card-st1 .img img {
    transition: transform 0.7s ease;
}

/* Yellow / gold buttons — readable hover */
.butn.bg-gold1,
.butn.bg-orange1,
a.butn.bg-gold1,
a.bg-gold1 {
    color: #111 !important;
}
.butn.bg-gold1:hover,
.butn.bg-orange1:hover,
.butn.hover-bg-light1:hover,
a.butn.bg-gold1:hover,
a.butn.bg-gold1.text-dark:hover,
a.butn.bg-gold1.text-dark.hover-bg-light1:hover,
a.bg-gold1.text-dark.hover-bg-light1:hover {
    background-color: #111111 !important;
    border-color: #f5c518 !important;
    color: #f5c518 !important;
}
.butn.bg-gold1:hover *,
.butn.bg-orange1:hover *,
.butn.hover-bg-light1:hover *,
a.butn.bg-gold1:hover *,
a.butn.bg-gold1.text-dark:hover *,
a.butn.bg-gold1.text-dark.hover-bg-light1:hover *,
a.bg-gold1.text-dark.hover-bg-light1:hover * {
    color: #f5c518 !important;
}
.text-dark.hover-bg-light1:hover {
    color: #f5c518 !important;
}
.hover-bg-orange1:hover {
    background-color: #f5c518 !important;
    color: #111 !important;
}
.hover-bg-orange1:hover * {
    color: #111 !important;
}
.butn.bg-light1.hover-bg-orange1:hover {
    background-color: #f5c518 !important;
    color: #111 !important;
}
.butn.bg-light1.hover-bg-orange1:hover * {
    color: #111 !important;
}

/* Preloader — logo grows for ~3s */
.loader-wrap .load-text img {
    max-height: none !important;
    height: 140px !important;
    width: auto !important;
    transform: scale(0.4);
    opacity: 0.7;
    animation: v16LogoGrow 3s ease-out forwards;
}
@keyframes v16LogoGrow {
    0%   { transform: scale(0.4); opacity: 0.55; }
    65%  { transform: scale(1.2); opacity: 1; }
    100% { transform: scale(1.55); opacity: 1; }
}

/* CTA — proper Get in Touch / Contact buttons */
.v16-cta-row,
.tc-contact-st1 .v16-cta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    flex-wrap: wrap;
    padding: 28px 0;
}
.v16-cta-btn,
.tc-contact-st1 .v16-cta-btn {
    display: inline-flex !important;
    align-items: center;
    gap: 12px;
    padding: 16px 36px !important;
    background: #f5c518 !important;
    color: #111 !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 14px !important;
    border-radius: 999px !important;
    text-decoration: none !important;
    transition: transform 0.35s ease, background 0.35s ease, color 0.35s ease, box-shadow 0.35s ease;
}
.v16-cta-btn:hover,
.tc-contact-st1 .v16-cta-btn:hover {
    background: #111 !important;
    color: #f5c518 !important;
    transform: translateY(-3px);
}

/* Premium common page hero */
.tc-innerheader-st16.v16-page-hero,
header.v16-page-hero {
    position: relative;
    min-height: 52vh;
    display: flex;
    align-items: center;
    overflow: hidden;
    background-color: #0a0a0a !important;
    padding: 140px 0 80px !important;
    border: 0 !important;
}
.v16-page-hero .v16-hero-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transform: scale(1.08);
    animation: v16HeroKen 18s ease-in-out infinite alternate;
    z-index: 0;
}
.v16-page-hero .v16-hero-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.55) 55%, rgba(0,0,0,0.75) 100%);
}
@keyframes v16HeroKen {
    from { transform: scale(1.05); }
    to   { transform: scale(1.15); }
}
.v16-page-hero .container,
.v16-page-hero .v16-hero-inner {
    position: relative;
    z-index: 2;
}
.v16-page-hero .bg-box {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
}
.v16-page-hero h1,
.v16-page-hero .display-4 {
    font-size: clamp(42px, 6vw, 80px) !important;
    font-weight: 500 !important;
    letter-spacing: 1px;
    color: #fff !important;
    animation: v16FadeUp 0.9s ease both;
}
.v16-page-hero .lead,
.v16-page-hero .v16-hero-sub {
    color: #cfcfcf !important;
    max-width: 640px;
    animation: v16FadeUp 1s 0.15s ease both;
}
.v16-page-hero .breadcrumb,
.v16-page-hero .links,
.v16-page-hero .btm-cont {
    animation: v16FadeUp 1s 0.3s ease both;
}
.v16-page-hero .breadcrumb-item,
.v16-page-hero .breadcrumb-item a,
.v16-page-hero .links a,
.v16-page-hero .btm-cont .txt {
    color: #bdbdbd !important;
}
.v16-page-hero .breadcrumb-item.active,
.v16-page-hero .text-gold {
    color: #f5c518 !important;
}
.v16-page-hero .btm-cont { display: none !important; }
@keyframes v16FadeUp {
    from { opacity: 0; transform: translateY(28px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Animated services showcase */
.v16-services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
@media (max-width: 991px) {
    .v16-services-grid { grid-template-columns: 1fr; }
}
.v16-service-card {
    position: relative;
    min-height: 260px;
    padding: 36px 28px;
    background: #161616;
    border: 1px solid #2a2a2a;
    overflow: hidden;
    text-decoration: none !important;
    color: #f0f0f0 !important;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    transition: transform 0.45s ease, border-color 0.45s ease, box-shadow 0.45s ease;
}
.v16-service-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(160deg, transparent 30%, rgba(245,197,24,0.12));
    opacity: 0;
    transition: opacity 0.45s ease;
}
.v16-service-card .num {
    position: absolute;
    top: 20px;
    right: 22px;
    font-size: 48px;
    font-weight: 700;
    color: rgba(255,255,255,0.06);
    line-height: 1;
    transition: color 0.45s ease, transform 0.45s ease;
}
.v16-service-card .icon {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: #222;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
    transition: background 0.45s ease, transform 0.45s ease;
}
.v16-service-card .icon img { width: 26px; height: 26px; filter: invert(1); }
.v16-service-card h5 {
    font-size: 24px;
    margin: 0 0 10px;
    position: relative;
    z-index: 1;
}
.v16-service-card p {
    margin: 0;
    color: #999;
    font-size: 14px;
    line-height: 1.6;
    position: relative;
    z-index: 1;
}
.v16-service-card:hover {
    transform: translateY(-8px);
    border-color: #f5c518;
    box-shadow: 0 20px 50px rgba(0,0,0,0.35);
}
.v16-service-card:hover::before { opacity: 1; }
.v16-service-card:hover .icon {
    background: #f5c518;
    transform: scale(1.08);
}
.v16-service-card:hover .icon img { filter: none; }
.v16-service-card:hover .num {
    color: rgba(245,197,24,0.25);
    transform: translateY(-6px);
}

/* About section polish */
.tc-about-st1 .numbers-wrapper .item {
    transition: transform 0.4s ease, border-color 0.4s ease;
}
.tc-about-st1 .numbers-wrapper .item:hover {
    transform: scale(1.06);
    border-color: #f5c518 !important;
}
.tc-about-st1 .down-arrow {
    transition: transform 0.4s ease, background 0.4s ease, color 0.4s ease;
    animation: v16Bounce 2.2s ease-in-out infinite;
}
.tc-about-st1 .down-arrow:hover {
    background: #111 !important;
    color: #f5c518 !important;
}
@keyframes v16Bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(10px); }
}

/* Testimonials content visibility */
.tc-testimonials-st1 .testi-card {
    color: #f0f0f0;
}
.tc-testimonials-st1 .main-text {
    font-size: clamp(18px, 2.2vw, 28px);
    line-height: 1.6;
}
.tc-testimonials-st1 .lg-title {
    color: #f5c518 !important;
    background: transparent !important;
    opacity: 0.18;
}

/* Projects premium layout */
.v16-projects-hero {
    min-height: 60vh;
}
.v16-project-block {
    margin-top: 80px;
}
.v16-project-block .v16-project-head {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 24px;
    margin-bottom: 28px;
    flex-wrap: wrap;
}
.v16-project-block .v16-project-head h4 {
    font-size: clamp(28px, 4vw, 48px);
    margin: 0;
    letter-spacing: 1px;
}
.v16-project-block .v16-project-head p {
    max-width: 520px;
    color: #999;
    margin: 0;
}
.v16-project-masonry {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 16px;
}
.v16-project-item {
    position: relative;
    overflow: hidden;
    min-height: 280px;
    grid-column: span 4;
    background: #161616;
}
.v16-project-item:nth-child(3n+1) { grid-column: span 5; min-height: 360px; }
.v16-project-item:nth-child(3n+2) { grid-column: span 4; min-height: 320px; }
.v16-project-item:nth-child(3n)   { grid-column: span 3; min-height: 280px; }
@media (max-width: 991px) {
    .v16-project-item,
    .v16-project-item:nth-child(n) {
        grid-column: span 12;
        min-height: 240px;
    }
}
.v16-project-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s ease;
}
.v16-project-item::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(transparent 40%, rgba(0,0,0,0.55));
    opacity: 0;
    transition: opacity 0.4s ease;
}
.v16-project-item:hover img { transform: scale(1.08); }
.v16-project-item:hover::after { opacity: 1; }

/* Subtle reveal helpers */
.wow { visibility: visible; }

/* ── Hero Split Text Responsive Media Queries ── */
header.tc-hero-st1 {
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 100vh !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
}

header.tc-hero-st1 .container {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
}

header.tc-hero-st1 .content {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

header.tc-hero-st1 .hero-slider {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    text-align: left !important;
}

header.tc-hero-st1 .swiper-wrapper {
    display: flex !important;
    align-items: center !important;
}

header.tc-hero-st1 .swiper-slide {
    display: flex !important;
    align-items: center !important;
    text-align: left !important;
}

header.tc-hero-st1 .info {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    text-align: left !important;
    width: 100% !important;
}

header.tc-hero-st1 h1.split-text {
    font-size: clamp(65px, 10vw, 150px);
    line-height: 1.05;
    letter-spacing: -0.02em;
    display: block;
    visibility: visible !important;
    opacity: 1 !important;
    text-align: left !important;
    margin: 0 !important;
}

header.tc-hero-st1 .btm-info {
    margin-top: 0 !important;
    display: none !important;
}

@media screen and (max-width: 1199px) {
    header.tc-hero-st1 h1.split-text {
        font-size: clamp(75px, 9vw, 110px) !important;
    }
}

@media screen and (max-width: 991px) {
    header.tc-hero-st1 {
        height: 100vh !important;
        height: 100dvh !important;
        padding: 0 !important;
    }
    header.tc-hero-st1 h1.split-text {
        font-size: clamp(58px, 9.5vw, 85px) !important;
        margin-top: 0 !important;
        text-align: left !important;
        line-height: 1.08 !important;
    }
    header.tc-hero-st1 h1::before {
        width: 70px !important;
        height: 160px !important;
        top: 0 !important;
        left: 3% !important;
        transform: rotate(10deg) !important;
    }
}

@media screen and (max-width: 767px) {
    header.tc-hero-st1 h1.split-text {
        font-size: clamp(48px, 11vw, 70px) !important;
        text-align: left !important;
    }
}

@media screen and (max-width: 575px) {
    header.tc-hero-st1 {
        height: 100vh !important;
        height: 100dvh !important;
        padding: 0 !important;
    }
    header.tc-hero-st1 h1.split-text {
        font-size: clamp(40px, 12.5vw, 56px) !important;
        line-height: 1.1 !important;
        text-align: left !important;
    }
    header.tc-hero-st1 h1::before {
        width: 55px !important;
        height: 110px !important;
        left: 3% !important;
        transform: rotate(10deg) !important;
    }
}

@media screen and (max-width: 380px) {
    header.tc-hero-st1 h1.split-text {
        font-size: clamp(34px, 11vw, 44px) !important;
        text-align: left !important;
    }
}