:root {
    --font-header-regular: 'charlevoix_proregular';
    --font-header-bold: 'charlevoix_probold';
    --font-header-extrabold: 'charlevoix_proextrabold';
}

h1,
h2,
h3 {
    text-transform: none;
    text-align: center;
    line-height: normal !important;
}

h2,
h3 {
    text-wrap: balance;
}

h2 {
    color: #003CA5;
    font-size: clamp(2rem, 10vw, 4rem);
}

h3 {
    font-family: var(--font-header-regular) !important;
    font-weight: lighter;
    font-size: clamp(1.5rem, 10vw, 2rem)
}

/* FIRST BANNER SEGMENT */
.banner .container-fluid {
    position: relative;
    padding: 0 !important;
    background: #003da6;
}

.banner .wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4rem;
}

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

.banner .image img {
    max-height: 55rem;
}

.banner .text {
    text-align: center;
}

.banner h1 {
    color: #ffffff;
    text-transform: none;
    text-align: left;
    font-size: clamp(4rem, 10vw, 7rem);
}

.banner p {
    font-size: clamp(1rem, 10vw, 1.6rem);
    line-height: 3rem;
    margin-bottom: 2rem;
    color: #cbd5f6;
}

.banner h1 span,
.offer .header h2 span {
    position: relative;
    display: inline-block;
    background: linear-gradient(180deg, transparent 70%, #ff3c2f 0);
}

.banner a.button,
.registration a.button {
    display: inline-block;
    margin-top: 1rem;
    padding: 2.35rem 4.1rem;
    background: #29B9E6;
    color: #ffffff;
    border-radius: 45px;
    font-family: var(--font-header-bold);
    font-size: 1.8rem;
    font-weight: bold;
    text-decoration: none;
    border: 0;
}

.banner a.button:hover,
.registration a.button:hover {
    background: #048eb8;
}


@media (min-width: 768px) {
    .banner .wrapper {
        flex-direction: row;
    }

    .banner .text {
        max-width: 50%;
        text-align: left;
        margin: 10rem 0 11rem 0;
    }

    .banner p {
        margin-bottom: 3.4rem;
    }

    .container-fluid.banner {
        padding: 0px !important;
    }

    .banner .image {
        align-self: flex-end;
    }

    .banner .image img {
        max-height: 71rem;
    }
}

/* SECOND FEATURES SEGMENT */
.features .container-fluid {
    padding: 0 !important;
}

.features-section .features-container {
    padding: 3rem 0 !important;
}

.features-container {
    display: flex;
    flex-direction: column;
    gap: 5rem;
}

.features-image img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 8px;
}

.features-list {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.feature-item {
    display: flex;
    gap: 2rem;
    align-items: flex-start;
}

.icon-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
}

.icon-circle {
    width: 9.3rem;
    height: 9.3rem;
    background-color: #e92329;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.icon-circle img {
    width: 50%;
    height: auto;
}

.icon-circle img.tag {
    width: 60%;
    height: auto;
}

.icon-wrapper::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    height: 120%;
    background: repeating-linear-gradient(to bottom,
            #002bb8,
            #002bb8 4px,
            transparent 4px,
            transparent 8px);
}

.features-list .feature-item:last-child .icon-wrapper::after {
    display: none;
}

.feature-item strong {
    font-family: var(--font-header-extrabold);
    font-size: clamp(1.5rem, 5vw, 2rem);
    font-weight: bold;
    color: #003CA5;
}

.feature-item div {
    font-size: clamp(1.5rem, 5vw, 1.6rem);
}

@media (min-width: 768px) {
    .features {
        padding: 4rem 0 7rem 0;
    }

    .features-container {
        display: flex;
        flex-direction: row;
        align-items: stretch;
        gap: 5rem;
        padding: 5rem 0 !important;
    }

    .features-image img {
        max-height: 57rem;
    }

    .features-image,
    .features-list {
        flex: 1;
    }

    .features-list {
        justify-content: space-between;
    }
}

