:root {
    /* Colors */
    --primary-color: #161617;
    --secondary-color: #0077ED;
    --light-background: #F5F5F7;
    --black-bean: #351B18ff;
    --van-dyke: #3D2B32ff;
    --tan: #D9B387ff;
    --almond: #EDDAC4ff;
    --old-lace: #FDF3E5ff;
    --transparent: transparent;
    --overlay: #0000008c;
    --white: white;
    --black: black;
    --grey: #656b67;
    --light-grey: rgba(255, 255, 255, 0.15);

    /* Font Sizes */
    --display-1: 5rem;
    --display-2: 4.5rem;
    --display-3: 3.5rem;
    --display-4: 3rem;
    --display-5: 2.5rem;
    --display-6: 1.75rem;

    /* Border */
    --rounded-border: 16px;

    /* Pixel Sizes */
    --1px: 0.063rem;
    --8px: 0.5rem;
    --10px: 0.625rem;
    --11px: 0.688rem;
    --12px: 0.75rem;
    --14px: 0.875rem;
    --16px: 1rem;
    --18px: 1.125rem;
    --20px: 1.25rem;
    --22px: 1.375rem;
    --24px: 1.5rem;
    --26px: 1.625rem;
    --28px: 1.75rem;
    --30px: 1.875rem;
    --32px: 2rem;
    --40px: 2.5rem;
    --48px: 3rem;
    --64px: 4rem;
    --80px: 5rem;
    --100px: 6.25rem;
    --128px: 8rem;
    --160px: 10rem;
    --200px: 12.5rem;
    --256px: 16rem;
    --300px: 18.75rem;
    --320px: 20rem;
    --400px: 25rem;
    --480px: 30rem;
    --500px: 31.25rem;
    --512px: 32rem;
    --560px: 35rem;
    --640px: 40rem;

    /* Font Weights */
    --fw-thin: 100;
    --fw-extra-light: 200;
    --fw-light: 300;
    --fw-regular: 400;
    --fw-medium: 500;
    --fw-semi-bold: 600;
    --fw-bold: 700;
    --fw-extra-bold: 800;
    --fw-black: 900;
}

*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: "Inter", sans-serif;
    color: var(--white);
    background-color: var(--van-dyke);
}

html {
    scroll-behavior: smooth;
}

input:focus {
    outline: none;
}
  

/*
===============================================================================================
        Header Styles
===============================================================================================
*/

.navbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--white);
    padding-top: var(--24px);
    margin-bottom: var(--64px);
}

.navbar ul li {
    padding: 1.5em 0em;
    display: inline-block;
    list-style: none;
    text-align: right;
    font-size: var(--18px);
    font-weight: var(--fw-medium);
    margin-left: var(--40px);
}

.navbar a {
    text-decoration: none;
    color: var(--white);
}

.logo {
    display: block;
    font-family: "Inter Tight", sans-serif;
    font-size: var(--22px);
    font-weight: var(--fw-black);
    cursor: pointer;
    color: var(--white);
}

.container {
    margin: 0 auto;
    padding-left: 3%;
    padding-right: 3%;
}

.databar {
    margin-top: var(--128px);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: transparent;
    backdrop-filter: blur(10px);
    border: 1px solid var(--light-grey);
    border-radius: var(--rounded-border);
}

