/*==================================================
XTRILL UI
==================================================*/

:root{

    --xt-primary:#2563eb;
    --xt-dark:#111827;
    --xt-muted:#6b7280;

}

/*==================================================
Spacing
==================================================*/

.xt-section-space{

    padding:40px 0;

}

/*==================================================
Heading
==================================================*/

.xt-heading{

    font-size:clamp(2rem,4vw,3.5rem);

    font-weight:800;

    line-height:1.15;

    letter-spacing:-1px;

    color:var(--xt-dark);

    margin:0;

}

/* Premium Selection */

.xt-heading::selection{

    background:#2563eb;

    color:#fff;

}


/*==================================================
Paragraph
==================================================*/

.xt-text{

    font-size:1.125rem;

    line-height:1.9;

    font-weight:400;

    color:var(--xt-muted);

    margin:0;

   

    letter-spacing:.2px;

}

.xt-text strong{

    color:var(--xt-dark);

    font-weight:700;

}

.xt-text a{

    color:var(--xt-primary);

    text-decoration:none;

    font-weight:600;

}

.xt-text a:hover{

    text-decoration:underline;

}


/*==================================================
Buttons
==================================================*/

.xt-btn{

    display:inline-flex;
    align-items:center;
    justify-content:center;

    gap:10px;

    padding:16px 34px;

    font-size:16px;
    font-weight:700;
    line-height:1;

    text-decoration:none !important;

    border-radius:50px;

    transition:all .35s ease;

    cursor:pointer;

    border:0;

    position:relative;

    overflow:hidden;

}

/* Primary */

