/* #region Fonts */

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

body {
    font-family: 'Poppins', sans-serif !important;
    overflow-x: clip;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    overflow-x: clip;
}

/* #endregion */
  

/* #region Global */

:root {
    --color-blue: #1c317f;
    --color-light-blue: #13cfe1;
    --color-red: #ef0505;
    --color-white: #ffffff;
    --color-text: #231f20;
    --color-orange: #f58220;
    --color-vlight-blue: #e7f6fc;

    --color-gray-1: #ebebeb;
    --color-gray-2: #f4f4f4;
    --color-gray-3: #f1f1f1;
    --color-gray-4: #b6b6b6;
    --color-gray-5: #f6f6f6;
    --color-gray-6: #4e5562;
    --color-gray-7: #dddddd;

    --color-footer-bg: #424242;

    --h2-size: 3.5em;
    --h3-size: 2em;
    --h5-size: 0.95em;
    --p-size: 1.2em;
    --sml-p-size: 1em;
    --big-p-size: 1.2em;
    --topbar-fontsize: 0.95em;
    --counter-size: 2.7em;
    --video-title-size: 2.5em;
    --job-title-size: 1.5em;
    --blog-title-size: 2.5em;


    --site-ara-space: 100px;
}

@media (max-width: 1280px) {
    :root {
        --counter-size: 2em;
    }
}

@media (max-width: 1024px) {
    :root {
        --video-title-size: 2em;

        --h2-size: 2.5em;
    }
}

@media (max-width: 600px) {
    :root {
        --p-size: 1em;
        --h2-size: 2em;

        --job-title-size: 1em;

        --site-ara-space: 50px;
    }
    h3 {
        font-size: 1.8em;
    }
}

@media (max-width: 450px) {
    :root {
        --video-title-size: 1.8em;
    }
}


.bg-gray {
    background-color: var(--color-gray-3);
}

.color-blue {
    color: var(--color-blue);
}

.cursor-pointer {
    cursor: pointer;
}

/* #endregion */


/* #region Max Width */

.mw-870 {
    max-width: 870px;
}

.mw-980 {
    max-width: 980px;
}

.mw-1000 {
    max-width: 1000px;
}

/* #endregion */


/* #region Padding & Margin */

.pv-site {
    padding-top: var(--site-ara-space);
    padding-bottom: var(--site-ara-space);
}

.pb-site {
    padding-bottom: var(--site-ara-space);
}

.pt-site {
    padding-top: var(--site-ara-space);
}

.pt-site-half {
    padding-top: calc(var(--site-ara-space) / 2);
}

.pb-site-half {
    padding-bottom: calc(var(--site-ara-space) / 2);
}

.pv-site-half {
    padding-top: calc(var(--site-ara-space) / 2);
    padding-bottom: calc(var(--site-ara-space) / 2);
}

/* #endregion */


/* #region Animations */

@keyframes turner-360 {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@keyframes up-down-hal {
    0% {
        transform: translate(25%, -40%);
    }
    50% {
        transform: translate(25%, -30%);
    }
    100% {
        transform: translate(25%, -40%);
    }
}

@keyframes phone-btn-anim {
    0% {
        transform: rotate(0deg) translate(0px, 0);
    }
    5% {
        transform: rotate(10deg) translate(3px, 0);
    }
    10% {
        transform: rotate(-10deg) translate(-3px, 0);
    }
    15% {
        transform: rotate(10deg) translate(3px, 0);
    }
    20% {
        transform: rotate(-10deg) translate(-3px, 0);
    }
    25% {
        transform: rotate(0deg) translate(0, 0);
    }
    100% {
        transform: rotate(0deg) translate(0, 0);
    }
}

@keyframes up-down-30 {
    0% {
        transform: translateY(0);
    }
    25% {
        transform: translateY(15px);
    }
    50% {
        transform: translateY(0);
    }
    75% {
        transform: translateY(-15px);
    }
    100% {
        transform: translateY(0);
    }
}

@keyframes down-60 {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(60px);
    }
    100% {
        transform: translateY(0);
    }
}

@keyframes banner-anim-circle-1 {
    0% {
        transform: translate(-50%, -50%) scale(1) rotate(0deg);
    }
    25% {
        transform: translate(-50%, -60%) scale(1.2) rotate(90deg);
    }
    50% {
        transform: translate(-50%, -70%) scale(1) rotate(180deg);
    }
    75% {
        transform: translate(-50%, -40%) scale(1.2) rotate(270deg);
    }
    100% {
        transform: translate(-50%, -50%) scale(1) rotate(360deg);
    }
}

@keyframes banner-border-anim-circle-1 {
    0% {
        -webkit-backdrop-filter: blur(10px);
        border: calc(100dvw * 0.005) solid rgba(255, 255, 255, 0.1);
    }
    25% {
        -webkit-backdrop-filter: blur(15px);
        border: calc(100dvw * 0.0075) solid rgba(255, 255, 255, 0.1);
    }
    50% {
        -webkit-backdrop-filter: blur(10px);
        border: calc(100dvw * 0.005) solid rgba(255, 255, 255, 0.1);
    }
    75% {
        -webkit-backdrop-filter: blur(15px);
        border: calc(100dvw * 0.0075) solid rgba(255, 255, 255, 0.1);
    }
    100% {
        -webkit-backdrop-filter: blur(10px);
        border: calc(100dvw * 0.005) solid rgba(255, 255, 255, 0.1);
    }
}

/* #endregion */


/* #region Buttons */

.btn {
    padding: 15px 45px;
    border-radius: 14px;
    font-weight: 500;
    font-size: var(--h5-size);
    display: block;
    width: fit-content;
    height: fit-content;
    transition: all 0.3s linear;
}

.home-slider-area .btn {
    padding: 15px 30px;
}

.btn.bg-blue {
    background-color: var(--color-blue);
    color: var(--color-white);
}

.btn.bg-blue:hover {
    background-color: var(--color-light-blue);
}

.btn.bg-red {
    background-color: var(--color-red);
    color: var(--color-white);
}

.btn.bg-red:hover {
    background-color: var(--color-blue);
}

.btn.bg-orange {
    background-color: var(--color-orange);
    color: var(--color-white);
}

.btn.bg-orange:hover {
    background-color: var(--color-blue);
}

.btn.bg-white {
    background-color: var(--color-white);
    color: var(--color-text);
}

.btn.bg-white:hover {
    background-color: var(--color-light-blue);
    color: var(--color-white);
}

.btn.brdr-white {
    border: 1px solid var(--color-white);
    padding: 14px 29px;
}

.btn.brdr-white:hover {
    border-color: var(--color-light-blue);
}

.btn.bg-gray {
    background-color: var(--color-gray-6);
    color: var(--color-white);
}

.btn.bg-gray:hover {
    background-color: var(--color-light-blue);
}

.btn.brdr-blue {
    border: 1px solid var(--color-blue);
    padding: 14px 29px;
}

.btn.brdr-blue:hover {
    background-color: var(--color-blue);
    color: var(--color-white);
}

