/* ======================================
   FONT SETUP
====================================== */

@font-face {
    font-family: "Montserrat";
    src: url("/assets/fonts/montserrat/Montserrat-Bold.woff2") format("woff2"),
         url("/assets/fonts/montserrat/Montserrat-Bold.woff") format("woff");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Montserrat";
    src: url("/assets/fonts/montserrat/Montserrat-Medium.woff2") format("woff2"),
         url("/assets/fonts/montserrat/Montserrat-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Montserrat";
    src: url("/assets/fonts/montserrat/Montserrat-Regular.woff2") format("woff2"),
         url("/assets/fonts/montserrat/Montserrat-Regular.woff") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: "Helvetica Neue";
    src: url("/assets/fonts/helvetica neue/HelveticaNeueLight.woff2") format("woff2"),
         url("/assets/fonts/helvetica neue/HelveticaNeueLight.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Helvetica Neue";
    src: url("/assets/fonts/helvetica neue/HelveticaNeueThin.woff2") format("woff2"),
         url("/assets/fonts/helvetica neue/HelveticaNeueThin.woff") format("woff");
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}
/* @font-face {
    font-family: "Nephlim2.woff2";
    src: url("/assets/fonts/Nephlim.woff2") format("woff2");
    font-weight: 200;
    font-style: normal;
    font-display: swap;
} */



/* ======================================
   ARABIC FONTS 
====================================== */
@font-face {
  font-family: 'Montserrat Arabic';
  src:
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic Thin 250.woff2') format('woff2'),
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic Thin 250.woff') format('woff');
  font-weight: 250;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat Arabic';
  src:
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic ExtraLight 275.woff2') format('woff2'),
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic ExtraLight 275.woff') format('woff');
  font-weight: 275;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat Arabic';
  src:
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic Light 300.woff2') format('woff2'),
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic Light 300.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat Arabic';
  src:
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic Regular 400.woff2') format('woff2'),
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic Regular 400.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat Arabic';
  src:
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic Medium 500.woff2') format('woff2'),
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic Medium 500.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat Arabic';
  src:
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic SemiBold 600.woff2') format('woff2'),
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic SemiBold 600.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat Arabic';
  src:
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic Bold 700.woff2') format('woff2'),
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic Bold 700.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat Arabic';
  src:
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic ExtraBold 800.woff2') format('woff2'),
    url('/assets/fonts/montserrat-arabic/Montserrat-Arabic ExtraBold 800.woff') format('woff');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

 *:lang(ar){
  font-family: 'Montserrat Arabic', sans-serif !important;
 }
 h1:lang(ar),h2:lang(ar),h3:lang(ar),h4:lang(ar),h5:lang(ar),h6:lang(ar){
    line-height: 1.2;
 }
 p,a{
    line-height: 1.2;
 }


/* ======================================
   HEADLINES 
====================================== */
span{
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}
.headline-1,
h1,
h2 {
    font-family: "Montserrat", sans-serif;
    font-size: clamp(90px, 7.8125vw, 150px);
    line-height: clamp(88px, 7.1667vw, 137.6px);
    font-weight: 500;
    text-transform: uppercase;
}

.headline-2 {
    font-family: "Montserrat", sans-serif;
    font-size: clamp(36px, 2.604vw, 50px);
    line-height: clamp(36px, 2.604vw, 50px);
    font-weight: 500;
    text-transform: uppercase;
}

.headline-3 {
    font-family: "Montserrat", sans-serif;
    font-size: clamp(24px, 1.667vw, 32px);
    line-height: clamp(24px, 1.667vw, 32px);
    font-weight: 700;
    text-transform: uppercase;
}

.headline-4 {
    font-family: "Montserrat", sans-serif;
    font-size: clamp(20px, 1.25vw, 24px);
    line-height: clamp(28px, 1.667vw, 32px);
    font-weight: 600;
    text-transform: uppercase;
}

.headline-5 {
    font-family: "Montserrat", sans-serif;
    font-size: clamp(16px, 0.9375vw, 18px);
    line-height: clamp(26px, 1.5625vw, 30px);
    font-weight: 400;
    text-transform: uppercase;
    color: var(--silver);
}

.headline-6 {
    font-family: "Montserrat", sans-serif;
    font-size: clamp(14px, 0.833vw, 16px);
    line-height: clamp(20px, 1.25vw, 24px);
    font-weight: 400;
    text-transform: uppercase;
}


/* ======================================
   BODY TEXT — EXACT FIGMA NAMES
====================================== */

.body-large {
    font-family: "Helvetica Neue", sans-serif;
    font-size: clamp(24px, 1.667vw, 32px);
    line-height: clamp(36px, 2.396vw, 46px);
    font-weight: 300;
}

.body-medium {
    font-family: "Helvetica Neue", sans-serif;
    font-size: clamp(18px, 1.25vw, 24px);
    line-height: clamp(28px, 1.771vw, 34px);
    font-weight: 200;
}

.body-small {
    font-family: "Helvetica Neue", sans-serif;
    font-size: clamp(16px, 0.9375vw, 18px);
    line-height: clamp(24px, 1.406vw, 27px);
    font-weight: 200;
    color: var(--gayser);
}

.body-xsmall,
.helv-regular {
    font-family: "Helvetica Neue", sans-serif;
    font-size: clamp(14px, 0.833vw, 16px);
    line-height: clamp(20px, 1.25vw, 24px);
    font-weight: 200;
}


.body-xsmall,
.helv-regular {
    font-family: "Helvetica Neue", sans-serif;
    font-size: clamp(14px, 0.833vw, 16px);
    line-height: clamp(20px, 1.25vw, 24px);
    font-weight: 200;
}


/* ======================================
   SPECIAL
====================================== */

.highlight-text {
    font-family: inherit;
    font-weight: inherit;
    color: var(--yellow-accent);
}
.blue-lagoon-highlight-text {
    font-family: inherit;
    font-weight: inherit;
    color: var(--blue-lagoon);
}
.blue-highlight-text {
    font-family: inherit;
    font-weight: inherit;
    color: var(--blue);
}


.btn-label {
    font-family: "TechDisplay", sans-serif;
    font-size: clamp(12px, 0.729vw, 14px);
    line-height: clamp(20px, 1.25vw, 24px);
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 600;
}


@media(max-width:768px){
        
    /* ======================================
    HEADLINES 
    ====================================== */

    .headline-1,
    h1,
    h2{
        font-family: "Montserrat", sans-serif;
        font-size:  50px;
        font-weight: 500;
        line-height: 1;
        text-transform: uppercase;
    }

    .headline-2 {
        font-family: "Montserrat", sans-serif;
        font-size: clamp(24px, 1.667vw, 32px);
        line-height: clamp(24px, 1.667vw, 32px);
        font-weight: 500;
        text-transform: uppercase;
    }

    .headline-3 {
        font-family: "Montserrat", sans-serif;
        font-size: clamp(20px, 1.25vw, 24px);
        line-height: lamp(28px, 1.667vw, 32px);
        font-weight: 600;
        text-transform: uppercase;
    }

    .headline-4 {
        font-family: "Montserrat", sans-serif;
        font-size: clamp(16px, 0.9375vw, 18px);
        line-height: clamp(26px, 1.5625vw, 30px);
        text-transform: uppercase;
        color: var(--silver);
    }

    .headline-5 {
        font-family: "Montserrat", sans-serif;
        font-size: clamp(14px, 0.833vw, 16px);
        line-height: clamp(20px, 1.25vw, 24px);
        font-weight: 400;
        text-transform: uppercase;
    }


    /* ======================================
    BODY TEXT — EXACT FIGMA NAMES
    ====================================== */

    .body-large {
        font-family: "Helvetica Neue", sans-serif;
        font-size: clamp(18px, 1.25vw, 24px);
        line-height: clamp(28px, 1.771vw, 34px);
        font-weight: 300;
    }

    .body-medium {
        
        font-family: "Helvetica Neue", sans-serif;
        font-size: clamp(16px, 0.9375vw, 18px);
        line-height: clamp(24px, 1.406vw, 27px);
        font-weight: 200;
    }

    .body-small {
        font-family: "Helvetica Neue", sans-serif;
        font-size: clamp(14px, 0.833vw, 16px);
        line-height: clamp(20px, 1.25vw, 24px);
        font-weight: 200;
        color: var(--gayser);
    }

    


    .body-xsmall,
    .helv-regular {
        font-family: "Helvetica Neue", sans-serif;
        font-size: clamp(14px, 0.833vw, 16px);
        line-height: clamp(20px, 1.25vw, 24px);
        font-weight: 200;
    }


    /* ======================================
    SPECIAL
    ====================================== */

    .highlight-text {
        font-family: inherit;
        font-weight: inherit;
        color: var(--yellow-accent);
    }
    .blue-lagoon-highlight-text {
        font-family: inherit;
        font-weight: inherit;
        color: var(--blue-lagoon);
    }
    .blue-highlight-text {
        font-family: inherit;
        font-weight: inherit;
        color: var(--blue);
    }


    .btn-label {
        font-family: "TechDisplay", sans-serif;
        font-size: clamp(12px, 0.729vw, 14px);
        line-height: clamp(20px, 1.25vw, 24px);
        text-transform: uppercase;
        letter-spacing: 2px;
        font-weight: 600;
    }

}

@media(max-width:410px){
    h1,h2,.headline-1{
        font-size: 40px;
        line-height: 1.1;
    }
}