/*
Theme Name: Meta Capital Site
Description: MetaCapital official website
Author: UX Themes
Template: flatsome
Version: 3.0
*/


:root{
    --primary-color: #025BD9;
    --second-color: #0FB7FE;
    --danger-color: #B50A0C;

	--headline: #353535;
    --bg-gray: #F9F7F2;
	--bg-white: #FFFFFF;

    --cycle-color-1: #2196f3;
    --cycle-color-2: #5ce1e6;
    --cycle-color-3: #ff7f3e;
    --cycle-color-4: #ffda40;
}

/*********** BASE CSS   ***********/
/* p{font-size: 20px !important;} */
h2{font-size: 2.5em !important; font-weight: 700 !important;}
.d-flex{display: flex;}
.flex-inline { display: inline-flex; }
.justify-content-start { justify-content: flex-start!important; }
.justify-space-between{justify-content: space-between;}
.align-baseline{align-items: baseline;}

.flex-column { flex-direction: column!important; }

.bg-white{background-color: var(--bs-white-rgb) !important;}
.vr{
	display: inline-block;
    align-self: stretch;
    width: 1px;
    min-height: 1em;
    background-color: currentcolor;
    opacity: .25;
}
.mb-0 { margin-bottom: 0!important; }
.mb-1 { margin-bottom: 0.25em;}
.mb-2 { margin-bottom: 0.5em;}
.mb-4 { margin-bottom: 1em;}
.ms-4 { margin-left: 1em !important; }
.me-4 { margin-right: 1em !important; }

.ps-3{ padding-left: 0.75em;}
.pe-3{ padding-right: 0.75em;}

.fsm-2 { font-size: .9rem!important; }
.fsm-6 { font-size: .7rem!important; }
.fw-semibold{ font-weight: 500 !important; }
.fw-bold{ font-weight: 700 !important; }

.wg-300{font-weight: 300 !important;}
.letter-spacing-1 { letter-spacing: .125rem!important; }

.text-center{text-align: center;}
.text-start{text-align: left;}
.text-end{text-align: right;}

.button.is-rounded{border-radius: 99px;}

.head-title{
    font-size: 32px;
    font-weight: 700;
    color: var(--primary-color);
}

.is-small, .is-small.button {
    font-size: 0.875rem;
}

.ellipsis-2{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* number of lines to show */
        line-clamp: 2; 
    -webkit-box-orient: vertical;
}

/*** Header ***/
.flickity-slider .img .img-inner > img {
    border-radius: 20px;
}

/* Section Alt */
.section-alt {
    position: relative;
    overflow: hidden;
}

.section-alt:before {
    content: '';
    width: 40vw;
    height: 0;
    padding-bottom: 40vw;
    position: absolute;
    left: 0;
    top: 0;
    background: linear-gradient(135deg, rgba(255, 0, 0, 0.2) 0%, rgba(255, 0, 0, 0) 50%);
    z-index: 1;
}

.section-alt:after {
    content: '';
    width: 50vw;
    height: 0;
    padding-bottom: 80vw;
    position: absolute;
    right: -30vw;
    top: -15vw;
    background: radial-gradient(ellipse at center, rgba(0, 163, 255, 0.35) 0%, rgba(0, 163, 255, 0) 60%);
    z-index: 3;
}

.section-alt .section-bg:before {
    content: '';
    width: 80vw;
    height: 0;
    padding-bottom: 35vw;
    position: absolute;
    right: -10vw;
    bottom: -20vw;
    background: radial-gradient(ellipse at center, rgba(121, 190, 96, 0.35) 0%, rgba(121, 190, 96, 0) 70%);
    z-index: 2;
}

.section-alt .section-content {
    position: relative;
    z-index: 20;
}


/* Section Red Alt */
.section-r-alt {
    position: relative;
    overflow: hidden;
}

.section-r-alt .section-content {
    position: relative;
    z-index: 20;
}

.section-r-alt:before {
    content: '';
    width: 60vw;
    height: 0;
    padding-bottom: 60vw;
    position: absolute;
    left: -30vw;
    top: -40vw;
    background: radial-gradient(ellipse at center, rgba(255, 0, 0, 0.2) 0%, rgba(255, 0, 0, 0) 60%);
    z-index: 1;
}

