/************************* css variables *********************/
html {
    font-size: 16px;
}
:root {
  /* ==========================
     Font Families
  ========================== */
  --font-primary: "DM Sans", sans-serif;
  --font-heading: "IvyMode", serif;

    /* ==========================
    Containers
    ========================== */
    --container-header: 86.25rem;   /* 1380px */
    --container-default: 85rem;  /* 1360px */
    --container-inline: 1.25rem;    /* 20px */
    --container-default-inline: 1.875rem; /* 30px */


  /* ==========================
     Font Sizes
  ========================== */
  --fs-p: 1.125rem;          /* 18px */
  --fs-h1: 5.625rem;         /* 90px */
  --fs-h2: 3rem;             /* 48px */
  --fs-h3: 1.875rem;         /* 30px */
  --fs-h4: 1.5rem;         /* 24px */
  --fs-cta: 1.125rem;        /* 18px */
  --fs-cta-small: 1rem;  /* 16px */
  --fs-small: 0.875rem;  /* 14px */

  /* ==========================
     Line Heights
  ========================== */
  --lh-p: 1.625rem;          /* 26px */
  --lh-h1: 7.5rem;           /* 120px */
  --lh-h2: 4.125rem;         /* 66px */
  --lh-h3: 2.625rem;         /* 42px */
  --lh-h4: 2rem;         /* 32px */
  --lh-cta: 1.6875rem;       /* 27px */
  --lh-cta-small: 1.5rem;       /* 24px */

  /* ==========================
     Letter Spacing
  ========================== */
  --ls-cta: 0.0625rem;       /* 1px */
  --ls-sm: 0.04375rem;       /* 0.7px */

  /* ==========================
     Layout
  ========================== */
  --container-padding: 4.875rem; /* ~78px */

  /* ==========================
     Icon Sizes
  ========================== */
  --icon-lg: 1.375rem;       /* 22px */
  --icon-md: 1.0625rem;      /* 17px */
  --icon-gap: 0.4375rem;     /* 7px */
  --link-gap: 0.75rem;       /* 12px */
  /* ==========================
     logo width
  ========================== */
  --logo-width: 7.375rem; /* 118px ÷ 16 */

    /* ==========================
    Language Switcher
    ========================== */
    --lang-radius: 1.875rem;                 /* 30px */
    --lang-padding-y: 0.5rem;               /* 8px */
    --lang-padding-x: 0.8125rem;            /* 13px */
    --lang-icon-size: 1.5rem;               /* 24px */


    /* ==========================
       Mega Menu
    ========================== */
    --mega-menu-arrow-width: 1.8125rem;   /* 29px */
    --mega-menu-arrow-height: 1.4375rem;  /* 23px */
    --mega-menu-arrow-gap: 0.375rem;      /* 6px */


}