.phone-btn {
    width: 70px;
    height: 70px;
    background-color: var(--color-red);
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.phone-btn img {
    width: 50%;
    height: 50%;
}

select.btn {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url('../images/select_arrow_white.svg');
    background-size: 15px;
    background-repeat: no-repeat;
    background-position: right 20px center;
    outline: none;
}

select.btn:focus {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

@media (max-width: 600px) {
    .btn {
        padding: 10px 20px;
    }
    .phone-btn {
        width: 50px;
        height: 50px;
    }
    .home-slider-area .btn {
        margin-top: 10px;
    }
}

/* #endregion */


/* #region Text Elements */

h1 {
    font-size: var(--h2-size);
    line-height: 1.05;
}

h2 {
    font-size: var(--h2-size);
    line-height: 1.05;
}

h3 {
    font-size: var(--h3-size);
    line-height: 1.05;
}

h5 {
    font-size: var(--h5-size);
    font-weight: 500;
}

p {
    font-size: var(--p-size);
    line-height: 1.5;
}

p.bold {
    font-weight: 600;
}

p.sml-p {
    font-size: var(--sml-p-size);
}

strong {
    font-weight: 600 !important;
}

/* #endregion */


/* #region Container */

@media (min-width: 1300px) {
    .container {
        max-width: 1280px;
    }
}

/* #endregion */


/* #region Topbar */

.topbar {
    background-color: var(--color-blue);
    padding: 15px 0;
    z-index: 99;
    position: relative;
}

[data-home="true"] .topbar {
    display: none;
}

.topbar .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.topbar .container * {
    color: #fff;
    font-size: var(--topbar-fontsize);
    font-weight: 300;
    margin: 0;
}

.topbar-social-icon {
    width: 20px;
    height: 20px;
}

.topbar-right {
    display: flex;
    gap: 20px;
}

@media (max-width: 450px) {
    .tb-mbl-hdn {
        display: none;
    }
}

/* #endregion */


/* #region Header */

header {
    padding: 30px 0;
    background-color: var(--color-white);
    z-index: 100;
    position: sticky;
    top: 0;
    left: 0;
    transition: all 0.3s linear;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 5px 10px;
}

[data-home="true"] header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
}

.home header {
    position: fixed;
    background-color: transparent;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    box-shadow: none;
}

.home.home-slider-txt-color-black header .hdrr-btn span {
    color: var(--color-text);
}
.home.home-slider-txt-color-black header .hdrr-btn-icon {
    filter: brightness(0) invert(0);
}


.home .menu-btn {

    height: 55px;
    background-color: transparent;
}

.home .menu-btn .mbtn-line {
    height: 4px;
    width: 30px;
    box-shadow: 0px 0px 8px rgba(256, 256, 256, 0.5);
}

.menu-btn {
    width: 50px;
    height: 50px;
    flex-shrink: 0;
    background-color: var(--color-gray-1);
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 15px;
    cursor: pointer;
    transition: all 0.3s linear;
}

.menu-btn .mbtn-line {
    width: 50%;
    height: 2px;
    background-color: var(--color-blue);
    transition: all 0.2s ease-in-out;
}

.menu-btn .mbltn2 {
    width: 75%;
}

.big-menu-opened .menu-btn .mbtn-line {
    width: 100%;
}

.header-logo,
.header-logo img {
    width: 250px;
    height: auto;
    object-fit: contain;
}

.header-logo img {
    filter: drop-shadow(0px 0px 44px rgba(256, 256, 256, 0.2));
}

.hdrr-btn-icon {
    width: 25px;
    height: 25px;
    transition: all 0.3s linear;
}

.hdrr-btn {
    display: flex;
    align-items: center;
    gap: 10px;
}

.hddr-btnbg span,
.hdrr-btn span {
    font-size: var(--h5-size);
    color: var(--color-text);
    transition: all 0.3s linear;
}

.hddr-btnbg {
    background-color: var(--color-blue);
    padding: 20px 50px;
    border-radius: 64px;
    transition: all 0.3s linear;
}

.hddr-btnbg:hover {
    background-color: var(--color-light-blue);
}

.hddr-btnbg span {
    color: var(--color-white);
}

.header-right {
    display: flex;
    align-items: center;
    gap: 20px;
}

.home .hdrr-btn span {
    color: var(--color-white);
}

.home .hddr-btnbg {
    background-color: var(--color-red);
}

.home .hddr-btnbg:hover {
    transform: scale(1.05);
}

.home .hdrr-btn-icon {
    filter: brightness(0) invert(1);
}

.hdr-langs {
    position: absolute;
    top: 100%;
    left: 50%;
    background-color: var(--color-white);
    box-shadow: 0 17px 15px 6px rgba(0, 0, 0, 0.2);
    padding: 10px;
    border-radius: 0 0 10px 10px;
    transform: translateY(10px) translateX(-50%) scale(0.9);
    opacity: 0;
    transition: all 0.2s linear;
    visibility: hidden;
    z-index: 9999;
}

.hdr-langs a {
    padding: 5px 15px;
    display: block;
    color: var(--color-text);
    font-size: var(--p-size);
    transition: all 0.2s linear;
}

.hdr-langs a:hover {
    background-color: var(--color-blue);
    color: var(--color-white);
}

.hdrr-btn-lng:hover .hdr-langs {
    transform: translateY(10px) translateX(-50%) scale(1);
    opacity: 1;
    visibility: visible;
}

@media (max-width: 768px) {
    .hddr-btnbg,
    .hdrr-btn-lng {
        display: none;
    }
}

@media (max-width: 500px) {
    .hdrr-btn span {
        display: none;
    }
    .header-logo img,
    .header-logo {
        width: 200px;
    }
}

/* #endregion */


/* #region Home Slider */

.home-slider-area {
    z-index: 5;
}

.home-slider-area .home-slider-img {
    width: 100%;
    object-fit: cover;
    aspect-ratio: 2560/1160;
    object-position: center;
    max-height: calc(100dvh - 80px);
}

.home-slider {
    width: 100%;
}

.home-slider-pagination {
    position: absolute;
    bottom: 55px;
    left: 55px;
    display: flex;
    gap: 15px;
    flex-direction: column;
}

.home-slider-area .swiper-pagination-bullet {
    background-color: transparent;
    border-radius: 100%;
    font-size: var(--h5-size);
    opacity: 1;
    width: 60px;
    height: 60px;
    margin: 0 5px;
    cursor: pointer;
    display: block;
    position: relative;
    counter-increment: home-slider-bullet;
    transition: all 0.2s ease-in-out;
}

.home-slider-txt-color-black .swiper-pagination-bullet {
    background-color: rgba(0, 0, 0, 0.2);
}

.home-slider-area .swiper-pagination-bullet-active {
    background-color: rgba(0, 0, 0, 0.4);
}

.home-slider-area .swiper-pagination-bullet::before {
    content: "0"counter(home-slider-bullet);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 20px;
    color: var(--color-white);
}

.hslider-email {
    position: absolute;
    transform: rotate(-90deg) translate(-100%, 0);
    top: 112px;
    left: 60px;
    transform-origin: left top;
    display: flex;
    align-items: center;
    gap: 10px;
}

.hslider-email img {
    width: 20px;
    height: 20px;
}

.hslider-email a {
    color: var(--color-white);
    font-size: var(--h5-size);
    transition: all 0.3s linear;
}

.hsel {
    width: 40px;
    height: 1px;
    background-color: var(--color-white);
}

.home-slider-content {
    position: absolute;
    top: 0;
    left: 50%;
    height: 100%;
    transform: translateX(-50%);
    z-index: 1;
    display: flex;
    align-items: center;
}

.home-slider-content-inner {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    max-width: 48%;
    width: fit-content;
}

.home-slider-content-inner h2,
.home-slider-content-inner p {
    color: var(--color-white);
    width: 100%;
}

.home-slider-content-inner p {
    font-size: var(--big-p-size);
}

@media (max-width: 1680px) {
    .home-slider-content-inner {
        max-width: 40%;
    }
    .home-slider-area .swiper-pagination-bullet {
        width: 40px;
        height: 40px;
    }
    .home-slider-area .swiper-pagination-bullet::before {
        font-size: 14px;
    }
    .home-slider-pagination {
        left: 25px;
        bottom: 25px;
    }
    .hslider-email {
        left: 40px;
    }
}

@media (max-width: 1450px) {
    .home-slider-pagination {
        display: none;
    }
    .hslider-email {
        display: none;
    }
}

@media (max-width: 1280px) {
    .home-slider-content-inner {
        margin-top: 50px;
        max-width: 60%;
    }
    .hddr-btnbg {
        padding: 15px 42px;
    }
}

@media (max-width: 1024px) {
    .home-slider-area .home-slider-img {
        aspect-ratio: 1024/600;
    }
}

@media (max-width: 768px) {
    .home-slider-content-inner {
        gap: 15px;
        max-width: 70%;
    }
    .home-slider-area .btn {
        padding: 7px 20px;
    }
}

@media (max-width: 680px) {
    .home-slider-area .home-slider-img {
        aspect-ratio: 680/720;
    }
    .home-slider-content-inner {
        max-width: 75%;
    }
    .home-slider-area .btn {
        padding: 8px 15px;
        font-size: 0.8em;
        border-radius: 8px;
    }
    .home-slider-area .btn {
        margin-top: 20px;
    }
}

@media (max-width: 470px) {
    .home-slider-content-inner {
        max-width: 90%;
    }
    .home-slider-area .btn {
        margin-top: 5px;
    }
    .slider-title {
        font-size: 1.7em;
    }
    .home-slider-content-inner p {
        font-size: 0.9em;
    }
}

.home-slider-txt-color-black .hslider-email a {
    color: var(--color-text);
}

.home-slider-txt-color-black .hsel {
    background-color: var(--color-text);
}

.home-slider-txt-color-black .hslider-email img {
    filter: brightness(0) invert(0);
}


.home-slider-txt-color-black .home-slider-content-inner h2, 
.home-slider-txt-color-black .home-slider-content-inner p {
    color: var(--color-text);
}

.home-slider-txt-color-black .home-slider-content-inner .btn.bg-white {
    background-color: var(--color-text);
    color: var(--color-white);
}

.home-slider-txt-color-black .home-slider-content-inner .btn.bg-white:hover {
    background-color: var(--color-light-blue);
    color: var(--color-white);
}

/* #endregion */


/* #region Slider Sub Counter */

.slider-sub-counter-area {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    margin-top: -65px;
    z-index: 6;
}

.ssc-item {
    width: calc(25% - 44px);
    aspect-ratio: 280/125;
    background-color: var(--color-blue);
    border-radius: 20px;
    border: 7px solid var(--color-white);
    display: flex;
    align-items: center;
    padding: 20px;
    position: relative;
    
}

.ssc-item-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.ssc-item-inner .counter {
    font-size: var(--counter-size);
    color: var(--color-white);
    font-weight: 600;
    display: block;
}

.ssc-item-inner p {
    color: var(--color-white);
    font-size: var(--p-size);
    font-weight: 600;
    max-width: 150px;
}

.ssc-plus {
    width: 30px;
    height: 30px;
    background-color: transparent;
    position: relative;
    margin-bottom: 2px;
    margin-top: 12px;
}

.ssc-plus::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 5px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: var(--color-white);
}