/* THIRD CAROUSEL SEGMENT */
.fullwidth_section.service-section.carousel {
    background: #fbfbfb;
}

.carousel .container-fluid {
    padding: 5rem 0 !important;
}

.carousel h3 {
    color: #99abd6;
    margin: 0 0 2rem 0;
    font-size: clamp(2rem, 5vw, 2.5rem);
}

.logo-scroll-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.logo-scroll-wrapper::-webkit-scrollbar {
    display: none;
}

.logo-scroll {
    display: flex;
    flex-direction: row;
    gap: 4rem;
    align-items: center;
    min-width: max-content;

}

.logo-scroll a {
    display: block;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.logo-scroll a:hover img {
    transform: scale(1.05);
    filter: grayscale(0%) brightness(1);
}

.logo-scroll img {
    height: auto;
    max-height: 40px;
    filter: grayscale(100%) brightness(2);
    transition: filter 0.3s ease;
}

@media (min-width: 1200px) {
    .logo-scroll-wrapper {
        overflow-x: hidden;
        display: flex;
        justify-content: center;
    }
}

/* FOURTH BENEFITS SEGMENT */
.fullwidth_section.benefits,
.fullwidth_section.contact {
    background: #f0f6ff;
}

.benefits .container-fluid {
    padding: 0 !important;
}

.benefits p {
    font-size: clamp(1.5rem, 10vw, 2rem);
    text-align: center;
    line-height: 3.5rem;
}

.benefits p span {
    color: #e92329;
    font-weight: bold;
}

.benefits-cards {
    margin: 6rem 0;
    display: flex;
    flex-direction: column;
    gap: 6rem;
}

.benefits-cards .card {
    background: white;
    border-radius: 2rem;
    padding: 0 2rem 2rem;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
    position: relative;
}

.benefits-cards .icon-circle {
    width: 9.4rem;
    height: 9.4rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    top: -4.7rem;
    position: relative;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.benefits-cards .icon-circle img {
    width: auto;
    height: auto;
    max-width: 50%;
    max-height: 50%;
}

.benefits-cards .icon-circle.blue {
    background: #1e3fa3;
}

.benefits-cards .icon-circle.red {
    background: #e92329;
}

.benefits-cards .icon-circle.sky {
    background: #60c5f3;
}

.benefits-cards .card h3 {
    margin-top: 0;
    font-size: clamp(2rem, 10vw, 2.5rem);
    color: #003CA5;
    font-weight: bold;
}

.benefits-cards .card p {
    color: #666;
    margin-top: 0.5rem;
    font-size: 1.8rem;
}

@media (min-width: 768px) {
    .benefits .container-fluid {
        padding: 5.7rem 0 0 !important;
    }

    .benefits-cards {
        gap: 2rem;
        flex-direction: row;
        justify-content: center;
        margin: 8.2rem 0 15rem 0;
    }

    .benefits-cards .card {
        flex: 1;
        max-width: 33%;
        min-height: 370px;
    }
}

/* FIFTH TESTIMONIALS SEGMENT */
.fullwidth_section.service-section.testimonials {
    background-color: #e92329;
    background-image: url('/assets/images/services/locker-europe/testimonials-background-left.png'), url('/assets/images/services/locker-europe/testimonials-background-right.png');
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, right center;
    background-size: auto 50%, contain;
}

.testimonials h2 {
    color: #ffffff;
    margin: 0 auto 3rem auto;
}

.testimonial-cards {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.testimonial-card {
    background-color: #fff;
    color: #333;
    border-radius: 2rem;
    padding: 5rem 5rem 3.2rem 5rem;
    text-align: left;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
}

.testimonial-card .wrapper {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.testimonial-cards .stars {
    display: flex;
    gap: 4px;
    margin-bottom: 1rem;
}

.testimonial-card .star {
    display: inline-block;
    width: 17px;
    height: 17px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 17 17'%3E%3Cpath d='M7.587.602c.367-.803 1.46-.803 1.827 0l1.794 3.929c.148.323.441.546.781.593l4.13.569c.844.116 1.182 1.203.565 1.816l-3.021 2.998c-.248.246-.361.608-.298.96l.759 4.281c.155.875-.73 1.547-1.478 1.122l-3.661-2.077c-.301-.171-.664-.171-.966 0l-3.661 2.077c-.748.424-1.633-.247-1.478-1.122l.759-4.281c.062-.352-.05-.713-.298-.96L.316 7.509c-.617-.612-.279-1.7.565-1.816l4.13-.569c.34-.047.634-.27.781-.593z' fill='%23ffb030'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}

.testimonial-card p {
    margin-bottom: 5rem;
    font-size: clamp(1rem, 5vw, 1.6rem);
}

.testimonials .user-info {
    display: flex;
    align-items: center;
    gap: 3rem;
}

.testimonials .user-info img {
    width: 7.4rem;
    height: 7.4rem;
    border-radius: 50%;
    object-fit: cover;
}

.testimonials .user-info b {
    color: #1e3fa3;
    font-size: clamp(1.8rem, 5vw, 2.5rem);
    font-family: var(--font-header-extrabold);
}

.testimonials .user-info span {
    color: #666;
    font-size: clamp(1rem, 5vw, 1.8rem);
}

.testimonials img.company {
    width: auto;
    max-width: 15rem;
    height: auto;
}

@media (min-width: 768px) {
    .testimonials .container-fluid {
        padding: 10rem 0 17rem !important;
    }

    .testimonials h2 {
        margin-bottom: 6rem;
    }

    .testimonial-cards {
        flex-direction: row;
        justify-content: center;
    }

    .testimonial-card {
        flex: 1;
        max-width: 50%;
    }
}

/* SIXTH REGISTRATION SEGMENT */
.registration .container-fluid {
    position: relative;
    padding: 10rem 0 !important;
    background: #003da6;
}

.registration .container .wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.registration h2 {
    color: #ffffff;
    text-align: left;
    font-size: clamp(3rem, 10vw, 3.6rem);
}

.registration p {
    font-size: clamp(1.2rem, 10vw, 1.8rem);
    margin-bottom: 2rem;
    color: #cbd5f6;
}

.registration p.check {
    position: relative;
    padding-left: 7.4rem;
}

.registration p.check::before,
.registration p.check::after {
    content: "";
    position: absolute;
}

.registration p.check::before {
    left: 0;
    top: 1rem;
    width: 5.4rem;
    height: 5.4rem;
    border: 4px solid #29B9E6;
    border-radius: 1.5rem;
}

.registration p.check::after {
    left: 2.2rem;
    top: 2.5rem;
    width: 1rem;
    height: 2rem;
    border: solid #29B9E6;
    border-width: 0 0.4rem 0.4rem 0;
    transform: rotate(45deg);
}

@media (min-width: 768px) {
    .registration .container .wrapper {
        flex-direction: row;
        justify-content: center;
        gap: 2rem;
    }

    .registration .image {
        min-width: 44rem;
    }
}

/* SEVENTH AIRCARGO SEGMENT */
.aircargo .container-fluid {
    padding: 0 !important;
}

.aircargo {
    background: url('/assets/images/services/locker-europe/aircargo-background.webp') no-repeat center center;
    background-size: cover;
}

.aircargo .wrapper {
    position: relative;
    display: inline-block;
    z-index: 0;
    padding: 5rem 0;
}

.aircargo .wrapper::before,
.aircargo .wrapper::after {
    content: "";
    position: absolute;
    border-radius: 2rem;
    z-index: 0;
}

.aircargo .wrapper::before {
    width: 18rem;
    height: 22rem;
    bottom: 2.5rem;
    right: -2rem;
    background-color: #003da6;
}

.aircargo .wrapper::after {
    width: 11rem;
    height: 13rem;
    top: 3rem;
    left: -1rem;
    background-color: #e63946;
}

.aircargo-card {
    position: relative;
    background: white;
    border-radius: 2rem;
    padding: 6rem;
    max-width: 500px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
    margin-left: 1rem;
    color: #3c4a9a;
    text-align: left;
    z-index: 1;
}

.aircargo-card h2 {
    color: #e63946;
    text-align: left;
    margin-top: 0;
}

.aircargo-card b {
    font-size: clamp(2rem, 5vw, 2.5rem);
    font-family: var(--font-header-bold);
}

.aircargo-card p {
    font-size: clamp(1.5rem, 5vw, 2rem);
    border-top: 1px solid #dfdfdf;
    margin-top: 1rem;
    padding-top: 1rem;
}

.aircargo-card p span {
    color: #e63946;
}

@media (min-width: 768px) {
    .aircargo .container-fluid {
        padding: 10.1rem 0 21.5rem 0 !important;
    }
}

/* EIGTH OFFER SEGMENT */
.fullwidth_section.offer {
    background-color: #f0f6ff;
    background-image: url('/assets/images/services/locker-europe/offer-background.png');
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: 40rem;
}

.offer .box {
    background: white;
    border-radius: 2rem;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    max-width: 111.4rem;
}

.offer .header {
    position: relative;
    background: url('/assets/images/services/locker-europe/offer-sky.webp') no-repeat center/cover;
    border-top-left-radius: 2rem;
    border-top-right-radius: 2rem;
    padding: 3rem 1rem 3rem;
}

.offer .header h2 {
    color: #ffffff;
}

.offer .header img {
    position: absolute;
    top: -5rem;
    left: -2rem;
    width: 50%;
}

.offer .wrapper {
    display: flex;
    padding: 2rem;
    gap: 2rem;
    flex-direction: column;
    flex-wrap: wrap;
}

.offer-item {
    font-size: clamp(1.5rem, 5vw, 1.8rem);
    width: 100%;
    color: #003CA5;
    position: relative;
    padding: 0 4rem;
    margin-bottom: 3.2rem;
}

.offer-item b {
    color: #F32735;
    font-family: var(--font-header-extrabold);
}

.offer-item::before,
.offer-item::after {
    content: "";
    position: absolute;
}

.offer-item::before {
    left: 0;
    top: 0rem;
    width: 2.5rem;
    height: 2.5rem;
    background: #e63946;
    border-radius: 0.6rem;
}

.offer-item::after {
    left: 1rem;
    top: 0.7rem;
    width: 0.5rem;
    height: 1rem;
    border: solid #ffffff;
    border-width: 0 0.2rem 0.2rem 0;
    transform: rotate(45deg);
}

@media (min-width: 768px) {
    .offer .container-fluid {
        padding: 11.4rem 0 14.2rem 0 !important;
    }

    .offer .wrapper {
        flex-direction: row;
        padding: 5rem;
    }

    .offer .header {
        padding: 7rem 1rem 7rem;
    }

    .offer-item {
        flex: 0 0 calc(50% - 1rem);
        padding: 0 4rem;
    }

    .offer .header img {
        top: -6rem;
        left: -7rem;
        max-width: 45%;
    }
}

/* NINTH ADVANTAGES SEGMENT */
.advantages .container-fluid {
    position: relative;
    padding: 6rem 0 3rem 0 !important;
    background: #003da6;
    background-image: url('/assets/images/services/locker-europe/advantages-background.png');
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 33rem;
}

.advantages .wrapper {
    display: flex;
    flex-direction: column;
    margin: auto;
    align-items: center;
    gap: 2rem;
}

.advantages .image {
    position: relative;
    display: inline-block;
    z-index: 0;
}

.advantages .image::before {
    content: "";
    position: absolute;
    border-radius: 15px;
    z-index: -1;
    width: 10rem;
    height: 12rem;
    top: -2rem;
    left: -2rem;
    background-color: #e63946;
}

.advantages .header,
.advantages .grid {
    flex: 1;
    color: white;
}

.advantages .header h2 {
    text-align: left;
    color: white;
    margin: 0 0 4rem 0;
    font-size: clamp(3rem, 5vw, 3.6rem);
}

.advantages .header p {
    font-size: clamp(2rem, 5vw, 2.5rem);
}

.advantages .grid {
    margin: 3rem 0;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.advantages .item {
    position: relative;
    padding-left: 4rem;
    font-size: clamp(1.5rem, 5vw, 1.8rem);
}

.advantages .item b {
    font-family: var(--font-header-extrabold);
}

.advantages .item::before,
.advantages .item::after {
    content: "";
    position: absolute;
}

.advantages .item::before {
    left: 0;
    top: 0;
    width: 2.2rem;
    height: 2.2rem;
    border: 2px solid #e63946;
    border-radius: 0.5rem;
}

.advantages .item::after {
    left: 0.8rem;
    top: 0.5rem;
    width: 0.5rem;
    height: 1rem;
    border: solid #e63946;
    border-width: 0 0.2rem 0.2rem 0;
    transform: rotate(45deg);
}

@media (min-width: 768px) {
    .advantages .wrapper {
        flex-direction: row;
        align-items: flex-start;
    }

    .advantages .grid {
        margin: 5.2rem 0;
    }

    .advantages .image {
        min-width: 43rem;
    }
}

@media (min-width: 1200px) {
    .advantages .container-fluid {
        padding: 6.7rem 0 8.3rem 0 !important;
    }

    .advantages .grid {
        flex-wrap: wrap;
        flex-direction: row;
    }

    .advantages .item {
        flex-direction: row;
        width: calc(50% - 1rem);
    }
}

/* TENTH CONTACT SEGMENT */
.contact .container-fluid {
    padding: 4rem 2rem !important;
}

.contact .center {
    display: flex;
    justify-content: center;
}

.contact .wrapper {
    position: relative;
    z-index: 0;
}

.contact .wrapper::before {
    content: "";
    position: absolute;
    border-radius: 2rem;
    z-index: -1;
    width: 11rem;
    height: 13rem;
    top: -2.8rem;
    left: -2.7rem;
    background-color: #F32735;
}

.contact .card {
    position: relative;
    background: white;
    border-radius: 2rem;
    padding: 2rem;
    max-width: 66.8rem;
    box-shadow: 0px 10px 60px rgba(38, 45, 118, 0.1);
    color: #003CA5;
    text-align: left;
    z-index: 1;
}

.contact h2 {
    text-align: left;
    border-bottom: 1px solid #dfdfdf;
    padding-bottom: 2rem;
    font-size: clamp(2.8rem, 5vw, 3.6rem);
}

.contact h2 span {
    font-family: var(--font-header-regular);
    color: #F32735;
    font-weight: bold;
}

.contact p {
    font-size: clamp(2rem, 5vw, 2.4rem);
    font-family: var(--font-header-extrabold);
    color: #1e4998;
}

.contact ul {
    margin: 2rem 0;
    list-style-type: none;
    padding: 0;
}

.contact ul li {
    margin: 1rem 0;
    padding-left: 4rem;
}

.contact ul li a {
    color: #58c9ec;
    font-size: clamp(1rem, 5vw, 1.6rem);
    font-weight: bold;
}

.contact ul li a.link {
    text-decoration: underline !important;
}

.contact ul li a:hover,
.contact ul li a.link:hover {
    color: #048eb8;
}

.contact ul li.phone {
    background: url('/assets/images/services/locker-europe/contact-phone.png') no-repeat left/25px 21px;
}

.contact ul li.email {
    background: url('/assets/images/services/locker-europe/contact-email.png') no-repeat left/25px;
}

@media (min-width: 768px) {
    .contact .container-fluid {
        padding: 10.8rem 0 13.9rem 0 !important;
    }

    .contact .card {
        padding: 7.8rem 12.2rem 14.2rem 9.3rem;
    }
}

@media (min-width: 700px) {
    .contact .card::after {
        content: '';
        position: absolute;
        top: -7rem;
        right: -27rem;
        width: 54rem;
        height: 74.4rem;
        background: url('/assets/images/services/locker-europe/contact-operator.webp') no-repeat right top/contain;
    }
}