@font-face{
	font-family: source-bold;
	src: url('../../fonts/Rubik-Bold.ttf') format('truetype');
}

@font-face{
	font-family: source-light;
	src: url('../../fonts/Rubik-Light.ttf') format('truetype');
}

@font-face{
	font-family: source-regular;
	src: url('../../fonts/Rubik-Regular.ttf') format('truetype');
}

* { 
	margin: 0;
 	padding: 0;
 	font-family: source-bold, sans-serif;
}

body {
    background: var(--color-back);
	scroll-behavior: smooth;
	transition: .6s all ease;
    width: 100vw;
    overflow-x: hidden;
}

:root {
	--color-primary: #013d7c;
	--color-secundary: #2d2d2d;
	--color-back: #f4f8fc;
	--color-white: #ffffff;
    --color-light: #d8e6f2;
	--color-black: #1c1c1c;
	--color-wsp: #3BAF4F;
    --color-red: #c51216;
	--font-family-bold: source-bold;
	--font-family-light: source-light;
    --font-family-regular: source-regular;
}

::-webkit-scrollbar {
	width: 0;
	height: 0;
}

::-webkit-scrollbar-thumb {
	background: var(--color-gray);
	border-radius: 2.5px;
	margin-inline: 2px;
}

/* Header */
.header {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: auto;
    align-items: center;
    background: var(--color-white);
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    padding-block: 0;
    overflow-x: hidden;
}

.header__category {
    display: none;
    align-items: center;
    padding: .1vw 1vw;
    border-radius: 1vw;
    border: 2px solid var(--color-secundary);
    cursor: pointer;
    margin-inline: 1vw;
    position: relative;
}

.header__category-lines {
    width: 22px;
    height: 22px;
    cursor: pointer;
    border: none;
    background: transparent;
    display: block;
    margin-inline: .5vw 0;
    transform: scale(.8);
    z-index: 90000;
}

.header__category-l1, .header__category-l2, .header__category-l3 {
    background: var(--color-secundary);
    width: 100%;
    height: 3px;
    border-radius: 1.5px;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: transform 0.7s, width 0.5s ;
}

.header__category-l1 { transform: translate(-50%, -8px); }
.header__category-l3 { transform: translate(-50%, 5px); }

.header__category-activo .header__category-l1 { transform: translate(-50%, -50%) rotate(45deg); }
.header__category-activo .header__category-l3 { transform: translate(-50%, -50%) rotate(-45deg); }
.header__category-activo .header__category-l2 { width: 0; }

.header__category-text {
    color: var(--color-secundary);
    font-family: var(--font-secundary-bold);
    font-size: 1.4vw;
}

.header__icons {
    display: block;
    width: 15vw;
    margin-inline: 0 3vw;
}

.header__icon {
    width: 100%;
    height: auto;
}

.header__list {
    display: flex;
    margin-inline: 0;
    transition: .5s all ease;
}

.header__list-container {
    display: flex;
    position: relative;
}

.header__list-content {
    display: flex;
    display: none;
    width: max-content;
    flex-direction: column;
    position: absolute;
    background: var(--color-white);
    border-bottom: 1px solid var(--color-secundary);
    padding: 1vw .5vw .5vw .5vw;
    top: 100%;
    left: 0;
    z-index: 99000;
}

.header__list-container:hover .header__list-content {
    display: flex;
}

.header__list-content .header__list-item {
    padding-block: .8vw;
}

.header__list-content .header__list-item:after {
    bottom: .8vw;
}

.header__list-item {
    color: var(--color-secundary);
    font-family: var(--font-family-regular);
    font-size: 1.1vw;
    text-align: center;
    text-decoration: none;
    margin-inline: .8vw;
    padding-inline: .25vw;
    padding-block: 1.2vw;
    position: relative;
    transition: .3s all ease;
    cursor: pointer;
}

.header__list-item:hover {
    transform: scale(1.05);
}

.header__list-item:after {
    content: '';
    width: 0;
    height: 1.5px;
    display: flex;
    background: var(--color-secundary);
    position: absolute;
    bottom: 1vw;
    left: 0;
    transition: .3s all cubic-bezier(0,0,.2,1);
}

.header__list-item:hover:after {
    width: 100%;
}

.header__list-phones {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-inline: 6vw 0;
}

.header__list-phone {
    width: 2.5vw;
    margin-inline: 0 1vw;
    fill: var(--color-primary);
}