.ssc-plus::after {
    content: "";
    position: absolute;
    width: 5px;
    height: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: var(--color-white);
}

.last-ssc-body-area {
    position: absolute;
    width: 135px;
    height: 135px;
    top: 0;
    right: 0;
    background-color: var(--color-blue);
    border-radius: 100%;
    transform: translate(50%, -10%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.last-ssc-body-area img {
    height: 70%;
}

.ssc-body-a {
    width: fit-content;
    height: fit-content;
    position: relative;
}

.ssc-body-a .ssc-arm {
    position: absolute;
    width: 15px;
    height: 26px;
    border: 3px solid white;
    border-top: none;
    border-right: none;
    border-bottom-left-radius: 10px;
    top: 0;
    left: 6px;
    transform: rotate(0deg);
    z-index: -1;
    transform-origin: bottom right;
    animation: ssc-arm-turner 1.5s linear infinite;
}

@keyframes ssc-arm-turner {
    0% {
        transform: rotate(-20deg);
    }
    50% {
        transform: rotate(10deg);
    }
    100% {
        transform: rotate(-20deg);
    }
}

.spm {
    display: none;
}

@media (max-width: 1430px) {
    .slider-sub-counter-area {
        gap: 20px;
        justify-content: center;
    }
}

@media (max-width: 1280px) {
    .slider-sub-counter-area {
        margin-top: calc(var(--site-ara-space) / 2);
        max-width: 95%;
        margin-left: auto;
        margin-right: auto;
        flex-wrap: wrap;
    }
    .ssc-item {
        box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
        width: calc(25% - 13.333px);
        height: fit-content;
        aspect-ratio: auto;
    }
    .ssc-item .last-ssc-body-area {
        width: 115px;
        height: 115px;
    }
    .ssc-item .last-ssc-body-area img {
        width: 65px;
    }
    .ssc-item-inner {
        flex-direction: column;
        align-items: flex-start;
    }
    .spm {
        display: block;
    }
    .spd {
        display: none;
    }
    .ssc-item-inner p {
        max-width: 200px;
    }
}

@media (max-width: 1200px) {
    .ssc-item {
        box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
        width: calc(33.333% - 13.333px);
        height: fit-content;
        aspect-ratio: auto;
    }
}

@media (max-width: 900px) {
    .ssc-item {
        box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
        width: calc(40% - 10px);
        height: fit-content;
        aspect-ratio: auto;
        min-height: 136px;
    }
    .last-ssc-body-area {
        top: 50%;
        transform: translate(50%, -50%);
    }
}

@media (max-width: 768px) {
    .last-ssc-body-area {
        position: relative;
        transform: none;
        background-color: transparent;
        width: fit-content !important;
        height: fit-content !important;
    }
    .ssc-item:has(.last-ssc-body-area) {
        gap: 20px;
    }
}

@media (max-width: 680px) {
    .ssc-item {
        width: calc(50% - 10px);
        max-width: 300px;
        padding: 15px;
        min-height: 100px;
        width: calc(50% - 5px);
    }
    .ssc-item-inner .counter {
        font-size: 1.7em;
    }
    .ssc-plus {
        margin-top: 4px;
    }
    .ssc-plus::before {
        height: 2.5px;
        width: 50%;
    }
    .ssc-plus::after {
        height: 50%;
        width: 2.5px;
    }
    .ssc-item-inner {
        gap: 0;
    }
    .ssc-item-inner p {
        line-height: 1.3;
    }
    .last-ssc-body-area {
        display: none;
    }
    .frst-innr {
        flex-direction: row;
        gap: 10px;
    }
    .slider-sub-counter-area {
        gap: 10px;
    }
}




/* #endregion */


/* #region ITA */

.ita {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 80px;
    position: relative;
}

.ita-img {
    width: calc(50% - 40px);
    flex-shrink: 0;
}

.ita-text {
    width: calc(50% - 40px);
    display: flex;
    flex-direction: column;
}

.ita-text.w-full {
    width: 100%;
}

.ita-text:not(.nlmt) p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 13;
    -webkit-box-orient: vertical;
}

.ita-text h5 {
    margin-bottom: 15px;
}

.ita-text h1,
.ita-text h2 {
    margin-bottom: 20px;
}

.ita-text p + .btn {
    margin-top: 40px;
}

.ita-reverse {
    flex-direction: row-reverse;
}

.anim-img {
    -webkit-mask-image: var(--anim-img-url);
    mask-image: var(--anim-img-url);
    -webkit-mask-size: cover;
    mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    overflow: hidden;
    transition: all 0.3s linear;
}

.anim-img img {
    transition: all 0.3s linear;
} 

.anim-img:hover img {
    scale: 1.1;
}

@media (max-width: 1280px) {
    .ita-text p + .btn {
        margin-top: 20px;
    }
}

@media (max-width: 768px) {
    .ita {
        flex-direction: column;
        gap: 40px;
    }

    .ita-img {
        width: 100%;
    }

    .ita-text {
        width: 100%;
    }
}

/* #endregion */


/* #region Home About */

.home-about-line {
    position: absolute;
    width: 400px;
    right: 100%;
    top: 0;
    transform: translate(25%, -35%);
    z-index: -1;
    animation: up-down-hal 6s linear infinite;
}

.home-dalga {
    position: absolute;
    width: 890px;
    bottom: 0;
    left: 0;
    z-index: -1;
    animation: down-60 6s linear infinite;
}

/* #endregion */


/* #region Home Video */

.home-video-content {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    background-color: rgba(0, 0, 0, 0.5);
    padding: 80px;
}

.home-video-title {
    color: var(--color-white);
    font-size: var(--video-title-size);
    line-height: 1.4;
    max-width: 430px;
}

.home-video-btn {
    width: 120px;
    height: 120px;
    background-color: var(--color-red);
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 20px;
    position: relative;
}

.home-video-btn::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    border: 1px solid var(--color-white);
    border-radius: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    width: 60px;
    height: 60px;
}

.home-video-turner {
    transform-origin: 100px 100px;
    animation: turner-360 10s linear infinite;
}

.home-video-img {
    width: 100%;
    height: auto;
    aspect-ratio: 1280/480;
    object-fit: cover;
}

@media (max-width: 1280px) {
    .home-video-content {
        padding: 50px;
    }
    .home-video-title {
        max-width: 630px;
    }
}

@media (max-width: 1024px) {
    .home-video-btn {
        width: 80px;
        height: 80px;
    }
    .home-video-btn svg{
        width: 70px;
        height: 70px;
    }
    .home-video-btn::before {
        width: 40px;
        height: 40px;
    }
    .home-video-img {
        width: 100%;
        object-fit: cover;
        min-height: 350px;
    }
}

/* #endregion */


/* #region Home Job Postings area */

