/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

.playfair-display-family span{
    font-family: "Playfair Display", sans-serif;
    font-weight: 600;
    font-style: italic;
}

.link-color a{
    color: #000;
}


/* Home Page CSS Starts */

.list-line .elementor-icon-list-items{
    display: flex;
    flex-wrap: wrap;
}

.list-line .elementor-icon-list-items .elementor-icon-list-item{
    width: 50%;
}

.margin-left{
    padding-right: calc(((100vw - 1140px) / 2 ) - 10px );
}

.clients-feedback-slider .feedback-item{
    padding: 30px;
    border: 1px solid #DADADA;
}

.clients-feedback-slider .feedback-item  .client-rating span {
    font-size: 25px;
    color: #C69F55;
}

.clients-feedback-slider .feedback-item  .client-content{
    margin: 20px 0;
}

.clients-feedback-slider .feedback-item  .client-content p{
    font-family: var( --e-global-typography-text-font-family ), Sans-serif;
    font-size: var( --e-global-typography-text-font-size );
    font-weight: var( --e-global-typography-text-font-weight );
    text-transform: var( --e-global-typography-text-text-transform );
    font-style: var( --e-global-typography-text-font-style );
    text-decoration: var( --e-global-typography-text-text-decoration );
    line-height: var( --e-global-typography-text-line-height );
    color: #000;
}

.clients-feedback-slider .feedback-item  .client-info{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
}

.clients-feedback-slider .feedback-item  .client-info .client-image img{
    display: none;
    width: 85px;
    height: 85px;
    border-radius: 100%;
}

.clients-feedback-slider .feedback-item  .client-info .client-detail h4{
    font-family: "Playfair Display", sans-serif;
    font-size: 18px;
    font-weight: 900;
    color: #000;
    font-style: italic;
    line-height: 1em;
    margin: 0 0 5px;
}

.clients-feedback-slider .feedback-item  .client-info .client-detail h6{
    font-size: 14px;
    font-weight: 500;
    color: #757575;
    line-height: 1em;
    letter-spacing: 1.5px;
    margin: 0;
}

/* Home Page CSS Ends */

/* Blog List Page CSS Starts */

.hero-section-wrapper {
    position: relative;
    overflow: hidden;
    padding: 200px 0 100px;
    margin-top: -120px;
    background: url('/team-design-factory/wp-content/uploads/2026/06/ribbed-living-room-rug.jpg') center center / cover no-repeat;
}

/* Overlay */
.hero-section-wrapper::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 1;
}

/* Container */
.template-container {
    position: relative;
    z-index: 2;
    max-width: 1150px;
    margin: 0 auto;
}

/* Content */
.hero-section {
    color: #fff;
    position: relative;
    z-index: 2;
    width: 50%;
}

.hero-section h1 {
    font-family: var(--e-global-typography-primary-font-family), Sans-serif;
    font-size: var(--e-global-typography-primary-font-size);
    font-weight: var(--e-global-typography-primary-font-weight);
    text-transform: var(--e-global-typography-primary-text-transform);
    font-style: var(--e-global-typography-primary-font-style);
    text-decoration: var(--e-global-typography-primary-text-decoration);
    line-height: var(--e-global-typography-primary-line-height);
    color: var(--e-global-color-a23afdb);
    text-align: left;
    margin: 0 0 20px;
}

.hero-section p {
    font-family: var(--e-global-typography-text-font-family), Sans-serif;
    font-size: var(--e-global-typography-text-font-size);
    font-weight: var(--e-global-typography-text-font-weight);
    text-transform: var(--e-global-typography-text-text-transform);
    font-style: var(--e-global-typography-text-font-style);
    text-decoration: var(--e-global-typography-text-text-decoration);
    line-height: var(--e-global-typography-text-line-height);
    color: var(--e-global-color-a23afdb);
    text-align: left;
}

.blog-section-wrapper{
    padding: 80px 0;
}

.blog-section-wrapper .blog-section .blog-filter{
    margin-bottom: 60px;
}