.header__list-numbers {
    display: flex;
    flex-direction: column;
}

.header__list-number {
    color: var(--color-black);
    font-family: var(--font-family-light);
    font-size: 1.1vw;
    text-decoration: none;
    margin-block: .3vw;
    transition: .3s all ease;
}

.header__list-number:hover {
    text-decoration: underline;
}

.header__call {
    font-family: var(--font-family-regular);
    font-size: 1.2vw;
    text-decoration: none;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1vw 2vw;
    color: var(--color-white);
    background: var(--color-primary);
    margin-inline: 3vw 0;
    transition: .3s all ease;
}

.header__call:hover {
    transform: scale(1.05);
}

.header__items {
    width: 90vw;
    margin-inline: auto;
    display: flex;
    justify-content: end;
    align-items: center;
}

.header__item {
    display: block;
    width: 1.4vw;
    margin-inline: .7vw;
    cursor: pointer;
    position: relative;
}

/* Home */
.home {
    display: flex;
    width: 100vw;
    height: auto;
    position: relative;
    margin-block: 0 17vw;
    overflow-x: hidden;
}

.home__content {
    display: flex;
    width: 50%;
    height: auto;
}

.home__images {
    display: flex;
    justify-content: center;
    align-items: end;
    width: 100%;
    height: max-content;
}

.home__image {
    width: 28vw;
    margin-block: 2vw;
}

.home__data {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40vw;
    flex-direction: column;
}

.home__subtitle {
    color: var(--color-primary);
    font-size: 1.2vw;
    text-align: center;
    transition: .3s all ease;
    transition-delay: .3s;
}

.home__subtitle-footer {
    color: var(--color-primary);
    font-size: 1.2vw;
    text-align: center;
    margin-block: 2vw 0;
    transition: .3s all ease;
    transition-delay: 1.1s;
}

.home__title {
    color: var(--color-black);
    font-size: 4vw;
    text-align: center;
    margin-block: 2vw 4vw;
    transition: .3s all ease;
}

.home__items {
    display: flex;
    justify-content: center;
    align-items: center;
}

.home__item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 14vw;
    height: 8vw;
    margin-inline: 2vw;
    border: 4px solid var(--color-light);
    position: relative;
    transition: .4s all ease;
    transition-delay: .5s;
}

.home__item:nth-of-type(2) { transition-delay: .7s; }

.home__item:after {
    content: '';
    display: flex;
    width: 2.3vw;
    height: .6vw;
    background: var(--color-primary);
    position: absolute;
    top: -1.3vw;
    left: -1.3vw;
}

.home__item:before {
    content: '';
    display: flex;
    width: .6vw;
    height: 2.3vw;
    background: var(--color-primary);
    position: absolute;
    top: -1.3vw;
    left: -1.3vw;
}

.active .home__item { transform: translateX(0) translateY(0); opacity: 1; }
.out .home__item { transform: translateX(20vw) translateY(10vh); opacity: 0; }

.active .home__title { transform: translateX(0) translateY(0); opacity: 1; }
.out .home__title { transform: translateX(20vw) translateY(10vh); opacity: 0; }

.active .home__subtitle { transform: translateX(0) translateY(0); opacity: 1; }
.out .home__subtitle { transform: translateX(20vw) translateY(10vh); opacity: 0; }

.active .home__subtitle-footer { opacity: 1; }
.out .home__subtitle-footer { opacity: 0; }

.home__text {
    font-family: var(--font-family-regular);
    font-size: 1.4vw;
    margin-inline: 1vw;
}

.home__text b {
    font-family: var(--font-family-light);
    font-size: 1.2vw;
}

.home__price {
    color: var(--color-primary);
    font-family: var(--font-family-light);
    font-size: 1.4vw;
    margin-block: 1vw 0;
    margin-inline: 1vw;
}

.home__call {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80vw;
    height: auto;
    padding-block: .5vw 1vw;
    background: var(--color-primary);
    position: absolute;
    bottom: -11vw;
    left: 0;
    right: 0;
    margin-inline: auto;
    overflow: hidden;
}

.home__call-rule {
    width: 100vw;
    height: auto;
    position: absolute;
    bottom: 0;
    left: 0;
}

.home__call-texts {
    display: flex;
    flex-direction: column;
    width: 30vw;
    margin-inline: 0 6vw;
}