.xt-btn-primary{

    background:linear-gradient(135deg,#2563eb,#1d4ed8);

    color:#fff;

    box-shadow:
        0 12px 30px rgba(37,99,235,.25);

}

.xt-btn-primary:hover{

    color:#fff;

    transform:translateY(-3px);

    box-shadow:
        0 20px 40px rgba(37,99,235,.35);

}

/* Arrow Animation */

.xt-btn i{

    transition:all .3s ease;

}

.xt-btn:hover i{

    transform:translateX(6px);

}

/*==================================================
Image
==================================================*/

.xt-image-wrapper{

    position:relative;

    overflow:hidden;

    border-radius:24px;

    background:#ffffff;

    box-shadow:
        0 20px 45px rgba(15,23,42,.10);

    transition:all .35s ease;

}

.xt-image-wrapper:hover{

    transform:translateY(-6px);

    box-shadow:
        0 30px 60px rgba(15,23,42,.16);

}

.xt-image{

    display:block;

    width:100%;

    height:auto;

    transition:transform .5s ease;

}

.xt-image-wrapper:hover .xt-image{

    transform:scale(1.04);

}

/*==================================================
Premium Divider
==================================================*/

.xt-divider{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:20px;

}

.xt-divider-line{

    flex:1;

    max-width:180px;

    height:2px;

    background:linear-gradient(
        90deg,
        transparent,
        #dbe4f0,
        transparent
    );

    border-radius:20px;

}

.xt-divider-icon{

    width:48px;

    height:48px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#ffffff;

    color:var(--xt-primary);

    font-size:18px;

    box-shadow:
        0 10px 25px rgba(0,0,0,.08);

    transition:.35s;

}

.xt-divider:hover .xt-divider-icon{

    transform:rotate(180deg);

    color:#ffffff;

    background:var(--xt-primary);

}


/*==================================================
Spacer
==================================================*/

.xt-spacer{

    position:relative;

    height:100px;

    width:100%;

    border:2px dashed #d6dce8;

    border-radius:16px;

    background:
        repeating-linear-gradient(
            45deg,
            #fafbfc,
            #fafbfc 12px,
            #f4f7fa 12px,
            #f4f7fa 24px
        );

    display:flex;

    align-items:center;

    justify-content:center;

    transition:.3s;

}

.xt-spacer:hover{

    border-color:var(--xt-primary);

    background:#f8fbff;

}

.xt-spacer-label{

    padding:10px 20px;

    border-radius:50px;

    background:#ffffff;

    color:#64748b;

    font-size:14px;

    font-weight:600;

    box-shadow:0 10px 25px rgba(15,23,42,.08);

}

.xt-spacer-label i{

    color:var(--xt-primary);

    margin-right:8px;

}


/*==================================================
Premium List
==================================================*/

.xt-list{

    list-style:none;

    margin:0;

    padding:0;

}

.xt-list li{

    display:flex;

    align-items:center;

    gap:16px;

    padding:16px 0;

    border-bottom:1px solid #eef2f7;

    transition:.3s;

}

.xt-list li:last-child{

    border-bottom:0;

}

.xt-list li:hover{

    padding-left:8px;

}

.xt-list-icon{

    width:42px;

    height:42px;

    min-width:42px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:linear-gradient(135deg,#22c55e,#16a34a);

    color:#fff;

    font-size:15px;

    box-shadow:0 10px 20px rgba(34,197,94,.25);

}

.xt-list li span:last-child{

    font-size:17px;

    font-weight:500;

    color:var(--xt-dark);

}


/*==================================================
Premium Blockquote
==================================================*/

.xt-blockquote{

    position:relative;

    background:#fff;

    border-radius:24px;

    padding:45px;

    box-shadow:0 20px 45px rgba(15,23,42,.08);

    transition:.35s;

}

.xt-blockquote:hover{

    transform:translateY(-6px);

    box-shadow:0 30px 60px rgba(15,23,42,.12);

}

.xt-blockquote-icon{

    width:70px;

    height:70px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:30px;

    background:linear-gradient(135deg,#2563eb,#1d4ed8);

    color:#fff;

    font-size:26px;

    box-shadow:0 12px 25px rgba(37,99,235,.25);

}

.xt-blockquote-text{

    margin:0;

    font-size:1.35rem;

    line-height:1.9;

    font-weight:500;

    font-style:italic;

    color:#374151;

}

.xt-blockquote-author{

    display:flex;

    align-items:center;

    margin-top:35px;

}

.xt-blockquote-avatar{

    width:60px;

    height:60px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-right:18px;

    background:#eff6ff;

    color:#2563eb;

    font-size:22px;

}

.xt-blockquote-name{

    margin:0;

    font-size:18px;

    font-weight:700;

    color:#111827;

}

.xt-blockquote-role{

    display:block;

    margin-top:4px;

    color:#64748b;

    font-size:14px;

}


/*==================================================
Premium Alert
==================================================*/

.xt-alert{

    display:flex;

    align-items:flex-start;

    gap:18px;

    padding:22px 24px;

    border:0;

    border-radius:20px;

    box-shadow:0 15px 35px rgba(15,23,42,.08);

    transition:.35s;

}

.xt-alert:hover{

    transform:translateY(-4px);

    box-shadow:0 22px 45px rgba(15,23,42,.12);

}

.xt-alert-icon{

    width:54px;

    height:54px;

    min-width:54px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:16px;

    font-size:22px;

    background:rgba(255,255,255,.25);

}

.xt-alert-title{

    margin:0 0 6px;

    font-size:18px;

    font-weight:700;

}

.xt-alert-text{

    margin:0;

    line-height:1.7;

    opacity:.9;

}


/*==================================================
Premium Badge
==================================================*/

.xt-badge{

    display:inline-flex;

    align-items:center;

    gap:8px;

    padding:10px 20px;

    border-radius:50px;

    font-size:14px;

    font-weight:700;

    letter-spacing:.5px;

    color:#fff;

    text-transform:uppercase;

    text-decoration:none;

    box-shadow:0 10px 25px rgba(15,23,42,.12);

    transition:all .35s ease;

}

.xt-badge:hover{

    transform:translateY(-3px);

    box-shadow:0 18px 35px rgba(15,23,42,.18);

}

.xt-badge i{

    font-size:13px;

}


/*==================================================
Premium Card
==================================================*/

.xt-card{

    background:#ffffff;

    border-radius:24px;

    overflow:hidden;

    box-shadow:0 20px 45px rgba(15,23,42,.08);

    transition:all .35s ease;

    border:1px solid #edf2f7;

}

.xt-card:hover{

    transform:translateY(-8px);

    box-shadow:0 35px 70px rgba(15,23,42,.14);

}

.xt-card-image{

    position:relative;

    overflow:hidden;

}

.xt-card-image img{

    width:100%;

    display:block;

    transition:transform .5s ease;

}

.xt-card:hover .xt-card-image img{

    transform:scale(1.06);

}

.xt-card-badge{

    position:absolute;

    top:20px;

    left:20px;

    background:#2563eb;

    color:#fff;

    padding:8px 18px;

    border-radius:50px;

    font-size:13px;

    font-weight:700;

    text-transform:uppercase;

    box-shadow:0 10px 25px rgba(37,99,235,.30);

}

.xt-card-body{

    padding:32px;

}

.xt-card-title{

    font-size:30px;

    font-weight:800;

    line-height:1.3;

    color:#111827;

    margin-bottom:16px;

}

.xt-card-text{

    font-size:17px;

    line-height:1.9;

    color:#6b7280;

    margin-bottom:28px;

}

.xt-card-link{

    display:inline-flex;

    align-items:center;

    gap:10px;

    color:#2563eb;

    font-weight:700;

    text-decoration:none;

    transition:.3s;

}

.xt-card-link:hover{

    color:#1d4ed8;

}

.xt-card-link i{

    transition:.3s;

}

.xt-card-link:hover i{

    transform:translateX(6px);

}


/*==================================================
Premium Table
==================================================*/

.xt-table-wrapper{

    overflow-x:auto;

    background:#fff;

    border-radius:24px;

    box-shadow:0 20px 45px rgba(15,23,42,.08);

    border:1px solid #edf2f7;

}

.xt-table{

    width:100%;

    border-collapse:collapse;

    min-width:700px;

}

.xt-table thead{

    background:#f8fafc;

}

.xt-table th{

    padding:22px 26px;

    font-size:14px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:.8px;

    color:#64748b;

    border-bottom:1px solid #edf2f7;

}

.xt-table td{

    padding:22px 26px;

    color:#374151;

    border-bottom:1px solid #f1f5f9;

    transition:.3s;

}

.xt-table tbody tr{

    transition:.3s;

}

.xt-table tbody tr:hover{

    background:#f8fbff;

}

.xt-table tbody tr:last-child td{

    border-bottom:none;

}

/*==================================================
HTML Widget
==================================================*/

.xt-html{

    min-height:180px;

    border:2px dashed #d8e0ea;

    border-radius:20px;

    background:#fafcff;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:40px;

    transition:.3s;

    cursor:pointer;

}

.xt-html:hover{

    border-color:var(--xt-primary);

    background:#f3f8ff;

}

.xt-html-placeholder{

    text-align:center;

    color:#64748b;

}

.xt-html-placeholder i{

    font-size:48px;

    color:var(--xt-primary);

    margin-bottom:20px;

}

.xt-html-placeholder h5{

    font-size:22px;

    font-weight:700;

    color:#111827;

    margin-bottom:10px;

}

.xt-html-placeholder p{

    margin:0;

    font-size:15px;

}


/*==================================================
Embed Widget
==================================================*/

.xt-embed{

    width:100%;

    border-radius:24px;

    overflow:hidden;

    background:#fff;

    box-shadow:0 20px 45px rgba(15,23,42,.08);

    transition:.35s;

}

.xt-embed:hover{

    box-shadow:0 30px 60px rgba(15,23,42,.14);

}

.xt-embed iframe{

    border:0;

}

.mt_popup_live_preview  .xt-embed iframe{

    pointer-events:none;

}

.mt_popup_live_preview   iframe{

    pointer-events:none;

}


/*==================================================
Progress
==================================================*/

.xt-progress{

    margin-bottom:25px;

}

.xt-progress-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-bottom:12px;

    font-size:16px;

    font-weight:600;

    color:#111827;

}

.xt-progress .progress{

    height:12px;

    border-radius:30px;

    background:#edf2f7;

    overflow:hidden;

    box-shadow:inset 0 2px 4px rgba(0,0,0,.05);

}

.xt-progress .progress-bar{

    border-radius:30px;

    background:linear-gradient(90deg,#2563eb,#3b82f6);

    transition:width .4s ease;

}


/*==================================================
Premium List Group
==================================================*/

.xt-list-group{

    margin:0;
    padding:0;
    list-style:none;

    background:#fff;

    border-radius:22px;

    overflow:hidden;

    border:1px solid #edf2f7;

    box-shadow:0 15px 35px rgba(15,23,42,.08);

}

.xt-list-group-item{

    display:flex;

    align-items:center;

    gap:16px;

    padding:20px 24px;

    border-bottom:1px solid #edf2f7;

    transition:.3s;

    cursor:pointer;

}

.xt-list-group-item:last-child{

    border-bottom:0;

}

.xt-list-group-item:hover{

    background:#f8fbff;

    padding-left:32px;

}

.xt-list-group-icon{

    color:#22c55e;

    font-size:18px;

    width:24px;

    text-align:center;

}

.xt-list-group-item span{

    flex:1;

    font-size:16px;

    font-weight:600;

    color:#111827;

}

.xt-list-group-arrow{

    color:#94a3b8;

    transition:.3s;

}

.xt-list-group-item:hover .xt-list-group-arrow{

    transform:translateX(6px);

    color:#2563eb;

}


/*==================================================
Feature Box
==================================================*/

.xt-feature-box{

    background:#fff;

    padding:45px 35px;

    border-radius:24px;

    text-align:center;

    border:1px solid #edf2f7;

    box-shadow:0 20px 45px rgba(15,23,42,.08);

    transition:.35s;

    height:100%;

}

.xt-feature-box:hover{

    transform:translateY(-8px);

    box-shadow:0 30px 60px rgba(15,23,42,.14);

}

.xt-feature-icon{

    width:90px;

    height:90px;

    margin:0 auto 30px;

    border-radius:22px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:linear-gradient(135deg,#2563eb,#1d4ed8);

    color:#fff;

    font-size:36px;

    box-shadow:0 15px 30px rgba(37,99,235,.25);

}

.xt-feature-title{

    font-size:26px;

    font-weight:700;

    margin-bottom:15px;

    color:#111827;

}

.xt-feature-text{

    margin:0;

    font-size:16px;

    line-height:1.8;

    color:#6b7280;

}


/*==================================================
CTA
==================================================*/

.xt-cta{

    background:linear-gradient(135deg,#0f172a,#1e293b);

    color:#fff;

    padding:70px 50px;

    border-radius:28px;

    text-align:center;

    position:relative;

    overflow:hidden;

    box-shadow:0 25px 60px rgba(15,23,42,.25);

}

.xt-cta-title{

    font-size:clamp(2rem,4vw,3.5rem);

    font-weight:800;

    margin:25px 0 20px;

    color:#fff;

}

.xt-cta-text{

    max-width:720px;

    margin:0 auto 40px;

    font-size:18px;

    line-height:1.8;

    color:rgba(255,255,255,.85);

}

.xt-cta-buttons{

    display:flex;

    justify-content:center;

    gap:20px;

    flex-wrap:wrap;

}

/* Outline Button */

.xt-btn-outline{

    background:transparent;

    color:#fff;

    border:2px solid rgba(255,255,255,.3);

}

.xt-btn-outline:hover{

    background:#fff;

    color:#111827;

}


/*==================================================
Counter
==================================================*/

.xt-counter-section{

    padding:30px 0;

}

.xt-counter{

    background:#fff;

    border-radius:24px;

    padding:45px 25px;

    text-align:center;

    border:1px solid #edf2f7;

    box-shadow:0 15px 40px rgba(15,23,42,.08);

    transition:.35s;

    height:100%;

}

.xt-counter:hover{

    transform:translateY(-8px);

    box-shadow:0 25px 60px rgba(15,23,42,.14);

}

.xt-counter-icon{

    width:80px;

    height:80px;

    margin:0 auto 25px;

    border-radius:22px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:linear-gradient(135deg,#2563eb,#1d4ed8);

    color:#fff;

    font-size:32px;

}

.xt-counter-number{

    font-size:48px;

    font-weight:800;

    color:#111827;

    line-height:1;

    margin-bottom:15px;

}

.xt-counter-title{

    font-size:17px;

    color:#6b7280;

}


/*==================================================
Testimonials
==================================================*/

.xt-testimonials{

    padding:30px 0;

}

.xt-testimonial{

    background:#fff;

    border-radius:24px;

    padding:40px;

    height:100%;

    border:1px solid #edf2f7;

    box-shadow:0 20px 45px rgba(15,23,42,.08);

    transition:.35s;

}

.xt-testimonial:hover{

    transform:translateY(-8px);

    box-shadow:0 35px 70px rgba(15,23,42,.14);

}

.xt-testimonial-stars{

    color:#f59e0b;

    font-size:18px;

    margin-bottom:25px;

}

.xt-testimonial-text{

    font-size:17px;

    line-height:1.9;

    color:#64748b;

    margin-bottom:35px;

}

.xt-testimonial-user{

    display:flex;

    align-items:center;

}

.xt-testimonial-user img{

    width:70px;

    height:70px;

    border-radius:50%;

    object-fit:cover;

    margin-right:18px;

}

.xt-testimonial-user h5{

    margin:0;

    font-size:18px;

    font-weight:700;

}

.xt-testimonial-user span{

    color:#64748b;

    font-size:14px;

}


/*==================================================
Team
==================================================*/

.xt-team-card{

    background:#fff;

    border-radius:24px;

    overflow:hidden;

    border:1px solid #edf2f7;

    box-shadow:0 20px 45px rgba(15,23,42,.08);

    transition:.35s;

    height:100%;

}

.xt-team-card:hover{

    transform:translateY(-8px);

    box-shadow:0 35px 70px rgba(15,23,42,.14);

}

.xt-team-image{

    overflow:hidden;

}

.xt-team-image img{

    width:100%;

    display:block;

    transition:.4s;

}

.xt-team-card:hover img{

    transform:scale(1.06);

}

.xt-team-content{

    padding:30px;

    text-align:center;

}

.xt-team-name{

    font-size:24px;

    font-weight:700;

    color:#111827;

    margin-bottom:8px;

}

.xt-team-role{

    color:#6b7280;

    margin-bottom:25px;

}

.xt-team-social{

    display:flex;

    justify-content:center;

    gap:12px;

}

.xt-team-social a{

    width:42px;

    height:42px;

    border-radius:50%;

    background:#f3f4f6;

    color:#2563eb;

    display:flex;

    align-items:center;

    justify-content:center;

    text-decoration:none;

    transition:.3s;

}

.xt-team-social a:hover{

    background:#2563eb;

    color:#fff;

}


/*==================================================
Pricing
==================================================*/

.xt-pricing{

    position:relative;

    background:#fff;

    border:1px solid #edf2f7;

    border-radius:24px;

    padding:45px 35px;

    text-align:center;

    box-shadow:0 20px 45px rgba(15,23,42,.08);

    transition:.35s;

    height:100%;

}

.xt-pricing:hover{

    transform:translateY(-10px);

    box-shadow:0 35px 70px rgba(15,23,42,.15);

}

.xt-pricing-featured{

    border:2px solid #2563eb;

    transform:scale(1.04);

}

.xt-pricing-badge{

    position:absolute;

    top:-16px;

    left:50%;

    transform:translateX(-50%);

    background:#2563eb;

    color:#fff;

    padding:8px 20px;

    border-radius:50px;

    font-size:13px;

    font-weight:700;

}

.xt-pricing-title{

    font-size:26px;

    font-weight:700;

    color:#111827;

    margin-bottom:20px;

}

.xt-pricing-price{

    font-size:56px;

    font-weight:800;

    color:#2563eb;

    line-height:1;

    margin-bottom:10px;

}

.xt-pricing-subtitle{

    color:#64748b;

    margin-bottom:35px;

}

.xt-pricing-features{

    list-style:none;

    padding:0;

    margin:0 0 35px;

    text-align:left;

}

.xt-pricing-features li{

    padding:12px 0;

    border-bottom:1px solid #eef2f7;

    display:flex;

    align-items:center;

}

.xt-pricing-features li:last-child{

    border-bottom:0;

}

.xt-pricing-features i{

    color:#22c55e;

    margin-right:12px;

}

/*==================================================
Social Icons
==================================================*/

.xt-social{

    display:flex;

    justify-content:center;

    align-items:center;

    flex-wrap:wrap;

    gap:15px;

}

.xt-social-item{

    width:58px;

    height:58px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#ffffff;

    border:1px solid #edf2f7;

    color:#2563eb;

    font-size:22px;

    text-decoration:none;

    box-shadow:0 15px 35px rgba(15,23,42,.08);

    transition:.35s;

}

.xt-social-item:hover{

    background:#2563eb;

    color:#fff;

    transform:translateY(-6px);

    box-shadow:0 25px 50px rgba(37,99,235,.30);

}


/*==================================================
Logo Cloud
==================================================*/

.xt-logo-cloud{

    padding:20px 0;

}

.xt-logo-item{

    background:#fff;

    border:1px solid #edf2f7;

    border-radius:18px;

    padding:30px;

    text-align:center;

    transition:.35s;

    box-shadow:0 12px 30px rgba(15,23,42,.06);

}

.xt-logo-item:hover{

    transform:translateY(-6px);

    box-shadow:0 20px 45px rgba(15,23,42,.12);

}

.xt-logo-item img{

    max-height:55px;

    width:auto;

    filter:grayscale(100%);

    opacity:.7;

    transition:.35s;

}

.xt-logo-item:hover img{

    filter:none;

    opacity:1;

}

/*==================================================
FAQ
==================================================*/

.xt-faq{

    max-width:900px;

    margin:auto;

}

.xt-faq-item{

    border:none;

    margin-bottom:18px;

    border-radius:18px !important;

    overflow:hidden;

    box-shadow:0 15px 35px rgba(15,23,42,.08);

}

.xt-faq-item .accordion-button{

    background:#fff;

    padding:22px 28px;

    font-size:18px;

    font-weight:700;

    color:#111827;

    box-shadow:none;

}

.xt-faq-item .accordion-button:not(.collapsed){

    background:#2563eb;

    color:#fff;

}

.xt-faq-item .accordion-button:focus{

    box-shadow:none;

}

.xt-faq-item .accordion-body{

    padding:28px;

    background:#fff;

    color:#64748b;

    line-height:1.9;

}


/*==================================================
Blog
==================================================*/

.xt-blog-card{

    background:#fff;

    border-radius:22px;

    overflow:hidden;

    border:1px solid #edf2f7;

    box-shadow:0 20px 45px rgba(15,23,42,.08);

    transition:.35s;

    height:100%;

}

.xt-blog-card:hover{

    transform:translateY(-8px);

    box-shadow:0 35px 70px rgba(15,23,42,.14);

}

.xt-blog-image{

    overflow:hidden;

}

.xt-blog-image img{

    width:100%;

    transition:.4s;

}

.xt-blog-card:hover img{

    transform:scale(1.06);

}

.xt-blog-content{

    padding:30px;

}

.xt-blog-meta{

    display:flex;

    justify-content:space-between;

    align-items:center;

    font-size:13px;

    color:#64748b;

    margin-bottom:18px;

}

.xt-blog-meta span:last-child{

    background:#eef4ff;

    color:#2563eb;

    padding:5px 12px;

    border-radius:50px;

    font-weight:600;

}

.xt-blog-content h4{

    font-size:22px;

    font-weight:700;

    margin-bottom:15px;

    color:#111827;

}

.xt-blog-content p{

    color:#6b7280;

    line-height:1.8;

    margin-bottom:25px;

}


/*==================================================
Portfolio
==================================================*/

.xt-portfolio-card{

    border-radius:22px;

    overflow:hidden;

    position:relative;

    box-shadow:0 18px 40px rgba(15,23,42,.08);

    transition:.35s;

    background:#fff;

}

.xt-portfolio-card:hover{

    transform:translateY(-8px);

    box-shadow:0 35px 70px rgba(15,23,42,.15);

}

.xt-portfolio-image{

    position:relative;

    overflow:hidden;

}

.xt-portfolio-image img{

    width:100%;

    transition:.5s;

}

.xt-portfolio-card:hover img{

    transform:scale(1.08);

}

.xt-portfolio-overlay{

    position:absolute;

    left:0;

    right:0;

    bottom:0;

    padding:30px;

    background:linear-gradient(to top,
        rgba(15,23,42,.92),
        rgba(15,23,42,.15),
        transparent);

    color:#fff;

}

.xt-portfolio-category{

    display:inline-block;

    background:#2563eb;

    padding:6px 14px;

    border-radius:40px;

    font-size:13px;

    margin-bottom:12px;

    font-weight:600;

}

.xt-portfolio-overlay h4{

    color:#fff;

    font-size:24px;

    font-weight:700;

    margin-bottom:20px;

}

/*==================================================
Services
==================================================*/

.xt-service-card{

    background:#fff;

    border:1px solid #edf2f7;

    border-radius:24px;

    padding:45px 35px;

    text-align:center;

    height:100%;

    transition:.35s;

    box-shadow:0 18px 40px rgba(15,23,42,.08);

}

.xt-service-card:hover{

    transform:translateY(-8px);

    box-shadow:0 35px 70px rgba(15,23,42,.15);

}

.xt-service-icon{

    width:90px;

    height:90px;

    margin:0 auto 30px;

    border-radius:22px;

    background:linear-gradient(135deg,#2563eb,#3b82f6);

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    font-size:34px;

    box-shadow:0 15px 35px rgba(37,99,235,.25);

}

.xt-service-title{

    font-size:26px;

    font-weight:700;

    color:#111827;

    margin-bottom:18px;

}

.xt-service-text{

    color:#64748b;

    line-height:1.9;

    margin-bottom:30px;

}


/*==================================================
Global Buttons
==================================================*/

.xt-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:14px 30px;

    border-radius:50px;

    font-size:15px;

    font-weight:600;

    text-decoration:none !important;

    transition:.35s;

    cursor:pointer;

    border:2px solid transparent;

}

/* Primary */

.xt-btn-primary{

    background:#2563eb;

    color:#fff !important;

    border-color:#2563eb;

}

.xt-btn-primary:hover{

    background:#1d4ed8;

    border-color:#1d4ed8;

    color:#fff !important;

    transform:translateY(-3px);

}

/* Outline */

.xt-btn-outline{

    background:#fff;

    color:#2563eb !important;

    border-color:#2563eb;

}

.xt-btn-outline:hover{

    background:#2563eb;

    color:#fff !important;

    border-color:#2563eb;

    transform:translateY(-3px);

}

/* Light */

.xt-btn-light{

    background:#f8fafc;

    color:#111827 !important;

    border-color:#e5e7eb;

}

.xt-btn-light:hover{

    background:#2563eb;

    color:#fff !important;

    border-color:#2563eb;

}

/*==================================================
Services
==================================================*/

.xt-service-card{

    background:#fff;

    border-radius:24px;

    overflow:hidden;

    border:1px solid #edf2f7;

    box-shadow:0 18px 40px rgba(15,23,42,.08);

    transition:.35s;

    height:100%;

}

.xt-service-card:hover{

    transform:translateY(-8px);

    box-shadow:0 35px 70px rgba(15,23,42,.15);

}

.xt-service-image{

    overflow:hidden;

}

.xt-service-image img{

    width:100%;

    height:260px;

    object-fit:cover;

    display:block;

    transition:.4s;

}

.xt-service-card:hover .xt-service-image img{

    transform:scale(1.08);

}

.xt-service-content{

    padding:30px;

}

.xt-service-title{

    font-size:26px;

    font-weight:700;

    color:#111827;

    margin-bottom:18px;

}

.xt-service-text{

    color:#64748b;

    line-height:1.9;

    margin-bottom:25px;

}

/*==================================================
XTRILL HERO MODERN
==================================================*/

.xt-hero-modern{
    position:relative;
    overflow:hidden;
    padding:120px 0;
    background:linear-gradient(135deg,#ffffff 0%,#f7f9fc 100%);
}

.xt-hero-modern:before{
    content:"";
    position:absolute;
    width:650px;
    height:650px;
    border-radius:50%;
    background:rgba(79,70,229,.07);
    top:-260px;
    right:-220px;
    filter:blur(10px);
}

.xt-hero-modern:after{
    content:"";
    position:absolute;
    width:450px;
    height:450px;
    border-radius:50%;
    background:rgba(99,102,241,.08);
    bottom:-180px;
    left:-120px;
}

.xt-hero-modern .container{
    position:relative;
    z-index:5;
}

.xt-badge{
    display:inline-block;
    padding:10px 22px;
    border-radius:100px;
    background:#eef2ff;
    color:#4f46e5;
    font-weight:700;
    margin-bottom:25px;
    font-size:14px;
    letter-spacing:.5px;
}

.xt-heading{
    font-size:62px;
    line-height:1.08;
    font-weight:800;
    color:#111827;
    margin-bottom:30px;
}

.xt-gradient{
    background:linear-gradient(90deg,#4f46e5,#06b6d4);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.xt-text{
    font-size:19px;
    color:#6b7280;
    line-height:1.9;
    max-width:800px;
    margin-bottom:40px;
	margin: 0 auto;
}

.xt-buttons{
    display:flex;
    gap:18px;
    flex-wrap:wrap;
}

.xt-btn-primary{
    padding:18px 36px;
    border-radius:14px;
    background:#4f46e5;
    border:none;
    font-weight:700;
    box-shadow:0 20px 45px rgba(79,70,229,.30);
    transition:.35s;
}

.xt-btn-primary:hover{
    transform:translateY(-4px);
    background:#4338ca;
}

.xt-btn-outline{
    padding:18px 36px;
    border-radius:14px;
    background:#fff;
    border:1px solid #e5e7eb;
    font-weight:700;
    box-shadow:0 12px 30px rgba(0,0,0,.08);
    transition:.35s;
}

.xt-btn-outline:hover{
    transform:translateY(-4px);
}

.xt-trusted{
    margin-top:60px;
}

.xt-trusted small{
    display:block;
    color:#94a3b8;
    margin-bottom:18px;
    letter-spacing:3px;
    font-weight:700;
}

.xt-company-list{
    display:flex;
    gap:40px;
    flex-wrap:wrap;
}

.xt-company-list span{
    color:#64748b;
    font-weight:700;
}

.xt-stat-card{
    background:#fff;
    border-radius:20px;
    padding:28px;
    text-align:center;
    box-shadow:0 20px 50px rgba(15,23,42,.08);
    transition:.35s;
}

.xt-stat-card:hover{
    transform:translateY(-8px);
}

.xt-stat-card h3{
    font-size:34px;
    color:#111827;
    margin-bottom:10px;
    font-weight:800;
}

.xt-stat-card p{
    margin:0;
    color:#64748b;
}

/*==========================================
RIGHT SIDE
==========================================*/

.xt-dashboard{
    position:relative;
    padding:35px;
}

.xt-browser{
    background:#fff;
    border-radius:24px;
    overflow:hidden;
    box-shadow:0 40px 80px rgba(15,23,42,.12);
}

.xt-browser-top{
    background:#f8fafc;
    padding:16px 18px;
    border-bottom:1px solid #edf2f7;
}

.xt-browser-top span{
    width:12px;
    height:12px;
    border-radius:50%;
    display:inline-block;
    margin-right:7px;
}

.xt-browser-top span:nth-child(1){
    background:#ef4444;
}

.xt-browser-top span:nth-child(2){
    background:#f59e0b;
}

.xt-browser-top span:nth-child(3){
    background:#10b981;
}

.xt-browser img{
    display:block;
    width:100%;
}

.xt-floating-card{
    position:absolute;
    background:#fff;
    border-radius:18px;
    padding:18px 22px;
    display:flex;
    align-items:center;
    gap:16px;
    box-shadow:0 25px 60px rgba(0,0,0,.12);
    z-index:10;
}

.xt-card-1{
    top:30px;
    left:-25px;
}

.xt-card-2{
    right:-25px;
    bottom:60px;
}

.xt-icon{
    width:52px;
    height:52px;
    border-radius:14px;
    background:#eef2ff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
}

/*==========================================
RESPONSIVE
==========================================*/

@media(max-width:991px){

.xt-hero-modern{
padding:80px 0;
}

.xt-heading{
font-size:42px;
}

.xt-dashboard{
margin-top:60px;
padding:0;
}

.xt-card-1,
.xt-card-2{
position:relative;
left:auto;
right:auto;
top:auto;
bottom:auto;
margin-bottom:20px;
}

.xt-company-list{
gap:20px;
}

}

@media(max-width:575px){

.xt-heading{
font-size:34px;
}

.xt-buttons{
display:block;
}

.xt-buttons .btn{
display:block;
width:100%;
margin-bottom:15px;
}

.xt-company-list{
display:grid;
grid-template-columns:repeat(2,1fr);
}

}


/*==================================================
XTRILL HERO STARTUP 01
==================================================*/

.xt-hero-startup-01{
    position:relative;
    overflow:hidden;
    padding:120px 0;
    background:linear-gradient(135deg,#ffffff 0%,#f5f8ff 100%);
}

.xt-hero-startup-01:before{
    content:"";
    position:absolute;
    width:650px;
    height:650px;
    right:-220px;
    top:-260px;
    border-radius:50%;
    background:rgba(59,130,246,.08);
}

.xt-hero-startup-01:after{
    content:"";
    position:absolute;
    width:450px;
    height:450px;
    left:-150px;
    bottom:-180px;
    border-radius:50%;
    background:rgba(14,165,233,.06);
}

.xt-hero-startup-01 .container{
    position:relative;
    z-index:5;
}

/*----------------------------------
Label
----------------------------------*/

.xt-hero-startup-01 .xt-label{
    display:inline-block;
    padding:10px 22px;
    border-radius:50px;
    background:#dbeafe;
    color:#2563eb;
    font-weight:700;
    margin-bottom:25px;
    font-size:14px;
}

/*----------------------------------
Heading
----------------------------------*/

.xt-hero-startup-01 .xt-title{
    font-size:62px;
    font-weight:800;
    line-height:1.08;
    color:#111827;
    margin-bottom:28px;
}

/*----------------------------------
Description
----------------------------------*/

.xt-hero-startup-01 .xt-description{
    font-size:19px;
    line-height:1.9;
    color:#64748b;
    margin-bottom:40px;
    max-width:560px;
}

/*----------------------------------
Buttons
----------------------------------*/

.xt-hero-startup-01 .xt-action{
    display:flex;
    gap:18px;
    flex-wrap:wrap;
}

.xt-hero-startup-01 .btn{
    border-radius:14px;
    padding:18px 36px;
    font-weight:700;
    transition:.35s;
}

.xt-hero-startup-01 .btn-dark{
    box-shadow:0 18px 40px rgba(17,24,39,.18);
}

.xt-hero-startup-01 .btn:hover{
    transform:translateY(-4px);
}

/*----------------------------------
Statistics
----------------------------------*/

.xt-hero-startup-01 .xt-number-box{
    background:#fff;
    text-align:center;
    padding:28px;
    border-radius:18px;
    box-shadow:0 18px 45px rgba(15,23,42,.08);
    transition:.35s;
}

.xt-hero-startup-01 .xt-number-box:hover{
    transform:translateY(-8px);
}

.xt-hero-startup-01 .xt-number-box h3{
    margin:0 0 8px;
    font-size:34px;
    font-weight:800;
    color:#111827;
}

.xt-hero-startup-01 .xt-number-box span{
    color:#64748b;
}

/*----------------------------------
Right Image
----------------------------------*/

.xt-hero-startup-01 .xt-image-area{
    position:relative;
}

.xt-hero-startup-01 .xt-image-area img{
    width:100%;
    border-radius:24px;
    box-shadow:0 30px 70px rgba(15,23,42,.15);
}

/*----------------------------------
Floating Cards
----------------------------------*/

.xt-hero-startup-01 .xt-card{
    position:absolute;
    background:#fff;
    padding:18px 22px;
    border-radius:18px;
    box-shadow:0 25px 60px rgba(0,0,0,.12);
    min-width:190px;
    transition:.35s;
}

.xt-hero-startup-01 .xt-card:hover{
    transform:translateY(-6px);
}

.xt-hero-startup-01 .xt-card small{
    display:block;
    color:#64748b;
    margin-bottom:6px;
}

.xt-hero-startup-01 .xt-card h4{
    margin:0;
    font-size:26px;
    color:#111827;
    font-weight:800;
}

/* Card Positions */

.xt-hero-startup-01 .xt-card-one{
    top:30px;
    left:-40px;
}

.xt-hero-startup-01 .xt-card-two{
    right:-40px;
    top:180px;
}

.xt-hero-startup-01 .xt-card-three{
    left:60px;
    bottom:-30px;
}

/*----------------------------------
Responsive
----------------------------------*/

@media(max-width:991px){

.xt-hero-startup-01{
padding:80px 0;
}

.xt-hero-startup-01 .xt-title{
font-size:42px;
}

.xt-hero-startup-01 .xt-image-area{
margin-top:70px;
}

.xt-hero-startup-01 .xt-card{
position:relative;
left:auto;
right:auto;
top:auto;
bottom:auto;
margin-bottom:20px;
}

}

@media(max-width:576px){

.xt-hero-startup-01 .xt-title{
font-size:34px;
}

.xt-hero-startup-01 .xt-action{
display:block;
}

.xt-hero-startup-01 .xt-action .btn{
display:block;
width:100%;
margin-bottom:15px;
}

.xt-hero-startup-01 .xt-number-box{
margin-bottom:20px;
}

}


/*==========================================
1400px
==========================================*/

@media (max-width:1400px){

.xt-hero-modern-01 .xt-heading{
font-size:clamp(48px,5vw,60px);
}

}

/*==========================================
1200px
==========================================*/

@media (max-width:1200px){

.xt-hero-modern-01{

padding:100px 0;

}

.xt-hero-modern-01 .xt-heading{

font-size:52px;

}

.xt-hero-modern-01 .xt-dashboard{

padding:20px;

}

}

/*==========================================
992px
==========================================*/

@media (max-width:992px){

.xt-hero-modern-01{

text-align:center;

padding:80px 0;

}

.xt-hero-modern-01 .xt-heading{

font-size:44px;

}

.xt-hero-modern-01 .xt-text{

max-width:100%;

}

.xt-hero-modern-01 .xt-buttons{

justify-content:center;

}

.xt-hero-modern-01 .xt-company-list{

justify-content:center;

}

.xt-hero-modern-01 .xt-dashboard{

margin-top:60px;

padding:0;

}

.xt-hero-modern-01 .xt-floating-card{

position:relative;

left:auto;

right:auto;

top:auto;

bottom:auto;

margin-bottom:20px;

}

}

/*==========================================
768px
==========================================*/

@media (max-width:768px){

.xt-hero-modern-01{

padding:70px 0;

}

.xt-hero-modern-01 .xt-heading{

font-size:38px;

line-height:1.2;

}

.xt-hero-modern-01 .xt-buttons{

display:flex;

flex-direction:column;

gap:15px;

}

.xt-hero-modern-01 .xt-buttons .btn{

width:100%;

}

.xt-hero-modern-01 .xt-company-list{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:18px;

}

.xt-hero-modern-01 .xt-stat-card{

margin-bottom:20px;

}

}

/*==========================================
576px
==========================================*/

@media (max-width:576px){

.xt-hero-modern-01{

padding:60px 0;

}

.xt-hero-modern-01 .xt-heading{

font-size:34px;

}

.xt-hero-modern-01 .xt-text{

font-size:17px;

}

.xt-hero-modern-01 .xt-badge{

font-size:13px;

padding:8px 18px;

}

.xt-hero-modern-01 .xt-company-list{

grid-template-columns:1fr;

text-align:center;

}

}


/*==========================================
1400px
==========================================*/

@media (max-width:1400px){

.xt-hero-startup-01 .xt-title{

font-size:58px;

}

}

/*==========================================
1200px
==========================================*/

@media (max-width:1200px){

.xt-hero-startup-01{

padding:100px 0;

}

.xt-hero-startup-01 .xt-title{

font-size:50px;

}

}

/*==========================================
992px
==========================================*/

@media (max-width:992px){

.xt-hero-startup-01{

padding:80px 0;

text-align:center;

}

.xt-hero-startup-01 .xt-title{

font-size:42px;

}

.xt-hero-startup-01 .xt-description{

max-width:100%;

}

.xt-hero-startup-01 .xt-action{

justify-content:center;

}

.xt-hero-startup-01 .xt-image-area{

margin-top:60px;

}

.xt-hero-startup-01 .xt-card{

position:relative;

left:auto;

right:auto;

top:auto;

bottom:auto;

margin-bottom:20px;

}

}

/*==========================================
768px
==========================================*/

@media (max-width:768px){

.xt-hero-startup-01{

padding:70px 0;

}

.xt-hero-startup-01 .xt-title{

font-size:36px;

line-height:1.2;

}

.xt-hero-startup-01 .xt-action{

display:flex;

flex-direction:column;

gap:15px;

}

.xt-hero-startup-01 .xt-action .btn{

width:100%;

}

.xt-hero-startup-01 .xt-number-box{

margin-bottom:20px;

}

}

/*==========================================
576px
==========================================*/

@media (max-width:576px){

.xt-hero-startup-01{

padding:60px 0;

}

.xt-hero-startup-01 .xt-title{

font-size:32px;

}

.xt-hero-startup-01 .xt-description{

font-size:17px;

}

.xt-hero-startup-01 .xt-label{

font-size:13px;

padding:8px 18px;

}

}

/*==================================================
XTRILL HERO SAAS 01
==================================================*/

.xt-hero-saas-01{

    position:relative;
    overflow:hidden;
    padding:120px 0;
    background:linear-gradient(180deg,#ffffff 0%,#f6f9ff 100%);

}

.xt-hero-saas-01:before{

    content:"";
    position:absolute;
    width:700px;
    height:700px;
    border-radius:50%;
    background:rgba(79,70,229,.08);
    top:-300px;
    right:-220px;
    filter:blur(40px);

}

.xt-hero-saas-01:after{

    content:"";
    position:absolute;
    width:500px;
    height:500px;
    border-radius:50%;
    background:rgba(6,182,212,.06);
    bottom:-220px;
    left:-180px;

}

.xt-hero-saas-01 .container{

    position:relative;
    z-index:10;

}

/*==================================
Badge
==================================*/

.xt-hero-saas-01 .xt-badge{

    display:inline-block;
    padding:10px 22px;
    border-radius:50px;
    background:#eef2ff;
    color:#4f46e5;
    font-size:14px;
    font-weight:700;
    margin-bottom:25px;

}

/*==================================
Heading
==================================*/

.xt-hero-saas-01 .xt-heading{

    font-size:64px;
    font-weight:800;
    line-height:1.08;
    color:#111827;
    margin-bottom:30px;

}

/*==================================
Description
==================================*/

.xt-hero-saas-01 .xt-description{

    max-width:760px;
    margin:0 auto 40px;
    font-size:20px;
    color:#64748b;
    line-height:1.9;

}

/*==================================
Buttons
==================================*/

.xt-hero-saas-01 .xt-buttons{

    display:flex;
    justify-content:center;
    gap:18px;
    flex-wrap:wrap;

}

.xt-hero-saas-01 .btn{

    padding:18px 38px;
    border-radius:14px;
    font-weight:700;
    transition:.35s;

}

.xt-hero-saas-01 .btn-primary{

    box-shadow:0 18px 45px rgba(79,70,229,.25);

}

.xt-hero-saas-01 .btn:hover{

    transform:translateY(-5px);

}

/*==================================
Dashboard
==================================*/

.xt-hero-saas-01 .xt-dashboard-wrapper{

    position:relative;
    margin-top:80px;

}

.xt-hero-saas-01 .xt-dashboard-wrapper img{

    width:100%;
    display:block;
    border-radius:28px;
    box-shadow:0 40px 80px rgba(15,23,42,.12);

}

/*==================================
Floating Widgets
==================================*/

.xt-hero-saas-01 .xt-widget{

    position:absolute;
    background:#fff;
    border-radius:18px;
    padding:20px 24px;
    min-width:200px;
    box-shadow:0 25px 60px rgba(15,23,42,.12);
    transition:.35s;

}

.xt-hero-saas-01 .xt-widget:hover{

    transform:translateY(-8px);

}

.xt-hero-saas-01 .xt-widget small{

    display:block;
    color:#64748b;
    margin-bottom:6px;

}

.xt-hero-saas-01 .xt-widget h4{

    margin:0;
    font-size:28px;
    color:#111827;
    font-weight:800;

}

/* Widget Positions */

.xt-hero-saas-01 .xt-widget-users{

    top:35px;
    left:-40px;

}

.xt-hero-saas-01 .xt-widget-sales{

    top:180px;
    right:-40px;

}

.xt-hero-saas-01 .xt-widget-growth{

    bottom:-35px;
    left:90px;

}

/*==================================
Feature Cards
==================================*/

.xt-hero-saas-01 .xt-feature-card{

    background:#fff;
    padding:35px;
    border-radius:24px;
    text-align:center;
    box-shadow:0 18px 45px rgba(15,23,42,.08);
    transition:.35s;
    height:100%;

}

.xt-hero-saas-01 .xt-feature-card:hover{

    transform:translateY(-8px);

}

.xt-hero-saas-01 .xt-icon{

    width:70px;
    height:70px;
    margin:auto;
    border-radius:20px;
    background:#eef2ff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:32px;
    margin-bottom:20px;

}

.xt-hero-saas-01 .xt-feature-card h5{

    font-size:24px;
    margin-bottom:15px;
    color:#111827;
    font-weight:700;

}

.xt-hero-saas-01 .xt-feature-card p{

    margin:0;
    color:#64748b;
    line-height:1.8;

}

/*==================================
Responsive
==================================*/

@media(max-width:1200px){

.xt-hero-saas-01{

padding:100px 0;

}

.xt-hero-saas-01 .xt-heading{

font-size:54px;

}

}

/* Tablet */

@media(max-width:992px){

.xt-hero-saas-01{

padding:80px 0;
text-align:center;

}

.xt-hero-saas-01 .xt-heading{

font-size:44px;

}

.xt-hero-saas-01 .xt-description{

font-size:18px;

}

.xt-hero-saas-01 .xt-dashboard-wrapper{

margin-top:60px;

}

.xt-hero-saas-01 .xt-widget{

position:relative;
left:auto;
right:auto;
top:auto;
bottom:auto;
margin-bottom:20px;
width:100%;

}

}

/* Mobile */

@media(max-width:768px){

.xt-hero-saas-01{

padding:70px 0;

}

.xt-hero-saas-01 .xt-heading{

font-size:36px;
line-height:1.2;

}

.xt-hero-saas-01 .xt-buttons{

flex-direction:column;

}

.xt-hero-saas-01 .xt-buttons .btn{

width:100%;

}

.xt-hero-saas-01 .xt-feature-card{

padding:28px;

}

}

/* Small Mobile */

@media(max-width:576px){

.xt-hero-saas-01{

padding:60px 0;

}

.xt-hero-saas-01 .xt-heading{

font-size:30px;

}

.xt-hero-saas-01 .xt-description{

font-size:17px;

}

.xt-hero-saas-01 .xt-badge{

font-size:13px;
padding:8px 18px;

}

.xt-hero-saas-01 .xt-feature-card h5{

font-size:20px;

}

}


/*==================================================
XTRILL HERO AGENCY 01
==================================================*/

.xt-hero-agency-01{
    position:relative;
    overflow:hidden;
    padding:120px 0;
    background:linear-gradient(135deg,#ffffff 0%,#f7f9fc 100%);
}

.xt-hero-agency-01:before{
    content:"";
    position:absolute;
    width:650px;
    height:650px;
    background:rgba(37,99,235,.08);
    border-radius:50%;
    right:-220px;
    top:-220px;
    filter:blur(20px);
}

.xt-hero-agency-01:after{
    content:"";
    position:absolute;
    width:450px;
    height:450px;
    background:rgba(139,92,246,.06);
    border-radius:50%;
    left:-180px;
    bottom:-180px;
}

.xt-hero-agency-01 .container{
    position:relative;
    z-index:5;
}

/*----------------------------------
Label
----------------------------------*/

.xt-hero-agency-01 .xt-label{

    display:inline-block;
    padding:10px 22px;
    background:#dbeafe;
    color:#2563eb;
    border-radius:100px;
    font-weight:700;
    font-size:14px;
    margin-bottom:25px;

}

/*----------------------------------
Heading
----------------------------------*/

.xt-hero-agency-01 .xt-heading{

    font-size:clamp(38px,5vw,64px);
    font-weight:800;
    line-height:1.08;
    color:#111827;
    margin-bottom:25px;

}

/*----------------------------------
Description
----------------------------------*/

.xt-hero-agency-01 .xt-description{

    font-size:19px;
    line-height:1.9;
    color:#64748b;
    margin-bottom:40px;
    max-width:560px;

}

/*----------------------------------
Buttons
----------------------------------*/

.xt-hero-agency-01 .xt-buttons{

    display:flex;
    gap:18px;
    flex-wrap:wrap;

}

.xt-hero-agency-01 .btn{

    padding:18px 36px;
    border-radius:14px;
    font-weight:700;
    transition:.35s;

}

.xt-hero-agency-01 .btn-primary{

    box-shadow:0 20px 45px rgba(37,99,235,.28);

}

.xt-hero-agency-01 .btn:hover{

    transform:translateY(-5px);

}

/*----------------------------------
Clients
----------------------------------*/

.xt-hero-agency-01 .xt-clients{

    display:flex;
    align-items:center;
    gap:25px;

}

.xt-hero-agency-01 .xt-avatar-group{

    display:flex;

}

.xt-hero-agency-01 .xt-avatar-group img{

    width:52px;
    height:52px;
    border-radius:50%;
    border:4px solid #fff;
    object-fit:cover;
    margin-left:-14px;
    box-shadow:0 10px 25px rgba(0,0,0,.08);

}

.xt-hero-agency-01 .xt-avatar-group img:first-child{

    margin-left:0;

}

/*----------------------------------
Image
----------------------------------*/

.xt-hero-agency-01 .xt-image-wrapper{

    position:relative;
	overflow: visible;

}

.xt-hero-agency-01 .xt-image-wrapper img{

    width:100%;
    display:block;
    border-radius:28px;
    box-shadow:0 35px 80px rgba(15,23,42,.15);

}

/*----------------------------------
Floating Cards
----------------------------------*/

.xt-hero-agency-01 .xt-card{

    position:absolute;
    background:#fff;
    border-radius:18px;
    padding:18px 24px;
    box-shadow:0 20px 60px rgba(15,23,42,.12);
    transition:.35s;

}

.xt-hero-agency-01 .xt-card:hover{

    transform:translateY(-8px);

}

.xt-hero-agency-01 .xt-card h3,
.xt-hero-agency-01 .xt-card h4{

    margin:0;
    font-size:30px;
    font-weight:800;
    color:#111827;

}

.xt-hero-agency-01 .xt-card small{

    color:#64748b;

}

.xt-hero-agency-01 .xt-card-one{

    top:40px;
    left:-35px;

}

.xt-hero-agency-01 .xt-card-two{

    right:-35px;
    top:180px;

}

.xt-hero-agency-01 .xt-card-three{

    bottom:-30px;
    left:80px;

}

/*----------------------------------
Animations
----------------------------------*/

.xt-hero-agency-01 .xt-card{

    animation:xtAgencyFloat 4s ease-in-out infinite;

}

.xt-hero-agency-01 .xt-card-two{

    animation-delay:.6s;

}

.xt-hero-agency-01 .xt-card-three{

    animation-delay:1.2s;

}

@keyframes xtAgencyFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-10px);

}

100%{

transform:translateY(0);

}

}

/*----------------------------------
Responsive
----------------------------------*/

@media(max-width:1200px){

.xt-hero-agency-01{

padding:100px 0;

}

}

/* Tablet */

@media(max-width:992px){

.xt-hero-agency-01{

padding:80px 0;
text-align:center;

}

.xt-hero-agency-01 .xt-description{

margin-left:auto;
margin-right:auto;

}

.xt-hero-agency-01 .xt-buttons{

justify-content:center;

}

.xt-hero-agency-01 .xt-clients{

justify-content:center;
margin-top:40px;

}

.xt-hero-agency-01 .xt-image-wrapper{

margin-top:70px;

}

.xt-hero-agency-01 .xt-card{

position:relative;
left:auto;
right:auto;
top:auto;
bottom:auto;
margin-bottom:20px;
width:100%;

}

}

/* Mobile */

@media(max-width:768px){

.xt-hero-agency-01{

padding:70px 0;

}

.xt-hero-agency-01 .xt-buttons{

flex-direction:column;

}

.xt-hero-agency-01 .xt-buttons .btn{

width:100%;

}

.xt-hero-agency-01 .xt-avatar-group{

justify-content:center;

}

}

/* Small Mobile */

@media(max-width:576px){

.xt-hero-agency-01{

padding:60px 0;

}

.xt-hero-agency-01 .xt-heading{

font-size:32px;

}

.xt-hero-agency-01 .xt-description{

font-size:17px;

}

.xt-hero-agency-01 .xt-label{

font-size:13px;
padding:8px 18px;

}

.xt-hero-agency-01 .xt-avatar-group img{

width:44px;
height:44px;

}

}


/*==================================================
XTRILL HERO AI 01
==================================================*/

.xt-hero-ai-01{
    position:relative;
    overflow:hidden;
    padding:120px 0;
    background:linear-gradient(135deg,#09090f 0%,#131a2e 45%,#1b1440 100%);
}

/*==============================
Background Glow
==============================*/

.xt-hero-ai-01:before{
    content:"";
    position:absolute;
    width:650px;
    height:650px;
    background:#6d5dfc;
    opacity:.18;
    border-radius:50%;
    filter:blur(120px);
    top:-250px;
    right:-180px;
}

.xt-hero-ai-01:after{
    content:"";
    position:absolute;
    width:550px;
    height:550px;
    background:#00d4ff;
    opacity:.12;
    border-radius:50%;
    filter:blur(120px);
    bottom:-220px;
    left:-180px;
}

.xt-hero-ai-01 .container{
    position:relative;
    z-index:5;
}

/*==============================
Badge
==============================*/

.xt-hero-ai-01 .xt-ai-badge{

    display:inline-block;
    padding:10px 22px;
    background:rgba(255,255,255,.08);
    backdrop-filter:blur(15px);
    border:1px solid rgba(255,255,255,.15);
    border-radius:50px;
    color:#8fd8ff;
    font-weight:700;
    margin-bottom:30px;

}

/*==============================
Heading
==============================*/

.xt-hero-ai-01 .xt-ai-title{

    font-size:clamp(38px,5vw,68px);
    font-weight:800;
    line-height:1.08;
    color:#fff;
    margin-bottom:25px;

}

/*==============================
Description
==============================*/

.xt-hero-ai-01 .xt-ai-description{

    color:#bfc7db;
    font-size:19px;
    line-height:1.9;
    margin-bottom:40px;
    max-width:560px;

}

/*==============================
Buttons
==============================*/

.xt-hero-ai-01 .xt-ai-buttons{

    display:flex;
    gap:18px;
    flex-wrap:wrap;

}

.xt-hero-ai-01 .btn{

    border-radius:14px;
    padding:18px 36px;
    font-weight:700;
    transition:.35s;

}

.xt-hero-ai-01 .btn-primary{

    background:linear-gradient(90deg,#6d5dfc,#00c6ff);
    border:none;
    box-shadow:0 18px 40px rgba(0,198,255,.25);

}

.xt-hero-ai-01 .btn-outline-light{

    border:1px solid rgba(255,255,255,.25);

}

.xt-hero-ai-01 .btn:hover{

    transform:translateY(-5px);

}

/*==============================
Stats
==============================*/

.xt-hero-ai-01 .xt-ai-stat{

    background:rgba(255,255,255,.06);
    backdrop-filter:blur(20px);
    border:1px solid rgba(255,255,255,.08);
    border-radius:20px;
    text-align:center;
    padding:25px;

}

.xt-hero-ai-01 .xt-ai-stat h3{

    color:#fff;
    font-size:30px;
    font-weight:800;
    margin-bottom:8px;

}

.xt-hero-ai-01 .xt-ai-stat small{

    color:#9fb4d6;

}

/*==============================
Dashboard
==============================*/

.xt-hero-ai-01 .xt-ai-dashboard{

    position:relative;

}

.xt-hero-ai-01 .xt-ai-dashboard img{

    width:100%;
    display:block;
    border-radius:28px;
    box-shadow:0 35px 80px rgba(0,0,0,.45);

}

/*==============================
Floating Cards
==============================*/

.xt-hero-ai-01 .xt-ai-card{

    position:absolute;
    min-width:210px;
    background:rgba(255,255,255,.08);
    backdrop-filter:blur(25px);
    border:1px solid rgba(255,255,255,.12);
    border-radius:18px;
    padding:20px 24px;
    transition:.35s;
    animation:xtAIFloat 4s ease-in-out infinite;

}

.xt-hero-ai-01 .xt-ai-card:hover{

    transform:translateY(-8px);

}

.xt-hero-ai-01 .xt-ai-card small{

    display:block;
    color:#9fb4d6;
    margin-bottom:8px;

}

.xt-hero-ai-01 .xt-ai-card h4{

    margin:0;
    color:#fff;
    font-size:26px;
    font-weight:700;

}

.xt-hero-ai-01 .xt-ai-card-1{

    top:35px;
    left:-35px;

}

.xt-hero-ai-01 .xt-ai-card-2{

    right:-35px;
    top:200px;
    animation-delay:.6s;

}

.xt-hero-ai-01 .xt-ai-card-3{

    left:90px;
    bottom:-35px;
    animation-delay:1.2s;

}

/*==============================
Floating Animation
==============================*/

@keyframes xtAIFloat{

0%{
transform:translateY(0);
}

50%{
transform:translateY(-12px);
}

100%{
transform:translateY(0);
}

}

/*==============================
Responsive
==============================*/

@media(max-width:1200px){

.xt-hero-ai-01{

padding:100px 0;

}

}

@media(max-width:992px){

.xt-hero-ai-01{

padding:80px 0;
text-align:center;

}

.xt-hero-ai-01 .xt-ai-description{

margin:auto;
margin-bottom:40px;

}

.xt-hero-ai-01 .xt-ai-buttons{

justify-content:center;

}

.xt-hero-ai-01 .xt-ai-dashboard{

margin-top:60px;

}

.xt-hero-ai-01 .xt-ai-card{

position:relative;
left:auto;
right:auto;
top:auto;
bottom:auto;
width:100%;
margin-bottom:20px;

}

}

@media(max-width:768px){

.xt-hero-ai-01{

padding:70px 0;

}

.xt-hero-ai-01 .xt-ai-buttons{

flex-direction:column;

}

.xt-hero-ai-01 .xt-ai-buttons .btn{

width:100%;

}

.xt-hero-ai-01 .xt-ai-title{

font-size:40px;

}

}

@media(max-width:576px){

.xt-hero-ai-01{

padding:60px 0;

}

.xt-hero-ai-01 .xt-ai-title{

font-size:32px;

}

.xt-hero-ai-01 .xt-ai-description{

font-size:17px;

}

.xt-hero-ai-01 .xt-ai-badge{

font-size:13px;
padding:8px 18px;

}

}


/*==================================================
XTRILL ABOUT COMPANY 01
==================================================*/

.xt-about-company-01{

    position:relative;
    overflow:hidden;
    padding:120px 0;
    background:#ffffff;

}

/*==================================
Background Shapes
==================================*/

.xt-about-company-01:before{

    content:"";
    position:absolute;
    width:650px;
    height:650px;
    background:#eef4ff;
    border-radius:50%;
    top:-320px;
    right:-220px;

}

.xt-about-company-01:after{

    content:"";
    position:absolute;
    width:420px;
    height:420px;
    background:#f8fafc;
    border-radius:50%;
    left:-180px;
    bottom:-180px;

}

.xt-about-company-01 .container{

    position:relative;
    z-index:5;

}

/*==================================
Image
==================================*/

.xt-about-company-01 .xt-about-image-wrapper{

    position:relative;

}

.xt-about-company-01 .xt-about-image-wrapper img{

    width:100%;
    display:block;
    border-radius:28px;
    box-shadow:0 30px 70px rgba(15,23,42,.12);

}

/*==================================
Floating Card
==================================*/

.xt-about-company-01 .xt-about-card{

    position:absolute;
    right:-35px;
    bottom:40px;

    background:#fff;
    padding:28px;

    border-radius:24px;

    box-shadow:0 20px 60px rgba(15,23,42,.12);

    min-width:230px;

}

.xt-about-company-01 .xt-about-card h2{

    margin:0 0 8px;

    font-size:52px;

    font-weight:800;

    color:#2563eb;

}

.xt-about-company-01 .xt-about-card p{

    margin:0;

    color:#64748b;

    line-height:1.7;

}

/*==================================
Badge
==================================*/

.xt-about-company-01 .xt-about-badge{

    display:inline-block;

    padding:10px 22px;

    border-radius:50px;

    background:#dbeafe;

    color:#2563eb;

    font-size:14px;

    font-weight:700;

    margin-bottom:25px;

}

/*==================================
Heading
==================================*/

.xt-about-company-01 .xt-about-title{

    font-size:clamp(38px,5vw,60px);

    line-height:1.15;

    font-weight:800;

    color:#111827;

    margin-bottom:25px;

}

/*==================================
Text
==================================*/

.xt-about-company-01 .xt-about-text{

    font-size:19px;

    line-height:1.9;

    color:#64748b;

    margin-bottom:35px;

}

/*==================================
Checklist
==================================*/

.xt-about-company-01 .xt-about-list{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.xt-about-company-01 .xt-about-item{

    display:flex;

    align-items:center;

    gap:15px;

    font-weight:600;

    color:#334155;

    font-size:17px;

}

.xt-about-company-01 .xt-about-item::before{

    content:"✓";

    width:34px;

    height:34px;

    border-radius:50%;

    background:#2563eb;

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

}

/*==================================
Stats
==================================*/

.xt-about-company-01 .xt-about-stat{

    background:#fff;

    text-align:center;

    padding:25px;

    border-radius:20px;

    box-shadow:0 15px 40px rgba(15,23,42,.08);

    transition:.35s;

    height:100%;

}

.xt-about-company-01 .xt-about-stat:hover{

    transform:translateY(-8px);

}

.xt-about-company-01 .xt-about-stat h3{

    margin:0 0 8px;

    font-size:34px;

    color:#111827;

    font-weight:800;

}

.xt-about-company-01 .xt-about-stat small{

    color:#64748b;

}

/*==================================
Button
==================================*/

.xt-about-company-01 .btn{

    padding:18px 38px;

    border-radius:14px;

    font-weight:700;

    transition:.35s;

    box-shadow:0 18px 40px rgba(37,99,235,.20);

}

.xt-about-company-01 .btn:hover{

    transform:translateY(-5px);

}

/*==================================
Floating Animation
==================================*/

.xt-about-company-01 .xt-about-card{

    animation:xtAboutFloat 4s ease-in-out infinite;

}

@keyframes xtAboutFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-10px);

}

100%{

transform:translateY(0);

}

}

/*==================================
Responsive
==================================*/

@media(max-width:1200px){

.xt-about-company-01{

padding:100px 0;

}

}

@media(max-width:992px){

.xt-about-company-01{

padding:80px 0;

text-align:center;

}

.xt-about-company-01 .xt-about-text{

max-width:100%;

}

.xt-about-company-01 .xt-about-list{

margin:0 auto;

max-width:420px;

}

.xt-about-company-01 .xt-about-item{

justify-content:flex-start;

}

.xt-about-company-01 .xt-about-image-wrapper{

margin-bottom:60px;

}

.xt-about-company-01 .xt-about-card{

position:relative;

right:auto;

bottom:auto;

margin:30px auto 0;

max-width:260px;

}

}

@media(max-width:768px){

.xt-about-company-01{

padding:70px 0;

}

.xt-about-company-01 .xt-about-title{

font-size:36px;

}

.xt-about-company-01 .xt-about-text{

font-size:17px;

}

.xt-about-company-01 .btn{

width:100%;

}

.xt-about-company-01 .xt-about-stat{

margin-bottom:20px;

}

}

@media(max-width:576px){

.xt-about-company-01{

padding:60px 0;

}

.xt-about-company-01 .xt-about-title{

font-size:30px;

}

.xt-about-company-01 .xt-about-badge{

font-size:13px;

padding:8px 18px;

}

.xt-about-company-01 .xt-about-card{

padding:22px;

}

.xt-about-company-01 .xt-about-card h2{

font-size:40px;

}

.xt-about-company-01 .xt-about-item{

font-size:16px;

}

}


/*==================================================
XTRILL ABOUT SPLIT 01
==================================================*/

.xt-about-split-01{
    position:relative;
    overflow:hidden;
    padding:120px 0;
    background:#fff;
}

.xt-about-split-01:before{
    content:"";
    position:absolute;
    width:700px;
    height:700px;
    right:-250px;
    top:-250px;
    background:#eef4ff;
    border-radius:50%;
}

.xt-about-split-01:after{
    content:"";
    position:absolute;
    width:450px;
    height:450px;
    left:-180px;
    bottom:-180px;
    background:#f8fafc;
    border-radius:50%;
}

.xt-about-split-01 .container{
    position:relative;
    z-index:5;
}

/*==================================
Images
==================================*/

.xt-about-split-01 .xt-images{
    position:relative;
    padding-right:90px;
    padding-bottom:90px;
}

.xt-about-split-01 .xt-main-image{

    width:100%;
    display:block;
    border-radius:30px;
    box-shadow:0 35px 80px rgba(15,23,42,.15);

}

.xt-about-split-01 .xt-small-image{

    position:absolute;
    width:52%;
    right:0;
    bottom:0;
    border-radius:24px;
    border:8px solid #fff;
    box-shadow:0 30px 60px rgba(15,23,42,.15);

}

/*==================================
Experience Card
==================================*/

.xt-about-split-01 .xt-exp-box{

    position:absolute;
    left:-35px;
    bottom:120px;

    background:#fff;
    padding:25px 30px;
    border-radius:22px;
    box-shadow:0 20px 50px rgba(15,23,42,.12);

    animation:xtSplitFloat 4s ease-in-out infinite;

}

.xt-about-split-01 .xt-exp-box h2{

    margin:0;
    font-size:52px;
    color:#2563eb;
    font-weight:800;

}

.xt-about-split-01 .xt-exp-box p{

    margin:5px 0 0;
    color:#64748b;

}

/*==================================
Badge
==================================*/

.xt-about-split-01 .xt-badge{

    display:inline-block;
    padding:10px 22px;
    border-radius:100px;
    background:#dbeafe;
    color:#2563eb;
    font-weight:700;
    font-size:14px;
    margin-bottom:25px;

}

/*==================================
Heading
==================================*/

.xt-about-split-01 .xt-title{

    font-size:clamp(38px,5vw,60px);
    font-weight:800;
    line-height:1.15;
    color:#111827;
    margin-bottom:25px;

}

/*==================================
Text
==================================*/

.xt-about-split-01 .xt-text{

    font-size:19px;
    line-height:1.9;
    color:#64748b;
    margin-bottom:40px;

}

/*==================================
Feature Cards
==================================*/

.xt-about-split-01 .xt-feature{

    background:#fff;
    border-radius:22px;
    padding:30px;
    height:100%;
    box-shadow:0 18px 45px rgba(15,23,42,.08);
    transition:.35s;

}

.xt-about-split-01 .xt-feature:hover{

    transform:translateY(-8px);

}

.xt-about-split-01 .xt-icon{

    width:65px;
    height:65px;
    border-radius:18px;
    background:#eef4ff;
    color:#2563eb;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:28px;

    margin-bottom:20px;

}

.xt-about-split-01 .xt-feature h5{

    font-size:22px;
    color:#111827;
    margin-bottom:12px;
    font-weight:700;

}

.xt-about-split-01 .xt-feature p{

    margin:0;
    color:#64748b;
    line-height:1.8;

}

/*==================================
Button
==================================*/

.xt-about-split-01 .btn{

    padding:18px 38px;
    border-radius:14px;
    font-weight:700;
    transition:.35s;
    box-shadow:0 18px 45px rgba(37,99,235,.20);

}

.xt-about-split-01 .btn:hover{

    transform:translateY(-5px);

}

/*==================================
Animation
==================================*/

@keyframes xtSplitFloat{

0%{
transform:translateY(0);
}

50%{
transform:translateY(-10px);
}

100%{
transform:translateY(0);
}

}

/*==================================
Responsive
==================================*/

@media(max-width:1200px){

.xt-about-split-01{

padding:100px 0;

}

}

@media(max-width:992px){

.xt-about-split-01{

padding:80px 0;
text-align:center;

}

.xt-about-split-01 .xt-images{

padding-right:0;
padding-bottom:60px;
margin-bottom:50px;

}

.xt-about-split-01 .xt-small-image{

position:relative;
width:70%;
margin:-80px auto 0;
right:auto;
bottom:auto;
display:block;

}

.xt-about-split-01 .xt-exp-box{

position:relative;
left:auto;
bottom:auto;
display:inline-block;
margin-top:25px;

}

.xt-about-split-01 .xt-text{

max-width:100%;

}

}

@media(max-width:768px){

.xt-about-split-01{

padding:70px 0;

}

.xt-about-split-01 .xt-title{

font-size:36px;

}

.xt-about-split-01 .xt-feature{

margin-bottom:20px;

}

.xt-about-split-01 .btn{

width:100%;

}

}

@media(max-width:576px){

.xt-about-split-01{

padding:60px 0;

}

.xt-about-split-01 .xt-title{

font-size:30px;

}

.xt-about-split-01 .xt-text{

font-size:17px;

}

.xt-about-split-01 .xt-small-image{

width:85%;

}

.xt-about-split-01 .xt-exp-box{

padding:20px;

}

.xt-about-split-01 .xt-exp-box h2{

font-size:40px;

}

.xt-about-split-01 .xt-feature{

padding:25px;

}

}


/*==================================================
XTRILL ABOUT TIMELINE 01
==================================================*/

.xt-about-timeline-01{

position:relative;
padding:120px 0;
background:#f8fafc;
overflow:hidden;

}

.xt-about-timeline-01:before{

content:"";
position:absolute;
width:650px;
height:650px;
background:#eef4ff;
border-radius:50%;
right:-250px;
top:-280px;

}

.xt-about-timeline-01 .container{

position:relative;
z-index:5;

}

/*============================*/

.xt-about-timeline-01 .xt-badge{

display:inline-block;
padding:10px 22px;
background:#dbeafe;
color:#2563eb;
border-radius:50px;
font-weight:700;
margin-bottom:25px;

}

.xt-about-timeline-01 .xt-title{

font-size:clamp(38px,5vw,60px);
font-weight:800;
line-height:1.15;
margin-bottom:25px;
color:#111827;

}

.xt-about-timeline-01 .xt-description{

font-size:19px;
color:#64748b;
line-height:1.9;
margin-bottom:80px;

}

/*============================*/

.xt-about-timeline-01 .xt-timeline{

position:relative;
max-width:850px;
margin:auto;

}

.xt-about-timeline-01 .xt-timeline:before{

content:"";
position:absolute;
left:90px;
top:0;
bottom:0;
width:3px;
background:#2563eb;

}

.xt-about-timeline-01 .xt-item{

display:flex;
gap:40px;
position:relative;
margin-bottom:70px;

}

.xt-about-timeline-01 .xt-year{

width:90px;
height:90px;
border-radius:50%;
background:#2563eb;
color:#fff;
display:flex;
align-items:center;
justify-content:center;
font-size:24px;
font-weight:800;
flex-shrink:0;
box-shadow:0 20px 40px rgba(37,99,235,.25);

}

.xt-about-timeline-01 .xt-content{

background:#fff;
padding:35px;
border-radius:24px;
box-shadow:0 18px 45px rgba(15,23,42,.08);
flex:1;
transition:.35s;

}

.xt-about-timeline-01 .xt-content:hover{

transform:translateY(-8px);

}

.xt-about-timeline-01 .xt-content h4{

font-size:28px;
font-weight:700;
margin-bottom:15px;
color:#111827;

}

.xt-about-timeline-01 .xt-content p{

margin:0;
color:#64748b;
line-height:1.8;

}

/*============================*/

@media(max-width:992px){

.xt-about-timeline-01{

padding:80px 0;

}

.xt-about-timeline-01 .xt-timeline:before{

left:45px;

}

.xt-about-timeline-01 .xt-item{

gap:25px;

}

.xt-about-timeline-01 .xt-year{

width:70px;
height:70px;
font-size:20px;

}

}

@media(max-width:768px){

.xt-about-timeline-01{

padding:70px 0;

}

.xt-about-timeline-01 .xt-item{

flex-direction:column;
align-items:center;
text-align:center;

}

.xt-about-timeline-01 .xt-timeline:before{

display:none;

}

.xt-about-timeline-01 .xt-content{

width:100%;

}

}

@media(max-width:576px){

.xt-about-timeline-01{

padding:60px 0;

}

.xt-about-timeline-01 .xt-title{

font-size:30px;

}

.xt-about-timeline-01 .xt-description{

font-size:17px;

}

.xt-about-timeline-01 .xt-content{

padding:25px;

}

.xt-about-timeline-01 .xt-content h4{

font-size:22px;

}

}


/*==================================================
XTRILL FEATURES GRID 01
==================================================*/

.xt-features-grid-01{

position:relative;
padding:120px 0;
background:#ffffff;
overflow:hidden;

}

.xt-features-grid-01:before{

content:"";
position:absolute;
width:700px;
height:700px;
right:-250px;
top:-250px;
background:#eef4ff;
border-radius:50%;

}

.xt-features-grid-01 .container{

position:relative;
z-index:5;

}

/*======================*/

.xt-features-grid-01 .xt-badge{

display:inline-block;
padding:10px 22px;
background:#dbeafe;
color:#2563eb;
border-radius:50px;
font-weight:700;
margin-bottom:25px;

}

.xt-features-grid-01 .xt-title{

font-size:clamp(40px,5vw,60px);
font-weight:800;
line-height:1.15;
margin-bottom:25px;
color:#111827;

}

.xt-features-grid-01 .xt-description{

font-size:19px;
line-height:1.9;
color:#64748b;
max-width:760px;
margin:auto;

}

/*======================*/

.xt-features-grid-01 .xt-feature-card{

height:100%;
padding:40px;
background:#fff;
border-radius:28px;
box-shadow:0 18px 50px rgba(15,23,42,.08);
transition:.35s;

}

.xt-features-grid-01 .xt-feature-card:hover{

transform:translateY(-10px);

box-shadow:0 25px 60px rgba(15,23,42,.12);

}

.xt-features-grid-01 .xt-feature-large{

min-height:320px;

display:flex;
flex-direction:column;
justify-content:center;

}

.xt-features-grid-01 .xt-icon{

width:70px;
height:70px;
border-radius:18px;
background:#eef4ff;
display:flex;
align-items:center;
justify-content:center;
font-size:30px;
color:#2563eb;
margin-bottom:25px;

}

.xt-features-grid-01 h3{

font-size:34px;
margin-bottom:20px;
font-weight:700;
color:#111827;

}

.xt-features-grid-01 h4{

font-size:24px;
margin-bottom:15px;
font-weight:700;
color:#111827;

}

.xt-features-grid-01 p{

margin:0;
line-height:1.8;
color:#64748b;

}

/*======================*/

@media(max-width:992px){

.xt-features-grid-01{

padding:80px 0;

}

.xt-features-grid-01 .xt-feature-large{

min-height:auto;

}

}

@media(max-width:768px){

.xt-features-grid-01{

padding:70px 0;
text-align:center;

}

.xt-features-grid-01 .xt-title{

font-size:36px;

}

.xt-features-grid-01 .xt-feature-card{

padding:30px;

}

.xt-features-grid-01 .xt-icon{

margin:0 auto 20px;

}

}

@media(max-width:576px){

.xt-features-grid-01{

padding:60px 0;

}

.xt-features-grid-01 .xt-title{

font-size:30px;

}

.xt-features-grid-01 .xt-description{

font-size:17px;

}

}


/*==================================================
XTRILL FEATURES CARDS 01
==================================================*/

.xt-features-cards-01{

    position:relative;
    overflow:hidden;
    padding:120px 0;
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);

}

/*==================================
Background Shapes
==================================*/

.xt-features-cards-01:before{

    content:"";
    position:absolute;
    width:700px;
    height:700px;
    right:-250px;
    top:-250px;
    border-radius:50%;
    background:rgba(37,99,235,.05);

}

.xt-features-cards-01:after{

    content:"";
    position:absolute;
    width:500px;
    height:500px;
    left:-180px;
    bottom:-180px;
    border-radius:50%;
    background:rgba(99,102,241,.04);

}

.xt-features-cards-01 .container{

    position:relative;
    z-index:5;

}

/*==================================
Header
==================================*/

.xt-features-cards-01 .xt-badge{

    display:inline-block;
    padding:10px 22px;
    background:#dbeafe;
    color:#2563eb;
    border-radius:50px;
    font-size:14px;
    font-weight:700;
    margin-bottom:25px;

}

.xt-features-cards-01 .xt-title{

    font-size:clamp(38px,5vw,60px);
    font-weight:800;
    line-height:1.1;
    color:#111827;
    margin-bottom:25px;

}

.xt-features-cards-01 .xt-description{

    max-width:760px;
    margin:0 auto 70px;
    color:#64748b;
    font-size:19px;
    line-height:1.9;

}

/*==================================
Cards
==================================*/

.xt-features-cards-01 .xt-card{

    position:relative;
    overflow:hidden;

    background:#fff;

    border-radius:28px;

    padding:40px;

    height:100%;

    border:1px solid #edf2f7;

    box-shadow:0 18px 50px rgba(15,23,42,.06);

    transition:all .35s ease;

}

.xt-features-cards-01 .xt-card:before{

    content:"";
    position:absolute;
    width:220px;
    height:220px;
    border-radius:50%;
    background:rgba(37,99,235,.05);
    top:-120px;
    right:-120px;
    transition:.35s;

}

.xt-features-cards-01 .xt-card:hover{

    transform:translateY(-12px);

    box-shadow:0 30px 70px rgba(15,23,42,.12);

}

.xt-features-cards-01 .xt-card:hover:before{

    transform:scale(1.4);

}

/*==================================
Icon
==================================*/

.xt-features-cards-01 .xt-icon{

    width:74px;
    height:74px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:20px;

    background:linear-gradient(135deg,#2563eb,#3b82f6);

    color:#fff;

    font-size:30px;

    margin-bottom:30px;

    box-shadow:0 20px 40px rgba(37,99,235,.25);

}

/*==================================
Title
==================================*/

.xt-features-cards-01 h3{

    font-size:28px;

    color:#111827;

    font-weight:700;

    margin-bottom:18px;

}

/*==================================
Text
==================================*/

.xt-features-cards-01 p{

    color:#64748b;

    line-height:1.8;

    margin-bottom:28px;

}

/*==================================
Link
==================================*/

.xt-features-cards-01 a{

    text-decoration:none;

    color:#2563eb;

    font-weight:700;

    transition:.3s;

}

.xt-features-cards-01 a:hover{

    letter-spacing:.5px;

}

/*==================================
Card Animation
==================================*/

.xt-features-cards-01 .xt-card{

    animation:xtCardsFloat 6s ease-in-out infinite;

}

.xt-features-cards-01 .col-lg-4:nth-child(2) .xt-card{

    animation-delay:.4s;

}

.xt-features-cards-01 .col-lg-4:nth-child(3) .xt-card{

    animation-delay:.8s;

}

.xt-features-cards-01 .col-lg-4:nth-child(4) .xt-card{

    animation-delay:1.2s;

}

.xt-features-cards-01 .col-lg-4:nth-child(5) .xt-card{

    animation-delay:1.6s;

}

.xt-features-cards-01 .col-lg-4:nth-child(6) .xt-card{

    animation-delay:2s;

}

@keyframes xtCardsFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-6px);

}

100%{

transform:translateY(0);

}

}

/*==================================
Responsive
==================================*/

@media(max-width:1200px){

.xt-features-cards-01{

padding:100px 0;

}

}

@media(max-width:992px){

.xt-features-cards-01{

padding:80px 0;

text-align:center;

}

.xt-features-cards-01 .xt-icon{

margin:0 auto 25px;

}

}

@media(max-width:768px){

.xt-features-cards-01{

padding:70px 0;

}

.xt-features-cards-01 .xt-title{

font-size:36px;

}

.xt-features-cards-01 .xt-description{

font-size:18px;

margin-bottom:50px;

}

.xt-features-cards-01 .xt-card{

padding:30px;

}

}

@media(max-width:576px){

.xt-features-cards-01{

padding:60px 0;

}

.xt-features-cards-01 .xt-title{

font-size:30px;

}

.xt-features-cards-01 .xt-description{

font-size:17px;

}

.xt-features-cards-01 .xt-badge{

font-size:13px;

padding:8px 18px;

}

.xt-features-cards-01 h3{

font-size:24px;

}

.xt-features-cards-01 .xt-icon{

width:64px;
height:64px;
font-size:26px;

}

}


/*==================================================
XTRILL FEATURES TABS 01
==================================================*/

.xt-features-tabs-01{

    position:relative;
    overflow:hidden;
    padding:120px 0;
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);

}

/*==================================
Background
==================================*/

.xt-features-tabs-01:before{

    content:"";
    position:absolute;
    width:700px;
    height:700px;
    right:-260px;
    top:-260px;
    border-radius:50%;
    background:rgba(37,99,235,.05);

}

.xt-features-tabs-01:after{

    content:"";
    position:absolute;
    width:450px;
    height:450px;
    left:-180px;
    bottom:-180px;
    border-radius:50%;
    background:rgba(99,102,241,.04);

}

.xt-features-tabs-01 .container{

    position:relative;
    z-index:5;

}

/*==================================
Header
==================================*/

.xt-features-tabs-01 .xt-badge{

    display:inline-block;
    padding:10px 22px;
    border-radius:50px;
    background:#dbeafe;
    color:#2563eb;
    font-size:14px;
    font-weight:700;
    margin-bottom:25px;

}

.xt-features-tabs-01 .xt-title{

    font-size:clamp(38px,5vw,60px);
    font-weight:800;
    line-height:1.1;
    color:#111827;
    margin-bottom:25px;

}

.xt-features-tabs-01 .xt-description{

    max-width:760px;
    margin:0 auto 70px;

    color:#64748b;
    font-size:19px;
    line-height:1.9;

}

/*==================================
Tabs
==================================*/

.xt-features-tabs-01 .xt-tabs{

    display:flex;
    flex-direction:column;
    gap:20px;

}

.xt-features-tabs-01 .xt-tab{

    width:100%;

    display:flex;
    align-items:center;
    gap:20px;

    padding:25px;

    background:#fff;

    border:1px solid #edf2f7;

    border-radius:24px;

    cursor:pointer;

    transition:.35s;

    text-align:left;

}

.xt-features-tabs-01 .xt-tab:hover{

    transform:translateX(8px);

    box-shadow:0 20px 50px rgba(15,23,42,.10);

}

.xt-features-tabs-01 .xt-tab.active{

    background:linear-gradient(135deg,#2563eb,#3b82f6);

    color:#fff;

    box-shadow:0 20px 50px rgba(37,99,235,.25);

}

.xt-features-tabs-01 .xt-tab.active h5,
.xt-features-tabs-01 .xt-tab.active p{

    color:#fff;

}

/*==================================
Icons
==================================*/

.xt-features-tabs-01 .xt-tab-icon{

    width:70px;
    height:70px;

    border-radius:20px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#eef4ff;

    color:#2563eb;

    font-size:28px;

    flex-shrink:0;

    transition:.35s;

}

.xt-features-tabs-01 .xt-tab.active .xt-tab-icon{

    background:#fff;

}

/*==================================
Typography
==================================*/

.xt-features-tabs-01 h5{

    font-size:22px;

    font-weight:700;

    color:#111827;

    margin-bottom:8px;

}

.xt-features-tabs-01 .xt-tab p{

    margin:0;

    color:#64748b;

    line-height:1.7;

}

/*==================================
Dashboard
==================================*/

.xt-features-tabs-01 .xt-dashboard{

    position:relative;

}

.xt-features-tabs-01 .xt-dashboard img{

    width:100%;
    display:block;

    border-radius:28px;

    box-shadow:0 30px 70px rgba(15,23,42,.15);

}

/*==================================
Floating Card
==================================*/

.xt-features-tabs-01 .xt-floating-card{

    position:absolute;

    right:-30px;

    bottom:40px;

    background:#fff;

    padding:28px;

    border-radius:22px;

    min-width:220px;

    box-shadow:0 20px 60px rgba(15,23,42,.15);

    animation:xtTabFloat 4s ease-in-out infinite;

}

.xt-features-tabs-01 .xt-floating-card h4{

    font-size:40px;

    font-weight:800;

    color:#2563eb;

    margin-bottom:5px;

}

.xt-features-tabs-01 .xt-floating-card p{

    margin:0;

    color:#64748b;

}

/*==================================
Animation
==================================*/

@keyframes xtTabFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-10px);

}

100%{

transform:translateY(0);

}

}

/*==================================
Responsive
==================================*/

@media(max-width:1200px){

.xt-features-tabs-01{

padding:100px 0;

}

}

@media(max-width:992px){

.xt-features-tabs-01{

padding:80px 0;

text-align:center;

}

.xt-features-tabs-01 .xt-dashboard{

margin-top:60px;

}

.xt-features-tabs-01 .xt-floating-card{

position:relative;

right:auto;

bottom:auto;

margin:30px auto 0;

max-width:250px;

}

}

@media(max-width:768px){

.xt-features-tabs-01{

padding:70px 0;

}

.xt-features-tabs-01 .xt-title{

font-size:36px;

}

.xt-features-tabs-01 .xt-description{

font-size:18px;

}

.xt-features-tabs-01 .xt-tab{

padding:22px;

}

.xt-features-tabs-01 .xt-tab-icon{

width:60px;

height:60px;

font-size:24px;

}

.xt-features-tabs-01 h5{

font-size:20px;

}

}

@media(max-width:576px){

.xt-features-tabs-01{

padding:60px 0;

}

.xt-features-tabs-01 .xt-title{

font-size:30px;

}

.xt-features-tabs-01 .xt-description{

font-size:17px;

}

.xt-features-tabs-01 .xt-tab{

flex-direction:column;

text-align:center;

}

.xt-features-tabs-01 .xt-floating-card{

padding:22px;

min-width:100%;

}

}


/*==================================================
XTRILL PRICING CARDS 01
==================================================*/

.xt-pricing-cards-01{

position:relative;
padding:120px 0;
overflow:hidden;
background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);

}

.xt-pricing-cards-01:before{

content:"";
position:absolute;
width:700px;
height:700px;
right:-250px;
top:-250px;
border-radius:50%;
background:rgba(37,99,235,.05);

}

.xt-pricing-cards-01 .container{

position:relative;
z-index:5;

}

/*--------------------*/

.xt-pricing-cards-01 .xt-badge{

display:inline-block;
padding:10px 22px;
background:#dbeafe;
color:#2563eb;
border-radius:50px;
font-weight:700;
margin-bottom:25px;

}

.xt-pricing-cards-01 .xt-title{

font-size:clamp(40px,5vw,60px);
font-weight:800;
line-height:1.1;
margin-bottom:25px;
color:#111827;

}

.xt-pricing-cards-01 .xt-description{

max-width:760px;
margin:auto;
font-size:19px;
line-height:1.9;
color:#64748b;

}

/*--------------------*/

.xt-pricing-cards-01 .xt-card{

position:relative;
background:#fff;
border-radius:30px;
padding:45px;
text-align:center;
height:100%;
overflow:hidden;
border:1px solid #edf2f7;
box-shadow:0 20px 50px rgba(15,23,42,.07);
transition:.35s;

}

.xt-pricing-cards-01 .xt-card:hover{

transform:translateY(-12px);

box-shadow:0 30px 70px rgba(15,23,42,.12);

}

.xt-pricing-cards-01 .xt-card:before{

content:"";
position:absolute;
width:220px;
height:220px;
border-radius:50%;
background:rgba(37,99,235,.05);
right:-120px;
top:-120px;

}

/*--------------------*/

.xt-pricing-cards-01 .xt-active{

background:linear-gradient(135deg,#2563eb,#3b82f6);
color:#fff;
transform:scale(1.05);

}

.xt-pricing-cards-01 .xt-active h4,
.xt-pricing-cards-01 .xt-active p,
.xt-pricing-cards-01 .xt-active .xt-price,
.xt-pricing-cards-01 .xt-active small,
.xt-pricing-cards-01 .xt-active span,
.xt-pricing-cards-01 .xt-active strong{

color:#fff;

}

/*--------------------*/

.xt-pricing-cards-01 .xt-top-badge{

position:absolute;
left:50%;
top:-15px;
transform:translateX(-50%);
background:#fff;
color:#2563eb;
padding:8px 22px;
border-radius:40px;
font-size:13px;
font-weight:700;
box-shadow:0 10px 25px rgba(0,0,0,.08);
overflow: unset !important;
}

/*--------------------*/

.xt-pricing-cards-01 .xt-icon{

width:85px;
height:85px;
margin:auto;
margin-bottom:30px;
border-radius:22px;
display:flex;
align-items:center;
justify-content:center;
font-size:34px;
background:linear-gradient(135deg,#2563eb,#60a5fa);
color:#fff;
box-shadow:0 20px 40px rgba(37,99,235,.25);

}

.xt-pricing-cards-01 h4{

font-size:28px;
font-weight:700;
margin-bottom:20px;

}

/*--------------------*/

.xt-pricing-cards-01 .xt-price{

margin-bottom:25px;

}

.xt-pricing-cards-01 .xt-price span{

font-size:26px;
vertical-align:top;

}

.xt-pricing-cards-01 .xt-price strong{

font-size:72px;
line-height:1;
font-weight:800;
color:#111827;

}

.xt-pricing-cards-01 .xt-price small{

color:#64748b;

}

/*--------------------*/

.xt-pricing-cards-01 p{

margin-bottom:35px;
line-height:1.8;
color:#64748b;

}

.xt-pricing-cards-01 .btn{

padding:16px 28px;
border-radius:14px;
font-weight:700;
transition:.35s;

}

.xt-pricing-cards-01 .btn:hover{

transform:translateY(-4px);

}

/*--------------------*/

@media(max-width:992px){

.xt-pricing-cards-01{

padding:80px 0;

}

.xt-pricing-cards-01 .xt-active{

transform:none;

}

}

@media(max-width:768px){

.xt-pricing-cards-01{

padding:70px 0;

}

.xt-pricing-cards-01 .xt-title{

font-size:36px;

}

.xt-pricing-cards-01 .xt-card{

padding:35px;

}

}

@media(max-width:576px){

.xt-pricing-cards-01{

padding:60px 0;

}

.xt-pricing-cards-01 .xt-title{

font-size:30px;

}

.xt-pricing-cards-01 .xt-description{

font-size:17px;

}

.xt-pricing-cards-01 .xt-price strong{

font-size:56px;

}

}


/*==================================================
XTRILL PRICING MODERN 01
==================================================*/

.xt-pricing-modern-01{

    position:relative;
    overflow:hidden;
    padding:120px 0;
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);

}

/*==================================
Background
==================================*/

.xt-pricing-modern-01:before{

    content:"";
    position:absolute;
    width:700px;
    height:700px;
    border-radius:50%;
    background:rgba(37,99,235,.05);
    right:-250px;
    top:-250px;

}

.xt-pricing-modern-01:after{

    content:"";
    position:absolute;
    width:450px;
    height:450px;
    border-radius:50%;
    background:rgba(99,102,241,.04);
    left:-180px;
    bottom:-180px;

}

.xt-pricing-modern-01 .container{

    position:relative;
    z-index:5;

}

/*==================================
Header
==================================*/

.xt-pricing-modern-01 .xt-badge{

    display:inline-block;
    padding:10px 22px;
    background:#dbeafe;
    color:#2563eb;
    border-radius:50px;
    font-size:14px;
    font-weight:700;
    margin-bottom:25px;

}

.xt-pricing-modern-01 .xt-title{

    font-size:clamp(38px,5vw,60px);
    font-weight:800;
    line-height:1.1;
    color:#111827;
    margin-bottom:25px;

}

.xt-pricing-modern-01 .xt-description{

    max-width:760px;
    margin:0 auto 40px;
    color:#64748b;
    font-size:19px;
    line-height:1.9;

}

/*==================================
Pricing Switch
==================================*/

.xt-pricing-modern-01 .xt-switch{

    display:flex;
    justify-content:center;
    align-items:center;
    gap:15px;
    margin-top:20px;
    font-weight:600;

}

.xt-pricing-modern-01 .form-switch{

    position:relative;
    width:60px;
    height:32px;
    margin:0;

}

.xt-pricing-modern-01 .form-switch input{

    display:none;

}

.xt-pricing-modern-01 .form-switch span{

    position:absolute;
    inset:0;
    border-radius:50px;
    background:#2563eb;
    cursor:pointer;
    transition:.35s;

}

.xt-pricing-modern-01 .form-switch span:before{

    content:"";
    position:absolute;
    width:24px;
    height:24px;
    border-radius:50%;
    background:#fff;
    top:4px;
    left:4px;
    transition:.35s;

}

.xt-pricing-modern-01 .form-switch input:checked + span:before{

    transform:translateX(28px);

}

/*==================================
Cards
==================================*/

.xt-pricing-modern-01 .xt-price-card{

    position:relative;
    background:#fff;
    border-radius:28px;
    padding:45px 40px;
    height:100%;
    border:1px solid #edf2f7;
    box-shadow:0 20px 50px rgba(15,23,42,.08);
    transition:.35s;

}

.xt-pricing-modern-01 .xt-price-card:hover{

    transform:translateY(-10px);
    box-shadow:0 35px 80px rgba(15,23,42,.12);

}

/*==================================
Featured Card
==================================*/

.xt-pricing-modern-01 .xt-featured{

    transform:scale(1.05);
    border:2px solid #2563eb;
    box-shadow:0 30px 70px rgba(37,99,235,.18);

}

.xt-pricing-modern-01 .xt-featured:hover{

    transform:scale(1.05) translateY(-10px);

}

.xt-pricing-modern-01 .xt-popular{

    position:absolute;
    top:-16px;
    left:50%;
    transform:translateX(-50%);

    padding:8px 20px;

    border-radius:50px;

    background:linear-gradient(90deg,#2563eb,#3b82f6);

    color:#fff;

    font-size:13px;

    font-weight:700;

    box-shadow:0 10px 25px rgba(37,99,235,.25);

}

/*==================================
Plan
==================================*/

.xt-pricing-modern-01 h5{

    font-size:24px;
    font-weight:700;
    margin-bottom:25px;
    color:#111827;

}

.xt-pricing-modern-01 .xt-price{

    display:flex;
    align-items:flex-start;
    margin-bottom:25px;

}

.xt-pricing-modern-01 .xt-price span{

    font-size:28px;
    margin-top:12px;
    color:#2563eb;

}

.xt-pricing-modern-01 .xt-price strong{

    font-size:70px;
    line-height:1;
    color:#111827;
    font-weight:800;

}

.xt-pricing-modern-01 .xt-price small{

    margin-top:42px;
    margin-left:8px;
    color:#64748b;

}

/*==================================
Text
==================================*/

.xt-pricing-modern-01 p{

    color:#64748b;
    line-height:1.8;
    margin-bottom:30px;

}

/*==================================
Feature List
==================================*/

.xt-pricing-modern-01 .xt-list{

    list-style:none;
    padding:0;
    margin:0 0 35px;

}

.xt-pricing-modern-01 .xt-list li{

    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:16px;
    color:#475569;

}

.xt-pricing-modern-01 .xt-list i{

    width:28px;
    height:28px;
    border-radius:50%;
    background:#eef4ff;
    color:#2563eb;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:13px;

}

/*==================================
Buttons
==================================*/

.xt-pricing-modern-01 .btn{

    padding:16px 30px;
    border-radius:14px;
    font-weight:700;
    transition:.35s;

}

.xt-pricing-modern-01 .btn:hover{

    transform:translateY(-4px);

}

/*==================================
Responsive
==================================*/

@media(max-width:1200px){

.xt-pricing-modern-01{

padding:100px 0;

}

}

@media(max-width:992px){

.xt-pricing-modern-01{

padding:80px 0;
text-align:center;

}

.xt-pricing-modern-01 .xt-featured{

transform:none;

}

.xt-pricing-modern-01 .xt-featured:hover{

transform:translateY(-10px);

}

.xt-pricing-modern-01 .xt-price{

justify-content:center;

}

.xt-pricing-modern-01 .xt-list li{

justify-content:center;

}

}

@media(max-width:768px){

.xt-pricing-modern-01{

padding:70px 0;

}

.xt-pricing-modern-01 .xt-title{

font-size:36px;

}

.xt-pricing-modern-01 .xt-description{

font-size:18px;

}

.xt-pricing-modern-01 .xt-price-card{

padding:35px 30px;

}

.xt-pricing-modern-01 .xt-price strong{

font-size:56px;

}

}

@media(max-width:576px){

.xt-pricing-modern-01{

padding:60px 0;

}

.xt-pricing-modern-01 .xt-title{

font-size:30px;

}

.xt-pricing-modern-01 .xt-description{

font-size:17px;

}

.xt-pricing-modern-01 .xt-badge{

font-size:13px;
padding:8px 18px;

}

.xt-pricing-modern-01 .xt-switch{

flex-wrap:wrap;

}

.xt-pricing-modern-01 .xt-price-card{

padding:30px 25px;

}

.xt-pricing-modern-01 .xt-price strong{

font-size:48px;

}

}


/*==================================================
XTRILL CTA CENTERED 01
==================================================*/

.xt-cta-centered-01{

    position:relative;
    overflow:hidden;
    padding:120px 0;
    background:linear-gradient(135deg,#2563eb,#3b82f6);

}

/*============================*/

.xt-cta-centered-01:before{

    content:"";
    position:absolute;
    width:600px;
    height:600px;
    border-radius:50%;
    background:rgba(255,255,255,.08);
    top:-260px;
    left:-220px;

}

.xt-cta-centered-01:after{

    content:"";
    position:absolute;
    width:500px;
    height:500px;
    border-radius:50%;
    background:rgba(255,255,255,.05);
    bottom:-220px;
    right:-180px;

}

.xt-cta-centered-01 .container{

    position:relative;
    z-index:5;

}

/*============================*/

.xt-cta-centered-01 .xt-cta-box{

    background:rgba(255,255,255,.08);

    backdrop-filter:blur(18px);

    border:1px solid rgba(255,255,255,.12);

    border-radius:30px;

    padding:70px 60px;

}

/*============================*/

.xt-cta-centered-01 .xt-badge{

    display:inline-block;

    padding:10px 22px;

    background:rgba(255,255,255,.15);

    color:#fff;

    border-radius:50px;

    font-size:14px;

    font-weight:700;

    margin-bottom:25px;

}

/*============================*/

.xt-cta-centered-01 .xt-title{

    font-size:clamp(40px,5vw,64px);

    font-weight:800;

    line-height:1.1;

    color:#fff;

    margin-bottom:25px;

}

/*============================*/

.xt-cta-centered-01 .xt-description{

    max-width:680px;

    margin:0 auto 45px;

    color:rgba(255,255,255,.88);

    font-size:19px;

    line-height:1.9;

}

/*============================*/

.xt-cta-centered-01 .xt-buttons{

    display:flex;

    justify-content:center;

    gap:18px;

    flex-wrap:wrap;

}

.xt-cta-centered-01 .btn{

    padding:18px 36px;

    border-radius:14px;

    font-weight:700;

    transition:.35s;

}

.xt-cta-centered-01 .btn-primary{

    background:#fff;

    color:#2563eb;

    border:none;

}

.xt-cta-centered-01 .btn-primary:hover{

    background:#f1f5f9;

    color:#2563eb;

}

.xt-cta-centered-01 .btn-outline-light{

    border:2px solid rgba(255,255,255,.35);

    color:#fff;

}

.xt-cta-centered-01 .btn-outline-light:hover{

    background:#fff;

    color:#2563eb;

}

.xt-cta-centered-01 .btn:hover{

    transform:translateY(-5px);

}

/*============================*/

@media(max-width:1200px){

.xt-cta-centered-01{

padding:100px 0;

}

}

@media(max-width:992px){

.xt-cta-centered-01{

padding:80px 0;

}

.xt-cta-centered-01 .xt-cta-box{

padding:55px 40px;

}

}

@media(max-width:768px){

.xt-cta-centered-01{

padding:70px 0;

}

.xt-cta-centered-01 .xt-title{

font-size:36px;

}

.xt-cta-centered-01 .xt-description{

font-size:18px;

}

.xt-cta-centered-01 .xt-buttons{

flex-direction:column;

}

.xt-cta-centered-01 .btn{

width:100%;

}

}

@media(max-width:576px){

.xt-cta-centered-01{

padding:60px 0;

}

.xt-cta-centered-01 .xt-cta-box{

padding:40px 25px;

}

.xt-cta-centered-01 .xt-title{

font-size:30px;

}

.xt-cta-centered-01 .xt-description{

font-size:17px;

}

.xt-cta-centered-01 .xt-badge{

font-size:13px;

padding:8px 18px;

}

}


/*==================================================
XTRILL CTA GRADIENT 01
==================================================*/

.xt-cta-gradient-01{

position:relative;
padding:120px 0;
overflow:hidden;
background:linear-gradient(135deg,#2563eb,#4f46e5,#7c3aed);

}

.xt-cta-gradient-01:before{

content:"";
position:absolute;
width:500px;
height:500px;
border-radius:50%;
background:rgba(255,255,255,.08);
left:-180px;
top:-180px;

}

.xt-cta-gradient-01:after{

content:"";
position:absolute;
width:420px;
height:420px;
border-radius:50%;
background:rgba(255,255,255,.06);
right:-120px;
bottom:-120px;

}

.xt-cta-gradient-01 .container{

position:relative;
z-index:5;

}

/*===========================*/

.xt-cta-gradient-01 .xt-gradient-box{

background:rgba(255,255,255,.08);

backdrop-filter:blur(18px);

border:1px solid rgba(255,255,255,.15);

border-radius:32px;

padding:70px;

box-shadow:0 30px 70px rgba(0,0,0,.15);

}

/*===========================*/

.xt-cta-gradient-01 .xt-badge{

display:inline-block;

padding:10px 20px;

background:rgba(255,255,255,.15);

color:#fff;

border-radius:40px;

font-weight:700;

margin-bottom:25px;

}

/*===========================*/

.xt-cta-gradient-01 .xt-title{

font-size:clamp(42px,5vw,64px);

font-weight:800;

line-height:1.1;

color:#fff;

margin-bottom:25px;

}

.xt-cta-gradient-01 .xt-description{

font-size:19px;

line-height:1.9;

color:rgba(255,255,255,.90);

margin-bottom:35px;

max-width:620px;

}

/*===========================*/

.xt-cta-gradient-01 .xt-buttons{

display:flex;

gap:15px;

flex-wrap:wrap;

margin-bottom:35px;

}

.xt-cta-gradient-01 .btn{

padding:17px 34px;

border-radius:14px;

font-weight:700;

transition:.35s;

}

.xt-cta-gradient-01 .btn:hover{

transform:translateY(-4px);

}

.xt-cta-gradient-01 .btn-light{

color:#2563eb;

}

/*===========================*/

.xt-cta-gradient-01 .xt-trust{

display:flex;

gap:30px;

flex-wrap:wrap;

}

.xt-cta-gradient-01 .xt-item{

display:flex;

align-items:center;

gap:10px;

color:#fff;

font-weight:600;

}

.xt-cta-gradient-01 .xt-item i{

font-size:18px;

}

/*===========================*/

.xt-cta-gradient-01 .xt-gradient-card{

position:relative;

animation:xtGradientFloat 5s ease-in-out infinite;

}

.xt-cta-gradient-01 .xt-gradient-card img{

border-radius:24px;

box-shadow:0 30px 70px rgba(0,0,0,.20);

}

/*===========================*/

@keyframes xtGradientFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-12px);

}

100%{

transform:translateY(0);

}

}

/*===========================*/

@media(max-width:992px){

.xt-cta-gradient-01{

padding:80px 0;

text-align:center;

}

.xt-cta-gradient-01 .xt-gradient-box{

padding:50px 35px;

}

.xt-cta-gradient-01 .xt-buttons{

justify-content:center;

}

.xt-cta-gradient-01 .xt-trust{

justify-content:center;

margin-bottom:40px;

}

.xt-cta-gradient-01 .xt-gradient-card{

margin:auto;
max-width:420px;

}

}

@media(max-width:768px){

.xt-cta-gradient-01{

padding:70px 0;

}

.xt-cta-gradient-01 .xt-title{

font-size:36px;

}

.xt-cta-gradient-01 .xt-description{

font-size:18px;

}

.xt-cta-gradient-01 .btn{

width:100%;

}

}

@media(max-width:576px){

.xt-cta-gradient-01{

padding:60px 0;

}

.xt-cta-gradient-01 .xt-gradient-box{

padding:35px 25px;

}

.xt-cta-gradient-01 .xt-title{

font-size:30px;

}

.xt-cta-gradient-01 .xt-description{

font-size:17px;

}

.xt-cta-gradient-01 .xt-trust{

flex-direction:column;

gap:15px;

}

}

/*==================================================
XTRILL TEAM 01
==================================================*/

.xt-team-01{

    position:relative;
    overflow:hidden;
    padding:120px 0;
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);

}

/*==================================
Background
==================================*/

.xt-team-01:before{

    content:"";
    position:absolute;
    width:700px;
    height:700px;
    right:-250px;
    top:-250px;
    border-radius:50%;
    background:rgba(37,99,235,.05);

}

.xt-team-01:after{

    content:"";
    position:absolute;
    width:500px;
    height:500px;
    left:-180px;
    bottom:-180px;
    border-radius:50%;
    background:rgba(99,102,241,.04);

}

.xt-team-01 .container{

    position:relative;
    z-index:5;

}

/*==================================
Header
==================================*/

.xt-team-01 .xt-badge{

    display:inline-block;
    padding:10px 22px;
    border-radius:50px;
    background:#dbeafe;
    color:#2563eb;
    font-size:14px;
    font-weight:700;
    margin-bottom:25px;

}

.xt-team-01 .xt-title{

    font-size:clamp(38px,5vw,60px);
    font-weight:800;
    line-height:1.1;
    color:#111827;
    margin-bottom:25px;

}

.xt-team-01 .xt-description{

    max-width:760px;
    margin:auto;
    color:#64748b;
    font-size:19px;
    line-height:1.9;

}

/*==================================
Member Card
==================================*/

.xt-team-01 .xt-member{

    position:relative;

    background:#fff;

    border-radius:28px;

    padding:35px 25px;

    text-align:center;

    overflow:hidden;

    border:1px solid #edf2f7;

    box-shadow:0 20px 50px rgba(15,23,42,.07);

    transition:.35s;

    height:100%;

}

.xt-team-01 .xt-member:hover{

    transform:translateY(-12px);

    box-shadow:0 35px 70px rgba(15,23,42,.12);

}

.xt-team-01 .xt-member:before{

    content:"";

    position:absolute;

    width:220px;

    height:220px;

    border-radius:50%;

    background:rgba(37,99,235,.05);

    top:-120px;

    right:-120px;

}

/*==================================
Image
==================================*/

.xt-team-01 .xt-image{

    width:180px;
    height:180px;

    margin:0 auto 30px;

    padding:6px;

    border-radius:50%;

    background:linear-gradient(135deg,#2563eb,#60a5fa);

}

.xt-team-01 .xt-image img{

    width:100%;
    height:100%;

    object-fit:cover;

    border-radius:50%;

    border:6px solid #fff;

    display:block;

}

/*==================================
Name
==================================*/

.xt-team-01 h4{

    font-size:26px;

    font-weight:700;

    color:#111827;

    margin-bottom:10px;

}

/*==================================
Role
==================================*/

.xt-team-01 .xt-role{

    color:#2563eb;

    font-weight:600;

    margin-bottom:28px;

}

/*==================================
Social
==================================*/

.xt-team-01 .xt-social{

    display:flex;

    justify-content:center;

    gap:12px;

}

.xt-team-01 .xt-social a{

    width:44px;

    height:44px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    text-decoration:none;

    color:#2563eb;

    background:#eef4ff;

    transition:.35s;

}

.xt-team-01 .xt-social a:hover{

    background:#2563eb;

    color:#fff;

    transform:translateY(-4px);

}

/*==================================
Floating Animation
==================================*/

.xt-team-01 .xt-member{

    animation:xtTeamFloat 6s ease-in-out infinite;

}

.xt-team-01 .col-lg-3:nth-child(2) .xt-member{

    animation-delay:.5s;

}

.xt-team-01 .col-lg-3:nth-child(3) .xt-member{

    animation-delay:1s;

}

.xt-team-01 .col-lg-3:nth-child(4) .xt-member{

    animation-delay:1.5s;

}

@keyframes xtTeamFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-6px);

}