.section-r-alt:after {
    content: '';
    width: 80vw;
    height: 0;
    padding-bottom: 80vw;
    position: absolute;
    right: -20vw;
    bottom: -40vw;
    background: radial-gradient(ellipse at center, rgba(255, 0, 0, 0.2) 0%, rgba(255, 0, 0, 0) 60%);
    z-index: 2;
}

    /*** Section About us ***/
    .head-has-after{ position: relative; }
        .head-has-after:after{
            content: '';
            width: 90px;
            height: 24px;
            background: url(assets/icons/icon-slices-heading.svg) no-repeat center center;
            background-size: contain;
            position: absolute;
            top: 25%;
            right: 0;
        }

    ul.list-checked {
        list-style: none;
        padding-left: 0;
        display: flex;
        flex-direction: column;
    }
        ul.list-checked li {
            margin-left: 1em;
            margin-bottom: 1em;
            display: flex;
            align-items:center;
            justify-content: flex-start;
            gap: 1.25em;
        }
            ul.list-checked li:before {
                flex-shrink: 0;
                content: "";
                width: 1.5rem;
                height: 1.5rem;
                background: url(assets/icons/icon-check.svg) no-repeat center center;
                background-size: contain;
            }


    /*** CYCLE A.I BOT ***/
    .cycle-color-1{ color: var(--cycle-color-1); }
    .cycle-color-2{ color: var(--cycle-color-2); }
    .cycle-color-3{ color: var(--cycle-color-3); }
    .cycle-color-4{ color: var(--cycle-color-4); }

    .cycle-heading{
        font-size: 24px;
        font-weight: 700;
        margin-bottom: 0.5em;
        padding-left: 90px;
    }
        .cycle-heading.cycle-color-1{ background: url(assets/icons/arrow-color-1.svg) no-repeat left center; background-size: 70px auto; }
        .cycle-heading.cycle-color-2{ background: url(assets/icons/arrow-color-2.svg) no-repeat left center; background-size: 70px auto; }
        .cycle-heading.cycle-color-3{ background: url(assets/icons/arrow-color-3.svg) no-repeat left center; background-size: 70px auto; }
        .cycle-heading.cycle-color-4{ background: url(assets/icons/arrow-color-4.svg) no-repeat left center; background-size: 70px auto; }


    /*about section*/
    .about-box .about-thumb {
        position: relative;
        left: 10px;
    }

    .about-box .shape1 {
        position: absolute;
        right: 196px;
        top: 113px;
    }

    .about-box .shape2 {
        position: absolute;
        top: 178px;
        left: -117px;
    }

    .about-box .shape3 {
        position: absolute;
        bottom: 160px;
        right: 137px;
    }

    .bg-lines{
        background: url(images/lines-bg.svg) no-repeat center center;
        background-size: contain;
    }


    .road-box{
        display: flex;
        gap: 5px;
        font-size: 18px;
        color: white;
        font-weight: 600;
        transform: skew(-35deg);
    }   
        .road-box .year, .road-box .title { padding: 10px 20px; border-radius: 8px; }
        .road-box .year span, .road-box .title span { transform: skew(35deg); display: inline-block; }

        .road-box .year{
            background-color: var(--primary-color);
            min-width: 100px;
            text-align: center;
        }
        .road-box .title{
            background-color: var(--second-color);
            flex-grow: 1;            
        }


/*** Update 12-10-2025 ***/
.stack.stack-whyus {
    gap: 2rem;
}
    .stack.stack-whyus .icon-box{
        flex-grow: 0;
        max-width: calc((100% - 8rem) / 5);
    }
    .stack.stack-whyus .icon-box .icon-box-text {
        border-top: 1px #333 dashed;
        padding-top: 15px;
    }

.row.row-dashed .stack {
    height: 100%;
    justify-content: space-between;
}
    .stack .icon-box-text h5 {
        font-weight: 600;
        line-height: 2;
        font-size: 15px;
        padding-left: 15px;
    }
    .stack .icon-box-text h6 {
        font-size: 15px;
        text-transform: none;
        padding-left: 15px;
    }
.stack .image-rounded .icon-box-img .icon-inner {
    border-radius: 50%;
    display: flex;
    overflow: hidden;
    aspect-ratio: 1 / 1;
}
    .stack .icon-box-img .icon-inner img { object-fit: cover; padding-top: 0;}

    .count-boxes .font-3xl {
        font-size: 5em;
        font-weight: bold;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 10px;
    }
    .count-boxes .font-3xl sup { font-weight: 500; }

    .count-boxes .font-3xl span.append {
        display: flex;
        flex-flow: column;
        gap: 0;
        font-size: 30px;
        font-weight: normal;
        line-height: 1.3;
    }

footer .absolute-footer{display: none;}
footer p{margin-bottom: 0;}

@media only screen and (max-width: 48em) {
    /*************** ADD MOBILE ONLY CSS HERE  ***************/
    
    
}