.blog-section-wrapper .blog-section .blog-filter button{
    font-size: 16px;
    font-weight: 500;
    color: #000;
    background: transparent;
    border: 2px solid #989899;
    border-radius: 0;
    padding: 6px 10px;
    margin: 0 5px 8px 0;
    transition: all .3s;
}

.blog-section-wrapper .blog-section .blog-filter button:focus{
    outline: none;
    box-shadow: none;
}

.blog-section-wrapper .blog-section .blog-filter button:hover,
.blog-section-wrapper .blog-section .blog-filter button.active{
    color: #FFF;
    background: #000;
    border-color: #000;
}

.blog-section-wrapper .blog-section .blog-listing{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.blog-section-wrapper .blog-section .blog-listing .blog-card .blog-img{
    overflow: hidden;
    position: relative;
    margin-bottom: 20px;
}

.blog-section-wrapper .blog-section .blog-listing .blog-card .blog-img a{
    display: block;
    overflow: hidden;
}

.blog-section-wrapper .blog-section .blog-listing .blog-card .blog-img a img {
    aspect-ratio: 1/1;
    object-fit: cover;
    transition: all .4s;
}

.blog-section-wrapper .blog-section .blog-listing .blog-card .blog-img img:hover{
    transform: scale(1.1);
}

.blog-section-wrapper .blog-section .blog-listing .blog-card .blog-img span.blog-category{
    font-size: 14px;
    font-weight: 600;
    color: #000;
    line-height: 0.9em;
    background: #fff;
    padding: 5px 10px;
    border-radius: 0;
    position: absolute;
    bottom: 20px;
    left: 20px;
}

.blog-section-wrapper .blog-section .blog-listing .blog-card .blog-content h3 a{
    display: inline-block;
    font-size: 22px;
    font-weight: 600;
    line-height: 0.9em;
    color: #000;
    transition: all .3s;
}

.blog-section-wrapper .blog-section .blog-listing .blog-card .blog-content p{
    color: #000;
}

.blog-section-wrapper .blog-section .blog-loader,
.blog-section-wrapper .blog-section .no-more-blogs{
    width: 100%;
    margin-top: 60px;
    text-align: center;
    font-family: "Playfair Display", sans-serif;
    font-size: 20px;
    font-weight: 600;
    color: #000;
    line-height: 0.9em;
    font-style: italic;
}

/* Blog List Page CSS Ends */

/* Blog Details Page CSS Starts */

.hero-section.full-width{ width: 100%; }
.hero-section span{
    display: inline-block;
    padding: 10px 10px 5px;
    line-height: 0.9em;
    background: #C69F55;
    color: #000;
    text-transform: uppercase;
    margin-bottom: 20px;
    font-weight: 600;
}

.hero-section.full-width p{
    position: relative;
    font-size: 22px;
}

.hero-section.full-width p:after,
.blog-details-section-wrapper .blog-details .blog-content h2:after{
    content: '';
    position: absolute;
    bottom: -15px;
    left:0;
    width: 80px;
    height: 3px;
    background: #C69F55;
}

.blog-details-section-wrapper{
    padding: 80px 0;
}

.blog-details-section-wrapper .blog-details{
    display: flex;
    flex-wrap: nowrap;
    gap: 60px;
}

.blog-details-section-wrapper .blog-details .blog-content{ width: 60%; }
.blog-details-section-wrapper .blog-details .blog-other-content{ width: 40%; }

.blog-details-section-wrapper .blog-details .blog-content h2{ 
    margin-bottom: 40px;
    position: relative;
}


.blog-details-section-wrapper .blog-details .blog-content h6{
    display: block;
    font-size: 18px !important;
    font-weight: 600;
    color: #C69F55;
    margin-bottom: 20px;
}

.blog-details-section-wrapper .blog-details .blog-content h6 span{ color: #000; }


.blog-details-section-wrapper .blog-details p{
    color: #000;
    margin-bottom: 20px;
}

.blog-details-section-wrapper .blog-details ul,
.blog-details-section-wrapper .blog-details ol{
    margin: 0;
}

.blog-details-section-wrapper .blog-details ul li,
.blog-details-section-wrapper .blog-details ol li{
    margin-bottom: 10px;
    color: #000;
}

.blog-details-section-wrapper .blog-details ul li ul,
.blog-details-section-wrapper .blog-details ul li ol,
.blog-details-section-wrapper .blog-details ol li ul,
.blog-details-section-wrapper .blog-details ol li ol{
    margin-top: 20px;
}

.blog-details-section-wrapper .blog-details h1{ font-size: 80px; }
.blog-details-section-wrapper .blog-details h2{ font-size: 50px; }
.blog-details-section-wrapper .blog-details h3{ font-size: 40px; }
.blog-details-section-wrapper .blog-details h4{ font-size: 38px; }
.blog-details-section-wrapper .blog-details h5{ font-size: 36px; }
.blog-details-section-wrapper .blog-details h6{ font-size: 34px; }

.blog-details-section-wrapper .blog-details table {
    width: 100%;
    border-collapse: collapse;
}

.blog-details-section-wrapper .blog-details table,
.blog-details-section-wrapper .blog-details table th,
.blog-details-section-wrapper .blog-details table td {
    border: 1px solid #000;
    text-align: center;
}

.blog-details-section-wrapper .blog-details table thead{
    border-width: 1px;
}

.blog-details-section-wrapper .blog-details table thead tr th{
    background: #000;
    color: #FFF;
}

.blog-details-section-wrapper .blog-details table tbody tr td{
    color: #000;
    background: #fff;
}

.blog-details-section-wrapper .blog-details .blog-other-content img{
    border-radius: 40px;
}

.blog-details-section-wrapper .blog-details .blog-other-content .more-tip{
    margin-top: 40px;
    padding: 40px;
    background: #f0f0f0;
    border-radius: 10px;
}

.blog-details-section-wrapper .blog-details .blog-other-content .more-tip ul{
    padding: 0;
    margin: 0;
}

.blog-details-section-wrapper .blog-details .blog-other-content .more-tip ul li{
    list-style-type: none;
    font-size: 18px;
    font-weight: 500;
    color: #000;
    margin-bottom: 10px;
    position: relative;
    padding-left: 30px;
}

.blog-details-section-wrapper .blog-details .blog-other-content .more-tip ul li:before{
    content: '⮫';
    position: absolute;
    top: 0;
    left: 0;
    font-size: 25px;
    color: #C69F55;
}

.blog-details-section-wrapper .blog-navigation{
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin-top: 60px;
}

.blog-details-section-wrapper .blog-navigation .blog-nav-prev,
.blog-details-section-wrapper .blog-navigation .blog-nav-next{
    width: 30%;
}

.blog-details-section-wrapper .blog-navigation .blog-nav-prev{ text-align: left; }
.blog-details-section-wrapper .blog-navigation .blog-nav-next{ text-align: right; }

.blog-details-section-wrapper .blog-navigation .blog-nav-prev a h4,
.blog-details-section-wrapper .blog-navigation .blog-nav-next a h4{
    font-size: 20px;
    line-height: 1.2em;
}

.blog-details-section-wrapper .blog-navigation .blog-nav-prev a span,
.blog-details-section-wrapper .blog-navigation .blog-nav-next a span{
    color: #000;
}

.blog-details-section-wrapper .blog-navigation .blog-nav-prev a:hover span,
.blog-details-section-wrapper .blog-navigation .blog-nav-next a:hover span,
.blog-details-section-wrapper .blog-navigation .blog-nav-prev a:hover h4,
.blog-details-section-wrapper .blog-navigation .blog-nav-next a:hover h4{
    text-decoration: underline;
}

/* Blog Details Page CSS Ends */

/* Contact Us Page CSS Starts */

.contact-us-form form.wpcf7-form p input,
.contact-us-form form.wpcf7-form p select,
.contact-us-form form.wpcf7-form p textarea{
    font-size: 16px;
    font-weight: 600;
    color: #000;
    border: 2px solid #989899;
    border-radius: 0;
    padding: 5px 10px;
    margin-bottom: 10px;
}

.contact-us-form form.wpcf7-form p input:focus,
.contact-us-form form.wpcf7-form p select:focus,
.contact-us-form form.wpcf7-form p textarea:focus{
    outline: none;
    box-shadow: none;
}

.contact-us-form form.wpcf7-form p input::placeholder,
.contact-us-form form.wpcf7-form p select::placeholder,
.contact-us-form form.wpcf7-form p textarea::placeholder{
    color: #000;
}

.contact-us-form form.wpcf7-form p input.btn-submit{
    border-color: #000;
    color: #FFF;
    transition: all .3s;
    font-size: 18px;
    padding: 10px 20px;
    width: auto;
}

.contact-us-form form.wpcf7-form p input.btn-submit:hover{
    background: #FFF;
    color: #000;
}

/* Contact Us Page CSS Ends */

@media only screen and (max-width: 991px) {

    .br-tablet-none br{
        display: none;
    }

    /* Home Page CSS Starts */

    .margin-left{ padding-right: 0; }

    /* Home Page CSS Ends */

    /* Blog List Page CSS Starts */

    .hero-section-wrapper {
        padding: 200px 20px 100px;
        margin-top: -120px;
    }

    .blog-section-wrapper{
        padding: 60px 20px;
    }

    .blog-section-wrapper .blog-section .blog-listing{
        grid-template-columns: repeat(2, 1fr);
    }

    /* Blog List Page CSS Ends */

    /* Blog Details Page CSS Starts */

    .blog-details-section-wrapper{
        padding: 60px 20px;
    }

    .blog-details-section-wrapper .blog-details h1{ font-size: 60px; }
    .blog-details-section-wrapper .blog-details h2{ font-size: 40px; }
    .blog-details-section-wrapper .blog-details h3{ font-size: 38px; }
    .blog-details-section-wrapper .blog-details h4{ font-size: 36px; }
    .blog-details-section-wrapper .blog-details h5{ font-size: 34px; }
    .blog-details-section-wrapper .blog-details h6{ font-size: 32px; }

    .blog-details-section-wrapper .blog-details .blog-other-content .more-tip{
        padding: 40px 20px;
    }

    /* Blog Details Page CSS Starts */

}

@media only screen and (max-width: 767px) {

    .br-mobile-none br{
        display: none;
    }

    /* Home Page CSS Starts */
/* 
    .list-line .elementor-icon-list-items{
        display: block;
    }

    .list-line .elementor-icon-list-items .elementor-icon-list-item{
        width: 100%;
    } */

    /* Home Page CSS Ends */

    /* Blog List Page CSS Starts */

    .hero-section {
        width: 100%;
    }

    .blog-section-wrapper .blog-section .blog-filter{
        display: flex;
        overflow-y: scroll;
        scrollbar-width: none; /* Firefox */
        -ms-overflow-style: none; /* IE & Edge */
    }

    /* Chrome, Safari & Opera */
    .blog-section-wrapper .blog-section .blog-filter::-webkit-scrollbar{
        display: none;
    }

    .blog-section-wrapper .blog-section .blog-listing{
        grid-template-columns: repeat(1, 1fr);
    }

    /* Blog List Page CSS Ends */

    /* Blog Details Page CSS Starts */

    .blog-details-section-wrapper .blog-details{ display: block; }
    .blog-details-section-wrapper .blog-details .blog-content, 
    .blog-details-section-wrapper .blog-details .blog-other-content { width: 100%; }

    .blog-details-section-wrapper .blog-details .blog-content{ margin-bottom: 60px; }

    .blog-details-section-wrapper .blog-details h1{ font-size: 50px; }
    .blog-details-section-wrapper .blog-details h2{ font-size: 38px; }
    .blog-details-section-wrapper .blog-details h3{ font-size: 36px; }
    .blog-details-section-wrapper .blog-details h4{ font-size: 34px; }
    .blog-details-section-wrapper .blog-details h5{ font-size: 32px; }
    .blog-details-section-wrapper .blog-details h6{ font-size: 30px; }

    .blog-details-section-wrapper .blog-navigation{
        align-items: flex-start;
    }

    .blog-details-section-wrapper .blog-navigation .blog-nav-prev, 
    .blog-details-section-wrapper .blog-navigation .blog-nav-next{
        width: 45%;

    }

    /* Blog Details Page CSS Starts */

}