100%{

transform:translateY(0);

}

}

/*==================================
Responsive
==================================*/

@media(max-width:1200px){

.xt-team-01{

padding:100px 0;

}

}

@media(max-width:992px){

.xt-team-01{

padding:80px 0;

text-align:center;

}

}

@media(max-width:768px){

.xt-team-01{

padding:70px 0;

}

.xt-team-01 .xt-title{

font-size:36px;

}

.xt-team-01 .xt-description{

font-size:18px;

}

.xt-team-01 .xt-member{

padding:30px 20px;

}

.xt-team-01 .xt-image{

width:160px;

height:160px;

}

.xt-team-01 h4{

font-size:22px;

}

}

@media(max-width:576px){

.xt-team-01{

padding:60px 0;

}

.xt-team-01 .xt-title{

font-size:30px;

}

.xt-team-01 .xt-description{

font-size:17px;

}

.xt-team-01 .xt-image{

width:140px;

height:140px;

}

.xt-team-01 .xt-badge{

font-size:13px;

padding:8px 18px;

}

}

/*==================================================
XTRILL TESTIMONIALS 01
==================================================*/

.xt-testimonials-01{

position:relative;
padding:120px 0;
overflow:hidden;
background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);

}

.xt-testimonials-01:before{

content:"";
position:absolute;
width:700px;
height:700px;
right:-250px;
top:-250px;
border-radius:50%;
background:rgba(37,99,235,.05);

}

