/**
 * 00. about
 *
 * -------------------------------------------------------------------
 */

.section-about .window-info {
    justify-content: left;
    border-right: none;
}

.title-since-2015-wrapper p {
    color: #403e46;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px; /* 228.571% */
    letter-spacing: 0.28px;
}
.article-more-than-apps {
    padding-top: 177px;
    padding-bottom: 177px;
    background-color: #ffffff;
}

.article-more-than-apps .window-image {
    padding-top: 0px;
    padding-bottom: 0px;
}

.founders-article .window-image {
    padding-top: 134px;
    padding-bottom: 134px;
}
.we-are-engineers-wrapper p,
.article-more-than-apps p,
.our-history-article {
    line-height: 32px;
}

.article-more-than-apps p,
.our-history-article p {
    font-size: 18px;
}

.our-history-article p {
    text-align: justify;
}

.article-more-than-apps h2 {
    font-size: 32px;
}

/* SCROLL BAR */
:is(.our-history-article .accordion-flush)::-webkit-scrollbar {
    background-color: #f5f5f5;
    border-radius: 10px;
    height: 5px;
    width: 5px;
}

:is(.our-history-article .accordion-flush)::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #000000;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
}

.accordion-body {
    padding-left: 12%;
}
.header-about {
    background: linear-gradient(90deg, #ffffff 50%, #27b67c 50%);
    padding-top: 100px;
    padding-bottom: 100px;
}
/**
 * 01. TITLE
 *
 * -------------------------------------------------------------------
 */
.header-about .window-image {
    /* background-color: #27b67c; */
    padding: 0;
}

.header-about h1 {
    font-size: 50px;
    line-height: 75px;
}

.title-since-2015-wrapper {
    align-items: center;
    column-gap: 8px;
    display: flex;
    flex-direction: row;
}

.bullet-point {
    background-color: #232227;
    border-radius: 12px;
    height: 8px;
    width: 8px;
}

.title-since-2015-wrapper p {
    font-size: 14px;
}

.we-are-engineers-wrapper {
    margin-top: 40px;
}

.we-are-engineers-wrapper p {
    font-size: 18px;
}

.title-software-wrapper {
    position: relative;
}

.underline-about-us {
    background-image: url(../assets/icons/underline-about-us.png);
    height: 152px;
    left: 0;
    position: absolute;
    top: 0;
    width: 195px;
    color: #403e46;
    font-family: Inter;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
}

.maggie-carousel,
.javi-carousel,
.corona-carousel,
.axel-carousel {
    height: 448px;
    width: 320px;
}

.carousel-image {
    background-repeat: no-repeat;
    background-size: contain;
}

.axel-carousel {
    background-image: url(../assets/team/carousel/carousel-axel.webp);
}

.corona-carousel {
    background-image: url(../assets/team/carousel/carousel-corona.webp);
}

.javi-carousel {
    background-image: url(../assets/team/carousel/carousel-javi.webp);
}

.maggie-carousel {
    background-image: url(../assets/team/carousel/carousel-maggie.webp);
}

.oval-image-container,
.half-image-container,
.square-image-container {
    border: 1px solid #232227;
    box-shadow: 6px 6px 0px #000000;
    overflow: hidden;
}

.oval-image-container {
    border-radius: 200px;
}

.square-image-container {
    border-radius: 40px;
}

.half-image-container {
    border-radius: 40px 40px 200px 200px;
}

/**
 * 02. MORE THAN APPS
 *
 * -------------------------------------------------------------------
 */
.article-more-than-apps h2 {
    line-height: 48px;
}

.colorful-emkode-logo {
    background-image: url(../assets/images/colorful-emkode-logo.png);
    height: 110px;
    width: 463px;
}

/**
 * 03. FOUNDERS
 *
 * -------------------------------------------------------------------
 */
.our-history-article .window-wrapper,
.our-history-article .window-image {
    height: fit-content;
}

/* reset from founders-article */
.our-history-article > .container > .row > :first-child {
    border-right: 0;
    height: inherit;
}

article:is(.our-history-article, ) > .container > .row > :last-child {
    border-left: 1px solid #232227;
}

.our-history-article :is(.window-info, .our-history-accordion) {
    background-color: #f5f5f5;
}

.our-history-article .window-info {
    background-color: #f5f5f5;
    padding: 8%;
    padding-top: 134px;
    padding-bottom: 134px;
    padding-right: calc(var(--bs-gutter-x) * 0.5);
}

.our-history-article .accordion-flush {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    max-height: 300px;
    overflow: scroll;
}

.our-history-article .collapse:not(.show) ~ .accordion-flush .ellipsis {
    visibility: hidden;
}

.our-history-article .accordion-body {
    padding: 0;
}

.our-history-article .accordion-header,
.our-history-article .accordion-body div {
    margin-bottom: 16px;
}

.our-history-image-wrapper {
    border-radius: 21px;
    border: 1px solid #232227;
    margin: 50px 25px 26px 25px;
    overflow: hidden;
}

.img-our-history {
    width: 100%;
}

.founders-article.our-history-article
    div.window-info
    div.btn-top.btn-dark-top
    p::before {
    content: "Menos...";
}
.founders-article.our-history-article
    div.window-info
    a.collapsed
    div.btn-top.btn-dark-top
    p::before {
    content: "Ver más";
}

.section-about .founders-article {
    background: linear-gradient(90deg, #f04e58 50%, #f5f5f5 50%);
}

/**
 * 04. ACHIEVEMENTS
 *
 * -------------------------------------------------------------------
 */
.logo-medal-process-cycle,
.logo-medal-overcome,
.logo-medal-desing-docs,
.logo-medal-price {
    height: 120px;
    width: 120px;
}

.logo-medal-process-cycle {
    background-image: url(../assets/images/medal_process_cycle.png);
}

.logo-medal-overcome {
    background-image: url(../assets/images/medal_overcome.png);
}

.logo-medal-desing-docs {
    background-image: url(../assets/images/medal_desing_docs.png);
}

.logo-medal-confidence {
    background-image: url(../assets/images/medal_confidence.png);
    height: 150px;
    width: 120px;
}

.logo-medal-price {
    background-image: url(../assets/images/medal_price.png);
}

.right-arrow {
    background-image: url(../assets/icons/right-arrow.png);
    height: 14px;
    width: 7px;
}

.achievements {
    margin: 180px 0;
}

.achievements h2 {
    line-height: 47px;
}

.achievements-col {
    border-radius: 10px;
    border: 2px solid #000000;
    height: 300px;
    width: 173px;
    display: flex;
    flex-direction: column;
}

.achievements-container {
    margin-top: 66px;
}

.achievements-container > .row {
    padding-left: 15px;
    padding-right: 15px;
}

.medal-image {
    align-items: center;
    background: #000000;
    display: flex;
    flex: 2;
    justify-content: center;
    width: 100%;
}

.achievements-container-heart {
    position: relative;
}

.achievements-logo-heart {
    position: absolute;
    transform: translateY(25px);
}

.description-container {
    align-items: center;
    display: flex;
    flex: 2;
    flex-direction: column;
    font-size: 12px;
    justify-content: center;
    line-height: 15px;
    text-align: center;
    width: 100%;
}

.achievements-container .btn-more-datails-wapper {
    height: 15%;
    padding-right: 10px;
    text-align: end;
}

.achievements-container div:is(.btn-white-top) {
    padding: 5px 10px;
}

.achievements-container div:is(.btn-white-top) ~ .btn-bottom {
    background-color: #000;
    bottom: 3px;
    right: -10px;
}

.achievements-container :is(.btn-bottom, .btn-top) {
    border-radius: 0px;
}

.achievements-container :is(.btn-top) {
    transform-style: preserve-3d;
    transform: translate3d(-1px, 3px, 0px) scale3d(1, 1, 1) rotateX(0deg)
        rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
}

.achievements-container :is(.btn-bottom) {
    left: 13px;
}

div.btn-more-datails-wapper > a > div,
div.btn-more-datails-wapper > a > div > .btn-top {
    min-width: auto;
    min-height: auto;
}

.values h2 {
    color: #232227;
    font-size: 32px;
    font-style: normal;
    font-weight: 500;
    line-height: 47.3px;
}

.btn-values {
    width: 388px;
    height: 110px;
}

.btn-values p {
    color: #fff;
    font-family: Poppins;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 38.4px;
}

.btn-values .btn-bottom {
    background-color: #000000;
}

.btn-values .btn-green-top {
    background-color: #27b67c;
    height: inherit;
    padding: 36px 37px 35px 38px;
}

.btn-values.btn-container:hover > div.btn-green-top {
    transform-style: preserve-3d;
    transform: translate3d(3px, 6px, 0px) scale3d(1, 1, 1) rotateX(0deg)
        rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
}

.values-container {
    background-color: #ffffff;
}
.values-title {
    padding-top: 130px;
}

.values-title h2 {
    color: #232227;
    font-family: Poppins;
    font-size: 32px;
    font-style: normal;
    font-weight: 500;
    line-height: 47.3px;
}

.values-buttons {
    padding-bottom: 130px;
    justify-content: center;
}

.values-button {
    margin-top: 46px;
}

/**
 * .Mmission Vision
 *
 * -------------------------------------------------------------------
 */

.mission-vision {
    background: #f7f7f7;
}

.mission-vision-icon,
.mission-vision-title {
    margin-bottom: 20px;
}

.mission-vision-p {
    text-align: justify;
}

.mission-container,
.vision-container {
    padding-top: 70px;
    padding-bottom: 70px;
}

.mission-container {
    padding-right: 60px;
    border-right: 1px solid #000000;
}

.vision-container {
    padding-left: 60px;
}

/**
 * 06. TEAM
 *
 * -------------------------------------------------------------------
 */
.team-home .btn-top {
    color: #fff;
}

.team-title {
    margin-bottom: 60px;
}

/**
 * 06. CONTACT
 *
 * -------------------------------------------------------------------
 */
.contact-underline-wrapper {
    position: relative;
}

.container-contact .underline {
    height: 10px;
    left: 0;
    position: absolute;
    transform: none;
    width: 200px;
}

.about-contact {
    background: #27b67c;
}

.about-contact h2 {
    color: #ffffff;
}

.background-color {
    background: #27b67c;
}

/**
 * 07. QUERIES
 *
 * -------------------------------------------------------------------
 */

@media (max-width: 1200px) {
    .achievements-container > .row {
        display: grid;
        grid-auto-flow: column;
        overflow-x: scroll;
    }

    .our-history-article .accordion-flush {
        max-height: 350px;
    }
}

@media (max-width: 994px) {
    .section-about .window-info {
        background: transparent;
        border-left: none !important;
    }
    .article-more-than-apps .window-image {
        padding-top: 60px;
    }
    .founders-article .window-image {
        padding-top: 136px;
        padding-bottom: 0px;
    }
    .article-more-than-apps {
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .article-more-than-apps .colorful-emkode-logo {
        margin-bottom: 60px;
    }
    .article-more-than-apps h2 {
        text-align: center;
    }
    .article-more-than-apps p {
        text-align: justify;
    }
}
@media (max-width: 768px) {
    .header-about {
        background: linear-gradient(180deg, #ffffff 45%, #27b67c 0%);
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .our-history-article > .container > .row {
        display: flex;
    }

    .our-history-article .accordion-flush {
        max-height: 220px;
    }

    .achievements {
        margin: 90px 0;
    }

    :is(.header-about, .article-more-than-apps, .our-history-article)
        .window-info {
        padding-top: 8%;
        padding-bottom: 8%;
        padding-right: calc(var(--bs-gutter-x) * 0.5);
        padding-left: calc(var(--bs-gutter-x) * 0.5);
    }

    :is(.header-about, .article-more-than-apps) .window-info > div {
        padding: 20px 10px;
    }

    .article-more-than-apps .window-image {
        padding-top: 0;
    }

    .underline-about-us {
        height: 100px;
        width: 130px;
    }

    .header-about .window-image {
        padding-top: 50px;
        padding-bottom: 20px;
    }

    .header-about .about-slide-track {
        height: 500px;
    }

    .colorful-emkode-logo {
        height: 86px;
        width: 361px;
    }

    .about-contact h2 {
        color: #fff;
        font-family: Poppins;
        font-size: 42px;
        font-style: normal;
        font-weight: 500;
        line-height: 59.4px;
    }

    .header-about h1 {
        font-size: 32px;
        line-height: 47px;
    }

    .container-contact .underline {
        width: 144px;
    }

    .about-contact .underline {
        width: 144px;
    }

    .article-more-than-apps .window-info {
        padding-top: 0px;
        padding-bottom: 0px;
        padding-right: calc(var(--bs-gutter-x) * 0.5);
        padding-left: calc(var(--bs-gutter-x) * 0.5);
    }

    .founders-article .window-image {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .section-about .founders-article {
        background: linear-gradient(180deg, #f5f5f5 44%, #f04e58 0%);
    }

    .title-since-2015-wrapper {
        width: fit-content;
        margin-left: auto;
        margin-right: auto;
    }

    .bullet-point {
        display: none;
    }

    .title-software-wrapper {
        width: fit-content;
        margin-left: auto;
        margin-right: auto;
    }

    .our-history-article .window-info > div {
        text-align: center;
    }

    .mission-container {
        padding-right: 0px;
        text-align: center;
        padding-bottom: 70px;
        border-right: 0px;
    }

    .vision-container {
        padding-left: 0px;
        text-align: center;
        padding-top: 70px;
    }

    .mission-vision-p {
        text-align: center;
    }

    /* .border-r {
        border-bottom: 1px solid #232227;
    } */

    .border-r::after {
        position: absolute;
        left: 0;
        content: " ";
        display: block;
        border-bottom: 1px solid grey;
        width: 100%;
    }
}

@media (max-width: 576px) {
    .header-about {
        background: linear-gradient(180deg, #ffffff 45%, #ffffff 0%);
    }
    .header-about .window-image {
        background: #27b67c;
    }
    .container-contact .underline {
        position: absolute;
        top: 56px;
    }

    .our-history-article .accordion-flush {
        max-height: 350px;
    }
    .section-about .founders-article {
        background: linear-gradient(180deg, #f5f5f5 57%, #f5f5f5 0%);
    }

    .contact-underline-wrapper {
        width: fit-content;
        display: flex;
        margin-right: auto;
        margin-left: auto;
    }
}