.databar__col--item {
    padding: 0.25rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.databar__wrapper {
    display: flex;
    align-items: center;
    padding: var(--16px) var(--48px);
}

.databar__icon {
    font-size: var(--22px);
}

.databar__text--group {
    margin-left: var(--16px);
}

.databar__title {
    display: block;
    text-transform: uppercase;
    font-weight: var(--fw-semi-bold);
    font-size: var(--18px);
}

.databar__text {
    font-size: var(--14px);
}

.hero__section--overlay {
   border-image: linear-gradient(0deg, var(--van-dyke) 20%, var(--transparent) 100%) fill 1;
}

.hero__section {
    height: 100svh;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
}

.hero__north--america { background-image: linear-gradient(rgba(0,0,0,0.50),rgba(0,0,0,0.50)), url(../images/north-america/north-america-cover-image.jpg);}
.hero__south--america { background-image: linear-gradient(rgba(0,0,0,0.50),rgba(0,0,0,0.50)), url(../images/south-america/south-america-cover-image.jpg);}
.hero__asia { background-image: linear-gradient(rgba(0,0,0,0.50),rgba(0,0,0,0.50)), url(../images/asia/asia-cover-image.jpg);}
.hero__africa { background-image: linear-gradient(rgba(0,0,0,0.50),rgba(0,0,0,0.50)), url(../images/africa/africa-cover-image.jpg);}
.hero__europe { background-image: linear-gradient(rgba(0,0,0,0.50),rgba(0,0,0,0.50)), url(../images/europe/europe-cover-image.jpg);}
.hero__oceania { background-image: linear-gradient(rgba(0,0,0,0.50),rgba(0,0,0,0.50)), url(../images/oceania/oceania-cover-image.jpg);}
.hero__world { background-image: linear-gradient(rgba(0,0,0,0.50),rgba(0,0,0,0.50)), url(../images/world/world-cover-image.jpg);}

.hero__label {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-transform: uppercase;
    border: 1px solid var(--white);
    border-radius: 999px;
    padding: var(--8px) var(--16px);
    font-weight: var(--fw-medium);
    font-size: var(--14px);
    background: transparent;
    backdrop-filter: blur(10px);
}

.hero__description {
    font-size: var(--24px);
    line-height: 1.5;
}

.hero__btn {
    display: inline-block;
    border-radius: 999px;
    padding: 1.5em 2.5em;
    border: none;
    text-decoration: none;
    background-color: var(--white);
    color: var(--black-bean);
    font-weight: var(--fw-medium);
    font-size: var(--18px);
    text-transform: uppercase;
    text-align: center;
    line-height: 1.111em;
    font-size: 1.1em;
    cursor: pointer;
    font-family: inherit;
}

.hero__btn:hover {
    transform: scale3d(.95,.95,1.001);
}

.hero__btn a {
    text-decoration: none;
    color: var(--van-dyke);
    font-family: "Inter", sans-serif;
    font-weight: 700;
    font-size: var(--16px);
}

.hero__title {
    margin: var(--28px) 0rem;
    color: var(--white);
    font-size: var(--display-2);

}

/*
===============================================================================================
        Main Styles
===============================================================================================
*/

/* Heading Styles */

.heading__01 {
    font-size: var(--display-1);
    margin-bottom: var(--32px);
    font-weight: bold;
    line-height: 1.5;
}

.heading__02 {
    font-size: var(--display-2);
    margin-bottom: var(--32px);
    font-weight: bold;
    line-height: 1.5;
}
.heading__03 {
    font-size: var(--display-3);
    margin-bottom: var(--32px);
    font-weight: bold;
    line-height: 1.5;
}

.heading__04 {
    font-size: var(--display-4);
    margin-bottom: var(--32px);
    font-weight: bold;
    line-height: 1.5;
}

.heading__05 {
    font-size: var(--display-5);
    margin-bottom: var(--32px);
    font-weight: bold;
    line-height: 1.5;
}

.heading__06 {
    font-size: var(--display-6);
    margin-bottom: var(--32px);
    font-weight: bold;
    line-height: 1.5;
}

/* Heading Styles */

/* Spacing Styles */

.space__32px {
    height: var(--32px);
}

.space__64px {
    height: var(--64px);
}

.space__128px {
    height: var(--128px);
}

.space__256px {
    height: var(--256px);
}

.space__512px {
    height: var(--512px);
}

/* Spacing Styles */

/* Layout 1 Styles */

.layout__01--grid {
    display: grid;
    gap: 3rem;
    grid-template-columns: 1.5fr 1fr;
}

.layout__01--grid--02 {
    display: grid;
    gap: 3rem;
    grid-template-columns: 1fr 1.5fr;
}

.layout__01--showcase {
    display: flex;
    justify-content: center;
    width: 100%;
    height: var(--560px);
}

.layout__01--showcase--flip {
    transform: scaleX(-1);
}

.layout__01--image {
    background-color: var(--white);
    padding: var(--12px);
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    border-radius: 50%;
}

.layout__01--description {
    font-size: var(--30px);
    padding-bottom: 1.5em;
    font-weight: var(--fw-medium);
}

.layout__01--list {
    list-style: none;
}

.layout__01--list-title {
    display: block;
    padding-bottom: 0.3em;
    font-weight: var(--fw-semi-bold);
    font-size: var(--30px);
    line-height: 1.5;
}

.layout__01--list li {
    font-size: var(--22px);
    padding-bottom: 1.5em;
}

.layout__01--two--column {
    display: grid;
    gap: 6rem;
    grid-template-columns: repeat(2, 1fr);
}

.layout__01--two-column--col {
    text-align: left;
    font-size: var(--18px);
    font-weight: var(--fw-regular);
}

.layout__01--sm-title {
    padding-bottom: var(--14px);
    font-weight: var(--fw-semi-bold);
    font-size: var(--26px);
    line-height: 1.5;
}

.layout__01--divider {
    background-color: var(--white);
    height: var(--1px);
}

/* Layout 1 Styles */

/* Gallery Styles */

.gallery {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(8, 5vw);
    grid-gap: 0.3rem; 
    margin-top: var(--24px);
}
  
.gallery__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block; 
    border-radius: var(--rounded-border);
    border: 1px solid var(--grey);
}
  