.xt-testimonials-01 .container{

position:relative;
z-index:2;

}

/*======================*/

.xt-testimonials-01 .xt-badge{

display:inline-block;
padding:10px 22px;
background:#dbeafe;
color:#2563eb;
border-radius:40px;
font-weight:700;
margin-bottom:25px;

}

.xt-testimonials-01 .xt-title{

font-size:clamp(38px,5vw,60px);
font-weight:800;
line-height:1.1;
color:#111827;
margin-bottom:25px;

}

.xt-testimonials-01 .xt-description{

max-width:760px;
margin:auto;
font-size:19px;
line-height:1.9;
color:#64748b;

}

/*======================*/

.xt-testimonials-01 .xt-testimonial-card{

background:#fff;
padding:40px;
border-radius:28px;
height:100%;
border:1px solid #edf2f7;
box-shadow:0 20px 50px rgba(15,23,42,.06);
transition:.35s;

}

.xt-testimonials-01 .xt-testimonial-card:hover{

transform:translateY(-10px);
box-shadow:0 30px 70px rgba(15,23,42,.12);

}

.xt-testimonials-01 .xt-featured{

background:linear-gradient(135deg,#2563eb,#3b82f6);
color:#fff;

}

.xt-testimonials-01 .xt-featured p,
.xt-testimonials-01 .xt-featured h5,
.xt-testimonials-01 .xt-featured span{

color:#fff;

}

/*======================*/

.xt-testimonials-01 .xt-stars{

margin-bottom:25px;
color:#fbbf24;
font-size:18px;

}

.xt-testimonials-01 p{

line-height:1.9;
margin-bottom:35px;
color:#64748b;

}

/*======================*/

.xt-testimonials-01 .xt-user{

display:flex;
align-items:center;
gap:15px;

}

.xt-testimonials-01 .xt-user img{

width:70px;
height:70px;
border-radius:50%;
object-fit:cover;
border:4px solid #eef4ff;

}

.xt-testimonials-01 h5{

margin:0;
font-size:20px;
font-weight:700;
color:#111827;

}

.xt-testimonials-01 .xt-user span{

font-size:14px;
color:#64748b;

}

/*======================*/

@media(max-width:992px){

.xt-testimonials-01{

padding:80px 0;

}

.xt-testimonials-01 .xt-featured{

transform:none;

}

}

@media(max-width:768px){

.xt-testimonials-01{

padding:70px 0;

text-align:center;

}

.xt-testimonials-01 .xt-title{

font-size:36px;

}

.xt-testimonials-01 .xt-description{

font-size:18px;

}

.xt-testimonials-01 .xt-user{

justify-content:center;

}

.xt-testimonials-01 .xt-testimonial-card{

padding:30px;

}

}

@media(max-width:576px){

.xt-testimonials-01{

padding:60px 0;

}

.xt-testimonials-01 .xt-title{

font-size:30px;

}

.xt-testimonials-01 .xt-description{

font-size:17px;

}

.xt-testimonials-01 .xt-testimonial-card{

padding:25px;

}

}


/*==================================================
XTRILL FAQ 01
==================================================*/

.xt-faq-01{

position:relative;
overflow:hidden;
padding:120px 0;
background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);

}