.home-job-postings-area {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.home-job-postings-area-inner {
    gap: 100px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.hjpa-person img {
    height: 100%;
}

.hjpa-person {
    flex-shrink: 0;
}

.hjpa-content p,
.hjpa-content h5,
.hjpa-content h2 {
    color: var(--color-white);
}

.hjpa-content {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 45%;
}

@media (max-width: 1280px) {
    .hjpa-content {
        width: 70%;
        padding-bottom: calc(var(--site-ara-space) / 2);
    }
    .hjpa-person {
        width: 30%;
    }
    .home-job-postings-area-inner {
        align-items: flex-end;
    }
}

@media (max-width: 1024px) {
    .hjpa-content {
        width: 60%;
    }
    .hjpa-person {
        width: 40%;
    }
    .home-job-postings-area .container {
        max-width: 95%;
    }
}

@media (max-width: 890px) {
    .home-job-postings-area-inner {
        flex-direction: column;
        gap: 20px;
    }
    .hjpa-content {
        width: 100%;
        padding-bottom: 0;
    }
    .hjpa-person {
        width: 100%;
        justify-content: center;
        display: flex;
    }
}



/* #endregion */


/* #region Home References */

.home-references-area {
    width: 72%;
    margin: 0 auto;
}

.home-references-item {
    display: flex;
    align-items: center;
    gap: 50px;
}

.home-references-item-text {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.home-references-item-img {
    width: 353px;
    height: 443px;
    background-color: var(--color-gray-2);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin: 0 0 6px 6px;
}

.home-references-item-img-area {
    padding: 4px 0;
}

.home-references-item-img::before {
    content: "";
    position: absolute;
    width: 88%;
    height: 4px;
    background: var(--color-blue);
    z-index: 1;
    transform: translate(-50%, -100%);
    top: 0;
    left: 50%;
}

.home-references-item-img::after {
    content: "";
    position: absolute;
    width: 88%;
    height: 4px;
    background: var(--color-blue);
    z-index: 1;
    transform: translate(-50%, 100%);
    bottom: 0;
    left: 50%;
}

.home-references-item-img img {
    max-width: 60%;
    max-height: 60%;
    min-width: 50%;
    min-height: 50%;
    object-fit: contain;
}

.home-references-arrow {
    position: absolute;
    width: 55px;
    height: 55px;
    background-color: var(--color-gray-1);
    display: flex;
    align-items: center;
    justify-content: center;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

.home-references-arrow img {
    width: 15px;
    height: 15px;
}

.hrra {
    right: 0;
}

.hrla {
    left: 0;
}

.home-references-arrow.hrra img {
    transform: rotate(180deg);
}

@media (max-width: 1024px) {
    .home-references-item {
        flex-direction: column;
        gap: 40px;
    }
}

@media (max-width: 640px) {
    .home-references-arrow {
        display: none;
    }
    .home-references-item-img {
        width: 50%;
        height: auto;
        margin: 0;
        background-color: transparent;
    }
    .home-references-item-img img {
        width: 100%;
        max-width: 100%;
    }
    .home-references-item-img::before,
    .home-references-item-img::after {
        display: none;
    }
    .home-references-item-img-area {
        width: 95%;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 20px;
        border: 1px solid #dddada;
        border-radius: 7px;
        aspect-ratio: 314/141;
    }
}



/* #endregion */


/* #region Home Blog */

.home-blog-item {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.home-blog-item h3 {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 1.3;
}

@media (max-width: 768px) {
    .home-blog-item {
        margin-top: 20px;
    }
}

.home-blog-item h5 {
    margin-bottom: -15px;
}

.hbi-line {
    width: 100%;
    height: 1px;
    background-color: var(--color-black);
}

.home-blog-swiper-pagination {
    display: block;
    display: flex;
    gap: 15px;
    width: fit-content;
    margin: 50px auto 0 auto;
    align-items: center;
}

.home-blog-area .swiper-pagination-bullet {
    display: block;
    width: 12px;
    height: 12px;
    background-color: var(--color-gray-4);
    border-radius: 100%;
    transition: all 0.3s linear;
    cursor: pointer;
}

.home-blog-area .swiper-pagination-bullet-active {
    background-color: var(--color-white);
    border: 1px solid var(--color-gray-4);
    width: 16px;
    height: 16px;
}

@media (max-width: 768px) {
    .home-blog-area img,
    .home-blog-item {
        width: 100%;
    }
}

/* #endregion */


/* #region Home FAQ */

.home-faq-area {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 100px;
}

.home-faq-img {
    width: 570px;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    position: relative;
    flex-shrink: 0;
}

.home-faq-img-2 {
    position: absolute;
    bottom: 0;
    left: 0;
    transform: translate(0, 10%);
    border: 9px solid var(--color-white);
    border-radius: 100%;
    width: 245px;
    height: 245px;
    object-fit: cover;
}

.home-faq-video-btn {
    width: 120px;
    height: 120px;
    background-color: var(--color-red);
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 20px;
    position: absolute;
    bottom: 10%;
}

.home-faq-video-btn::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    border: 1px solid var(--color-white);
    border-radius: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    width: 60px;
    height: 60px;
}

.hf-acrd-body {
    overflow: hidden;
    transition: all 0.3s linear;
}

.hf-acrd-body.act {
    height: 0;
}

.home-faq-item.opened .hf-acrd-body {
    height: var(--data-hf-acrd-body-height);
}

.home-faq-item {
    background-color: var(--color-gray-5);
    padding: 15px 30px;
    border-radius: 17px;
    display: flex;
    flex-direction: column;
    cursor: pointer;
    transition: all 0.3s linear;
    width: 100%;
}

.home-faqs-double .home-faq-item {
    width: calc(50% - 12.5px);
    height: fit-content;
}

@media (max-width: 1024px) {
    .home-faqs-double .home-faq-item {
        width: 100%;
    }
}

@media (max-width: 500px) {
    .hf-acrd-title p {
        font-size: 0.9em;
    }
    .hf-acrd-body p {
        font-size: 0.9em;
    }
}

.home-faqs-double {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
}

.home-faqs {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.hf-acrd-arrow {
    width: 15px;
    height: 15px;
    transition: all 0.3s linear;
}
.hf-acrd-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.home-faq-item.opened {
    gap: 10px;
}

.home-faq-item.opened .hf-acrd-arrow {
    transform: rotate(180deg);
}

.home-faq-img {
    width: 45%;
}

.hfsa {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-right: 30px;
}

.hfsa a {
    font-size: var(--p-size);
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 5px;
    width: fit-content;
    white-space: nowrap;
}

.hfsa a img {
    width: 30px;
    margin-top: -4px;
    transition: all 0.2s linear;
}

.hfsa a:hover img {
    transform: translate(5px, -5px);
}

@media (max-width: 1024px) {
    .home-faq-area {
        gap: 40px;
    }
    .home-faq-img-2 {
        width: 45%;
        height: 45%;
        border: 6px solid var(--color-white);
    }
}

@media (max-width: 900px) {
    .home-faq-area {
        flex-direction: column;
    }
    .home-faq-img {
        width: 65%;
    }
    .home-faq-area .ita-text {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .home-faq-img {
        width: 85%;
    }
    .home-faq-video-btn {
        scale: 0.9;
    }
}


/* #endregion */


/* #region Home Fot References */

.fot-reference {
    width: 100%;
    aspect-ratio: 250/115;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-white);
    border-radius: 7px;
    border: 1px solid var(--color-gray-4);
}

.fot-reference img {
    max-width: 80%;
    max-height: 80%;
}

/* #endregion */


/* #region Footer */

footer {
    background-color: var(--color-footer-bg);
}

.footer-col {
    width: fit-content;
    flex-shrink: 0;
}

footer h3.ftr-title {
    color: var(--color-white);
    position: relative;
    width: fit-content;
    margin-bottom: 50px;
}

footer h3.ftr-title::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: var(--color-white);
    left: 0;
    bottom: -25px;
    transform: translate(0, -50%);
}

.ftr-menu-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ftr-menu-list li {
    color: var(--color-white);
    font-size: var(--p-size);
    padding-left: 35px;
    position: relative;
    font-weight: 300;
    transition: all 0.2s linear;
}

.ftr-menu-list li:hover {
    transform: translateX(10px);
    font-weight: 500;
}

.ftr-menu-list li::before {
    content: "";
    position: absolute;
    width: 17px;
    height: 17px;
    background-image: url('../images/footer-arrow.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.ftr-big-img-area {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ftr-big-img-area-inner {
    width: 415px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.ftr-big-img-area-inner img {
    width: 100%;
}

.ftrbia-txt {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    padding: 70px 87px 100px 87px;
    text-align: center;
    color: var(--color-white);
    gap: 15px;
}

.ftrbia-txt h3 {
    font-size: 1.8em;
}

.ftrbia-txt p {
    font-size: 1.05em;
}

.ftr-contact-icon {
    border-radius: 100%;
    overflow: hidden;
    flex-shrink: 0;
    height: fit-content;
}

.ftr-contact-info {
    color: var(--color-white);
}

.mw-300 {
    max-width: 300px;
}

.mw-340 {
    max-width: 340px;
}

.apply-now-btn {
    display: flex;
    position: absolute;
    bottom: 0;
    right: 0;
    transform: translate(50%, 50%);
    color: var(--color-white);
    border: 3px solid var(--color-white);
    align-items: center;
    justify-content: center;
    width: 90px;
    height: 90px;
    border-radius: 100%;
    font-size: var(--h5-size);
    font-weight: 600;
    transition: all 0.3s linear;
    cursor: pointer;
    padding: 10px;
    text-align: center;
}

.apply-now-btn:hover {
    background-color: var(--color-white);
    color: var(--color-black);
}

.footer-line {
    width: 100%;
    height: 1px;
    background-color: var(--color-white);
    margin-top: calc(var(--site-ara-space) / 2);
}

.ftr-social-icons {
    display: flex;
    gap: 12px;
    align-items: center;
}

.ftr-social-icons a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
}

.ftr-social-icons a img {
    width: 100%;
    height: 100%;
}

.ftr-address-btn {
    border: 2px solid var(--color-white);
    color: var(--color-white);
    padding: 5px 9px;
    border-radius: 10px;
    transition: all 0.3s linear;
    cursor: pointer;
}

.ftr-address-btn.active {
    background-color: var(--color-white);
    color: var(--color-black);
}

.ftr-address-btn:hover {
    background-color: var(--color-white);
    color: var(--color-black);
}

.ftr-addresses-tab {
    margin-bottom: 40px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.ftr-mbl {
    display: none;
}

@media (max-width: 1280px) {
    footer .container {
        max-width: 95%;
    }
    .ftr-mbl {
        display: block;
    }
    .ftr-dsktp {
        display: none;
    }
    .ftr-cols {
        flex-direction: column;
        gap: 40px;
    }
    .ftr-mbl-cols {
        gap: 80px;
        margin-top: 40px;
        margin-right: auto;
        margin-left: auto;
    }
}

@media (max-width: 720px) {
    .ftr-mbl-cols {
        flex-direction: column;
        gap: 100px;
        margin-left: 0;
    }
}

@media (max-width: 540px) {
    .ftrbia-txt {
        padding: 140px 87px 100px 87px;
    }
    .ftr-big-img-area-inner {
        width: 100%;
    }
    .apply-now-btn {
        bottom: -14%;
        right: 14%;
    }
}


@media (max-width: 480px) {
    .ftrbia-txt {
        padding: 70px 47px 100px 47px;
        transform: scale(0.9);
    }
    .ftr-big-img-area-inner {
        width: 100%;
    }
    .apply-now-btn {
        bottom: -14%;
        right: 14%;
    }
}


/* #endregion */


/* #region Banner */

.banner {
    width: 100%;
    height: auto;
    aspect-ratio: 1920/350;
    position: relative;
    overflow: hidden;
}

.banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.banner-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    text-align: left;
    color: var(--color-white);
    z-index: 2;
}

.bradcrumb {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 20px;
}

.bradcrumb li {
    color: var(--color-white);
    font-size: var(--p-size);
    display: flex;
    align-items: center;
    gap: 10px;
}

.bradcrumb li:not(:last-child)::after {
    content: ">";
    display: flex;
    align-items: center;
    justify-content: center;
}

.banner-anim-circle-1 {
    position: absolute;
    width: 6.68%;
    height: auto;
    aspect-ratio: 1/1;
    border-radius: 100%;
    top: 42%;
    left: 10%;
    transform: translate(-50%, -50%);
    animation: banner-anim-circle-1 30s linear infinite;
    transform-origin: bottom;
    z-index: 1;
}

.banner-anim-circle-1::before {
    content: "";
    position: absolute;
    top: -10px;
    left: -10px;
    width: 100%;
    height: auto;
    aspect-ratio: 1/1;
    border-radius: 100%;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 10px solid rgba(255, 255, 255, 0.1);
    z-index: -1;
    animation: banner-border-anim-circle-1 30s linear infinite;
}

.banner-anim-circle-2 {
    position: absolute;
    width: 3%;
    height: auto;
    aspect-ratio: 1/1;
    border-radius: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: banner-anim-circle-1 30s linear infinite;
    transform-origin: bottom;
    z-index: 1;
}

.banner-anim-circle-2::before {
    content: "";
    position: absolute;
    top: -10px;
    left: -10px;
    width: 100%;
    height: auto;
    aspect-ratio: 1/1;
    border-radius: 100%;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 10px solid rgba(255, 255, 255, 0.1);
    z-index: -1;
    animation: banner-border-anim-circle-1 30s linear infinite;
}

.banner-anim-circle-3 {
    width: 10% !important;
    height: auto !important;
    aspect-ratio: 234/154 !important;
    position: absolute;
    bottom: 20px;
    right: 20px;
    z-index: 2;
    animation: up-down-30 4s linear infinite;
}

@media (max-width: 1280px) {
    .banner {
        aspect-ratio: 1280/350;
    }
}

@media (max-width: 768px) {
    .banner {
        aspect-ratio: 768/350;
    }
}

@media (max-width: 480px) {
    .banner-content h1,
    .banner-content h2 {
        font-size: 1.6em;
    }
    .bradcrumb {
        margin-top: 10px;
        gap: 5px;
    }
    .bradcrumb li {
        font-size: 0.9em;
    }
}


/* #endregion */


/* #region Open Positions */

.open-positions-left {
    width: 34%;
}

.open-positions-arrow {
    margin-top: 50px;
    animation: up-down-30 4s linear infinite;
}

.open-positions-area {
    display: flex;
    gap: 70px;
    justify-content: space-between;
}

.open-positions-right {
    width: calc(66% - 70px);
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.opl-btns {
    display: flex;
    align-items: center;
    gap: 10px;
}

.opl-btns * {
    width: calc(33.333% - 6.6666px);
}

@media (max-width: 768px) {
    .opl-btns {
        flex-wrap: wrap;
    }
    .opl-btns * {
        width: calc(50% - 5px);
    }
}

@media (max-width: 400px) {
    .opl-btns * {
        width: 100% !important;
    }
}

.open-position-item {
    width: 100%;
    padding: 45px;
    background-color: var(--color-gray-5);
    border-radius: 20px;
}

.open-position-item .brdr-blue {
    padding: 15px 64px;
}


.open-position-item h4 {
    font-size: var(--job-title-size);
    font-weight: 600;
    color: var(--color-text);
}

.opi-item img {
    width: 30px;
    height: 30px;
}

.opi-items + .opi-items {
    margin-top: 35px;
}

.opi-item p.bold {
    margin-top: -5px;
}

.oplt {
    position: sticky;
    top: 120px;
}

.opdb-tag {
    position: relative;
    display: block;
    font-size: 1.1em;
    font-weight: 600;
    color: var(--color-blue);
    white-space: nowrap;
    width: 100%;
    text-align: right;
    padding-right: 90px;
    margin-bottom: 5px;
}


.mt30 {
    margin-top: 30px;
}

.opdb-logo-box {
    position: absolute;
    right: 41%;
    bottom: -17%;
    transform: translate(0, 100%);
}

.opdb-logo {
    width: 88px;
    height: 88px;
}

.opdb-logo-txt {
    font-weight: 600;
    font-size: var(--p-size);
    color: var(--color-blue);
    position: absolute;
    top: 17%;
    left: 70%;
    white-space: nowrap;
}

.op_features {
    padding: 40px;
    background-color: var(--color-gray-5);
    border-radius: 20px;
}

.op_features_item {
    display: flex;
    align-items: center;
    gap: 10px;
}

.op_features .op_features_item:not(:last-child) {
    margin-bottom: 10px;
}

.opfi-lbl {
    width: calc(40% - 5px);
    position: relative;
}

.opfi-val {
    width: calc(60% - 5px);
    position: relative;
}

.opfi-lbl .bold {
    font-weight: 500;
}

.opfi-val::before {
    position: absolute;
    content: ":";
    left: -10px;
    top: 50%;
    transform: translateY(-50%);
}

.op_sbmt {
    padding-left: 80px;
    padding-right: 80px;
}

.op_other_postings {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.opi-items {
    gap: 40px;
    flex-wrap: wrap;
}

.op_other_postings li {
    font-size: var(--job-title-size);
    padding-left: 30px;
    position: relative;
    line-height: 1.3;
    line-clamp: 1;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
}

.op_other_postings li::before {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    background-image: url('../images/other_op_list.svg');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.fs-title {
    font-size: 2.2em;
    width: 55%;
    line-height: 1.3;
    margin: 0 auto;
}

.opdb-img {
    width: 500px;
}

.opdb-jc-item {
    gap: 50px;
}

.op-detail-box {
    background-color: #ededed;
    border-radius: 60px;
    position: relative;
    width: 435px;
}

.job-text {
    max-width: calc(100% - 435px);
}

.op-detail-box::before {
    content: '';
    position: absolute;
    width: calc(20% + 5px);
    height: calc(100% + 3px);
    border-right: 8px solid var(--color-blue);
    border-bottom: 8px solid var(--color-blue);
    border-bottom-right-radius: 60px;
    bottom: 0;
    right: 0;
    transform: translate(2.5px, 0);
    border-bottom-left-radius: 9px;
    border-top-right-radius: 60px;
    border-top: 8px solid var(--color-blue);
    z-index: 1;
}

.op-detail-box::after {
    content: '';
    position: absolute;
    width: calc(88% + 5px);
    height: 25%;
    border-left: 8px solid var(--color-blue);
    border-bottom: 8px solid var(--color-blue);
    border-bottom-left-radius: 60px;
    bottom: 0;
    left: 0;
    transform: translate(-2.5px, 0);
    border-bottom-right-radius: 9px;
    z-index: 1;
}

.op-detail-box .opdb-cikinti {
    color: var(--color-blue);
    position: absolute;
    bottom: 8px;
    right: 90px;
    transform: translate(0, 100%) rotateY(180deg);
    z-index: 5;
}

.op-detail-box .opdb-cikinti polygon {
    fill: #ededed;
    stroke: var(--color-blue)
}

.opdb-content {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    gap: 20px;
    padding: 50px;
}

.opdb-content img {
    width: 30px;
    height: 30px;
}

.mobile-title {
    display: none;
}

@media (max-width: 1280px) {
    .open-positions-area {
        gap: 40px;
    }
    .open-positions-left {
        width: 37%;
    }
    .open-positions-right {
        width: calc(63% - 40px);
    }
    .op-detail-box {
        background-color: #ededed;
        border-radius: 60px;
        position: relative;
        width: 435px;
    }

    .desktop-title {
        display: none;
    }
    .mobile-title {
        display: block;
    }
}

@media (max-width: 1150px) {
    .open-positions-area {
        flex-direction: column;
    }
    .open-positions-arrow {
        display: none;
    }
    .open-positions-left {
        width: 100%;
    }
    .open-positions-right {
        width: 100%;
    }
    .open-position-item {
        max-width: 768px;
    }
    .open-position-item:nth-child(2n + 1) {
        margin-left: auto;
    }
    .jd-btns {
        flex-wrap: wrap;
    }
    .jd-btns a {
        width: fit-content;
        text-align: center;
    }
    .op-fea-btn {
        width: 95%;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }
}

@media (max-width: 1050px) {
    .op_features {
        border-radius: 0;
    }
}

@media (max-width: 1024px) {
    .opdb-jc-item {
        gap: 30px;
    }
}


.opi-mbl {
    display: none;
}

@media (max-width: 768px) {
    .opl-btns .btn {
        width: calc(50% - 5px);
    }
    .jd-area {
        flex-direction: column-reverse;
    }
    .odba {
        margin-bottom: 130px;
        margin-top: 0;
        width: 100%;
    }
    .opdb-img {
        width: 100%;
    }
    .opdb-jc-item {
        gap: 70px;
    }
    .op-detail-box {
        width: 100%;
    }
    .job-text {
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .opi-mbl {
        display: flex;
    }
    .opi-dsktp {
        display: none;
    }
    .opi-items {
        flex-wrap: wrap;
        margin-bottom: 20px;
    }
    .opi-item {
        width: calc(50% - 20px);
    }
    .opdb-tag {
        font-size: 120%;
    }
    .op_features {
        padding: 20px;
    }
    .op_features_item {
        align-items: flex-start;
    }
    .opfi-val::before {
        top: 0;
        transform: translateY(0);
    }
}

@media (max-width: 500px) {
    .opi-item {
        width: 100%;
    }
    .opdb-tag {
        font-size: 100%;
    }
    .opdb-jc-item {
        gap: 45px;
    }
}

@media (max-width: 420px) {
    .opdb-tag {
        font-size: 80%;
    }
    .opdb-jc-item {
        gap: 30px;
    }
}


/* #endregion */


/* #region TXT */

.txt ul li {
    list-style: disc;
    font-size: var(--p-size);
}

.txt ul {
    margin-left: 20px;
}

.txt * + * {
    margin-top: 20px;
}

.txt li + li {
    margin-top: 10px;
}

/* #endregion */


/* #region About */

.about_mission-area {
    background: linear-gradient(90deg, #1c317f, #007acb, #007acb, #0064a6, #0064a5, #00a7d4);
    min-height: 320px;
    width: 100%;
    position: relative;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    overflow: hidden;
}

.about_mission-area .container {
    padding: 60px;
}

.abma-spacer {
    width: calc((100dvw - 1280px) / 2);
    height: 50px;
    flex-shrink: 0;
}

.abma-mv-items {
    gap: 80px;
}

.abma-mv-item {
    width: calc(50% - 60px);
}

.abma-mv-item  * {
    color: var(--color-white);
}

.abma-mv-item h3 {
    margin-bottom: 20px;
}

.our_values {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    row-gap: 60px;
    column-gap: 80px;
}

.ov-item {
    width: calc(50% - 40px);
    display: flex;
    justify-content: space-between;
}

.ov-item-img img,
.ov-item-img svg {
    width: 75px;
    height: 75px;
    flex-shrink: 0;
    fill: var(--color-blue);
    stroke: var(--color-blue);
    color: var(--color-blue);
}

.ov-item-img {
    width: 75px;
    height: 75px;
    flex-shrink: 0;
}

.ov-item-text {
    width: calc(100% - 95px);
}

.ov-item-text h3 {
    margin-bottom: 10px;
}

.about-blbnr-logo {
    position: absolute;
    left: 100%;
    bottom: -3px;
}

@media (max-width: 1280px) {
    .about_mission-area {
        border-radius: 0;
        height: auto;
    }
    .abma-mv-items {
        width: 100%;
        max-width: 100%;
    }
    .abma-mv-item {
        width: calc(50% - 40px);
    }
    .about-blbnr-logo {
        display: none;
    }
    
}

@media (max-width: 1024px) {
    .ov-item {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .about_mission-area .abma-mv-items{
        padding: 40px;
        gap: 50px;
    }
    .abma-mv-item {
        width: calc(50% - 20px);
    }
}

@media (max-width: 660px) {
    .about_mission-area .abma-mv-items{
        width: 100%;
        max-width: 100%;
        flex-direction: column;
    }
    .abma-mv-item {
        width: 100%;
    }
}

/* #endregion */


/* #region Services */

.services-slogan {
    background-color: var(--color-vlight-blue);
    padding: var(--site-ara-space);
    text-align: center;
    font-weight: 600;
    color: var(--color-blue);
    border-radius: 10px;
    position: relative;
}

.services-slogan h2 {
    line-height: 1.45;
}

@media (max-width: 600px) {
    .services-slogan {
        width: 100%;
        max-width: 100%;
        padding: calc(var(--site-ara-space) / 2);
        border-radius: 0;
    }
    .services-slogan h2 {
        font-size: 1.5em;
    }
    .services-quotes {
        display: none;
    }
}

.services-quotes {
    width: 120px;
    position: absolute;
    top: 0;
    left: 20px;
    transform: translateY(-50%)
}

.services-list {
    max-width: 990px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 50px;
}

.service-item {
    display: flex;
    justify-content: space-between;
}

.service-img,
.service-img img,
.service-img svg {
    width: 100px;
    height: 100px;
}

.service-txt {
    width: calc(100% - 150px);
}

.service-txt h3 {
    margin-bottom: 10px;
}

@media (max-width: 600px) {
    .service-item {
        gap: 10px;
    }
    .service-txt {
        width: calc(100% - 120px);
    }
}

@media (max-width: 500px) {
    .service-item {
        flex-direction: column;
        width: 100%;
        gap: 30px;
    }
    .service-txt {
        width: 100%;
    }
}

/* #endregion */


/* #region Big Menu */

.big-menu-filter {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    transform: translateX(100%);
    opacity: 0;
    transition: all 0.3s ease-in-out;
}

.big-menu-opened .big-menu-filter {
    transform: translateX(0);
    opacity: 1;
}

.big-menu {
    position: fixed;
    top: 0;
    right: 0;
    width: 36%;
    height: 100%;
    background-color: var(--color-blue);
    min-width: 360px;
}

.big-menu-content {
    width: 360px;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 45px;
}

.bm-langs {
    display: flex;
    gap: 10px;
    align-items: center;
}

.bm-langs a {
    font-size: var(--p-size);
    font-weight: 500;
    color: var(--color-white);
}

.bm-langs img {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    filter: brightness(0) invert(1);
}

.bm-logo-area {
    margin-top: 45px;
    margin-bottom: 45px;
}

.bm-logo {
    width: 175px;
    height: auto;
}

.bm-menu-list li a {
    color: var(--color-white);
    font-size: var(--p-size);
    font-weight: 500;
    line-height: 1;
    padding: 8px 15px 8px 0;
    display: block;
    position: relative;
    width: fit-content;
    transition: all 0.3s ease-in-out 0.1s;
}

.bm-menu-list li a::before {
    content: "";
    position: absolute;
    width: 0;
    height: 100%;
    background-color: var(--color-white);
    bottom: 0;
    left: -15px;
    transition: all 0.3s ease-in-out 0.1s;
    z-index: -1;
}

.bm-menu-list li a:hover::before {
    width: calc(100% + 15px);
}

.bm-menu-list li a:hover {
    color: var(--color-blue);
}

.bm-contact-area *,
.bm-social-area * {
    color: var(--color-white);
}

.bm-contact-area {
    margin-bottom: 45px;
    margin-top: 45px;
}

.cti-img img {
    width: 24px;
    height: 24px;
}

.bm-social-area img {
    width: 33px;
    height: 33px;
    flex-shrink: 0;
}

.bm-arrow {
    width: 100px !important;
    height: auto !important;
    margin-top: 25px;
}

.bm-langs a.active {
    color: var(--color-red);
}

.big-menu-cls-mbl {
    display: none;
}

@media (max-width: 500px) {
    .bm-arrow {
        display: none;
    }
    .bm-logo-area {
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .big-menu-cls-mbl {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        background-color: var(--color-white);
        color: var(--color-blue);
        position: absolute;
        top: 20px;
        right: 20px;
        font-size: 30px;
        font-weight: 600;
        cursor: pointer;
        z-index: 1000;
    }
}

/* #endregion */


/* #region Search */

.search-area {
    position: absolute;
    top: -5%;
    left: 0;
    width: 100%;
    min-height: 300px;
    z-index: 1000;
    transition: all 0.3s ease-in-out;
    opacity: 0;
    transform: translateY(-100%);
    visibility: hidden;
}

.search-opened .search-area {
    transform: translateY(0);
    opacity: 1;
    top: 100%;
    visibility: visible;
    overflow: hidden;
}

.search-area .container {
    min-height: 150px;
    background-color: var(--color-white);
    padding: 40px;
    height: 100%;
}

#search-results-header {
    overflow: auto;
    max-height: 100%;
    max-height: calc(100dvh - 280px);
}

.search-filter {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 50;
    transition: all 0.3s ease-in-out;
    transform: translateY(-100%);
    opacity: 0;
    transition: all 0.3s ease-in-out;
    top: -100%;
}

.search-opened .search-filter {
    transform: translateY(0);
    opacity: 1;
    top: 0;
}

.search-input {
    width: 100%;
    font-size: var(--p-size);
    padding: 10px 15px;
    border-radius: 10px;
    border: 1px solid var(--color-blue);
    display: block;
}

.search-results {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-top: 30px;
}

.search-result-item {
    width: 100%;
    padding: 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    transition: all 0.3s ease-in-out;
    background-color: rgba(0, 0, 0, 0);
}

.search-result-item:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

.search-results .search-result-item:not(:last-child) {
    border-bottom: 2px solid var(--color-gray-7);
}

.search-result-item .sri-img {
    flex-shrink: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    width: 120px;
    height: 120px;
    aspect-ratio: 1/1;
}

.nrds {
    border-radius: 0 !important;
    aspect-ratio: auto !important;
    max-width: 120px !important;
    max-height: 120px !important;
    overflow: visible !important;
}

.nrds img {
    object-fit: contain !important; 
}

.search-result-item .sri-img img {
    flex-shrink: 0;
    object-fit: cover;
    transition: all 0.3s ease-in-out;
    width: 100%;
    height: 100%;
}

.search-result-item .sri-img svg {
    flex-shrink: 0;
    object-fit: cover;
    transition: all 0.3s ease-in-out;
    width: 70%;
    height: 70%;
}

.search-result-item:hover .sri-img img {
    transform: scale(1.2);
}

.search-result-item:hover .sri-img svg {
    transform: scale(1.2);
}

.search-result-item .sri-img + div {
    width: calc(100% - 150px);
}

.search-result-item h3 {
    margin-bottom: 10px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
}

.search-result-item p {
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
}

@media (max-width: 500px) {
    .sri-img  {
        display: none !important;
    }
    .search-result-item .sri-img + div {
        width: 100%;
    }
}

/* #endregion */


/* #region Login */

.login-area {
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-area-inner {
    min-width: 300px;
    width: 90%;
    max-width: 600px;
}

.login-area h2 {
    font-size: 1.8em;
    font-weight: 600;
    text-align: center;
    margin: 30px 0;
}

.login-area input {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin-bottom: 10px;
}

/* #endregion */


/* #region Open Positions Form */

.op-form
{
  display: flex;
  flex-wrap: wrap;
  row-gap: 20px;
}

.t-row
{
  width: 100%;
  display: flex;
  column-gap: 20px;
}

.t-col
{
  padding: 0 !important;
  width: 100%;
}


.t-col .file-input
{
    margin-top: 34px;
}


.t-col .file-input input[type="file"] {
    display: none;
}


.t-col .file-input label
{
    display: flex;
    height: 48.55px;
    align-items: center;
    justify-content: center;
    background-color: #1c317f;
    color: #fff;
    text-align: center;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    font-weight: bold;
}


.t-col .file-input label:hover
{
    background-color: #2E2E2E;
    color: #fff;
}

.file1
{
    position: relative;
}

.file1::before
{
    content: '✓';
    background-color: #2E2E2E !important;
    color: #fff !important;
    font-size: 1.8em !important;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 5;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.t-col input,
.t-col select,
.t-col textarea {
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    border: 1px solid var(--color-gray-7);
    font-size: var(--p-size);
}

.t-col select {
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E")
      calc(100% - 15px) no-repeat;
    background-size: 18px;
}

.t-col label {
    display: block;
    font-size: var(--p-size);
    font-weight: 500;
    color: var(--color-black);
    margin-bottom: 5px;
}

.op-form-btns {
    gap: 10px;
}

@media (max-width: 500px) {
    .t-col {
        width: 100%;
    }
    .t-row {
        flex-wrap: wrap;
        row-gap: 20px;
    }
}

/* #endregion */


/* #region Gallery */

.gallery-area {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.gallery-item {
    width: calc(33.33% - 13.333px);
    background-color: var(--color-white);
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

.gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s ease-in-out;
}

.gallery-item:hover img {
    transform: scale(1.1);
}

@media (max-width: 768px) {
    .gallery-item {
        width: calc(50% - 10px);
    }
}

@media (max-width: 450px) {
    .gallery-item {
        width: 100%;
    }
}

/* #endregion */


/* #region Blogs */

.blog-area {
    display: flex;
    column-gap: 30px;
    row-gap: 60px;
    flex-wrap: wrap;
    align-items: flex-end;
}

.blog-item {
    display: flex;
    flex-direction: column;
    width: calc(33.333% - 20px);
}

.blog-item h5 {
    margin-bottom: 10px;
}

.blog-item h3 {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 1.3;
}

.blog-item h3,
.blog-item .hbi-line {
    margin-bottom: 30px;
}

.blog-detail-img {
    width: 100%;
    height: auto;
    aspect-ratio: 16/9;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 30px;
}

.blog-detail-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s ease-in-out;
}

.blog-detail-img:hover img {
    transform: scale(1.1);
}

.blog-detail h1 {
    font-size: var(--blog-title-size);
    font-weight: 600;
}

.blog-detail-left {
    padding-right: 15px;
}

.blog-detail-right {
    padding-left: 15px;
}

.other-blogs-title {
    background-color: var(--color-black);
    padding: 20px;
    margin-bottom: 20px;
}

.other-blogs-title h3 {
    color: var(--color-white);
    font-weight: 600;
}

.other-blogs {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.other-blog {
    display: flex;
    gap: 20px;
    position: relative;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
}

.other-blog:not(:first-child)::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    background-color: var(--color-gray-4);
    top: -15px;
    left: 0;
    transform: translateY(50%);
}

.other-blog img {
    width: 100px;
    height: 100px;
    object-fit: cover;
}

.other-blog p.bold {
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
}

.ob-desc {
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    font-size: var(--sml-p-size);
}

@media (max-width: 1024px) {
    .blog-item {
        width: calc(50% - 15px);
    }
    .blog-detail-area {
        flex-direction: column;
    }
    .blog-detail-right,
    .blog-detail-left {
        width: 100%;
        padding: 0;
    }
    .blog-detail-right {
        margin-top: 50px;
    }
}

@media (max-width: 550px) {
    .blog-item {
        width: 100%;
    }
    .blog-item img {
        width: 100%;
    }
}

/* #endregion */


/* #region References */

.references-area {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

.references-item {
    width: calc(33.333% - 20px);
    background-color: var(--color-white);
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    padding: 30px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.references-item img {
    max-height: 100px;
    max-width: 50%;
    width: 100%;
    height: 100%;
    object-fit: contain;
    margin: 0 auto;
    aspect-ratio: 1/1;
}

@media (max-width: 1280px) {
    .references-item {
        width: calc(50% - 20px);
    }
}

@media (max-width: 768px) {
    .references-item {
        width: 100%;
    }
}


/* #endregion */


/* #region Stable Page */

.stable-page .head {
    margin-bottom: 30px;
}

/* #endregion */


/* #region Contact */

.locations-area {
    margin-top: 80px;
    display: flex;
    gap: 25px;
}

.address-area {
    width: calc(50% - 12.5px);
    border: 1px solid #b7b9b4;
    padding: 60px 40px 40px 40px;
    position: relative;
}

.ctt-info-area {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 20px;
}

.ctt-info-item {
    width: 100%;
    display: flex;
    gap: 10px;
    align-items: center;
}

.ctt-info-item img {
    width: 25px;
    height: 25px;
}

.ctt-social {
    display: flex;
    gap: 15px;
    margin-top: 30px;
}

.ctt-social-item {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #eeefee;
}

.ctt-social-item img {
    width: 50%;
    height: 50%;
}

.ctt-addresses-btns {
    width: 100%;
    display: flex;
    gap: 10px;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(-50%);
}

.ctt-address-btn {
    padding: 14px 33px;
    background-color: #ffffff;
    border-radius: 15px;
    border: 1px solid #000000;
    font-weight: 500;
    cursor: pointer;
    font-size: var(--p-size);
    transition: all 0.3s ease-in-out;
}

.ctt-address-btn.selected {
    background-color: var(--color-blue);
    color: var(--color-white);
    border-color: var(--color-blue);
}

.ctt-address-btn:hover {
    background-color: var(--color-blue);
    color: var(--color-white);
    border-color: var(--color-blue);
}

.ctt-logo-body {
    position: absolute;
    bottom: 15px;
    right: 25px;
    width: 63px;
    height: 87px;
}

.clbd-arm {
    position: absolute;
    width: 8px;
    height: 26px;
    border: 3px solid var(--color-blue);
    border-top: none;
    border-right: none;
    border-bottom-left-radius: 10px;
    top: 5px;
    left: -15px;
    transform: rotate(0deg);
    z-index: -1;
    transform-origin: bottom right;
    animation: ssc-arm-turner 2s linear infinite;
}

.clbd-arm::before {
    content: "";
    position: absolute;
    width: 5px;
    height: 5px;
    background-color: var(--color-blue);
    top: 0;
    left: 0;
    transform: translate(-78%, 0);
    border-radius: 100%;
}

.address-item {
    display: none;
}

.address-item.selected {
    display: block;
}

.maps-area {
    width: calc(50% - 12.5px);
    position: relative;
}

.map-item {
    width: 100%;
    height: 100%;
    animation: be-hidden 0.5s linear forwards;
    position: absolute;
}

.map-item.selected {
    height: 100%;
    animation: be-visible 0.5s linear forwards;
}

@keyframes be-hidden {
    0% {
        visibility: visible;
        opacity: 1;
    }
    99% {
        visibility: hidden;
        opacity: 0;
    }
    100% {
        visibility: hidden;
        opacity: 0;
        display: none;
        position: absolute;
    }
}

@keyframes be-visible {
    0% {
        visibility: hidden;
        opacity: 0;
        display: none;
        position: absolute;
        top: 0;
    }
    1% {
        visibility: hidden;
        opacity: 0;
        display: block;
    }
    100% {
        visibility: visible;
        opacity: 1;
    }
}

.contact-mini-form-area {
    display: flex;
    gap: 30px;
    margin-top: 30px;
    position: relative;
}

.contact-mini-form-img {
    width: calc(50% - 15px);
    flex-shrink: 0;
    object-fit: cover;
}

.contact-mini-form {
    width: calc(50% - 15px);
    border: 1px solid #b7b9b4;
    padding: 60px;
}

.ctt-row {
    display: flex;
    gap: 25px;
}

.ctt-row + .ctt-row {
    margin-top: 25px;
}

.ctt-col {
    width: 100%;
}

.ctt-col label {
    display: block;
    margin-bottom: 5px;
    font-size: var(--p-size);
    font-weight: 500;
}

.ctt-col input[type="radio"] + label,
.ctt-col input[type="checkbox"] + label {
    font-weight: normal;
    font-size: var(--sml-p-size);
}

.ctt-input {
    width: 100%;
    padding: 10px 15px;
    border-radius: 10px;
    border: 1px solid #b6b6b6;
}

.ctt-textarea {
    width: 100%;
    padding: 10px 15px;
    border-radius: 10px;
    border: 1px solid #b6b6b6;
    resize: none;
    height: 190px;
}

.ctt-btn {
    width: 100%;
}

.bif-area {
    display: flex;
    gap: 75px;
}

.bif-left {
    width: calc(50% - 75px);
}

.bif-right {
    width: 50%;
}

.bifl-line {
    width: 100%;
    height: 10px;
    background: linear-gradient(135deg, #007acb, #0072bc, #1c317f, #1c317f, #000f49);
    margin-top: 15px;
    margin-bottom: 20px;
}

.bif-left h3 {
    line-height: 1.2;
    margin-bottom: 30px;
}

.bif {
    width: 100%;
    background-color: var(--color-white);
    padding: 45px;
}

.ctt-radio-area {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 20px;
}

.ctt-radio-item {
    display: flex;
    gap: 10px;
    cursor: pointer;
}

.ctt-radio-item label {
    cursor: pointer;
}

.ctt-radio-item input[type="radio"] {
    width: 20px;
    height: 20px;
    background-color: #b7b9b4;
    flex-shrink: 0;
    appearance: none;
    border-radius: 100%;
    margin-top: 2.5px;
    transition: all 0.3s ease-in-out;
    position: relative;
    cursor: pointer;
}

.ctt-radio-item input[type="radio"]:checked {
    width: 20px;
    height: 20px;
    background-color: var(--color-blue);
    flex-shrink: 0;
    appearance: none;
    border-radius: 50%;
}

.ctt-radio-item input[type="radio"]::before {
    content: "";
    position: absolute;
    width: 2px;
    height: 5px;
    background-color: var(--color-white);
    bottom: 6px;
    left: 40%;
    transform: rotate(-45deg) translate(-50%, 0) scale(0);
    transition: all 0.3s ease-in-out;
}

.ctt-radio-item input[type="radio"]::after {
    content: "";
    position: absolute;
    width: 2px;
    height: 10px;
    background-color: var(--color-white);
    bottom: 5px;
    left: 63%;
    transform: rotate(23deg) translate(-50%, 0) scale(0);
    transition: all 0.3s ease-in-out;
}

.ctt-radio-item input[type="radio"]:checked::before {
    transform: rotate(-45deg) translate(-50%, 0) scale(1);
}

.ctt-radio-item input[type="radio"]:checked::after {
    transform: rotate(23deg) translate(-50%, 0) scale(1);
}

.map-item iframe {
    width: 100%;
    height: 100%;
}

@media (max-width: 1280px) {
    .ctt-address-btn {
        padding: 5px 10px;
    }
}

@media (max-width: 1024px) {
    .ctt-addresses-btns {
        gap: 5px;
    }
    .ctt-address-btn {
        font-size: 0.9em;
        border-radius: 5px;
    }
    .contact-mini-form-img {
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: -1;
        opacity: 0.1 !important;
    }
    .contact-mini-form {
        width: 100%;
    }
    .bif-area {
        flex-direction: column;
        gap: 40px;
    }
    .bif-left,
    .bif-right  {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .locations-area {
        flex-direction: column-reverse;
        gap: 50px;
        margin-top: 40px;
    }
    .maps-area {
        width: 100%;
        height: 300px !important;
    }
    .map-item.selected {
        width: 100%;
        height: 300px !important;
    }
    .address-area {
        width: 100%;
    }
}

@media (max-width: 500px) {
    .contact-mini-form {
        padding: 40px;
    }
    .ctt-row {
        flex-direction: column;
        gap: 10px;
    }
    .ctt-row + .ctt-row {
        margin-top: 10px;
    }
    .cttmblrdo {
        margin-top: 20px !important;
    }
}

/* #endregion */


/* #region 404 */

.page-404 {
    width: 100dvw;
    height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2%;
}

.error-area {
    width: fit-content;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.error-area h2 {
    font-size: calc(100dvw / 7);
    font-weight: 600;
    color: var(--color-blue);
}

.clb-404 {
    position: relative;
    height: calc(100dvw / 7);
    width: auto;
    aspect-ratio: 105/145;
    display: flex;
    align-items: center;
    justify-content: center;
}

.clb-404 img {
    height: 100%;
}

.error-text {
    max-width: 30%;
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 465px;
}

@media (max-width: 1280px) {
    .error-area h2 {
        font-size: calc(100dvw / 5);
        font-weight: 600;
        color: var(--color-blue);
    }
    .page-404 {
        flex-direction: column-reverse;
    }
    .error-text {
        text-align: center;
        justify-content: center;
        max-width: 60%;
    }
    .error-text div.flex {
        justify-content: center;
    }
    .clb-404 {
        height: calc(100dvw / 5);
    }
}

@media (max-width: 768px) {
    .error-area h2 {
        font-size: calc(100dvw / 3);
        font-weight: 600;
        color: var(--color-blue);
    }
    .clb-404 {
        height: calc(100dvw / 3);
    }
    .error-text {
        min-width: 0px;
    }
}

/* #endregion */