.gallery__item--1 {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 1;
    grid-row-end: 3;
}
  
.gallery__item--2 {
    grid-column-start: 3;
    grid-column-end: 5;
    grid-row-start: 1;
    grid-row-end: 3;
}
  
.gallery__item--3 {
    grid-column-start: 5;
    grid-column-end: 9;
    grid-row-start: 1;
    grid-row-end: 6;
}
  
.gallery__item--4 {
    grid-column-start: 1;
    grid-column-end: 5;
    grid-row-start: 3;
    grid-row-end: 6;
}
  
.gallery__item--5 {
    grid-column-start: 1;
    grid-column-end: 5;
    grid-row-start: 6;
    grid-row-end: 9;
}
  
.gallery__item--6 {
    grid-column-start: 5;
    grid-column-end: 9;
    grid-row-start: 6;
    grid-row-end: 9;
}

/* Gallery Styles */

/* Layout 2 Styles */

.layout__02--section--image {
    width: 100%;
    height: 100%;
    min-height: 100dvh;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.layout__02--grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto;
    gap: var(--32px);    
}

.layout__02--grid--col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: var(--16px) 0rem;
}

.layout__02--container {
    position: relative;
    width: 100%;
    padding: 0% 5%;
    z-index: 2;
}

.layout__02--bg--image {
    object-fit: cover;
    object-position: 50% 50%;
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0%;
    z-index: 0;
}

.layout__02--overlay--darker {
    z-index: 1;
    background-color: var(--overlay);
    position: absolute;
    inset: 0%;
}

.layout__02--heading--2 {
    font-size: var(--32px);
    font-weight: var(--fw-semi-bold);
    margin-bottom: var(--16px);
    line-height: 1.5;
}

.layout__02--paragraph--big {
    font-size: var(--18px);
    line-height: var(--32px);
    padding-right: var(--80px);
}

.layout__02--divider {
    border-right: 1px solid var(--grey);
}

/* Layout 2 Styles */

/* Showcase Styles */

.showcase__card--link
{
    text-decoration: none;
    color: var(--white);
}

.showcase__card--grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-columns: 1fr;
    gap: var(--16px);
}

.showcase__card--item {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    height: var(--500px);
    position: relative;
}

.showcase__card--picture {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    border-radius: var(--rounded-border);
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.showcase__card--image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.showcase__card--overlay {
    z-index: 0;
    background-color: #00000030;
    border-image: linear-gradient(0deg, var(--black-bean) 0%, var(--transparent) 100%) fill 1; 
    position: absolute;
    inset: 0%;
  }

.showcase__card--description {
    z-index: 1; /* Hoger dan de overlay */
    width: 100%;
    padding: 1.25rem;
    position: absolute;
}

.showcase__card--title {
    font-size: var(--display-5);
    font-weight: var(--fw-semi-bold);
    line-height: 1.5;
}

.showcase__card--text {
    font-size: var(--20px);
}

.showcase__card--label {
    position: absolute;
    top: 0;
    right: 0;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-transform: uppercase;
    border: 1px solid var(--white);
    border-radius: 999px;
    padding: var(--8px);
    margin: 1.25rem;
    font-weight: var(--fw-medium);
    font-size: var(--14px);
}

.showcase__grid--divider {
    background-color: var(--white);
    height: var(--1px);
    margin-top: var(--24px);
    margin-bottom: var(--24px);
}

/* Showcase Styles */

/* Contact Form Styles */
.contact__form--grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--48px);
}

.contact__form--wrapper {
    display: flex;
    flex-direction: column;
    gap: var(--16px);
}

.contact__form--label {
    display: block;
    font-size: var(--22px);
    color: var(--white);
    margin-bottom: var(--8px);
    line-height: 1.5;
    font-weight: var(--fw-semi-bold);
}