.xt-faq-01:before{

content:"";
position:absolute;
width:650px;
height:650px;
right:-250px;
top:-250px;
background:rgba(37,99,235,.05);
border-radius:50%;

}

.xt-faq-01 .container{

position:relative;
z-index:5;

}

/*========================*/

.xt-faq-01 .xt-badge{

display:inline-block;
padding:10px 22px;
background:#dbeafe;
color:#2563eb;
border-radius:50px;
font-weight:700;
margin-bottom:25px;

}

.xt-faq-01 .xt-title{

font-size:clamp(38px,5vw,58px);
font-weight:800;
line-height:1.1;
margin-bottom:25px;
color:#111827;

}

.xt-faq-01 .xt-description{

font-size:19px;
line-height:1.9;
color:#64748b;
margin-bottom:40px;

}

.xt-faq-01 .btn{

padding:17px 34px;
border-radius:14px;
font-weight:700;

}

/*========================*/

.xt-faq-01 .accordion-item{

border:none;
margin-bottom:18px;
border-radius:22px;
overflow:hidden;
background:#fff;
box-shadow:0 18px 45px rgba(15,23,42,.07);

}

.xt-faq-01 .accordion-button{

padding:26px 30px;
font-size:20px;
font-weight:700;
color:#111827;
background:#fff;
box-shadow:none;

}