.home__call-title {
    color: var(--color-white);
    font-family: var(--font-family-regular);
    font-size: 2.2vw;
    margin-block: 2vw 1vw;
}

.home__call-subtitle {
    color: var(--color-white);
    font-family: var(--font-family-regular);
    font-size: 1.4vw;
    margin-block: 0 3vw;
}

.home__call-phone {
    display: flex;
    flex-direction: column;
}

.home__call-label {
    display: flex;
    align-items: center;
}

.home__call-text {
    color: var(--color-white);
    font-family: var(--font-family-light);
    font-size: 1.2vw;
}

.home__call-datas {
    display: flex;
    align-items: center;
}

.home__call-inputs {
    display: flex;
    position: relative;
    width: max-content;
    height: max-content;
    margin-block: .5vw;
    z-index: 100;
}

.home__call-inputs-adv:after {
    content: '';
    width: calc(100% + .5vw);
    height: calc(100% + .5vw);
    position: absolute;
    top: -0.25vw;
    left: -0.25vw;
    background: var(--color-red);
    z-index: 0;
    transition: .3s all ease;
    animation: blinkSmooth 1s ease-in-out infinite;
}

@keyframes blinkSmooth {
    0%   { opacity: 1; transform: translateY(0); }
    45%  { opacity: 0.05; transform: translateY(-2px); }
    55%  { opacity: 0.05; transform: translateY(-2px); }
    100% { opacity: 1; transform: translateY(0); }
}

.home__call-input {
    font-family: var(--font-family-regular);
    font-size: 1.4vw;
    padding: .2vw 1vw;
    width: 15vw;
    border: 1px solid var(--color-black);
    outline: none;
    position: relative;
    z-index: 100;
}

.home__call-btn {
    color: var(--color-black);
    font-family: var(--font-family-bold);
    font-size: 1.2vw;
    text-decoration: none;
    padding: 1vw 3vw;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-inline: 2vw 0;
    margin-block: 1.2vw 0;
    background: var(--color-light);
    border: 1px solid var(--color-black);
    transition: .3s all ease;
    cursor: pointer;
}

.home__call-btn:hover {
    transform: scale(1.05);
}

/* Services */
.services {
    display: flex;
    width: 100vw;
    align-items: center;
    justify-content: center;
    margin-block: 0 6vw;
    overflow-x: hidden;
}

.services__content {
    display: flex;
    flex-direction: column;
    width: 50%;
}

.services__images {
    display: flex;
    width: 30vw;
    margin-inline: auto 5vw;
    transition: .5s all ease;
}

.services__image {
    width: 100%;
    height: auto;
}

.services__texts {
    display: flex;
    width: 36vw;
    flex-direction: column;
    justify-content: start;
    align-items: start;
    margin-inline: 5vw auto;
}

.services__subtitle {
    color: var(--color-primary);
    font-size: 1.2vw;
    transition: .3s all ease;
    transition-delay: .3s;
}

.services__title {
    font-family: var(--font-family-regular);
    font-size: 2.7vw;
    font-weight: 600;
    margin-block: 1vw;
    transition: .3s all ease;
    transition-delay: .6s;
}

.services__text {
    font-family: var(--font-family-light);
    font-size: 1.4vw;
    transition: .3s all ease;
    transition-delay: .9s;
}

.services__items {
    display: flex;
    width: 50vw;
    flex-wrap: wrap;
    margin-block: 2vw 0;
}

.services__item {
    display: flex;
    width: 18vw;
    align-items: center;
    margin: .5vw 2vw .5vw 0;
    transition: .3s all ease;
    transition-delay: 1.2s;
}

.services__item:nth-of-type(2) { transition-delay: 1.5s; }
.services__item:nth-of-type(3) { transition-delay: 1.8s; }
.services__item:nth-of-type(4) { transition-delay: 2.1s; }
.services__item:nth-of-type(5) { transition-delay: 2.4s; }
.services__item:nth-of-type(6) { transition-delay: 2.7s; }

.services__item-check {
    font-size: 2vw;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 2.1vw;
    min-width: 2.1vw;
    height: 2.1vw;
    border: 4px solid var(--color-primary);
    margin-inline: 0 1.5vw;
    transition: .3s all ease;
    transition-delay: 1.6s;
}

