@charset "utf-8";body{margin:0;padding:0;color:#00184b;overflow-x:hidden;font-family:Helvetica,sans-serif}
.d-none1{display: inline;}
.d-none2{display:none;}
.top-22{position:absolute;left: 53%;}
.bg-dark-blue{border-radius: 0px 0px 50px 50px;background-color: #0f1e40;}
.font-head{font-size:4rem}
.dashed1::before{content:"";font-weight:bold;display:inline-block;background-color:#ffffff;margin-right:20px;width:70px;height:2px;margin-left:5px;margin-bottom:5px}
.custom-btn{color:#000;padding:10px 25px;font-weight:500;background:transparent;cursor:pointer;border-radius:35px;transition:all .3s ease;display:inline-block;outline:0;position:relative;z-index:999999}
.border-left{border-left:solid 2px #3d8bfd;height: 100px;}
a{color:inherit;text-decoration:none}
.btn-15{background:#30c4ec;border:0;z-index:1}
.btn-15:after{position:absolute;content:"";width:0;height:100%;top:0;right:0;z-index:-1;background-color:#fff;border-radius:35px;transition:all .3s ease}
.btn-15:hover,a:hover{color:#333}
.btn-15:hover:after{left:0;width:100%}
.btn-15:active{top:2px}
a{color:inherit;text-decoration:none}
html{scroll-behavior:smooth}
.row>*,.row{padding-right:0!important;padding-left:0!important;margin:0}
.bg-banner{background:url('../img/air-duct-bg.webp') no-repeat center;background-size:100% 100%; border-radius: 50px;}
.bg-banner-residential{background:url('../img/residential-air-duct-richardson-banner.webp') no-repeat center;background-size:100% 100%; border-radius: 50px;}
.bg-banner-commercial{background:url('../img/commercial-air-duct-richardson-banner.webp') no-repeat center;background-size:100% 100%; border-radius: 50px;}
.bg-banner-vent{background:url('../img/air-vent-cleaning-banner.webp') no-repeat center;background-size:100% 100%; border-radius: 50px;}
.bg-banner-filter{background:url('../img/air-filter-replacemnt-banner.webp') no-repeat center;background-size:100% 100%; border-radius: 50px;}
.bg-banner-dryer{background:url('../img/dryer-vent-cleaning-banner.webp') no-repeat center;background-size:100% 100%; border-radius: 50px;}
.bg-banner-ac{background:url('../img/ac-repair-and-installation-banner.webp') no-repeat center;background-size:100% 100%; border-radius: 50px;}
.w-85{width: 95%}
.bg-light-blue{background-color: rgba(94, 220, 255, 0.1);}
.bg-light-gray{background-color: rgba(245, 245, 245, 0.973);}
.margin-theme{margin:10% 0 5% 0}
.stroke-form{border: #fff 10px solid;border-radius: 10px 0px 0px 10px;}
.bg-light1{background-color: #fff;border-radius: 0px 10px 10px 0px;}
.bg-light2{background-color:rgba(0,24,75,0.6);border-radius: 0px 10px 10px 0px;}
.z-in3{z-index:2}
.bg-gallery{background:url('../img/bg-form.webp') no-repeat center;background-size:cover;background-attachment:fixed}
/* form */
form.CUS input.subject { display: none; }
.CUS input, .CUS textarea{ background-color: #ffffff;
margin: 10px;border-radius: 2px;height: 40px;width: 45%;padding-left: 1%; color:#333;border-color: #eee;}
.CUS select{background-color: #ffffff;border-radius: 2px;height: 40px;margin: 10px; width: 45%;color:#4e4e4e;display:inline;border-color: #eee;}
@media (max-width:1200px){.CUS input, .CUS textarea{width: 95%;}}
/* end form */
ul li{list-style:none}
@media(max-width:1400px){.d-none1{display: none;}
.d-none2{display:inline;}}
@media(max-width:1300px){.display-top2{display:none}
.z-in3{right:8%;position:static}
.text-end1{text-align:end!important}
}
@media(max-width:580px){body{flex-direction:column}
}
.bg-img1{background:url('../img/bg-sec3.webp') no-repeat center top;background-size:cover}
.container-fluid{padding:0}
.overlay-anim:after{background:rgba(255,255,255,0.3);content:"";position:absolute;left:0;top:0;width:100%;height:0;opacity:1;z-index:9;pointer-events:none}
.overlay-anim:hover:after{height:100%;opacity:0;-webkit-transition:all 400ms linear;transition:all 400ms linear}
a{color:#00184b}
.row{margin-top:0}
.footer{color:#fff;background:#0f1e40}
.footer h2::before{content:"";position:absolute;width:50px;height:2px;background-color:#03bce1;bottom:-14px;left:0}
.footer h2{font-size:1.5rem;margin-top:30px}
.bg-secondary{padding:5px 10px;color:#fff}
a:link,a:active,a:hover{color:inherit;text-decoration:none}
.footer a{color:#fff}
@media only screen and (max-width:1600px){.bg-sec-1{background-color:rgba(255,255,255,0.5)}
}
@media only screen and (max-width:1200px){.nav-link{margin-top:20px}
.bg-img1{background-size:cover}
.navbar{padding-left:2%}
}
@media only screen and (max-width:850px){.navbar-toggler{background:#fff}
}
.dance2{-webkit-animation:dance2 4s alternate infinite;animation:dance2 4s alternate infinite;z-index:-1}
@keyframes dance2{0%{transform:translate3d(0,0,0)}
50%{transform:translate3d(25px,-25px,0)}
100%{transform:translate3d(0,-25px,25px)}
}
/* duct process */
/* --- Timeline Container (Desktop Horizontal) --- */
.timeline-container {
    position: relative;
    width: 100vw;
    height: 100vh;
    display: flex;
    align-items: center;
    overflow-x: auto; /* Horizontal Scroll */
    overflow-y: hidden;
    padding: 0 10vw; /* Spacing on sides */
    gap: 80px;
    scroll-behavior: auto;
    /* Custom Scrollbar Styling */
    scrollbar-width: thin;
    scrollbar-color: var(--accent-glow) var(--bg-color);
}

/* Hide scrollbar for cleaner look (optional) */
.timeline-container::-webkit-scrollbar {
    height: 8px;
}
.timeline-container::-webkit-scrollbar-track {
    background: var(--bg-color);
}
.timeline-container::-webkit-scrollbar-thumb {
    background-color: var(--accent-glow);
    border-radius: 10px;
}

/* --- The Central Line --- */
.timeline-line {
    position: absolute;
    top: 50%;
    left: 0;
    width: 2500px; /* Long enough to cover all items */
    height: 2px;
    background: linear-gradient(90deg, 
        transparent 0%, 
        var(--accent-glow) 20%, 
        var(--accent-secondary) 80%, 
        transparent 100%);
    z-index: 0;
    transform: translateY(-50%);
}

/* --- Timeline Item --- */
.timeline-item {
    position: relative;
    min-width: 320px;
    max-width: 320px;
    z-index: 1;
    display: flex;
    background-color: #00184b;
    color: #fff;
    flex-direction: column;
    /* Alternate alignment for visual interest */
    justify-content: flex-start; 
}

/* Stagger items slightly up and down */
.timeline-item:nth-child(even) {
    transform: translateY(40px);
}
.timeline-item:nth-child(odd) {
    transform: translateY(-40px);
}

/* --- The Dot Indicator --- */
.timeline-dot {
    width: 16px;
    height: 16px;
    background-color: var(--bg-color);
    border: 2px solid var(--accent-glow);
    border-radius: 50%;
    position: absolute;
    top: 50%; /* Center on the line based on parent offset */
    left: 50%;
    transform: translate(-50%, -50%); /* Adjust based on shift */
    box-shadow: 0 0 10px var(--accent-glow);
    transition: all var(--transition-speed) ease;
    z-index: 2;
}

/* Fix dot positioning relative to the alternating offset */
.timeline-item:nth-child(even) .timeline-dot {
    top: -40px; /* Offset needed to touch the center line */
}
.timeline-item:nth-child(odd) .timeline-dot {
    top: calc(100% + 40px);
}

/* --- The Date --- */

/* --- The Content Card --- */
.timeline-content {
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: 16px;
    padding: 20px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    transition: all var(--transition-speed) ease;
    cursor: pointer;
    overflow: hidden;
}

/* Image Styling */
.image-wrapper {
    width: 100%;
    height: 160px;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 15px;
}

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

/* Text Styling */
.timeline-content h3 {
    font-size: 1.25rem;
    margin-bottom: 8px;
    background: linear-gradient(to right, #fff, #a5b4fc);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.timeline-content p {
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--text-secondary);
}

/* --- Interactivity & Hover Effects --- */
.timeline-item:hover .timeline-content {
    transform: translateY(-5px) scale(1.02);
    border-color: rgba(99, 102, 241, 0.4);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
    background: rgba(255, 255, 255, 0.08);
}

.timeline-item:hover .image-wrapper img {
    transform: scale(1.1);
}

.timeline-item:hover .timeline-dot {
    background-color: var(--accent-glow);
    box-shadow: 0 0 20px var(--accent-glow), 0 0 40px var(--accent-secondary);
    transform: translate(-50%, -50%) scale(1.3);
}

/* --- MOBILE RESPONSIVE DESIGN (Vertical) --- */
@media (max-width: 900px) {
    body {
        overflow-y: auto;
    }

    .timeline-container {
        flex-direction: column;
        width: 100%;
        height: auto;
        overflow-x: hidden; /* No horizontal scroll */
        padding: 120px 20px 50px 20px;
        gap: 0;
    }

    /* Vertical Line */
    .timeline-line {
        width: 2px;
        height: 100%;
        top: 0;
        left: 30px; /* Position to the left */
        transform: none;
        background: linear-gradient(180deg, 
            transparent 0%, 
            var(--accent-glow) 10%, 
            var(--accent-secondary) 90%, 
            transparent 100%);
    }

    /* Reset Item Layout */
    .timeline-item {
        min-width: 100%;
        flex-direction: row;
        margin-bottom: 40px;
        padding-left: 50px; /* Space for line */
        transform: none !important; /* Remove alternating offset */
    }

    /* Reset Dot Position */
    .timeline-dot {
        left: 30px; /* Match line position */
        top: 35px; /* Align with top of card roughly */
        transform: translate(-50%, 0);
              top: 0 !important;
    }
    
    /* Fix dot hover for mobile */
    .timeline-item:hover .timeline-dot {
        transform: translate(-50%, 0) scale(1.3);
    }

    /* Reset Date Position */

    /* Card Adjustments */
    .timeline-content {
        width: 100%;
    }
}
/* end duct process */
/* faq */
#FaqAccordion1 .accordion-button::after {background-image:none !important;}
/* end faq */
/*!
 * Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 * Copyright 2025 Fonticons, Inc.
 */.fa-brands,.fa{--_fa-family:var(--fa-family,var(--fa-style-family,"Font Awesome 7 Free"));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:var(--fa-display,inline-block);font-family:var(--_fa-family);font-feature-settings:normal;font-style:normal;font-synthesis:none;font-variant:normal;font-weight:var(--fa-style,900);line-height:1;text-align:center;text-rendering:auto;width:var(--fa-width,1.25em)}
:is(.fas,.far,.fab,.fa-solid,.fa-regular,.fa-brands,.fa-classic,.fa)::before{content:var(--fa);content:var(--fa)/""}
.fa-clock{--fa:"\f017"}
.fa-map-marker{--fa:"\f041"}
.fa-phone{--fa:"\f095"}
.fa-arrow-circle-right{--fa:"\f0a9"}
:root,:host{--fa-family-brands:"Font Awesome 7 Brands";--fa-font-brands:normal 400 1em/1 var(--fa-family-brands)}
@font-face{font-family:"Font Awesome 7 Brands";font-style:normal;font-weight:400;font-display:swap;src:url("../webfonts/fa-brands-400.woff2")}
.fa-brands{--fa-family:var(--fa-family-brands);--fa-style:400}
.fa-blogger-b {--fa: "\f37d";}
.fa-youtube {--fa: "\f167";}
.fa-facebook-f{--fa:"\f39e"}
:root,:host{--fa-family-classic:"Font Awesome 7 Free";--fa-font-regular:normal 400 1em/1 var(--fa-family-classic);--fa-style-family-classic:var(--fa-family-classic)}
@font-face{font-family:"Font Awesome 7 Free";font-style:normal;font-weight:400;font-display:swap;src:url("../webfonts/fa-regular-400.woff2")}
:root,:host{--fa-family-classic:"Font Awesome 7 Free";--fa-font-solid:normal 900 1em/1 var(--fa-family-classic);--fa-style-family-classic:var(--fa-family-classic)}
@font-face{font-family:"Font Awesome 7 Free";font-style:normal;font-weight:900;font-display:swap;src:url("../webfonts/fa-solid-900.woff2")}
@font-face{font-family:"Font Awesome 5 Brands";font-display:swap;font-weight:400;src:url("../webfonts/fa-brands-400.woff2") format("woff2")}
@font-face{font-family:"Font Awesome 5 Free";font-display:swap;font-weight:900;src:url("../webfonts/fa-solid-900.woff2") format("woff2")}
@font-face{font-family:"Font Awesome 5 Free";font-display:swap;font-weight:400;src:url("../webfonts/fa-regular-400.woff2") format("woff2")}
@font-face{font-family:"FontAwesome";font-display:swap;src:url("../webfonts/fa-solid-900.woff2") format("woff2")}
@font-face{font-family:"FontAwesome";font-display:swap;src:url("../webfonts/fa-brands-400.woff2") format("woff2")}
@font-face{font-family:"FontAwesome";font-display:swap;src:url("../webfonts/fa-regular-400.woff2") format("woff2");unicode-range:U+F003,U+F006,U+F014,U+F016-F017,U+F01A-F01B,U+F01D,U+F022,U+F03E,U+F044,U+F046,U+F05C-F05D,U+F06E,U+F070,U+F087-F088,U+F08A,U+F094,U+F096-F097,U+F09D,U+F0A0,U+F0A2,U+F0A4-F0A7,U+F0C5,U+F0C7,U+F0E5-F0E6,U+F0EB,U+F0F6-F0F8,U+F10C,U+F114-F115,U+F118-F11A,U+F11C-F11D,U+F133,U+F147,U+F14E,U+F150-F152,U+F185-F186,U+F18E,U+F190-F192,U+F196,U+F1C1-F1C9,U+F1D9,U+F1DB,U+F1E3,U+F1EA,U+F1F7,U+F1F9,U+F20A,U+F247-F248,U+F24A,U+F24D,U+F255-F25B,U+F25D,U+F271-F274,U+F278,U+F27B,U+F28C,U+F28E,U+F29C,U+F2B5,U+F2B7,U+F2BA,U+F2BC,U+F2BE,U+F2C0-F2C1,U+F2C3,U+F2D0,U+F2D2,U+F2D4,U+F2DC}
@font-face{font-family:"FontAwesome";font-display:swap;src:url("../webfonts/fa-v4compatibility.woff2") format("woff2");unicode-range:U+F041,U+F047,U+F065-F066,U+F07D-F07E,U+F080,U+F08B,U+F08E,U+F090,U+F09A,U+F0AC,U+F0AE,U+F0B2,U+F0D0,U+F0D6,U+F0E4,U+F0EC,U+F10A-F10B,U+F123,U+F13E,U+F148-F149,U+F14C,U+F156,U+F15E,U+F160-F161,U+F163,U+F175-F178,U+F195,U+F1F8,U+F219,U+F27A}
.carousel-item h3{font-size: 20px;}
.lc-block h3{font-size: 1.3rem;}