.xt-faq-01 .accordion-button:not(.collapsed){

background:#2563eb;
color:#fff;

}

.xt-faq-01 .accordion-button:focus{

box-shadow:none;

}

.xt-faq-01 .accordion-body{

padding:30px;
color:#64748b;
line-height:1.9;

}

.xt-faq-01 .accordion-button::after{

filter:brightness(0);

}

.xt-faq-01 .accordion-button:not(.collapsed)::after{

filter:brightness(10);

}

/*========================*/

@media(max-width:992px){

.xt-faq-01{

padding:80px 0;
text-align:center;

}

}

@media(max-width:768px){

.xt-faq-01{

padding:70px 0;

}

.xt-faq-01 .xt-title{

font-size:36px;

}

.xt-faq-01 .xt-description{

font-size:18px;

}

.xt-faq-01 .accordion-button{

font-size:18px;
padding:22px;

}

.xt-faq-01 .accordion-body{

padding:22px;

}

}

@media(max-width:576px){

.xt-faq-01{

padding:60px 0;

}

.xt-faq-01 .xt-title{

font-size:30px;

}

.xt-faq-01 .xt-description{

font-size:17px;

}

.xt-faq-01 .btn{

width:100%;

}

}


/*==================================================
XTRILL BLOGS 01
==================================================*/

.xt-blogs-01{

position:relative;
padding:120px 0;
overflow:hidden;
background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);

}

.xt-blogs-01:before{

content:"";
position:absolute;
width:700px;
height:700px;
border-radius:50%;
right:-250px;
top:-250px;
background:rgba(37,99,235,.05);

}

.xt-blogs-01 .container{

position:relative;
z-index:2;

}

/*=======================*/

.xt-blogs-01 .xt-badge{

display:inline-block;
padding:10px 22px;
background:#dbeafe;
color:#2563eb;
border-radius:50px;
font-weight:700;
margin-bottom:25px;

}

.xt-blogs-01 .xt-title{

font-size:clamp(38px,5vw,60px);
font-weight:800;
line-height:1.1;
color:#111827;
margin-bottom:25px;

}

.xt-blogs-01 .xt-description{

max-width:760px;
margin:auto;
font-size:19px;
line-height:1.9;
color:#64748b;

}

/*=======================*/

.xt-blogs-01 .xt-blog-card{

background:#fff;
border-radius:28px;
overflow:hidden;
height:100%;
border:1px solid #edf2f7;
box-shadow:0 20px 50px rgba(15,23,42,.06);
transition:.35s;

}

.xt-blogs-01 .xt-blog-card:hover{

transform:translateY(-10px);

box-shadow:0 35px 70px rgba(15,23,42,.12);

}

.xt-blogs-01 .xt-blog-card img{

width:100%;
display:block;
transition:.4s;

}

.xt-blogs-01 .xt-blog-card:hover img{

transform:scale(1.05);

}

.xt-blogs-01 .xt-blog-content{

padding:30px;

}

/*=======================*/

.xt-blogs-01 .xt-category{

display:inline-block;
padding:7px 18px;
border-radius:30px;
background:#eef4ff;
color:#2563eb;
font-size:13px;
font-weight:700;
margin-bottom:18px;

}

.xt-blogs-01 h3{

font-size:34px;
font-weight:700;
margin-bottom:18px;
color:#111827;

}

.xt-blogs-01 h4{

font-size:24px;
font-weight:700;
margin-bottom:15px;
color:#111827;

}

.xt-blogs-01 p{

line-height:1.8;
color:#64748b;
margin-bottom:25px;

}

/*=======================*/

.xt-blogs-01 .xt-meta{

display:flex;
justify-content:space-between;
align-items:center;
font-size:15px;
color:#64748b;

}

.xt-blogs-01 .xt-meta a{

color:#2563eb;
font-weight:700;
text-decoration:none;

}

.xt-blogs-01 .xt-meta a:hover{

letter-spacing:.5px;

}

/*=======================*/

@media(max-width:992px){

.xt-blogs-01{

padding:80px 0;

}

}

@media(max-width:768px){

.xt-blogs-01{

padding:70px 0;
text-align:center;

}

.xt-blogs-01 .xt-title{

font-size:36px;

}

.xt-blogs-01 .xt-description{

font-size:18px;

}

.xt-blogs-01 h3{

font-size:28px;

}

.xt-blogs-01 h4{

font-size:22px;

}

.xt-blogs-01 .xt-meta{

flex-direction:column;
gap:12px;

}

}

@media(max-width:576px){

.xt-blogs-01{

padding:60px 0;

}

.xt-blogs-01 .xt-title{

font-size:30px;

}

.xt-blogs-01 .xt-description{

font-size:17px;

}

.xt-blogs-01 .xt-blog-content{

padding:22px;

}

}

/*==================================================
XTRILL BLOGS 02
==================================================*/

.xt-blogs-02{

position:relative;
padding:120px 0;
overflow:hidden;
background:#f8fbff;

}

.xt-blogs-02 .xt-badge{

display:inline-block;
padding:10px 22px;
background:#dbeafe;
color:#2563eb;
border-radius:40px;
font-weight:700;
margin-bottom:25px;

}

.xt-blogs-02 .xt-title{

font-size:clamp(40px,5vw,60px);
font-weight:800;
line-height:1.1;
margin-bottom:25px;
color:#111827;

}

.xt-blogs-02 .xt-description{

max-width:760px;
margin:auto;
font-size:19px;
line-height:1.9;
color:#64748b;

}

/*====================*/

.xt-blogs-02 .xt-featured-blog{

background:#fff;

border-radius:30px;

overflow:hidden;

box-shadow:0 25px 60px rgba(15,23,42,.08);

}

.xt-blogs-02 .xt-featured-blog img{

width:100%;
height:100%;
object-fit:cover;
display:block;

}

.xt-blogs-02 .xt-feature-content{

padding:60px;

}

.xt-blogs-02 .xt-feature-content h2{

font-size:42px;
font-weight:800;
margin:20px 0;

}

.xt-blogs-02 .xt-feature-content p{

line-height:1.9;
color:#64748b;
margin-bottom:30px;

}

/*====================*/

.xt-blogs-02 .xt-category{

display:inline-block;
padding:8px 18px;
background:#eef4ff;
color:#2563eb;
border-radius:30px;
font-size:13px;
font-weight:700;

}

/*====================*/

.xt-blogs-02 .xt-meta{

display:flex;
justify-content:space-between;
align-items:center;
margin-top:20px;
color:#64748b;

}

.xt-blogs-02 .xt-meta a{

text-decoration:none;
font-weight:700;
color:#2563eb;

}

/*====================*/

.xt-blogs-02 .xt-blog-card{

background:#fff;
border-radius:24px;
overflow:hidden;
box-shadow:0 18px 45px rgba(15,23,42,.06);
transition:.35s;
height:100%;

}

.xt-blogs-02 .xt-blog-card:hover{

transform:translateY(-10px);

}

.xt-blogs-02 .xt-blog-card img{

width:100%;
display:block;

}

.xt-blogs-02 .xt-content{

padding:28px;

}

.xt-blogs-02 .xt-content h4{

font-size:24px;
font-weight:700;
margin:18px 0;

}

/*====================*/

@media(max-width:992px){

.xt-blogs-02{

padding:80px 0;

}

.xt-blogs-02 .xt-feature-content{

padding:40px;

}

}

@media(max-width:768px){

.xt-blogs-02{

padding:70px 0;
text-align:center;

}

.xt-blogs-02 .xt-title{

font-size:36px;

}

.xt-blogs-02 .xt-feature-content{

padding:30px;

}

.xt-blogs-02 .xt-feature-content h2{

font-size:32px;

}

.xt-blogs-02 .xt-meta{

flex-direction:column;
gap:12px;

}

}

@media(max-width:576px){

.xt-blogs-02{

padding:60px 0;

}

.xt-blogs-02 .xt-title{

font-size:30px;

}

.xt-blogs-02 .xt-description{

font-size:17px;

}

.xt-blogs-02 .xt-content{

padding:22px;

}

}


/*==================================================
XTRILL SERVICES 01
==================================================*/

.xt-services-01{

position:relative;
padding:120px 0;
overflow:hidden;
background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);

}

.xt-services-01:before{

content:"";
position:absolute;
width:700px;
height:700px;
background:rgba(37,99,235,.05);
border-radius:50%;
right:-260px;
top:-260px;

}

.xt-services-01:after{

content:"";
position:absolute;
width:500px;
height:500px;
background:rgba(99,102,241,.04);
border-radius:50%;
left:-180px;
bottom:-180px;

}

.xt-services-01 .container{

position:relative;
z-index:2;

}

/*======================*/

.xt-services-01 .xt-badge{

display:inline-block;
padding:10px 22px;
background:#dbeafe;
color:#2563eb;
border-radius:50px;
font-weight:700;
margin-bottom:25px;

}

.xt-services-01 .xt-title{

font-size:clamp(40px,5vw,60px);
font-weight:800;
line-height:1.1;
margin-bottom:25px;
color:#111827;

}

.xt-services-01 .xt-description{

max-width:760px;
margin:auto;
font-size:19px;
line-height:1.9;
color:#64748b;

}

/*======================*/

.xt-services-01 .xt-service-card{

position:relative;
background:#fff;
padding:40px;
border-radius:28px;
height:100%;
overflow:hidden;
border:1px solid #edf2f7;
box-shadow:0 20px 50px rgba(15,23,42,.06);
transition:.35s;

}

.xt-services-01 .xt-service-card:hover{

transform:translateY(-10px);

box-shadow:0 35px 70px rgba(15,23,42,.12);

}

.xt-services-01 .xt-number{

position:absolute;
right:30px;
top:25px;

font-size:48px;

font-weight:800;

color:#eef4ff;

line-height:1;

}

/*======================*/

.xt-services-01 .xt-icon{

width:74px;
height:74px;
display:flex;
align-items:center;
justify-content:center;
border-radius:20px;
background:linear-gradient(135deg,#2563eb,#3b82f6);
color:#fff;
font-size:30px;
margin-bottom:30px;
box-shadow:0 18px 35px rgba(37,99,235,.25);

}

.xt-services-01 h3{

font-size:28px;
font-weight:700;
margin-bottom:18px;
color:#111827;

}

.xt-services-01 p{

line-height:1.8;
color:#64748b;
margin-bottom:28px;

}

.xt-services-01 a{

text-decoration:none;
color:#2563eb;
font-weight:700;
transition:.3s;

}

.xt-services-01 a:hover{

letter-spacing:.5px;

}

/*======================*/

.xt-services-01 .btn{

padding:17px 34px;
border-radius:14px;
font-weight:700;

}

/*======================*/

@media(max-width:1200px){

.xt-services-01{

padding:100px 0;

}

}

@media(max-width:992px){

.xt-services-01{

padding:80px 0;
text-align:center;

}

.xt-services-01 .xt-icon{

margin:0 auto 25px;

}

}

@media(max-width:768px){

.xt-services-01{

padding:70px 0;

}

.xt-services-01 .xt-title{

font-size:36px;

}

.xt-services-01 .xt-description{

font-size:18px;

}

.xt-services-01 .xt-service-card{

padding:32px;

}

.xt-services-01 h3{

font-size:24px;

}

}

@media(max-width:576px){

.xt-services-01{

padding:60px 0;

}

.xt-services-01 .xt-title{

font-size:30px;

}

.xt-services-01 .xt-description{

font-size:17px;

}

.xt-services-01 .xt-service-card{

padding:28px 24px;

}

.xt-services-01 .xt-number{

font-size:38px;

}

.xt-services-01 .xt-icon{

width:64px;
height:64px;
font-size:26px;

}

.xt-services-01 .btn{

width:100%;

}

}

/*==================================================
XTRILL SERVICES 02
==================================================*/

.xt-services-02{

padding:120px 0;
background:#fff;
overflow:hidden;

}

.xt-services-02 .xt-badge{

display:inline-block;
padding:10px 22px;
border-radius:40px;
background:#eef4ff;
color:#2563eb;
font-weight:700;
margin-bottom:25px;

}

.xt-services-02 .xt-title{

font-size:clamp(42px,5vw,60px);
font-weight:800;
margin-bottom:25px;
color:#111827;

}

.xt-services-02 .xt-description{

max-width:760px;
margin:auto;
font-size:19px;
line-height:1.9;
color:#64748b;

}

/*========================*/

.xt-services-02 img{

border-radius:28px;
box-shadow:0 25px 60px rgba(15,23,42,.08);
transition:.4s;

}

.xt-services-02 img:hover{

transform:scale(1.03);

}

/*========================*/

.xt-services-02 .xt-service-box{

padding:20px 40px;

}

.xt-services-02 .xt-number{

font-size:72px;
font-weight:800;
color:#dbeafe;
line-height:1;
margin-bottom:15px;

}

.xt-services-02 h3{

font-size:36px;
font-weight:700;
margin-bottom:20px;
color:#111827;

}

.xt-services-02 p{

font-size:18px;
line-height:1.9;
color:#64748b;
margin-bottom:30px;

}

.xt-services-02 a{

font-weight:700;
color:#2563eb;
text-decoration:none;

}

.xt-services-02 a:hover{

letter-spacing:.5px;

}

/*========================*/

@media(max-width:992px){

.xt-services-02{

padding:80px 0;
text-align:center;

}

.xt-services-02 .xt-service-box{

padding:0;

}

}

@media(max-width:768px){

.xt-services-02{

padding:70px 0;

}

.xt-services-02 .xt-title{

font-size:36px;

}

.xt-services-02 h3{

font-size:28px;

}

.xt-services-02 .xt-number{

font-size:56px;

}

}

@media(max-width:576px){

.xt-services-02{

padding:60px 0;

}

.xt-services-02 .xt-title{

font-size:30px;

}

.xt-services-02 .xt-description{

font-size:17px;

}

.xt-services-02 h3{

font-size:24px;

}

.xt-services-02 p{

font-size:16px;

}

}


/*==================================================
XTRILL LOGO CLOUD 01
==================================================*/

.xt-logo-cloud-01{

position:relative;
padding:100px 0;
overflow:hidden;
background:#fff;

}

.xt-logo-cloud-01:before{

content:"";
position:absolute;
width:650px;
height:650px;
right:-250px;
top:-250px;
background:rgba(37,99,235,.05);
border-radius:50%;

}

.xt-logo-cloud-01 .container{

position:relative;
z-index:2;

}

/*====================*/

.xt-logo-cloud-01 .xt-badge{

display:inline-block;
padding:10px 22px;
background:#dbeafe;
color:#2563eb;
border-radius:40px;
font-weight:700;
margin-bottom:25px;

}

.xt-logo-cloud-01 .xt-title{

font-size:clamp(38px,5vw,58px);
font-weight:800;
line-height:1.1;
color:#111827;
margin-bottom:25px;

}

.xt-logo-cloud-01 .xt-description{

max-width:720px;
margin:auto;
font-size:19px;
line-height:1.9;
color:#64748b;

}

/*====================*/

.xt-logo-cloud-01 .xt-logo-card{

height:120px;

background:#fff;

border:1px solid #eef2f7;

border-radius:24px;

display:flex;

align-items:center;

justify-content:center;

transition:.35s;

box-shadow:0 15px 40px rgba(15,23,42,.05);

}

.xt-logo-cloud-01 .xt-logo-card:hover{

transform:translateY(-8px);

box-shadow:0 25px 60px rgba(15,23,42,.10);

}

.xt-logo-cloud-01 .xt-logo-card img{

max-width:120px;

max-height:45px;

opacity:.75;

transition:.35s;

}

.xt-logo-cloud-01 .xt-logo-card:hover img{

opacity:1;

transform:scale(1.05);

}

/*====================*/

@media(max-width:992px){

.xt-logo-cloud-01{

padding:80px 0;

}

}

@media(max-width:768px){

.xt-logo-cloud-01{

padding:70px 0;

text-align:center;

}

.xt-logo-cloud-01 .xt-title{

font-size:36px;

}

.xt-logo-cloud-01 .xt-description{

font-size:18px;

}

.xt-logo-cloud-01 .xt-logo-card{

height:100px;

}

}

@media(max-width:576px){

.xt-logo-cloud-01{

padding:60px 0;

}

.xt-logo-cloud-01 .xt-title{

font-size:30px;

}

.xt-logo-cloud-01 .xt-description{

font-size:17px;

}

.xt-logo-cloud-01 .xt-logo-card{

height:90px;

border-radius:18px;

}

.xt-logo-cloud-01 .xt-logo-card img{

max-width:95px;

}

}

/*==================================================
XTRILL COMPANY STATISTICS 01
==================================================*/

.xt-company-stats-01{

    position:relative;
    overflow:hidden;
    padding:120px 0;
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);

}