.services__item:nth-of-type(2) .services__item-check { transition-delay: 1.9s; }
.services__item:nth-of-type(3) .services__item-check { transition-delay: 2.2s; }
.services__item:nth-of-type(4) .services__item-check { transition-delay: 2.5s; }
.services__item:nth-of-type(5) .services__item-check { transition-delay: 2.8s; }
.services__item:nth-of-type(6) .services__item-check { transition-delay: 3.1s; }

.services__item-text {
    font-family: var(--font-family-light);
    font-size: 1.3vw;
}

.services-large .services__content:nth-of-type(1) {
    width: 42vw;
}

.services-large .services__content:nth-of-type(2) {
    width: 30vw;
}

.services__texts-large {
    margin-inline: auto;
    width: 40vw;
}

.services__content:nth-of-type(2) .services__images {
    margin-inline: 5vw auto;
}

.active .servicesImages { transform: translateX(0) translateY(0); opacity: 1; }
.out .servicesImages { transform: translateX(-20vw) translateY(10vh); opacity: 0; }
.active .servicesSubtitle { transform: translateX(0); opacity: 1; }
.out .servicesSubtitle { transform: translateX(20vw); opacity: 0; }
.active .servicesTitle { transform: translateX(0); opacity: 1; }
.out .servicesTitle { transform: translateX(20vw); opacity: 0; }
.active .servicesText { transform: translateX(0); opacity: 1; }
.out .servicesText { transform: translateX(20vw); opacity: 0; }

.active .services__images { transform: translateX(0) translateY(0); opacity: 1; }
.out .services__images { transform: translateX(-20vw) translateY(10vh); opacity: 0; }
.active .services__subtitle { transform: translateX(0); opacity: 1; }
.out .services__subtitle { transform: translateX(20vw); opacity: 0; }
.active .services__title { transform: translateX(0); opacity: 1; }
.out .services__title { transform: translateX(20vw); opacity: 0; }
.active .services__text { transform: translateX(0); opacity: 1; }
.out .services__text { transform: translateX(20vw); opacity: 0; }
.active .services__item { opacity: 1; }
.out .services__item { opacity: 0; }
.active .services__item-check { opacity: 1; }
.out .services__item-check { opacity: 0; }

/* Portfolio */
.portfolio {
    display: flex;
    align-items: center;
    width: 100vw;
    flex-direction: column;
    position: relative;
    background: var(--color-light);
    padding-block: 6vw;
    overflow-x: hidden;
}

.portfolio-rule {
    width: 100vw;
    height: auto;
    position: absolute;
    top: 0;
    transform: rotate(180deg);
}

.portfolio__subtitle {
    color: var(--color-primary);
    font-size: 1.2vw;
    transition: .3s all ease;
}

.portfolio__title {
    font-family: var(--font-family-regular);
    font-size: 2.7vw;
    font-weight: 600;
    margin-block: 1vw;
    transition: .3s all ease;
    transition-delay: .3s;
}

.portfolio__text {
    width: 75%;
    margin-inline: auto;
    font-family: var(--font-family-light);
    font-size: 1.4vw;
    text-align: center;
    transition: .3s all ease;
    transition-delay: .7s;
}

.portfolio__items {
    display: flex;
    width: 90vw;
    align-items: center;
    justify-content: center;
    margin-block: 3vw 0;
    margin-inline: .6vw;
}

.portfolio__images {
    display: flex;
    width: 20vw;
    height: 20vw;
    position: relative; 
}

.portfolio__item {
    display: flex;
    width: 20vw;
    height: auto;
    position: relative;
    margin-inline: .8vw;
    overflow: hidden;
    border: 1px solid var(--color-primary);
    transition: .3s all ease;
    transition-delay: .7s;
}

.portfolio__item:nth-of-type(2) { transition-delay: 1.1s; }
.portfolio__item:nth-of-type(3) { transition-delay: 1.5s; }
.portfolio__item:nth-of-type(4) { transition-delay: 1.9s; }

.portfolio__item:after {
    content: '';
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: var(--color-secundary);
    opacity: .5;
    z-index: 250;
}

.portfolio__item:before {
    content: '';
    width: 100%;
    height: 100%;
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    background: var(--color-secundary);
    opacity: .5;
    z-index: 500;
}

.portfolio__item:hover:after {
    display: flex;
}

.portfolio__item:hover .portfolio__img {
    transform: scale(1.1);
}

.portfolio__item:hover .portfolio__data {
    transform: scale(1);
}

