.logo h3 {
    color: var(--zt-text-primary);
}

.logo a {
    text-decoration: none;
}

.hero-area .glide__track{
    z-index: 1;
    position: relative;
}

.hero-area [class*="icon-box"] {
    position: absolute;
}

.hero-area .glide__slides {
    transform: translate3d(0,0,0)!important;
}
.hero-area .glide__slide {
    position: absolute;
    top: 0;
    left: 0;
    order: 2;
    opacity: 0;
}

.hero-area .glide__slide.glide__slide--active {
    position: relative;
    order: 1;
    opacity: 1;
    z-index: 1;
}

.hero-area .glide__slide.glide__slide--active .hero-content h1{
    animation: slideFadeLeft 2s;
}

.hero-area .glide__slide.glide__slide--active .hero-content p{
    animation: slideFadeLeft 2s;
}

.hero-area .glide__slide.glide__slide--active .hero-content .hero-btn{
    animation: slideFadeLeft 2s;
}

.hero-area .glide__slide.glide__slide--active .hero-img{
    animation: slideFadeRight 2s;
}


@-webkit-keyframes slideFadeLeft {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideFadeLeft {
    0% {
        transform: translate3d(-100%, 0, 0);
    }

    100% {
        transform: translate3d(0, 0, 0);
    }
}

@-webkit-keyframes slideFadeRight {
    0% {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideFadeRight {
    0% {
        transform: translate3d(100%, 0, 0);
    }

    100% {
        transform: translate3d(0, 0, 0);
    }
}

.animation-icon .elementor-icon{
    width : 90px;
    height : 90px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.animation-top-bottom{
    animation: animationTopBottom 20s infinite alternate;
}

.animation-left-right{
    animation: animationLeftRight 20s infinite alternate;
}

@-webkit-keyframes animationTopBottom {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }


    100% {
        -webkit-transform: translate3d(0, 65%, 0);
        transform: translate3d(0, 65%, 0);
    }
}

@keyframes animationTopBottom {
    0% {
        transform: translate3d(0, 0, 0);
    }

    100% {
        transform: translate3d(0, 65%, 0);
    }
}

@-webkit-keyframes animationLeftRight {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }


    100% {
        -webkit-transform: translate3d(65%, 0, 0);
        transform: translate3d(65%, 0, 0);
    }
}

@keyframes animationLeftRight {
    0% {
        transform: translate3d(0, 0, 0);
    }

    100% {
        transform: translate3d(65%, 0, 0);
    }
}

.icon-box-one {
    top: 130px;
    left: 156px;
    animation: jumpTwo 5s infinite alternate;
}

.icon-box-two {
    bottom: 50px;
    right: 113px;
    animation: jumpThree 5s infinite alternate;
    -webkit-animation: jumpThree 5s infinite alternate;
}

.icon-box-three {
    bottom: 60px;
    left: 170px;
    animation: jumpThree 5s infinite alternate;
}

.icon-box-four {
    bottom: 40px;
    left: 70px;
    animation: jumpTwo 5s infinite alternate;
}

.icon-box-five {
    bottom: 60px;
    left: 170px;
    animation: jumpThree 5s infinite alternate;
}

.icon-box-six {
    bottom: 160px;
    left: 70px;
    animation: jumpThree 5s infinite alternate;
}

@-webkit-keyframes jumpTwo {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    40% {
        -webkit-transform: translate3d(0, 20px, 0);
        transform: translate3d(0, 20px, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes jumpTwo {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    40% {
        -webkit-transform: translate3d(0, 20px, 0);
        transform: translate3d(0, 20px, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@-webkit-keyframes jumpThree {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    40% {
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes jumpThree {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    40% {
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}


.header-area .sub-menu.sub-menu-3rd {
    top: 16px !important;
    left: 100%;
}

.header-area .sub-menu.sub-menu-3rd::before {
    display: none;
}

.menu-mobile .sub-menu li a:hover {
    padding-left: 0;
}

.appointment-form .zt-cat,
.contact-form .zt-cat{
    width : auto;
}

.appointment-form .zt-cat:focus,
.contact-form .zt-cat:focus{
    border: none;
}


.blog-details-area .post-thumbnail{
    width: fit-content;
}

.blog-details-area .post-wrap .post-navigation a {
    color: var(--zt-text-primary);
}

.blog-details-area .post-wrap .post-navigation a:hover {
    color: var(--zt-brand-secondary);
}

.sticky-label {
    position: absolute;
    background: var(--zt-brand);
    color: var(--zt-white);
    top: 0;
    right: 0;
    padding: 5px 10px;
}

.feature-link .post-content img {
    position: absolute;
    top: 50%;
    right: 30px;
    transform: translateY(-50%);
    opacity: .35;
}

.blog-list-wrap .post-content {
    border: 1px solid #e7e7e7;
    padding: 30px;
}

.blog-list-wrap .zt-cat {
    padding: 13px 20px;
}

.page-content a:not(.zt-cat, .zt-cat-transparent,.team-wrap a) {
    color: var(--zt-brand-secondary);
}

.page-content a:not(.zt-cat):hover {
    color: var(--zt-heading);
}

.post-thumbnail img {
    height: auto;
    width: 100%;
}

.page-banner .page-title span {
    font-size: 56px;
    line-height: 62px;
    color: var(--zt-heading);
    font-weight: 700;
}

.error-area .form-control {
    padding: 20px;
}

.error-area .form-control:focus {
    box-shadow: none;
}

.post-details-meta .cat-title {
    margin-top: 3px;
}

.post-details-meta .share {
    margin-top: 4px;
}

.team-wrap .member-prof{
    text-transform: capitalize;
}

/* ==========================================================================
   CodeProMax Black & Red Brand Identity — Theme & Footer Styling
   ========================================================================== */

:root {
    --zt-brand: #e50914 !important;
    --zt-brand-secondary: #b80710 !important;
}

/* Header Top Bar — Ultra-Sleek Single-Line Onyx & Crimson */
.cpm-topbar-wrapper {
    background: #0d0f13 !important;
    border-bottom: 1px solid rgba(229, 9, 20, 0.4) !important;
    position: relative;
    z-index: 99;
}

.cpm-topbar-wrapper .header-top {
    background: transparent !important;
    border-bottom: none !important;
    padding: 7px 0 !important;
    min-height: 38px;
}

.cpm-topbar-wrapper .contact-info {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 22px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-wrap: nowrap !important;
}

.cpm-topbar-item {
    display: inline-flex !important;
    align-items: center !important;
    font-size: 0.835rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

.cpm-topbar-item span,
.cpm-topbar-item a {
    color: #cbd5e1 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    transition: color 0.2s ease !important;
}

.cpm-topbar-item a:hover {
    color: #ffffff !important;
}

.cpm-topbar-item i {
    color: #e50914 !important;
    margin-right: 7px !important;
    font-size: 0.82rem !important;
}

.cpm-topbar-wrapper .social {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 14px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.cpm-topbar-wrapper .social li {
    display: inline-flex !important;
    align-items: center !important;
}

.cpm-topbar-wrapper .social a {
    color: #cbd5e1 !important;
    font-size: 0.88rem !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 26px !important;
    height: 26px !important;
    border-radius: 6px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    transition: all 0.25s ease !important;
}

.cpm-topbar-wrapper .social a:hover {
    background: #e50914 !important;
    border-color: #e50914 !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(229, 9, 20, 0.4) !important;
}

/* Header Bottom / Main Navigation Bar */
.header-bottom {
    background: #ffffff !important;
    border-bottom: 1px solid #eef2f6 !important;
    transition: all 0.3s ease !important;
}

.header-area.header-fixed .header-bottom {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.07) !important;
}

/* Global Buttons & Links */
.zt-cat,
a.zt-cat,
button.zt-cat {
    background: linear-gradient(135deg, #e50914 0%, #b80710 100%) !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

.zt-cat:hover,
a.zt-cat:hover,
button.zt-cat:hover {
    background: linear-gradient(135deg, #b80710 0%, #8b0000 100%) !important;
    box-shadow: 0 8px 24px rgba(229, 9, 20, 0.4) !important;
    color: #ffffff !important;
}

.main-menu .current-menu-item > a,
.header-menu li a:hover {
    color: #e50914 !important;
}

/* Footer Area — Deep Obsidian / Slate Black with Crimson Red Accents */
.footer-area,
.footer-area.cpm-footer {
    background: linear-gradient(180deg, #131418 0%, #090a0c 100%) !important;
    border-top: 3px solid #e50914 !important;
    box-shadow: 0 -16px 40px rgba(0, 0, 0, 0.7);
    color: #cbd5e1;
    position: relative;
    overflow: hidden;
}

.footer-area::before {
    content: '';
    position: absolute;
    top: 0;
    left: 10%;
    right: 10%;
    height: 2px;
    background: linear-gradient(90deg, transparent, #e50914, #ff3b3f, transparent);
    pointer-events: none;
}

/* Hide legacy floating CPM logo ornament shapes */
.footer-ornament {
    display: none !important;
}

/* Footer Brand Logo Badge (Crisp White Backdrop to make Black & Red Logo POP) */
.footer-brand .footer-logo-link {
    display: inline-block !important;
    background: #ffffff !important;
    padding: 10px 22px !important;
    border-radius: 12px !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(229, 9, 20, 0.25) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.footer-brand .footer-logo-link:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 26px rgba(229, 9, 20, 0.4), 0 0 0 1px rgba(229, 9, 20, 0.5) !important;
}

.footer-brand .footer-logo {
    max-height: 50px !important;
    width: auto !important;
    display: block !important;
    filter: none !important;
}

.footer-desc {
    color: #94a3b8 !important;
    font-size: 0.925rem !important;
    line-height: 1.7 !important;
    margin-top: 14px;
}

/* Widget Headings */
.footer-widget-title,
.footer-widget h4,
.footer-area .elementor-heading-title {
    color: #ffffff !important;
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em;
    margin-bottom: 22px !important;
    position: relative;
    padding-bottom: 12px;
}

.footer-widget-title::after,
.footer-widget h4::after,
.footer-area .elementor-widget-heading .elementor-heading-title::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 38px;
    height: 3px;
    background: linear-gradient(90deg, #e50914, #ff4d4d) !important;
    border-radius: 3px;
}

/* Navigation Links */
.cpm-footer-links li {
    margin-bottom: 11px;
}

.cpm-footer-links li a,
.footer-area .elementor-icon-list-item a {
    color: #94a3b8 !important;
    font-size: 0.925rem;
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    padding: 2px 0;
}

.cpm-footer-links li a i,
.footer-area .elementor-icon-list-item a i {
    font-size: 0.72rem;
    color: #e50914 !important;
    transition: transform 0.25s ease, color 0.25s ease;
}

.cpm-footer-links li a:hover,
.footer-area .elementor-icon-list-item a:hover {
    color: #ffffff !important;
    transform: translateX(5px);
}

.cpm-footer-links li a:hover i,
.footer-area .elementor-icon-list-item a:hover i {
    color: #ff4d4d !important;
    transform: translateX(2px);
}

/* Contact Info Items */
.cpm-contact-list li {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 16px;
    font-size: 0.915rem;
    color: #94a3b8;
    line-height: 1.55;
}

.cpm-contact-list li a {
    color: #cbd5e1 !important;
    text-decoration: none !important;
    transition: color 0.2s ease;
}

.cpm-contact-list li a:hover {
    color: #ff3b3f !important;
}

.cpm-contact-icon {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 10px;
    background: rgba(229, 9, 20, 0.12) !important;
    border: 1px solid rgba(229, 9, 20, 0.32) !important;
    color: #ff3b3f !important;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    margin-top: 2px;
}

/* Social Media Buttons */
.cpm-social-links {
    display: flex;
    gap: 10px;
    align-items: center;
}

.cpm-social-btn {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.12);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #cbd5e1 !important;
    font-size: 1rem;
    text-decoration: none !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.cpm-social-btn:hover {
    background: linear-gradient(135deg, #e50914, #b80710) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    transform: translateY(-3px);
    box-shadow: 0 8px 22px rgba(229, 9, 20, 0.5) !important;
}

/* Footer Bottom Sub-Bar */
.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.footer-bottom .copyright p {
    color: #64748b !important;
    font-size: 0.88rem !important;
}

.footer-legal-links a {
    color: #94a3b8 !important;
    font-size: 0.88rem;
    transition: color 0.2s ease;
}

.footer-legal-links a:hover {
    color: #ff3b3f !important;
}

/* Back to Top Floating Action Button */
#back2top {
    position: fixed;
    bottom: 26px;
    right: 26px;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, #e50914, #b80710) !important;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 24px rgba(229, 9, 20, 0.45) !important;
    z-index: 998;
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

#back2top:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(229, 9, 20, 0.65) !important;
    color: #ffffff;
}

/* Telegram Live Chat Support Removed (WhatsApp Dedicated) */
#tlcs-chat-toggle,
#tlcs-chat-widget,
.tlcs-chat-container,
.tlcs-chat-wrapper,
.tlcs-chat-icon {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* Mobile Responsiveness */
@media (max-width: 767px) {
    .footer-area {
        padding-top: 60px !important;
        padding-bottom: 25px !important;
        margin-top: 60px !important;
    }
    .footer-widget {
        margin-bottom: 30px;
    }
    .footer-bottom {
        text-align: center;
        gap: 12px;
    }
    .cpm-floating-whatsapp {
        bottom: 20px !important;
        right: 20px !important;
        width: 52px !important;
        height: 52px !important;
        font-size: 26px !important;
    }
    #back2top {
        bottom: 20px !important;
        left: 20px !important;
        right: auto !important;
    }
}

/* Suppress duplicate demo Elementor footer sections so only official cpm-footer renders */
.elementor-section.footer-area,
.elementor-section[data-settings*="footer-area"],
.page-id-1773 .elementor-element-3f93857 {
    display: none !important;
}

/* Ensure modern cpm-footer is always visible */
footer.cpm-footer {
    display: block !important;
}

/* High-End Contact Form 7 Styling — Black & Red Focus */
.wpcf7-form {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 36px 32px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.wpcf7-form label {
    font-weight: 600;
    color: #1e293b;
    font-size: 0.95rem;
    margin-bottom: 8px;
    display: block;
}

.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form select,
.wpcf7-form textarea {
    width: 100% !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 10px !important;
    padding: 12px 16px !important;
    font-size: 0.95rem !important;
    color: #334155 !important;
    background-color: #f8fafc !important;
    transition: all 0.25s ease !important;
    outline: none !important;
}

.wpcf7-form input:focus,
.wpcf7-form select:focus,
.wpcf7-form textarea:focus {
    border-color: #e50914 !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(229, 9, 20, 0.18) !important;
}

.wpcf7-form input[type="submit"] {
    background: linear-gradient(135deg, #e50914 0%, #b80710 100%) !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    letter-spacing: 0.3px !important;
    padding: 14px 38px !important;
    border: none !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 8px 20px rgba(229, 9, 20, 0.35) !important;
}

.wpcf7-form input[type="submit"]:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 26px rgba(229, 9, 20, 0.55) !important;
}

.wpcf7-response-output {
    border-radius: 10px !important;
    font-size: 0.9rem !important;
    margin-top: 20px !important;
    padding: 14px 18px !important;
}

/* ==========================================================================
   CodeProMax Tech (CPM): Compact Header & Page Title Banner Design System
   Eliminates excessive whitespace, provides sleek obsidian/crimson branding
   ========================================================================== */

/* 1. Compact Main Navigation Header */
.header-bottom {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    background-color: #ffffff !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04) !important;
}

.header-bottom .logo img {
    max-height: 46px !important;
    width: auto !important;
    transition: transform 0.25s ease;
}

.header-bottom .logo img:hover {
    transform: scale(1.02);
}

.main-menu.header-menu > ul > li > a {
    font-size: 0.94rem !important;
    font-weight: 600 !important;
    padding: 8px 16px !important;
    color: #1e293b !important;
    transition: color 0.2s ease, transform 0.2s ease !important;
}

.main-menu.header-menu > ul > li > a:hover,
.main-menu.header-menu > ul > li.current-menu-item > a,
.main-menu.header-menu > ul > li.current_page_item > a {
    color: #e50914 !important;
}

/* 2. Sleek, Compact CPM Page Title Banner (White / Cream Theme) */
.page-banner,
.blog-page-banner,
.single-banner,
.cpm-page-banner {
    background: linear-gradient(180deg, #fdfbf7 0%, #f4f6f8 100%) !important;
    padding-top: 42px !important;
    padding-bottom: 38px !important;
    position: relative !important;
    border-bottom: 1px solid #e2e8f0 !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.02) !important;
    overflow: hidden !important;
}

.page-banner::before,
.blog-page-banner::before,
.single-banner::before,
.cpm-page-banner::before {
    display: none !important;
}

.page-banner .page-title,
.blog-page-banner .page-title,
.single-banner .page-title {
    margin-bottom: 0 !important;
}

.page-banner .page-title h1,
.blog-page-banner .page-title h1,
.single-banner .page-title h1 {
    color: #0f172a !important;
    font-size: 2.35rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em !important;
    line-height: 1.2 !important;
    margin: 0 0 6px 0 !important;
    text-shadow: none !important;
}

/* 3. Refined Breadcrumb Styling (White / Cream Theme) */
.page-banner .breadcrumb,
.blog-page-banner .breadcrumb,
.breadcrumb {
    padding-top: 4px !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    background: transparent !important;
}

.page-banner .breadcrumb .breadcrumb-item,
.blog-page-banner .breadcrumb .breadcrumb-item {
    font-size: 0.88rem !important;
    color: #64748b !important;
    display: inline-flex !important;
    align-items: center !important;
}

.page-banner .breadcrumb .breadcrumb-item a,
.blog-page-banner .breadcrumb .breadcrumb-item a {
    color: #475569 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
    font-weight: 500 !important;
}

.page-banner .breadcrumb .breadcrumb-item a:hover,
.blog-page-banner .breadcrumb .breadcrumb-item a:hover {
    color: #ff2a2a !important;
}

.page-banner .breadcrumb .breadcrumb-item.active,
.blog-page-banner .breadcrumb .breadcrumb-item.active {
    color: #ff2a2a !important;
    font-weight: 700 !important;
}

.page-banner .breadcrumb-item + .breadcrumb-item::before,
.blog-page-banner .breadcrumb-item + .breadcrumb-item::before {
    color: #94a3b8 !important;
    content: "/" !important;
    padding: 0 10px !important;
}

/* 4. Elimination of Massive Page Wrapper Padding (was 120px) */
.page-wrapper,
.page-wrapper.pt-120,
.cpm-page-wrapper,
.service-single-area,
.service-single-area.pt-120,
.single-portfolio-area,
.single-portfolio-area.pt-120,
.team-single-area,
.team-single-area.pt-120,
.blog-details-area,
.blog-details-area.pt-120,
.blog-list-area,
.blog-list-area.pt-120 {
    padding-top: 36px !important;
    padding-bottom: 45px !important;
    background-image: none !important;
}

/* Tighten top margins on first Elementor sections */
.page-wrapper .elementor > .elementor-section:first-child,
.page-wrapper .elementor-section.elementor-top-section:first-child {
    margin-top: 0 !important;
}

.page-wrapper .elementor-section.elementor-top-section:first-child > .elementor-container > .elementor-column > .elementor-widget-wrap > .elementor-element:first-child > .elementor-widget-container {
    padding-top: 5px !important;
}

/* 5. Mobile & Tablet Optimization */
@media (max-width: 991px) {
    .header-bottom {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }
    
    .page-banner,
    .blog-page-banner,
    .single-banner,
    .cpm-page-banner {
        padding-top: 28px !important;
        padding-bottom: 24px !important;
    }
    
    .page-banner .page-title h1,
    .blog-page-banner .page-title h1,
    .single-banner .page-title h1 {
        font-size: 1.85rem !important;
    }
    
    .page-wrapper,
    .cpm-page-wrapper {
        padding-top: 25px !important;
    }
}

/* 6. Suppress Duplicate Inner Elementor Footers */
.elementor-section.footer-area,
.elementor-top-section.footer-area,
.page-wrapper .elementor-section.footer-area,
.elementor .elementor-section.footer-area {
    display: none !important;
}

/* 7. Floating WhatsApp Quick-Connect Widget */
.cpm-floating-whatsapp {
    position: fixed;
    bottom: 26px;
    right: 26px;
    width: 52px;
    height: 52px;
    background: #25d366;
    color: #ffffff !important;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 27px;
    box-shadow: 0 6px 20px rgba(37, 211, 102, 0.45);
    z-index: 99999;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-decoration: none !important;
}

.cpm-floating-whatsapp:hover {
    transform: scale(1.1) translateY(-3px);
    box-shadow: 0 10px 28px rgba(37, 211, 102, 0.65);
    color: #ffffff !important;
}

.cpm-floating-tooltip {
    position: absolute;
    right: 64px;
    background: #0d0f13;
    color: #ffffff;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease, transform 0.25s ease;
    transform: translateX(10px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
    border-left: 3px solid #25d366;
}

.cpm-floating-whatsapp:hover .cpm-floating-tooltip {
    opacity: 1;
    transform: translateX(0);
}

/* Floating Action: Dedicated WhatsApp Quick-Connect (Sole Chat Widget) */
.cpm-floating-whatsapp {
    position: fixed;
    bottom: 25px;
    right: 25px;
    width: 58px;
    height: 58px;
    background: linear-gradient(135deg, #25d366 0%, #128c7e 100%);
    color: #ffffff !important;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    box-shadow: 0 8px 24px rgba(37, 211, 102, 0.45);
    z-index: 99999;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-decoration: none !important;
}

.cpm-floating-whatsapp:hover {
    transform: scale(1.1) translateY(-4px);
    box-shadow: 0 14px 32px rgba(37, 211, 102, 0.6);
    color: #ffffff !important;
}

.cpm-floating-whatsapp .cpm-floating-tooltip {
    position: absolute;
    right: 70px;
    background: #0f172a;
    color: #ffffff;
    font-size: 0.85rem;
    font-weight: 600;
    padding: 7px 14px;
    border-radius: 20px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transform: translateX(10px);
    transition: all 0.25s ease;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
}

.cpm-floating-whatsapp .cpm-floating-tooltip::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -5px;
    transform: translateY(-50%);
    border-width: 5px 0 5px 5px;
    border-style: solid;
    border-color: transparent transparent transparent #0f172a;
}

.cpm-floating-whatsapp:hover .cpm-floating-tooltip {
    opacity: 1;
    transform: translateX(0);
}

/* Back-to-top moved to Bottom-Left for ergonomic, distraction-free live chat dock */
#back2top {
    bottom: 25px !important;
    left: 25px !important;
    right: auto !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    color: #ff2a2a !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08) !important;
    z-index: 99990 !important;
}

#back2top:hover {
    background: #ff2a2a !important;
    color: #ffffff !important;
    border-color: #ff2a2a !important;
    transform: translateY(-3px);
}

/* CPM Crisp White/Cream Navbar */
.header-area .header-bottom,
.header-bottom,
.header-2.header-fixed,
.header-fixed {
    background: #ffffff !important;
    border-bottom: 1px solid #eef2f6 !important;
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.04) !important;
    transition: all 0.3s ease !important;
}

.header-fixed {
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border-bottom: 1px solid #e2e8f0 !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
}

/* CPM Logo: Positioned naturally on the white/cream navbar without artificial badges */
.header-area .logo a,
.mobile-header .logo a {
    display: inline-flex !important;
    align-items: center !important;
    background: transparent !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

.header-area .logo a:hover,
.mobile-header .logo a:hover {
    transform: none !important;
    box-shadow: none !important;
}

.header-area .logo img,
.mobile-header .logo img {
    max-height: 48px !important;
    width: auto !important;
    display: block !important;
    transition: transform 0.2s ease !important;
}

.header-area .logo img:hover,
.mobile-header .logo img:hover {
    transform: scale(1.02) !important;
}

/* Desktop Main Menu on White/Cream Background */
.header-area .main-menu > ul > li > a,
.main-menu li a {
    color: #1e293b !important;
    font-size: 0.92rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em !important;
    text-transform: uppercase !important;
    padding: 10px 0 !important;
    transition: color 0.2s ease !important;
}

.header-area .main-menu > ul > li:hover > a,
.header-area .main-menu > ul > li.current-menu-item > a,
.header-area .main-menu > ul > li.active > a {
    color: #ff2a2a !important;
}

/* Mobile Menu Bar */
.menu-bar .menu-burger,
.menu-bar .menu-burger::before,
.menu-bar .menu-burger::after {
    background: #1e293b !important;
}

.mobile-menu {
    background: #ffffff !important;
    border-left: 1px solid #e2e8f0 !important;
    box-shadow: -4px 0 25px rgba(0, 0, 0, 0.08) !important;
}

.menu-mobile li a {
    color: #1e293b !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

.menu-mobile li a:hover,
.menu-mobile li.active a {
    color: #ff2a2a !important;
}

.close-button {
    color: #ffffff !important;
    background: #ff2a2a !important;
    border-radius: 50% !important;
    width: 32px !important;
    height: 32px !important;
    line-height: 32px !important;
    text-align: center !important;
}

/* ==========================================================================
   CPM White / Cream Theme: Content Cards, Typography & Interactive Modules
   ========================================================================== */

/* Universal Page Background */
.cpm-page-wrapper,
.service-single-area,
.single-portfolio-area,
.team-single-area,
.page-wrapper {
    background: #f8fafc !important;
}

/* CPM Service & Portfolio Typography (White / Cream Theme) */
.cpm-service-detail h3,
.cpm-portfolio-case-study h3 {
    font-size: 1.45rem;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: #0f172a !important;
    border-left: 3px solid #ff2a2a;
    padding-left: 14px;
    margin-top: 36px;
    margin-bottom: 18px;
}

.cpm-service-detail ul,
.cpm-portfolio-case-study ul {
    list-style: none;
    padding-left: 0;
    margin-bottom: 24px;
}

.cpm-service-detail ul li,
.cpm-portfolio-case-study ul li {
    position: relative;
    padding-left: 26px;
    margin-bottom: 12px;
    line-height: 1.7;
    color: #334155 !important;
}

.cpm-service-detail ul li::before,
.cpm-portfolio-case-study ul li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: #ff2a2a !important;
    font-weight: 800;
    font-size: 1rem;
}

.cpm-service-detail p,
.cpm-portfolio-case-study p {
    color: #334155 !important;
    line-height: 1.75;
    font-size: 1.02rem;
    margin-bottom: 18px;
}

.cpm-service-detail strong,
.cpm-portfolio-case-study strong {
    color: #0f172a !important;
    font-weight: 700;
}

/* Service Content White Card */
.service-single-area .service-content {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    padding: 38px 42px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
}

/* Portfolio White Cards */
.single-portfolio-area .portfolio-wrap {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    padding: 32px 36px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
}

.single-portfolio-area .portfolio-wrap .portfolio-title {
    color: #0f172a !important;
    font-weight: 800;
}

.single-portfolio-area .portfolio-info span.info-name {
    color: #64748b !important;
    font-weight: 600;
}

.single-portfolio-area .portfolio-info span.info-details {
    color: #0f172a !important;
    font-weight: 600;
}

.single-portfolio-area .portfolio-details {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    padding: 38px 42px !important;
    margin-top: 35px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
    color: #334155 !important;
}

.single-portfolio-area .portfolio-details p {
    color: #334155 !important;
}

/* CPM Team Members Center Alignment & White Cards */
.team-area .row {
    justify-content: center !important;
}
.team-wrap {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: 24px 20px !important;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.04) !important;
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}
.team-wrap:hover {
    transform: translateY(-5px);
    border-color: rgba(255, 42, 42, 0.35) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08) !important;
}
.team-wrap .member-img img {
    border-radius: 10px;
    width: 100%;
    max-width: 280px;
    height: auto;
    object-fit: cover;
}
.team-wrap .member-info .member-name {
    font-size: 1.15rem;
    font-weight: 700;
    color: #0f172a !important;
    transition: color 0.2s ease;
}
.team-wrap .member-info .member-name:hover {
    color: #ff2a2a !important;
}
.team-wrap .member-info .member-prof {
    color: #64748b !important;
    font-size: 0.9rem;
    display: block;
    margin-top: 4px;
    font-weight: 500;
}

/* Team Single Page */
.team-single-area .member-details {
    color: #334155 !important;
}
.team-single-area .member-name {
    color: #0f172a !important;
    font-weight: 800;
}
.team-single-area .contact-title {
    color: #0f172a !important;
    font-weight: 700;
}
.team-single-area .contact-info .info-name {
    color: #64748b !important;
}
.team-single-area .contact-info .info-details {
    color: #0f172a !important;
    font-weight: 600;
}

/* CPM Pricing Table White Cards */
.pricing-area .single-pricing,
.price-table {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    padding: 40px 32px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}
.pricing-area .single-pricing:hover,
.pricing-area .single-pricing.active,
.price-table:hover {
    border-color: rgba(255, 42, 42, 0.4) !important;
    transform: translateY(-6px);
    box-shadow: 0 16px 35px rgba(0, 0, 0, 0.08) !important;
}
.pricing-area .pricing-header .package-name,
.price-table .package-title {
    color: #0f172a !important;
    font-size: 1.35rem;
    font-weight: 700;
}
.pricing-area .pricing-header .price,
.price-table .price {
    color: #ff2a2a !important;
    font-size: 2.2rem;
    font-weight: 800;
}
.pricing-area .pricing-header .period,
.price-table .package-time {
    color: #64748b !important;
    font-size: 0.9rem;
}
.pricing-area .pricing-body ul,
.price-table .price-feature {
    list-style: none;
    padding-left: 0;
    margin: 25px 0 35px;
}
.pricing-area .pricing-body ul li,
.price-table .price-feature li {
    color: #334155 !important;
    padding: 8px 0;
    border-bottom: 1px solid #f1f5f9 !important;
    font-size: 0.95rem;
}
.pricing-area .pricing-btn .zt-cat,
.price-cat .zt-cat {
    background: #ff2a2a !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    padding: 12px 28px !important;
    font-weight: 600 !important;
    display: inline-block;
    transition: background 0.25s ease, transform 0.25s ease;
}
.pricing-area .pricing-btn .zt-cat:hover,
.price-cat .zt-cat:hover {
    background: #e01b1b !important;
    transform: translateY(-2px);
    color: #ffffff !important;
}

/* CPM Working Process White Cards */
.working-process-wrap {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: 30px 24px !important;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.04) !important;
    transition: all 0.3s ease;
}
.working-process-wrap:hover {
    border-color: rgba(255, 42, 42, 0.35) !important;
    transform: translateY(-4px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important;
}
.working-process-wrap .work-process-title,
.working-process-wrap .process-title {
    color: #0f172a !important;
    font-weight: 700;
}
.working-process-wrap p,
.working-process-wrap .process-desc {
    color: #475569 !important;
    line-height: 1.6;
}

/* CPM Contact Details Cards & Forms (White / Cream Theme) */
.contact-area .contact-info-wrap {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: 30px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
}
.contact-area .contact-info-item,
.contact-area .elementor-icon-list-text,
.contact-area .elementor-icon-list-item a {
    color: #334155 !important;
}
.contact-area .wpcf7 form input[type="text"],
.contact-area .wpcf7 form input[type="email"],
.contact-area .wpcf7 form input[type="tel"],
.contact-area .wpcf7 form textarea,
.contact-area .wpcf7 form select {
    background: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
    color: #0f172a !important;
    border-radius: 8px !important;
    padding: 14px 18px !important;
    font-size: 0.98rem !important;
    width: 100% !important;
}
.contact-area .wpcf7 form input:focus,
.contact-area .wpcf7 form textarea:focus,
.contact-area .wpcf7 form select:focus {
    background: #ffffff !important;
    border-color: #ff2a2a !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(255, 42, 42, 0.15) !important;
}
.contact-area .wpcf7 form input[type="submit"] {
    background: #ff2a2a !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    padding: 14px 34px !important;
    cursor: pointer !important;
    transition: background 0.25s ease !important;
}
.contact-area .wpcf7 form input[type="submit"]:hover {
    background: #e01b1b !important;
}

/* ==========================================================================
   SENIOR UI WHITESPACE HARMONIZATION & SECTION COMPACTING (Executive Standard)
   Eliminates excessive empty gaps, normalized to modern 45-55px desktop rhythm
   ========================================================================== */

/* 1. Global Spacing Utility Class Normalization */
.pt-120, .pt-115, .pt-110, .pt-105, .pt-100 {
    padding-top: 55px !important;
}
.pb-120, .pb-115, .pb-110, .pb-105, .pb-100 {
    padding-bottom: 55px !important;
}
.pt-80, .pt-90, .pt-85 {
    padding-top: 48px !important;
}
.pb-80, .pb-90, .pb-85 {
    padding-bottom: 48px !important;
}
.mt-120, .mt-110, .mt-100 {
    margin-top: 45px !important;
}
.mb-120, .mb-110, .mb-100 {
    margin-bottom: 45px !important;
}
.mt-80 {
    margin-top: 40px !important;
}
.mb-80 {
    margin-bottom: 40px !important;
}

/* 2. Section Vertical Rhythm Harmonization */
.service-area,
.pricing-area,
.team-area,
.work-area,
.working-process-area,
.testimonial-area,
.blog-area,
.partner-area {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}

/* 3. Section Title Spacing & Polish */
.section-title,
.zt-section-title,
.cpm-section-title {
    margin-bottom: 35px !important;
}
.section-title .sub-title,
.zt-section-title .sub-title {
    margin-bottom: 8px !important;
    font-size: 0.9rem !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    color: #ff2a2a !important;
}
.section-title h2,
.zt-section-title h2 {
    font-size: 2.15rem !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    letter-spacing: -0.02em !important;
    line-height: 1.25 !important;
    margin-bottom: 12px !important;
}
.section-title p,
.zt-section-title p {
    color: #64748b !important;
    font-size: 1rem !important;
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.6 !important;
}

/* 4. Responsive Whitespace Clamping for Tablet & Mobile */
@media (max-width: 991px) {
    .pt-120, .pt-115, .pt-110, .pt-105, .pt-100, .pt-80, .pt-90, .pt-85 {
        padding-top: 42px !important;
    }
    .pb-120, .pb-115, .pb-110, .pb-105, .pb-100, .pb-80, .pb-90, .pb-85 {
        padding-bottom: 42px !important;
    }
    .mt-120, .mt-110, .mt-100, .mt-80 {
        margin-top: 35px !important;
    }
    .mb-120, .mb-110, .mb-100, .mb-80 {
        margin-bottom: 35px !important;
    }
    .service-area,
    .pricing-area,
    .team-area,
    .work-area,
    .working-process-area,
    .testimonial-area,
    .blog-area,
    .partner-area {
        padding-top: 38px !important;
        padding-bottom: 38px !important;
    }
    .section-title h2,
    .zt-section-title h2 {
        font-size: 1.85rem !important;
    }
}

@media (max-width: 767px) {
    .pt-120, .pt-115, .pt-110, .pt-105, .pt-100, .pt-80, .pt-90, .pt-85 {
        padding-top: 32px !important;
    }
    .pb-120, .pb-115, .pb-110, .pb-105, .pb-100, .pb-80, .pb-90, .pb-85 {
        padding-bottom: 32px !important;
    }
    .mt-120, .mt-110, .mt-100, .mt-80 {
        margin-top: 25px !important;
    }
    .mb-120, .mb-110, .mb-100, .mb-80 {
        margin-bottom: 25px !important;
    }
    .service-area,
    .pricing-area,
    .team-area,
    .work-area,
    .working-process-area,
    .testimonial-area,
    .blog-area,
    .partner-area {
        padding-top: 30px !important;
        padding-bottom: 30px !important;
    }
    .section-title h2,
    .zt-section-title h2 {
        font-size: 1.6rem !important;
    }
}