.xt-company-stats-01:before{

    content:"";
    position:absolute;
    width:700px;
    height:700px;
    right:-260px;
    top:-260px;
    border-radius:50%;
    background:rgba(37,99,235,.05);

}

.xt-company-stats-01 .container{

    position:relative;
    z-index:2;

}

/*=======================*/

.xt-company-stats-01 .xt-badge{

    display:inline-block;
    padding:10px 22px;
    border-radius:50px;
    background:#dbeafe;
    color:#2563eb;
    font-weight:700;
    margin-bottom:25px;

}

.xt-company-stats-01 .xt-title{

    font-size:clamp(40px,5vw,60px);
    font-weight:800;
    line-height:1.1;
    margin-bottom:25px;
    color:#111827;

}

.xt-company-stats-01 .xt-description{

    max-width:760px;
    margin:auto;
    font-size:19px;
    line-height:1.9;
    color:#64748b;

}

/*=======================*/

.xt-company-stats-01 .xt-stat-card{

    background:#fff;
    border-radius:28px;
    padding:40px 30px;
    text-align:center;
    height:100%;
    border:1px solid #edf2f7;
    box-shadow:0 20px 50px rgba(15,23,42,.06);
    transition:.35s;

}

.xt-company-stats-01 .xt-stat-card:hover{

    transform:translateY(-10px);
    box-shadow:0 35px 70px rgba(15,23,42,.12);

}

.xt-company-stats-01 .xt-icon{

    width:74px;
    height:74px;
    margin:0 auto 25px;
    border-radius:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(135deg,#2563eb,#3b82f6);
    color:#fff;
    font-size:30px;
    box-shadow:0 18px 35px rgba(37,99,235,.25);

}

.xt-company-stats-01 h2{

    font-size:56px;
    font-weight:800;
    color:#2563eb;
    margin-bottom:10px;

}

.xt-company-stats-01 h5{

    font-size:22px;
    font-weight:700;
    margin-bottom:15px;
    color:#111827;

}

.xt-company-stats-01 p{

    margin:0;
    color:#64748b;
    line-height:1.8;

}

/*=======================*/

@media(max-width:992px){

.xt-company-stats-01{

padding:80px 0;
text-align:center;

}

}

@media(max-width:768px){

.xt-company-stats-01{

padding:70px 0;

}

.xt-company-stats-01 .xt-title{

font-size:36px;

}

.xt-company-stats-01 h2{

font-size:46px;

}

}

@media(max-width:576px){

.xt-company-stats-01{

padding:60px 0;

}

.xt-company-stats-01 .xt-title{

font-size:30px;

}

.xt-company-stats-01 .xt-description{

font-size:17px;

}

.xt-company-stats-01 .xt-stat-card{

padding:30px 22px;

}

.xt-company-stats-01 h2{

font-size:40px;

}

.xt-company-stats-01 h5{

font-size:20px;

}

}

/*==================================================
XTRILL GALLERY 01
==================================================*/

.xt-gallery-01{

position:relative;
padding:120px 0;
background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
overflow:hidden;

}

.xt-gallery-01:before{

content:"";
position:absolute;
width:700px;
height:700px;
right:-250px;
top:-250px;
background:rgba(37,99,235,.05);
border-radius:50%;

}

.xt-gallery-01 .container{

position:relative;
z-index:2;

}

/*==========================*/

.xt-gallery-01 .xt-badge{

display:inline-block;
padding:10px 22px;
background:#dbeafe;
color:#2563eb;
border-radius:40px;
font-weight:700;
margin-bottom:25px;

}

.xt-gallery-01 .xt-title{

font-size:clamp(40px,5vw,60px);
font-weight:800;
line-height:1.1;
margin-bottom:25px;
color:#111827;

}

.xt-gallery-01 .xt-description{

max-width:760px;
margin:auto;
font-size:19px;
line-height:1.9;
color:#64748b;

}

/*==========================*/

.xt-gallery-01 .xt-gallery-item{

position:relative;
overflow:hidden;
border-radius:28px;
box-shadow:0 20px 50px rgba(15,23,42,.08);

}

.xt-gallery-01 .xt-gallery-item img{

width:100%;
display:block;
transition:.5s;

}

.xt-gallery-01 .xt-gallery-item:hover img{

transform:scale(1.08);

}

/*==========================*/

.xt-gallery-01 .xt-overlay{

position:absolute;
left:0;
right:0;
bottom:0;

padding:30px;

background:linear-gradient(transparent,rgba(0,0,0,.82));

color:#fff;

opacity:0;

transition:.35s;

}

.xt-gallery-01 .xt-gallery-item:hover .xt-overlay{

opacity:1;

}

.xt-gallery-01 .xt-overlay h3{

font-size:34px;
font-weight:700;
margin-bottom:10px;

}

.xt-gallery-01 .xt-overlay h4{

font-size:24px;
font-weight:700;

}

.xt-gallery-01 .xt-overlay p{

margin:0;
opacity:.85;

}

/*==========================*/

@media(max-width:992px){

.xt-gallery-01{

padding:80px 0;

}

}

@media(max-width:768px){

.xt-gallery-01{

padding:70px 0;
text-align:center;

}

.xt-gallery-01 .xt-title{

font-size:36px;

}

.xt-gallery-01 .xt-description{

font-size:18px;

}

.xt-gallery-01 .xt-overlay{

padding:22px;

}

.xt-gallery-01 .xt-overlay h3{

font-size:28px;

}

.xt-gallery-01 .xt-overlay h4{

font-size:22px;

}

}

@media(max-width:576px){

.xt-gallery-01{

padding:60px 0;

}

.xt-gallery-01 .xt-title{

font-size:30px;

}

.xt-gallery-01 .xt-description{

font-size:17px;

}

.xt-gallery-01 .xt-gallery-item{

border-radius:20px;

}

.xt-gallery-01 .xt-overlay{

padding:18px;

}

}

/*==================================================
XTRILL PORTFOLIO 01
==================================================*/

.xt-portfolio-01{

position:relative;
padding:120px 0;
overflow:hidden;
background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);

}

.xt-portfolio-01:before{

content:"";
position:absolute;
width:650px;
height:650px;
right:-220px;
top:-220px;
background:rgba(37,99,235,.05);
border-radius:50%;

}

.xt-portfolio-01 .container{

position:relative;
z-index:2;

}

/*====================*/

.xt-portfolio-01 .xt-badge{

display:inline-block;
padding:10px 22px;
background:#dbeafe;
color:#2563eb;
border-radius:40px;
font-weight:700;
margin-bottom:25px;

}

.xt-portfolio-01 .xt-title{

font-size:clamp(40px,5vw,60px);
font-weight:800;
line-height:1.1;
margin-bottom:25px;
color:#111827;

}

.xt-portfolio-01 .xt-description{

max-width:760px;
margin:auto;
font-size:19px;
line-height:1.9;
color:#64748b;

}

/*====================*/

.xt-portfolio-01 .xt-project-card{

background:#fff;
border-radius:28px;
overflow:hidden;
height:100%;
box-shadow:0 20px 50px rgba(15,23,42,.06);
transition:.35s;

}

.xt-portfolio-01 .xt-project-card:hover{

transform:translateY(-10px);

box-shadow:0 35px 70px rgba(15,23,42,.12);

}

.xt-portfolio-01 .xt-image{

position:relative;
overflow:hidden;

}

.xt-portfolio-01 .xt-image img{

width:100%;
display:block;
transition:.5s;

}

.xt-portfolio-01 .xt-project-card:hover img{

transform:scale(1.08);

}

/*====================*/

.xt-portfolio-01 .xt-overlay{

position:absolute;
inset:0;

display:flex;
align-items:center;
justify-content:center;

background:rgba(37,99,235,.65);

opacity:0;

transition:.35s;

}

.xt-portfolio-01 .xt-project-card:hover .xt-overlay{

opacity:1;

}

.xt-portfolio-01 .xt-view{

width:70px;
height:70px;

border-radius:50%;

background:#fff;

display:flex;
align-items:center;
justify-content:center;

font-size:26px;

text-decoration:none;

color:#2563eb;

transition:.35s;

}

.xt-portfolio-01 .xt-view:hover{

transform:rotate(45deg);

}

/*====================*/

.xt-portfolio-01 .xt-content{

padding:30px;

}

.xt-portfolio-01 .xt-category{

display:inline-block;

padding:8px 18px;

border-radius:30px;

background:#eef4ff;

color:#2563eb;

font-size:13px;

font-weight:700;

margin-bottom:18px;

}

.xt-portfolio-01 h3{

font-size:28px;

font-weight:700;

margin-bottom:18px;

color:#111827;

}

.xt-portfolio-01 p{

line-height:1.8;

color:#64748b;

margin:0;

}

/*====================*/

@media(max-width:992px){

.xt-portfolio-01{

padding:80px 0;

}

}

@media(max-width:768px){

.xt-portfolio-01{

padding:70px 0;
text-align:center;

}

.xt-portfolio-01 .xt-title{

font-size:36px;

}

.xt-portfolio-01 .xt-description{

font-size:18px;

}

.xt-portfolio-01 h3{

font-size:24px;

}

}

@media(max-width:576px){

.xt-portfolio-01{

padding:60px 0;

}

.xt-portfolio-01 .xt-title{

font-size:30px;

}

.xt-portfolio-01 .xt-description{

font-size:17px;

}

.xt-portfolio-01 .xt-content{

padding:24px;

}

}

/*==================================================
XTRILL PORTFOLIO 02
==================================================*/

.xt-portfolio-02{

position:relative;
padding:120px 0;
overflow:hidden;
background:#f8fbff;

}

.xt-portfolio-02 .xt-badge{

display:inline-block;
padding:10px 22px;
background:#dbeafe;
color:#2563eb;
border-radius:40px;
font-weight:700;
margin-bottom:25px;

}

.xt-portfolio-02 .xt-title{

font-size:clamp(40px,5vw,60px);
font-weight:800;
line-height:1.1;
margin-bottom:25px;

}

.xt-portfolio-02 .xt-description{

max-width:760px;
margin:auto;
font-size:19px;
line-height:1.9;
color:#64748b;

}

/*====================*/

.xt-portfolio-02 .xt-bento{

position:relative;
overflow:hidden;
border-radius:28px;
box-shadow:0 20px 50px rgba(15,23,42,.08);
cursor:pointer;

}

.xt-portfolio-02 .large{

height:720px;

}

.xt-portfolio-02 .small{

height:348px;

}

.xt-portfolio-02 img{

width:100%;
height:100%;
object-fit:cover;
display:block;
transition:.5s;

}

.xt-portfolio-02 .xt-bento:hover img{

transform:scale(1.08);

}

/*====================*/

.xt-portfolio-02 .xt-content{

position:absolute;
left:0;
right:0;
bottom:0;

padding:35px;

background:linear-gradient(transparent,rgba(0,0,0,.88));

color:#fff;

}

.xt-portfolio-02 .xt-tag{

display:inline-block;
padding:8px 18px;
background:#2563eb;
border-radius:30px;
font-size:13px;
font-weight:700;
margin-bottom:20px;

}

.xt-portfolio-02 h3{

font-size:38px;
font-weight:700;
margin-bottom:15px;

}

.xt-portfolio-02 h4{

font-size:26px;
font-weight:700;

}

.xt-portfolio-02 p{

margin:0;
opacity:.9;
line-height:1.8;

}

/*====================*/

@media(max-width:992px){

.xt-portfolio-02{

padding:80px 0;

}

.xt-portfolio-02 .large{

height:520px;

}

.xt-portfolio-02 .small{

height:320px;

}

}

@media(max-width:768px){

.xt-portfolio-02{

padding:70px 0;
text-align:center;

}

.xt-portfolio-02 .xt-title{

font-size:36px;

}

.xt-portfolio-02 .xt-description{

font-size:18px;

}

.xt-portfolio-02 .large{

height:420px;

}

.xt-portfolio-02 .small{

height:260px;

}

.xt-portfolio-02 h3{

font-size:28px;

}

.xt-portfolio-02 h4{

font-size:22px;

}

.xt-portfolio-02 .xt-content{

padding:25px;

}

}

@media(max-width:576px){

.xt-portfolio-02{

padding:60px 0;

}

.xt-portfolio-02 .xt-title{

font-size:30px;

}

.xt-portfolio-02 .xt-description{

font-size:17px;

}

.xt-portfolio-02 .large,
.xt-portfolio-02 .small{

height:250px;

}

}

/*==================================================
XTRILL HEADER 01
==================================================*/

.xt-header-01{

position:relative;

background:#fff;

box-shadow:0 5px 30px rgba(15,23,42,.05);

z-index:999;

}

.xt-header-01 .navbar{

padding:18px 0;

}

.xt-header-01 .navbar-brand img{

height:42px;
width:auto;

}

.xt-header-01 .navbar-nav{

gap:12px;

}

.xt-header-01 .nav-link{

font-weight:600;

font-size:16px;

color:#334155;

padding:12px 18px !important;

border-radius:12px;

transition:.3s;

}

.xt-header-01 .nav-link:hover{

background:#eef4ff;

color:#2563eb;

}

.xt-header-01 .nav-link.active{

background:#2563eb;

color:#fff;

}

.xt-header-01 .btn{

padding:14px 28px;

border-radius:14px;

font-weight:700;

}

.xt-header-01 .navbar-toggler{

border:none;

box-shadow:none;

}

.xt-header-01 .navbar-toggler:focus{

box-shadow:none;

}

@media(max-width:991px){

.xt-header-01 .navbar-collapse{

padding-top:20px;

}

.xt-header-01 .navbar-nav{

gap:5px;

}

.xt-header-01 .btn{

width:100%;

margin-top:20px;

}

}

/*==================================================
XTRILL HEADER 02
==================================================*/

.xt-header-02{

position:relative;

background:transparent;

z-index:999;

}

/*==========================*/

.xt-header-02 .xt-topbar{

background:#2563eb;

color:#fff;

padding:10px 0;

font-size:14px;

font-weight:600;

}

/*==========================*/

.xt-header-02 .navbar{

padding:22px 0;

background:rgba(255,255,255,.82);

backdrop-filter:blur(16px);

-webkit-backdrop-filter:blur(16px);

border-bottom:1px solid rgba(255,255,255,.25);

}

/*==========================*/

.xt-header-02 .navbar-brand img{

height:42px;
width:auto;

}

/*==========================*/

.xt-header-02 .navbar-nav{

gap:10px;

}

.xt-header-02 .nav-link{

font-size:16px;

font-weight:600;

color:#334155;

padding:12px 18px !important;

border-radius:12px;

transition:.3s;

}

.xt-header-02 .nav-link:hover{

background:#eef4ff;

color:#2563eb;

}

.xt-header-02 .nav-link.active{

color:#2563eb;

}

/*==========================*/

.xt-header-02 .xt-login{

text-decoration:none;

font-weight:600;

color:#475569;

padding:12px 18px;

transition:.3s;

}

.xt-header-02 .xt-login:hover{

color:#2563eb;

}

/*==========================*/

.xt-header-02 .btn{

padding:14px 30px;

border-radius:14px;

font-weight:700;

}

/*==========================*/

.xt-header-02 .navbar-toggler{

border:none;

box-shadow:none;

}

.xt-header-02 .navbar-toggler:focus{

box-shadow:none;

}

/*==========================*/

@media(max-width:991px){

.xt-header-02 .navbar{

padding:18px 0;

}

.xt-header-02 .navbar-collapse{

padding-top:20px;

}

.xt-header-02 .navbar-nav{

gap:5px;

margin-bottom:20px;

}

.xt-header-02 .d-flex{

flex-direction:column;

align-items:stretch!important;

}

.xt-header-02 .btn{

width:100%;

}

.xt-header-02 .xt-login{

text-align:center;

display:block;

}

}

@media(max-width:576px){

.xt-header-02 .xt-topbar{

font-size:13px;

padding:8px 15px;

}

.xt-header-02 .navbar-brand img{

height:36px;

}

}


/*==================================================
XTRILL HEADER 03
==================================================*/

.xt-header-03{

background:#fff;
padding:18px 0;
box-shadow:0 5px 30px rgba(15,23,42,.05);
position:relative;
z-index:999;

}

.xt-header-03 .xt-logo img{

height:46px;
width:auto;

}

/*========================*/

.xt-header-03 .xt-nav{

display:flex;
align-items:center;
gap:35px;
margin:0;
padding:0;
list-style:none;

}

.xt-header-03 .left-nav{

justify-content:flex-end;

}

.xt-header-03 .right-nav{

justify-content:flex-start;

}

/*========================*/

.xt-header-03 .xt-nav a{

text-decoration:none;
font-weight:600;
color:#334155;
transition:.3s;
padding:10px 0;

}

.xt-header-03 .xt-nav a:hover{

color:#2563eb;

}

/*========================*/

.xt-header-03 .xt-right{

display:flex;
align-items:center;
justify-content:flex-end;
gap:25px;

}

/*========================*/

.xt-header-03 .btn{

padding:14px 30px;
border-radius:14px;
font-weight:700;

}

/*========================*/

.xt-header-03 .navbar-toggler{

border:none;
box-shadow:none;

}

.xt-header-03 .navbar-toggler:focus{

box-shadow:none;

}

/*========================*/

.xt-header-03 .xt-mobile-nav{

list-style:none;
padding:20px 0;
margin:0;

}

.xt-header-03 .xt-mobile-nav li{

border-bottom:1px solid #eef2f7;

}

.xt-header-03 .xt-mobile-nav a{

display:block;
padding:16px 0;
text-decoration:none;
color:#334155;
font-weight:600;

}

/*========================*/

@media(max-width:991px){

.xt-header-03{

padding:15px 0;

}

.xt-header-03 .xt-logo img{

height:40px;

}

.xt-header-03 .btn{

display:none;

}

}

@media(max-width:576px){

.xt-header-03 .xt-logo img{

height:34px;

}

}


/*==================================================
XTRILL HEADER 04
==================================================*/

.xt-header-04{

background:#fff;
position:relative;
z-index:999;
box-shadow:0 5px 25px rgba(15,23,42,.05);

}

/*======================
Top Bar
======================*/

.xt-header-04 .xt-topbar{

background:#0f172a;
padding:10px 0;
color:#fff;
font-size:14px;

}

.xt-header-04 .xt-contact{

display:flex;
gap:25px;
align-items:center;

}

.xt-header-04 .xt-contact span{

display:flex;
align-items:center;
gap:8px;

}

.xt-header-04 .xt-social{

display:flex;
justify-content:flex-end;
gap:15px;

}

.xt-header-04 .xt-social a{

width:34px;
height:34px;
border-radius:50%;
background:rgba(255,255,255,.08);
display:flex;
align-items:center;
justify-content:center;
color:#fff;
text-decoration:none;
transition:.3s;

}

.xt-header-04 .xt-social a:hover{

background:#2563eb;

}

/*======================
Navbar
======================*/

.xt-header-04 .navbar{

padding:18px 0;

}

.xt-header-04 .navbar-brand img{

height:44px;

}

.xt-header-04 .navbar-nav{

gap:10px;

}

.xt-header-04 .nav-link{

font-weight:600;
color:#334155;
padding:12px 18px!important;
border-radius:10px;
transition:.3s;

}

.xt-header-04 .nav-link:hover{

background:#eef4ff;
color:#2563eb;

}

.xt-header-04 .nav-link.active{

color:#2563eb;

}

.xt-header-04 .btn{

padding:14px 28px;
border-radius:14px;
font-weight:700;

}