.portfolio__img {
    width: 20vw;
    height: 20vw;
    object-fit: cover;
    height: auto;
    transition: .3s all ease;
    position: absolute;
    top: 0;
    left: 0;
}

.portfolio__data {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 700;
    transition: .4s all ease;
    transform: scale(0);
}

.portfolio__data-text {
    color: var(--color-white);
    font-family: var(--font-family-light);
    font-size: 1.2vw;
}

.portfolio__data-title {
    color: var(--color-white);
    font-family: var(--font-family-bold);
    font-size: 1.5vw;
    line-height: 1.2;
    text-align: center;
    margin-block: 1.7vw 0;
    margin-inline: 1vw;
}

.active .portfolio__subtitle { transform: translateX(0) translateY(0); opacity: 1; }
.out .portfolio__subtitle { transform: translateX(20vw) translateY(10vh); opacity: 0; }
.active .portfolio__title { transform: translateX(0) translateY(0); opacity: 1; }
.out .portfolio__title { transform: translateX(20vw) translateY(10vh); opacity: 0; }
.active .portfolio__text { transform: translateX(0) translateY(0); opacity: 1; }
.out .portfolio__text { transform: translateX(20vw) translateY(10vh); opacity: 0; }
.active .portfolio__item { opacity: 1; }
.out .portfolio__item { opacity: 0; }

/* Chppse */
.choose {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100vw;
    height: auto;
    background: var(--color-back);
    padding-block: 6vw;
    overflow-x: hidden;
}

.choose__content {
    display: flex;
    width: max-content;
    height: max-content;
}

.choose__texts {
    display: flex;
    flex-direction: column;
    width: 32vw;
    margin-inline: 0 3vw;
}

.choose__subtitle {
    color: var(--color-primary);
    font-size: 1.2vw;
    transition: .3s all ease;
}

.choose__title {
    font-family: var(--font-family-regular);
    font-size: 2.7vw;
    font-weight: 600;
    margin-block: 1vw;
    transition: .3s all ease;
    transition-delay: .5s;
}

.choose__text {
    color: var(--color-secundary);
    font-family: var(--font-family-light);
    font-size: 1.4vw;
    transition: .3s all ease;
    transition-delay: .8s;
}

.choose__items {
    display: flex;
    width: 44vw;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.choose__item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 16vw;
    height: 15vw;
    margin: 2vw;
    border: 4px solid var(--color-light);
    position: relative;
    transition: .3s all ease;
    transition-delay: 1s;
}

.choose__item:nth-of-type(2) { transition-delay: 1.3s; }
.choose__item:nth-of-type(3) { transition-delay: 1.6s; }
.choose__item:nth-of-type(4) { transition-delay: 1.9s; }

.choose__item:after {
    content: '';
    display: flex;
    width: 2.3vw;
    height: .6vw;
    background: var(--color-primary);
    position: absolute;
    top: -1.3vw;
    left: -1.3vw;
}


.choose__item:before {
    content: '';
    display: flex;
    width: .6vw;
    height: 2.3vw;
    background: var(--color-primary);
    position: absolute;
    top: -1.3vw;
    left: -1.3vw;
}

.choose__item-title {
    color: var(--color-primary);
    font-family: var(--font-family-bold);
    font-size: 2vw;
    margin-block: .5vw 0;
    margin-inline: 1vw;
}

.choose__item-subtitle {
    color: var(--color-secundary);
    font-family: var(--font-family-bold);
    font-size: 1.4vw;
    margin-block: .5vw 1vw;
    margin-inline: 1vw;
}

.choose__item-text {
    font-family: var(--font-family-regular);
    font-size: 1.2vw;
    margin-inline: 1vw;
}

.active .choose__subtitle { transform: translateX(0) translateY(0); opacity: 1; }
.out .choose__subtitle { transform: translateX(20vw) translateY(10vh); opacity: 0; }
.active .choose__title { transform: translateX(0) translateY(0); opacity: 1; }
.out .choose__title { transform: translateX(20vw) translateY(10vh); opacity: 0; }
.active .choose__text { transform: translateX(0) translateY(0); opacity: 1; }
.out .choose__text { transform: translateX(20vw) translateY(10vh); opacity: 0; }
.active .choose__item { transform: translateX(0) translateY(0); opacity: 1; }
.out .choose__item { transform: translateX(20vw) translateY(10vh); opacity: 0; }

