:root {
    --theme: #5ECFCF !important;
    /* Teal from logo */
    --theme-gradient: linear-gradient(135deg, #5ECFCF 0%, #7B68EE 100%);
}

/* Override all orange (#F94D00) elements */
.theme-btn,
.back-to-top,
.newsletter-box-4,
.spinner,
.accordion-button:not(.collapsed)::after,
.link-btn:hover,
.letters-loading {
    background: var(--theme-gradient) !important;
}

.theme-btn:hover {
    background: linear-gradient(135deg, #4ABFBF 0%, #6B58DE 100%) !important;
}

.sub-title,
.link-btn,
.accordion-button:not(.collapsed),
a:hover,
.highlight-text {
    color: #5ECFCF !important;
}

/* Accordion icons */
.accordion-button::after {
    background-color: #5ECFCF !important;
}

/* Pricing checkmarks */
.pricing-card-items .icon i,
.check-list li::before {
    color: #5ECFCF !important;
}

/* Fix cursor freezing - improve performance */
.mouseCursor {
    will-change: transform;
    transform: translateZ(0);
    pointer-events: none;
}

.cursor-inner {
    transition: transform 0.08s ease-out, width 0.2s ease, height 0.2s ease !important;
}

.cursor-outer {
    transition: transform 0.15s ease-out !important;
}

/* News animation fix */
.tp_fade_anim {
    opacity: 1 !important;
    transform: none !important;
}

.news-card-items {
    animation: fadeInUp 0.6s ease-out forwards;
}

.news-card-items:nth-child(2) {
    animation-delay: 0.2s;
}

.news-card-items:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Force black navigation text for Header 1 */
.header-1 .main-menu ul li a {
    color: #000 !important;
}

.header-1 .main-menu ul li a:hover,
.header-1 .main-menu ul li a.active {
    color: var(--theme) !important;
}

/* Mobile responsive - hide main nav on small screens */
@media (max-width: 1199px) {
    .header-1 .main-menu {
        display: none !important;
    }

    .header-1 .header-right .header-button {
        display: none !important;
    }

    .header-1 .header__hamburger {
        display: block !important;
    }

    .header-1 .logo img {
        max-height: 40px !important;
    }
}

/* Ensure logo is visible and properly sized */
.header-1 .logo img {
    max-height: 50px;
    width: auto;
}

/* Footer logo sizing */
.footer-widget img,
.footer-4 .footer-logo img {
    max-height: 60px !important;
    width: auto !important;
}

/* ========== MOBILE TEXT STABILITY FIXES ========== */

/* Stabilize letter-by-letter animation on mobile - COMPREHENSIVE */
@media (max-width: 991px) {

    /* Target ALL animated title span elements */
    .text-anim span,
    .tz-itm-anim span,
    .sec_title span,
    .tx-title span,
    .tx-split span,
    h1 span,
    h2 span,
    .section-title h2 span,
    .about-section-4 h2 span {
        display: inline !important;
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
        position: relative !important;
    }

    /* Ensure parent containers are stable */
    .text-anim,
    .tz-itm-anim,
    .sec_title,
    .tx-title,
    .tx-split,
    .section-title h2,
    .about-section-4 h2 {
        opacity: 1 !important;
        transform: none !important;
        display: block !important;
        white-space: normal !important;
    }

    /* Force hero text to be readable */
    .hero-4 h1,
    .hero-section-4 h1 {
        font-size: 32px !important;
        line-height: 1.2 !important;
    }

    /* Reduce marquee text size on mobile */
    .marquee .text {
        font-size: 24px !important;
    }
}

/* Word-break for long German words */
h1,
h2,
h3,
h4,
h5,
h6,
.service-card-items-4 h3,
.service-card-items-4 h3 a,
.section-title h2 {
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
}

/* Ensure consistent text rendering */
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* ========== OFFCANVAS/SIDEBAR FIX ========== */
/* Ensure offcanvas is ALWAYS hidden by default */
.offcanvas__info {
    visibility: hidden;
    opacity: 0;
    transform: translateX(calc(100% + 80px)) !important;
}

.offcanvas__info.info-open {
    visibility: visible;
    opacity: 1;
    transform: translateX(0) !important;
}

/* Ensure overlay is hidden by default */
.offcanvas__overlay {
    display: none;
    opacity: 0;
    visibility: hidden;
}

.offcanvas__overlay.overlay-open {
    display: block;
    opacity: 1;
    visibility: visible;
}

/* Fix for fix-area container */
.fix-area {
    position: relative;
    z-index: 9999;
}

/* Force meanmenu nav links to show directly in offcanvas (no collapsible reveal bar) */
.offcanvas__info .mobile-menu.mean-container .mean-bar {
    background: transparent !important;
    padding: 0 !important;
    min-height: auto !important;
}

.offcanvas__info .mobile-menu.mean-container a.meanmenu-reveal {
    display: none !important;
}

.offcanvas__info .mobile-menu.mean-container .mean-nav {
    display: block !important;
    margin-top: 0 !important;
    background: transparent !important;
}

.offcanvas__info .mobile-menu.mean-container .mean-nav>ul {
    display: block !important;
}

.offcanvas__info .mobile-menu.mean-container .mean-nav ul li a {
    color: #1a1a2e !important;
    border-top: 1px solid #e0e3ed !important;
    font-size: 16px !important;
    padding: 12px 0 !important;
    text-transform: capitalize !important;
    width: 100% !important;
    background: transparent !important;
}

.offcanvas__info .mobile-menu.mean-container .mean-nav ul li:first-child a {
    border-top: none !important;
}

.offcanvas__info .mobile-menu.mean-container .mean-nav ul li a:hover {
    color: var(--theme) !important;
}

/* ========== COMPREHENSIVE MOBILE LAYOUT FIXES (< 768px) ========== */
@media (max-width: 767px) {

    /* Hide decorative elements that cause overlap */
    .hero-shape,
    .hover-image,
    .shape-image,
    .decoration-image {
        display: none !important;
    }

    /* Force column layout for all flex containers */
    .hero-button,
    .hero-content .d-flex,
    .service-left-content .d-flex,
    .footer-widget .d-flex {
        flex-direction: column !important;
        gap: 15px !important;
        align-items: center !important;
    }

    /* Ensure hero content has proper z-index */
    .hero-content {
        position: relative;
        z-index: 10;
    }

    /* Make marquee text readable on mobile */
    .marquee .text {
        font-size: 16px !important;
        gap: 10px !important;
    }

    .marquee .text img {
        width: 16px !important;
        height: 16px !important;
    }

    /* Ensure buttons are always clickable */
    .theme-btn {
        position: relative;
        z-index: 100;
        width: 100%;
        text-align: center;
    }

    /* Fix container padding for mobile */
    .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    /* Ensure text doesn't overflow */
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p {
        max-width: 100% !important;
        overflow-wrap: break-word !important;
    }

    /* Fix section padding on mobile */
    .section-padding {
        padding: 60px 0 !important;
    }

    /* Ensure footer has proper spacing */
    .footer-4 {
        padding-bottom: 80px !important;
    }

    /* Fix offcanvas contact info spacing */
    .offcanvas__contact ul li {
        margin-bottom: 15px;
    }
}

/* Fix Contact Form Capitalization */
.contact-us-wrapper .contact-box .contact-form-box .form-clt input,
.contact-us-wrapper .contact-box .contact-form-box .form-clt textarea,
.contact-wrapper-inner .contact-box-items .contact-form-box .form-clt input,
.contact-wrapper-inner .contact-box-items .contact-form-box .form-clt textarea {
    text-transform: none !important;
}