/*======================
Mobile
======================*/

.xt-header-04 .navbar-toggler{

border:none;
box-shadow:none;

}

.xt-header-04 .navbar-toggler:focus{

box-shadow:none;

}

/*======================
Responsive
======================*/

@media(max-width:991px){

.xt-header-04 .xt-topbar{

display:none;

}

.xt-header-04 .navbar-collapse{

padding-top:20px;

}

.xt-header-04 .navbar-nav{

margin-bottom:20px;

}

.xt-header-04 .btn{

width:100%;

}

}

@media(max-width:576px){

.xt-header-04 .navbar-brand img{

height:38px;

}

.xt-header-04 .navbar{

padding:14px 0;

}

}


/*==================================================
XTRILL HEADER 05
==================================================*/

.xt-header-05{

background:#0f172a;

position:relative;

z-index:999;

border-bottom:1px solid rgba(255,255,255,.08);

}

.xt-header-05 .navbar{

padding:18px 0;

}

.xt-header-05 .navbar-brand img{

height:44px;

width:auto;

}

/*============================*/

.xt-header-05 .navbar-nav{

gap:10px;

}

.xt-header-05 .nav-link{

color:rgba(255,255,255,.75);

font-weight:600;

padding:12px 18px!important;

border-radius:12px;

transition:.3s;

}

.xt-header-05 .nav-link:hover{

background:rgba(255,255,255,.08);

color:#fff;

}

.xt-header-05 .nav-link.active{

color:#fff;

background:rgba(255,255,255,.08);

}

/*============================*/

.xt-header-05 .xt-actions{

display:flex;

align-items:center;

gap:15px;

}

.xt-header-05 .xt-login{

color:rgba(255,255,255,.75);

font-weight:600;

text-decoration:none;

padding:12px 10px;

transition:.3s;

}

.xt-header-05 .xt-login:hover{

color:#fff;

}

.xt-header-05 .btn{

padding:14px 30px;

border-radius:14px;

font-weight:700;

box-shadow:0 10px 25px rgba(37,99,235,.35);

}

/*============================*/

.xt-header-05 .navbar-toggler{

border:none;

background:rgba(255,255,255,.08);

padding:10px 12px;

border-radius:10px;

}

.xt-header-05 .navbar-toggler:focus{

box-shadow:none;

}

.xt-header-05 .navbar-toggler-icon{

filter:invert(1);

}

/*============================*/

@media(max-width:991px){

.xt-header-05 .navbar{

padding:15px 0;

}

.xt-header-05 .navbar-collapse{

padding-top:20px;

}

.xt-header-05 .navbar-nav{

margin-bottom:20px;

gap:5px;

}

.xt-header-05 .xt-actions{

flex-direction:column;

align-items:stretch;

}

.xt-header-05 .btn{

width:100%;

}

.xt-header-05 .xt-login{

text-align:center;

}

}

@media(max-width:576px){

.xt-header-05 .navbar-brand img{

height:38px;

}

}


/*==================================================
XTRILL HEADER 06
GLASSMORPHISM
==================================================*/

.xt-header-06{

position:relative;

padding:25px 0;

background:linear-gradient(135deg,#eef6ff,#f8fbff);

z-index:999;

}

/*=============================*/

.xt-header-06 .xt-glass-nav{

background:rgba(255,255,255,.60);

backdrop-filter:blur(18px);

-webkit-backdrop-filter:blur(18px);

border:1px solid rgba(255,255,255,.35);

border-radius:24px;

padding:14px 26px;

box-shadow:

0 20px 45px rgba(15,23,42,.08),

0 0 0 1px rgba(255,255,255,.25) inset;

}

/*=============================*/

.xt-header-06 .navbar-brand img{

height:44px;
width:auto;

}

/*=============================*/

.xt-header-06 .navbar-nav{

gap:8px;

}

.xt-header-06 .nav-link{

padding:12px 18px !important;

border-radius:12px;

font-weight:600;

color:#334155;

transition:.3s;

}

.xt-header-06 .nav-link:hover{

background:rgba(37,99,235,.08);

color:#2563eb;

}

.xt-header-06 .nav-link.active{

background:#2563eb;

color:#fff;

}

/*=============================*/

.xt-header-06 .xt-actions{

display:flex;

align-items:center;

gap:15px;

}

.xt-header-06 .xt-login{

text-decoration:none;

font-weight:600;

color:#475569;

transition:.3s;

padding:10px;

}

.xt-header-06 .xt-login:hover{

color:#2563eb;

}

/*=============================*/

.xt-header-06 .btn{

padding:14px 28px;

border-radius:14px;

font-weight:700;

box-shadow:0 12px 28px rgba(37,99,235,.25);

}

/*=============================*/

.xt-header-06 .navbar-toggler{

border:none;

box-shadow:none;

background:rgba(255,255,255,.45);

border-radius:12px;

padding:10px;

}

.xt-header-06 .navbar-toggler:focus{

box-shadow:none;

}

/*=============================*/

@media(max-width:991px){

.xt-header-06{

padding:15px 0;

}

.xt-header-06 .xt-glass-nav{

padding:18px;

border-radius:20px;

}

.xt-header-06 .navbar-collapse{

padding-top:20px;

}

.xt-header-06 .navbar-nav{

margin-bottom:20px;

}

.xt-header-06 .xt-actions{

flex-direction:column;

align-items:stretch;

}

.xt-header-06 .btn{

width:100%;

}

.xt-header-06 .xt-login{

text-align:center;

}

}

@media(max-width:576px){

.xt-header-06 .navbar-brand img{

height:38px;

}

.xt-header-06 .xt-glass-nav{

padding:14px;

border-radius:18px;

}

}

/*==================================================
XTRILL HEADER 07
MINIMAL
==================================================*/

.xt-header-07{

position:relative;

background:#ffffff;

padding:22px 0;

z-index:999;

}

/*=============================*/

.xt-header-07 .navbar{

padding:0;

}

.xt-header-07 .navbar-brand img{

height:42px;
width:auto;

}

/*=============================*/

.xt-header-07 .navbar-nav{

gap:12px;

}

.xt-header-07 .nav-link{

padding:10px 16px !important;

font-size:16px;

font-weight:500;

color:#475569;

transition:.3s;

border-radius:10px;

}

.xt-header-07 .nav-link:hover{

color:#111827;

background:#f8fafc;

}

.xt-header-07 .nav-link.active{

color:#111827;

font-weight:700;

}

/*=============================*/

.xt-header-07 .xt-actions{

display:flex;

align-items:center;

}

.xt-header-07 .xt-contact-btn{

display:flex;

align-items:center;

gap:10px;

padding:14px 24px;

border:1px solid #e2e8f0;

border-radius:50px;

text-decoration:none;

color:#111827;

font-weight:600;

transition:.35s;

background:#fff;

}

.xt-header-07 .xt-contact-btn:hover{

background:#111827;

color:#fff;

border-color:#111827;

transform:translateY(-2px);

}

.xt-header-07 .xt-contact-btn i{

font-size:14px;

transition:.3s;

}

.xt-header-07 .xt-contact-btn:hover i{

transform:translateX(4px);

}

/*=============================*/

.xt-header-07 .navbar-toggler{

border:none;

box-shadow:none;

padding:10px;

}

.xt-header-07 .navbar-toggler:focus{

box-shadow:none;

}

/*=============================*/

@media(max-width:991px){

.xt-header-07{

padding:18px 0;

}

.xt-header-07 .navbar-collapse{

padding-top:20px;

}

.xt-header-07 .navbar-nav{

margin-bottom:20px;

gap:6px;

}

.xt-header-07 .xt-actions{

justify-content:center;

}

.xt-header-07 .xt-contact-btn{

width:100%;

justify-content:center;

}

}

@media(max-width:576px){

.xt-header-07{

padding:15px 0;

}

.xt-header-07 .navbar-brand img{

height:36px;

}

.xt-header-07 .nav-link{

padding:12px 10px !important;

}

}


/*==================================================
XTRILL ANNOUNCEMENT 02
==================================================*/

.xt-announcement-02{

background:#0f172a;

padding:12px 0;

position:relative;

overflow:hidden;

}

/*======================*/

.xt-announcement-02:before{

content:"";

position:absolute;

left:-120px;

top:-120px;

width:240px;

height:240px;

border-radius:50%;

background:rgba(255,255,255,.04);

}

.xt-announcement-02:after{

content:"";

position:absolute;

right:-100px;

bottom:-100px;

width:200px;

height:200px;

border-radius:50%;

background:rgba(255,255,255,.03);

}

/*======================*/

.xt-announcement-02 .container{

position:relative;

z-index:2;

}

.xt-announcement-02 .xt-announcement-bar{

display:flex;

align-items:center;

justify-content:space-between;

gap:20px;

}

/*======================*/

.xt-announcement-02 .xt-left{

display:flex;

align-items:center;

gap:16px;

flex-wrap:wrap;

}

.xt-announcement-02 .xt-pill{

display:inline-flex;

align-items:center;

justify-content:center;

padding:6px 16px;

background:#2563eb;

color:#fff;

border-radius:30px;

font-size:12px;

font-weight:700;

letter-spacing:.5px;

text-transform:uppercase;

}

.xt-announcement-02 .xt-text{

color:rgba(255,255,255,.92);

font-size:15px;

font-weight:500;

}

/*======================*/

.xt-announcement-02 .xt-right a{

display:inline-flex;

align-items:center;

gap:10px;

color:#fff;

text-decoration:none;

font-weight:600;

transition:.3s;

}

.xt-announcement-02 .xt-right a:hover{

gap:15px;

color:#60a5fa;

}

.xt-announcement-02 .xt-right i{

font-size:13px;

}

/*======================*/

@media(max-width:768px){

.xt-announcement-02{

padding:15px 0;

text-align:center;

}

.xt-announcement-02 .xt-announcement-bar{

flex-direction:column;

gap:12px;

}

.xt-announcement-02 .xt-left{

justify-content:center;

}

.xt-announcement-02 .xt-text{

font-size:14px;

}

}

@media(max-width:576px){

.xt-announcement-02{

padding:14px 0;

}

.xt-announcement-02 .xt-pill{

font-size:11px;

padding:5px 14px;

}

.xt-announcement-02 .xt-text{

font-size:13px;

line-height:1.6;

}

}

/*==================================================
XTRILL ANNOUNCEMENT 03
==================================================*/

.xt-announcement-03{

position:relative;

padding:110px 0;

overflow:hidden;

background:linear-gradient(135deg,#0f172a,#1e3a8a,#2563eb);

}

/*========================*/

.xt-announcement-03:before{

content:"";

position:absolute;

width:520px;

height:520px;

left:-180px;

top:-180px;

border-radius:50%;

background:rgba(255,255,255,.06);

}

.xt-announcement-03:after{

content:"";

position:absolute;

width:420px;

height:420px;

right:-150px;

bottom:-150px;

border-radius:50%;

background:rgba(255,255,255,.05);

}

/*========================*/

.xt-announcement-03 .container{

position:relative;

z-index:5;

}

/*========================*/

.xt-announcement-03 .xt-launch-box{

padding:70px;

border-radius:34px;

background:rgba(255,255,255,.08);

backdrop-filter:blur(18px);

-webkit-backdrop-filter:blur(18px);

border:1px solid rgba(255,255,255,.15);

box-shadow:0 25px 60px rgba(0,0,0,.20);

}

/*========================*/

.xt-announcement-03 .xt-badge{

display:inline-block;

padding:10px 22px;

border-radius:40px;

background:rgba(255,255,255,.15);

color:#fff;

font-weight:700;

margin-bottom:24px;

}

/*========================*/

.xt-announcement-03 h2{

font-size:clamp(42px,5vw,62px);

font-weight:800;

line-height:1.1;

color:#fff;

margin-bottom:25px;

}

.xt-announcement-03 p{

font-size:19px;

line-height:1.9;

color:rgba(255,255,255,.90);

margin-bottom:35px;

max-width:620px;

}

/*========================*/

.xt-announcement-03 .xt-buttons{

display:flex;

gap:15px;

flex-wrap:wrap;

}

.xt-announcement-03 .btn{

padding:16px 34px;

border-radius:14px;

font-weight:700;

transition:.35s;

}

.xt-announcement-03 .btn:hover{

transform:translateY(-4px);

}

.xt-announcement-03 .btn-light{

color:#2563eb;

}

/*========================*/

.xt-announcement-03 .xt-image-card{

padding:16px;

border-radius:28px;

background:rgba(255,255,255,.10);

box-shadow:0 20px 50px rgba(0,0,0,.20);

}

.xt-announcement-03 .xt-image-card img{

width:100%;

display:block;

border-radius:22px;

}

/*========================*/

@media(max-width:991px){

.xt-announcement-03{

padding:80px 0;

text-align:center;

}

.xt-announcement-03 .xt-launch-box{

padding:45px;

}

.xt-announcement-03 .xt-buttons{

justify-content:center;

margin-bottom:40px;

}

}

@media(max-width:768px){

.xt-announcement-03{

padding:70px 0;

}

.xt-announcement-03 h2{

font-size:36px;

}

.xt-announcement-03 p{

font-size:18px;

}

}

@media(max-width:576px){

.xt-announcement-03{

padding:60px 0;

}

.xt-announcement-03 .xt-launch-box{

padding:30px 22px;

border-radius:24px;

}

.xt-announcement-03 h2{

font-size:30px;

}

.xt-announcement-03 p{

font-size:16px;

}

.xt-announcement-03 .btn{

width:100%;

}

}


/*==================================================
XTRILL EMBED 01
==================================================*/

.xt-embed-01{

padding:120px 0;

background:#f8fbff;

position:relative;

overflow:hidden;

}

.xt-embed-01:before{

content:"";

position:absolute;

width:650px;

height:650px;

right:-250px;

top:-250px;

border-radius:50%;

background:rgba(37,99,235,.05);

}

.xt-embed-01 .container{

position:relative;

z-index:2;

}

/*======================*/

.xt-embed-01 .xt-badge{

display:inline-block;

padding:10px 22px;

background:#dbeafe;

color:#2563eb;

border-radius:40px;

font-weight:700;

margin-bottom:25px;

}

.xt-embed-01 .xt-title{

font-size:clamp(40px,5vw,60px);

font-weight:800;

margin-bottom:25px;

color:#111827;

}

.xt-embed-01 .xt-description{

max-width:760px;

margin:auto;

font-size:19px;

line-height:1.9;

color:#64748b;

}

/*======================*/

.xt-embed-01 .xt-embed-box{

background:#fff;

padding:18px;

border-radius:28px;

box-shadow:0 20px 50px rgba(15,23,42,.08);

border:1px solid #eef2f7;

overflow:hidden;

}

.xt-embed-01 iframe{

display:block;

width:100%;

border:none;

border-radius:18px;

background:#fff;

}

/*======================*/

@media(max-width:768px){

.xt-embed-01{

padding:70px 0;

}

.xt-embed-01 .xt-title{

font-size:36px;

}

.xt-embed-01 .xt-description{

font-size:18px;

}

.xt-embed-01 iframe{

height:350px;

}

}

@media(max-width:576px){

.xt-embed-01{

padding:60px 0;

}

.xt-embed-01 .xt-title{

font-size:30px;

}

.xt-embed-01 .xt-description{

font-size:17px;

}

.xt-embed-01 .xt-embed-box{

padding:12px;

border-radius:20px;

}

.xt-embed-01 iframe{

height:250px;

}

}


/*==================================================
XTRILL TOP HEADER 01
==================================================*/

.xt-top-header-01{

background:#0f172a;

padding:10px 0;

font-size:14px;

color:#fff;

}

/*======================*/

.xt-top-header-01 .xt-top-left{

display:flex;

align-items:center;

gap:25px;

flex-wrap:wrap;

}

.xt-top-header-01 .xt-top-left span{

display:flex;

align-items:center;

gap:8px;

}

/*======================*/

.xt-top-header-01 .xt-top-right{

display:flex;

justify-content:flex-end;

align-items:center;

gap:20px;

flex-wrap:wrap;

}

.xt-top-header-01 .xt-top-right>a{

color:#fff;

text-decoration:none;

transition:.3s;

}

.xt-top-header-01 .xt-top-right>a:hover{

color:#60a5fa;

}

/*======================*/

.xt-top-header-01 .xt-social{

display:flex;

gap:10px;

margin-left:10px;

}

.xt-top-header-01 .xt-social a{

width:32px;

height:32px;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

background:rgba(255,255,255,.08);

color:#fff;

transition:.3s;

text-decoration:none;

}

.xt-top-header-01 .xt-social a:hover{

background:#2563eb;

}

/*======================*/

@media(max-width:768px){

.xt-top-header-01{

text-align:center;

padding:15px 0;

}

.xt-top-header-01 .xt-top-left,

.xt-top-header-01 .xt-top-right{

justify-content:center;

}

.xt-top-header-01 .xt-top-right{

margin-top:12px;

gap:15px;

}

}

/*==================================================
XTRILL FOOTER 01
==================================================*/

.xt-footer-01{

background:#0f172a;
color:#cbd5e1;
padding:100px 0 35px;

}

.xt-footer-01 .xt-logo img{

height:46px;
margin-bottom:25px;

}

.xt-footer-01 .xt-about{

line-height:1.9;
margin-bottom:30px;

}

/*======================*/

.xt-footer-01 h5{

color:#fff;
font-size:20px;
font-weight:700;
margin-bottom:25px;

}

.xt-footer-01 ul{

list-style:none;
padding:0;
margin:0;

}

.xt-footer-01 ul li{

margin-bottom:14px;

}

.xt-footer-01 ul a{

color:#cbd5e1;
text-decoration:none;
transition:.3s;

}

.xt-footer-01 ul a:hover{

color:#fff;
padding-left:5px;

}

/*======================*/

.xt-footer-01 .xt-social{

display:flex;
gap:12px;

}

.xt-footer-01 .xt-social a{

width:42px;
height:42px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
background:rgba(255,255,255,.08);
color:#fff;
text-decoration:none;
transition:.3s;

}

.xt-footer-01 .xt-social a:hover{

background:#2563eb;
transform:translateY(-4px);

}

/*======================*/

.xt-footer-01 .form-control{

border-radius:12px;
padding:14px;

}

.xt-footer-01 .btn{

border-radius:12px;
padding:13px;
font-weight:600;

}

/*======================*/

.xt-footer-01 hr{

margin:60px 0 30px;
border-color:rgba(255,255,255,.08);

}

.xt-footer-01 .xt-bottom{

display:flex;
justify-content:space-between;
align-items:center;
gap:20px;

}

.xt-footer-01 .xt-bottom p{

margin:0;

}

.xt-footer-01 .xt-links{

display:flex;
gap:25px;

}

.xt-footer-01 .xt-links a{

color:#cbd5e1;
text-decoration:none;

}

.xt-footer-01 .xt-links a:hover{

color:#fff;

}

/*======================*/

@media(max-width:991px){

.xt-footer-01{

padding:70px 0 30px;

}

.xt-footer-01 .xt-bottom{

flex-direction:column;
text-align:center;

}

}

@media(max-width:576px){

.xt-footer-01{

padding:60px 0 25px;

}

.xt-footer-01 .xt-links{

flex-wrap:wrap;
justify-content:center;
gap:15px;

}

.xt-footer-01 h5{

margin-top:10px;

}

}

/*==================================================
XTRILL FOOTER 02
==================================================*/

.xt-footer-02{

padding:90px 0 40px;

background:#ffffff;

text-align:center;

}

.xt-footer-02 .xt-logo img{

height:50px;

margin-bottom:30px;

}

.xt-footer-02 .xt-description{

max-width:650px;

margin:0 auto 40px;

font-size:18px;

line-height:1.9;

color:#64748b;

}

/*=====================*/

.xt-footer-02 .xt-menu{

display:flex;

justify-content:center;

gap:35px;

flex-wrap:wrap;

list-style:none;

padding:0;

margin:0 0 40px;

}

.xt-footer-02 .xt-menu a{

text-decoration:none;

color:#334155;

font-weight:600;

transition:.3s;

}

.xt-footer-02 .xt-menu a:hover{

color:#2563eb;

}

/*=====================*/

.xt-footer-02 .xt-social{

display:flex;

justify-content:center;

gap:15px;

margin-bottom:40px;

}

.xt-footer-02 .xt-social a{

width:46px;

height:46px;

display:flex;

align-items:center;

justify-content:center;

border-radius:50%;

background:#f1f5f9;

color:#334155;

font-size:18px;

transition:.3s;

text-decoration:none;

}

.xt-footer-02 .xt-social a:hover{

background:#2563eb;

color:#fff;

transform:translateY(-4px);

}

/*=====================*/

.xt-footer-02 hr{

margin:40px auto 25px;

max-width:700px;

border-color:#e5e7eb;

}

.xt-footer-02 .xt-copy{

margin:0;

color:#94a3b8;

font-size:15px;

}

/*=====================*/

@media(max-width:768px){

.xt-footer-02{

padding:70px 0 35px;

}

.xt-footer-02 .xt-description{

font-size:17px;

}

.xt-footer-02 .xt-menu{

gap:18px;

}

}

@media(max-width:576px){

.xt-footer-02{

padding:60px 0 30px;

}

.xt-footer-02 .xt-logo img{

height:42px;

}

.xt-footer-02 .xt-description{

font-size:16px;

margin-bottom:30px;

}

.xt-footer-02 .xt-menu{

flex-direction:column;

gap:15px;

margin-bottom:30px;

}

.xt-footer-02 .xt-social{

gap:10px;

}

.xt-footer-02 .xt-social a{

width:42px;

height:42px;

}

}


.xt-icon img {
    padding: 20px !important;
}