/* Clietns */
.clients {
    display: flex;
    flex-direction: column;
    width: 100vw;
    padding-block: 5vw 0;
    align-items: center;
    justify-content: center;
    background: var(--color-white);
    position: relative;
    overflow-x: hidden;
}

.clients__subtitle {
    color: var(--color-primary);
    font-size: 1.2vw;
    transition: .3s all ease;
}

.clients__title {
    font-family: var(--font-family-regular);
    font-size: 2.7vw;
    font-weight: 600;
    margin-block: 1vw;
    transition: .3s all ease;
    transition-delay: .5s;
}

.clients__text {
    color: var(--color-secundary);
    font-family: var(--font-family-light);
    font-size: 1.4vw;
    transition: .3s all ease;
    transition-delay: .8s;
}

.clients__items {
    display: flex;
    justify-content: center;
    width: 90vw;
    margin-block: 4vw 6vw;
}

.clients__item {
    display: flex;
    flex-direction: column;
    margin-inline: 1.5vw;
    transition: .4s all ease;
    transition-delay: 1s;
}

.clients__item:nth-of-type(2) { transition-delay: 1.3s; }
.clients__item:nth-of-type(3) { transition-delay: 1.6s; }
.clients__item:nth-of-type(4) { transition-delay: 1.9s; } 

.clients__item-name {
    font-family: var(--font-family-bold);
    color: var(--color-secundary);
    font-size: 1.3vw;
}

.clients__item-stars {
    display: flex;
    align-items: center;
}

.clients__item-star {
    width: 1vw;
    margin-inline: 0 .3vw;
    margin-block: .5vw 1vw;
}

.clients__item-text {
    color: var(--color-secundary);
    font-family: var(--font-family-light);
    font-size: 1.2vw;
    width: 15vw;
    height: auto;
    padding: 1vw;
    background: var(--color-back);
}

.clients .home__call {
    width: 100vw;
    position: relative;
    bottom: 0;
    padding-block: 1vw 1.5vw;
}

.active .clients__subtitle { transform: translateX(0) translateY(0); opacity: 1; }
.out .clients__subtitle { transform: translateX(20vw) translateY(10vh); opacity: 0; }
.active .clients__title { transform: translateX(0) translateY(0); opacity: 1; }
.out .clients__title { transform: translateX(20vw) translateY(10vh); opacity: 0; }
.active .clients__text { transform: translateX(0) translateY(0); opacity: 1; }
.out .clients__text { transform: translateX(20vw) translateY(10vh); opacity: 0; }
.active .clients__item { transform: translateX(0) translateY(0); opacity: 1; }
.out .clients__item { transform: translateX(20vw) translateY(10vh); opacity: 0; }


/* Footer */
.footer {
    display: flex;
    align-self: center;
    justify-content: center;
    width: 100vw;
    padding-block: .5vw .2vw;
    overflow-x: hidden;
}

.footer__text {
    color: var(--color-secundary);
    font-family: var(--font-family-light);
    font-size: 1.2vw;
}

.footer__link {
    color: var(--color-primary);
    font-family: var(--font-family-light);
    font-size: 1.2vw;
    text-decoration: underline;
    margin-inline: 1vw 0;
    transition: .3s all ease;
}

.footer__link:hover {
    transform: scale(1.05);
}

.footer__float {
    position: fixed;
    bottom: .8vw;
    right: 1vw;
    width: max-content;
    z-index: 5900;
}

.footer__social {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.7vw;
    aspect-ratio: 1;
    height: auto;
    padding: .5vw;
    margin-block: .5vw;
    position: relative;
    background: var(--color-primary);
    border: 1px solid var(--color-white);
    border-radius: 50%;
}

.footer__logo {
    width: 100%;
    filter: invert(1);
}

/* Success */
.query__success {
    display: flex;
    width: 100vw;
    height: 100vh;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    transition: .3s all ease;
    transform: scale(0);
}

.query__success-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 30vw;
    height: max-content;
    background: var(--color-back);
    position: relative;
    z-index: 100;
    border: .5px solid var(--color-black);
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    overflow: hidden;
}

.query__success-third {
    display: flex;
    width: 10vw;
    height: 3.5vw;
    border: 2px solid var(--color-black);
    position: absolute;
    top: 0;
    right: -3vw;
    transform: rotate(45deg);
}

.query__success-back {
    display: flex;
    width: 10vw;
    height: 3vw;
    border: 2px solid var(--color-black);
    background: var(--color-primary);
    position: absolute;
    top: 0;
    right: -3vw;
    transform: rotate(45deg);
}