.contact__form--input {
    display: block;
    width: 100%;
    min-height: var(--32px);
    border: none;
    background-color: var(--transparent);
    border-bottom: 1px solid var(--grey);
    line-height: 1.5;
    font-size: var(--18px);
    color: var(--white);
    padding: var(--16px) 0;
    margin-bottom: var(--22px);
    transition: border-color .3s, color .3s, border-color .3s;
}

.contact__form--text-area {
    font-family: "Inter", sans-serif;
    display: block;
    background-color: var(--transparent);
    border: none;
    border-bottom: 1px solid var(--grey);
    font-size: var(--18px);
    color: var(--white);
    padding: var(--18px) 0;
    outline: none;
    transition: border-color .3s, color .3s, border-color .3s;
    height: auto;
    overflow: auto;
    margin-bottom: var(--64px);
}

/* Contact Form Styles */

/*
===============================================================================================
        Footer Styles
===============================================================================================
*/

.footer__divider {
    background-color: var(--white);
    height: 0.0625rem;
    margin-bottom: var(--24px);
}

.footer__grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 0.1fr;
    gap: var(--16px);
    margin-bottom: 1.5rem;
    height: var(--300px);
}

.footer__wrapper {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.8rem;
}

.footer__flex--vertical {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.footer__socials {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-end;
    gap: var(--16px) 0;
    list-style: none;
}

.footer__copyright {
    text-decoration: none;
    color: var(--white);
}

.footer__social--link {
    color: var(--white);
    font-size: var(--32px);
}

.footer__logo {
    font-family: "Inter Tight", sans-serif;
    font-size: var(--32px);
    font-weight: var(--fw-black);
    cursor: pointer;
    color: var(--white);
}

.footer__list--items {
    list-style: none;
}

.footer__list--link {
    color: var(--white);
    text-decoration: none;
    font-size: var(--22px);
    font-weight: var(--fw-regular);
    line-height: 2;
}

.footer__list--underline {
    text-decoration: underline;
}

/*
===============================================================================================
        RWD Device Styles
===============================================================================================
*/

/* Extra */

@media screen 
  and (min-width: 1500px) 
  and (max-width: 1600px) 
{ 
    .databar__wrapper {
        padding: var(--22px);
    }
}

/* Laptop in portrait */

@media screen 
  and (min-width: 1024px) 
  and (max-width: 1500px) 
{ 
     .hero__section {
         height: 100svh;
     }

    .databar {
        grid-template-columns: repeat(2, 1fr);
        margin-top: var(--64px);
        gap: 0;
    }

    .heading__02 {
        font-size: var(--display-3);
    }

    .layout__01--grid {
        grid-template-columns: 1fr;
    }

    .layout__01--content {
        grid-row-start: 1;
    }

    .layout__01--showcase {
        grid-row-end: 3;
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .layout__01--grid--02 {
        grid-template-columns: 1fr;
    }

    .gallery {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(4, 30vw);
    }
  
    .gallery__item--1 {
        grid-column: 1;
        grid-row: 1 / span 2;
    }
  
    .gallery__item--2 {
        grid-column: 2;
        grid-row: 1;
    }
  
    .gallery__item--3 {
        grid-column: 2;
        grid-row: 2;
    }
  
    .gallery__item--4 {
        grid-column: 1 / span 2;
        grid-row: 3;
    }
  
    .gallery__item--5 {
        grid-column: 1;
        grid-row: 4;
    }
    
    .gallery__item--6 {
        grid-column: 2;
        grid-row: 4;
    }

    .layout__02--section--image {
        min-height: 100dvh;
    }

    .layout__02--grid {
        grid-template-columns: 2fr;
    }
    
    .layout__02--divider {
        border-right: none;
        border-bottom: 1px solid var(--grey);
    }

    .showcase__card--grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-auto-columns: 1fr;
        gap: var(--16px);
    }

    .contact__form--grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .footer__grid {
        grid-template-columns: repeat(2, 1fr);
        height: auto;
    }

    .footer__socials {
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
    }

    .footer__social--link {
        margin-right: var(--24px);
    }
}


/* Tablet in portrait */

@media only screen 
and (min-width: 768px) 
and (max-width: 1024px) 
and (orientation : portrait) 
{ 
     .hero__section {
         height: 100svh;
     }

    .databar {
        grid-template-columns: repeat(2, 1fr);
        margin-top: var(--64px);
        gap: 0;
    }

    .heading__02 {
        font-size: var(--display-3);
    }

    .layout__01--grid {
        grid-template-columns: 1fr;
    }

    .layout__01--content {
        grid-row-start: 1;
    }

    .layout__01--showcase {
        grid-row-end: 3;
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .layout__01--grid--02 {
        grid-template-columns: 1fr;
    }

    .gallery {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(4, 30vw);
    }
  
    .gallery__item--1 {
        grid-column: 1;
        grid-row: 1 / span 2;
    }
  
    .gallery__item--2 {
        grid-column: 2;
        grid-row: 1;
    }
  
    .gallery__item--3 {
        grid-column: 2;
        grid-row: 2;
    }
  
    .gallery__item--4 {
        grid-column: 1 / span 2;
        grid-row: 3;
    }
  
    .gallery__item--5 {
        grid-column: 1;
        grid-row: 4;
    }
    
    .gallery__item--6 {
        grid-column: 2;
        grid-row: 4;
    }

    .layout__02--section--image {
        min-height: 100dvh;
    }

    .layout__02--grid {
        grid-template-columns: 2fr;
    }
    
    .layout__02--divider {
        border-right: none;
        border-bottom: 1px solid var(--grey);
    }

    .showcase__card--grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-auto-columns: 1fr;
        gap: var(--16px);
    }

    .contact__form--grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .footer__grid {
        grid-template-columns: repeat(2, 1fr);
        height: auto;
    }

    .footer__socials {
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
    }

    .footer__social--link {
        margin-right: var(--24px);
    }
}

/* Smartphone in portrait */

@media only screen 
and (min-width: 320px) 
and (max-width: 768px) 
and (orientation: portrait ) {

    .hero__section {
        height: 120svh;
    }

    .hero__description {
        font-size: var(--18px);
    }

    .navbar {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        margin-bottom: var(--32px);
    }
    
    .navbar ul {
        display: flex;
        width: 100%;
        justify-content: space-between;
        padding: 0.5em 0;
        margin: 0;
        text-align: center;
    }

    .navbar ul li {
        font-size: var(--18px);
        padding: 0.8em 0;
        margin: 0;
    }

    .hero__title {
        font-size: var(--display-4);
    }

    .hero__label {
        font-size: var(--12px);
    }

    .databar {
        margin-top: var(--64px);
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0.5rem;
        background: transparent;
        backdrop-filter: blur(10px);
    }
    .databar__col--item {
        padding: 0.25rem;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    
    .databar__wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: var(--16px) 0;
    }
    
    .databar__icon {
        font-size: var(--20px);
        margin-bottom: var(--8px);
    }
    
    .databar__text--group {
        margin-left: 0;
    }
    
    .databar__title {
        display: block;
        text-transform: uppercase;
        font-weight: var(--fw-semi-bold);
        font-size: var(--16px);
    }
    
    .databar__text {
        font-size: var(--12px);
    }

    .heading__02 {
        font-size: var(--display-5);
    }

    .heading__03 {
        font-size: var(--40px);
    }

    .layout__01--grid {
        grid-template-columns: 1fr;
    }

    .layout__01--grid--02 {
        grid-template-columns: 1fr;
    }

    .layout__01--two--column {
        display: grid;
        gap: 3rem;
        grid-template-columns: 1fr;
    }

    .layout__01--two-column-item  {
        padding-bottom: var(--8px);
    }

    .layout__01--showcase {
        width: var(--320px);
        height: var(--320px);
        grid-row-end: 3;
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .showcase__card--text {
        font-size: var(--16px);
    }

    .layout__01--image {
        padding: var(--16px);
    }

    .gallery {
        grid-template-columns: repeat(1, 1fr);
        grid-template-rows: auto;
    }

    .gallery__img {
        height: var(--256px);
    }

    .gallery__item--1, 
    .gallery__item--2,
    .gallery__item--3, 
    .gallery__item--4, 
    .gallery__item--5, 
    .gallery__item--6 {
        grid-column: auto;
        grid-row: auto;
    }

    .layout__02--grid {
        grid-template-columns: 1fr;
    }

    .layout__02--divider {
        border-right: none;
        border-bottom: 1px solid var(--grey);
    }

    .layout__02--paragraph--big {
        padding-right: 0;
    }

    .layout__02--section--image {
        padding: var(--32px) 0;
    }

    .showcase__card--grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .contact__form--grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .footer__grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .footer__flex--vertical {
        margin-bottom: var(--24px);
    }

    .footer__socials {
        flex-direction: row;
        align-items: center;
        justify-content: center;
        margin-bottom: var(--24px);
        gap: var(--24px);
    }

    .footer__social--link {
        font-size: var(--28px);
        margin-left: 0;
    }

    .footer__list--link {
        font-size: var(--22px);
    }

}