.query__success-img {
    width: 10vw;
    margin-block: 3vw 1vw;
}

.query__success-title {
    font-family: var(--font-family-bold);
    font-size: 1.5vw;
    text-align: center;
    max-width: 25vw;
    margin-block: 0 3vw;
}

@media screen and (max-width: 600px) {
    .header { padding-block: 0; margin-block: 0 3vw; position: sticky; top: 0; left: 0; z-index: 99000; }
    .header__items { width: 90%; padding-block: 0; }
    .header__icons { width: 35vw; margin-inline: 2vw auto; }
    .header__item { width: 4.5vw; margin-inline: 3vw; }
    .header__category { display: flex; padding-inline: 0; margin-inline: 3vw 0; border: none; }
    .header__category-lines { margin-inline: 0; }
    .header__category-text { font-size: 4.6vw; margin-inline: 0 2vw; }
    .header__category-lines { height: 16px; }
    .header__category-l1, .header__category-l2, .header__category-l3 { height: 2px; }
    .header__category-l1 { transform: translate(-50%, -6px); }
    .header__list {
        width: 100vw;
        height: 100vh;
        background: var(--color-white);
        position: fixed;
        top: 0;
        left: 0;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        transform: translateY(-102vh);
    }

    .header__list-active { transform: translateY(0); }
    .headarItemRespo { display: none; }
    .header__list-content { display: flex; position: relative; padding-block: 0; border: none; top: 0; left: 0; }
    .header__list-item { font-size: 5vw; margin-block: 3vw; }
    .header__list-phones { display: none; }
    .header__call { display: none; }
    /* Home */
    .home { flex-direction: column-reverse; padding-block: 6vw; margin-block: 0 22vw; }
    .home__content {  width: 100%; justify-content: center; }
    .home__data { width: 85vw; }
    .home__subtitle { font-size: 3.2vw; }
    .home__subtitle-footer { z-index: 900; display: flex; background: var(--color-light); width: 100vw; font-size: 3vw; padding-block: 1vw; justify-content: center; position: absolute; border-block: .5px solid var(--color-primary); bottom: 23vw; }
    .home__title { font-size: 7vw; margin-block: 3vw 7vw; }
    .home__item { width: 35vw; height: 24vw; margin-inline: 3vw; }
    .home__item:before { width: 1vw; height: 5vw; top: -3vw; left: -3vw; }
    .home__item:after { height: 1vw; width: 5vw; top: -3vw; left: -3vw; }
    .home__item:nth-of-type(2) .home__price { text-align: end; margin-inline: 1vw 5vw; }
    .home__text { font-size: 3.5vw; margin-inline: 3vw; }
    .home__text b { font-size: 3vw; }
    .home__price { font-size: 4.5vw; margin-inline: 3vw; margin-block: 3vw 0; }
    .home__image { width: 74vw; margin-block: -14vw 2vw; z-index: 15; }
    .home__call { flex-direction: column; width: 100vw; padding-block: 4vw; bottom: -17vw; z-index: 30; }
    .home__call-texts { width: 80vw; margin-inline: auto; }
    .home__call-datas { width: 80vw; }
    .home__call-title { font-size: 5vw; }
    .home__call-subtitle { font-size: 3vw; }
    .home__call-text { display: none; }
    .home__call-inputs { margin-block: 1vw; margin-inline: 0 3vw; }
    .home__call-inputs-adv:after { width: calc(100% + 1vw); height: calc(100% + 1vw); top: -0.5vw; left: -0.5vw; }
    .home__call-input { font-size: 3vw; padding: .3vw 3vw; width: 40vw; margin-inline: 0; }
    .home__call-btn { font-size: 4vw; font-family: var(--font-family-bold); padding: 1vw 5vw; margin-block: 4vw 3vw; }
    /* Services */
    .services { flex-direction: column; padding-block: 6vw 0; margin-block: 0; }
    .services__content { width: 100%; }
    .services__images { width: 80vw; margin-inline: auto; }
    .services__texts { width: 95vw; margin-inline: auto; margin-block: 8vw 0; }
    .services__subtitle { font-size: 3.2vw; width: 85vw; margin-inline: auto; }
    .services__title { font-size: 7vw; margin-block: 2vw 4vw; width: 85vw; margin-inline: auto; }
    .services__text { font-size: 3.8vw; width: 85vw; margin-inline: auto; }
    .services-large { padding-block: 0; flex-direction: column-reverse; }
    .services-large .services__content:nth-of-type(1) { width: 95vw; }
    .services-large .services__content:nth-of-type(2) { width: 80vw; margin-block: 10vw 0; }
    .services__content:nth-of-type(2) .services__images { margin-inline: auto; }
    .services__items { width: 95vw; margin-block: 6vw 8vw; }
    .services__item { width: 41vw; margin: 2vw 3vw; }
    .services__item-check { font-size: 4vw; width: 5.5vw; min-width: 5.5vw; height: 5.5vw; border: 3px solid var(--color-primary); }
    .services__item-text { font-size: 3vw; }
    /* Portfolio */
    .portfolio { padding-block: 8vw; }
    .portfolio__subtitle { font-size: 3.2vw; }
    .portfolio__title { font-size: 7vw; margin-block: 2vw 4vw; }
    .portfolio__text { font-size: 3.8vw; width: 85vw; text-align: center; }
    .portfolio__items { margin-block: 6vw 0; flex-wrap: wrap; }
    .portfolio__images { width: 43vw; height: 43vw; }
    .portfolio__img { width: 43vw; height: 43vw; }
    .portfolio__item { width: 40vw; margin: 2vw; }
    .portfolio__item { border: .5px solid var(--color-primary); }
    .portfolio__item:after { opacity: 0.3; }
    .portfolio__item:after { display: flex; }
    .portfolio__data { transform: scale(1); }
    .portfolio__data-text { font-size: 2.8vw; }
    .portfolio__data-title { font-size: 3.2vw; margin-block: 4vw 0; margin-inline: 3vw; }
    /* Choose */
    .choose { padding-block: 8vw; flex-direction: column; }
    .choose__texts { width: 85vw; margin-inline: auto; }
    .choose__subtitle { font-size: 3.2vw; text-align: center; }
    .choose__title { font-size: 7vw; margin-block: 2vw 4vw; text-align: center; }
    .choose__text { font-size: 3.8vw; max-width: 85vw; text-align: center; }
    .choose__items { margin-block: 6vw 0; width: 100vw; }
    .choose__item { width: 38vw; height: 32vw; margin: 3.5vw; }
    .choose__item:before { width: 1vw; height: 5vw; top: -3vw; left: -3vw; }
    .choose__item:after { height: 1vw; width: 5vw; top: -3vw; left: -3vw; }
    .choose__item-title { margin-inline: 3vw; font-size: 5vw; }
    .choose__item-subtitle { margin-block: 1vw 2vw; font-size: 3.2vw; margin-inline: 3vw; }
    .choose__item-text { font-size: 2.8vw; margin-inline: 3vw; }
    /* Clients */
    .clients { padding-block: 8vw 0; flex-direction: column; }
    .clients__texts { width: 85vw; margin-inline: auto; }
    .clients__subtitle { font-size: 3.2vw; text-align: center; }
    .clients__title { font-size: 7vw; margin-block: 2vw 4vw; text-align: center; }
    .clients__text { font-size: 3.8vw; max-width: 90vw; text-align: center; }
    .clients__items { width: 100vw; flex-wrap: wrap; margin-block: 6vw; }
    .clients__item { margin: 4vw; }
    .clients__item-name { font-size: 2.8vw; }
    .clients__item-stars { margin-block: .5vw 1.5vw; }
    .clients__item-star { width: 2.5vw; }
    .clients__item-text { padding: 2vw 4vw; width: 30vw; font-size: 2.5vw; }
    .clients .home__call { padding: 4vw 0; }
    /* Footer */
    .footer { padding: 1vw 0; }
    .footer__text { font-size: 2.5vw; }
    .footer__link { font-size: 2.5vw; }
    .footer__float { right: 1.4vw; }
    .footer__social { width: 6vw; padding: 2vw; margin-block: 1.4vw; }
    /* Success */
    .query__success-container { width: 65vw; padding: 2vw 4vw; }
    .query__success-third { width: 50vw; height: 30vw; top: -20vw; right: -20vw; }
    .query__success-back { width: 50vw; height: 30vw; top: -20vw; right: -22vw; }
    .query__success-img { width: 30vw; margin-block: 6vw; }
    .query__success-title { font-size: 3.8vw; max-width: 50vw; margin-block: 0 6vw; }
}