@use 'sass:map';
:root {
  /* ------------------------- */
  /* Font sizes */
  /* ------------------------- */
  /* 12px */
  --txt-xs: 1.2rem;
  /* 14px */
  --txt-sm: 1.4rem;
  /* 16px */
  --txt-base: 1.6rem;
  /* 18px */
  --txt-lg: 1.8rem;
  /* 20px */
  --txt-xl: 2rem;
  /* 24px */
  --txt-2xl: 2.4rem;
  /* 30px */
  --txt-3xl: 3rem;
  /* 36px */
  --txt-4xl: 3.6rem;
  /* 48px */
  --txt-5xl: 4.8rem;
  /* 60px */
  --txt-6xl: 6rem;
  /* 72px */
  --txt-7xl: 7.2rem;
  /* 96px */
  --txt-8xl: 9.6rem;
  /* ------------------------- */
  /* Font families */
  /* ------------------------- */
  --ff-sans-normal: 'Inter', sans-serif;
  /* gap */
  --gap: 0.5rem;
  /* ------------------------- */
  /* Colors */
  /* ------------------------- */
  --clr-white: 0, 0%, 100%;
  --clr-black: 0, 0%, 0%;
  /* Primary */
  --clr-primary-50: 164, 100%, 95%;
  --clr-primary-100: 169, 87%, 85%;
  --clr-primary-200: 168, 76%, 73%;
  --clr-primary-300: 162, 87%, 53%;
  --clr-primary-400: 162, 77%, 52%;
  --clr-primary-500: 168, 95%, 39%;
  --clr-primary-600: 174, 77%, 35%;
  --clr-primary-700: 180, 77%, 29%;
  --clr-primary-800: 186, 78%, 23%;
  --clr-primary-900: 195, 79%, 17%;
  /* Default */
  --clr-default-50: 240, 20%, 99%;
  --clr-default-100: 210, 20%, 98%;
  --clr-default-200: 216, 24%, 96%;
  --clr-default-300: 217, 16%, 84%;
  --clr-default-400: 214 11% 72%;
  --clr-default-500: 216, 10%, 47%;
  --clr-default-600: 219, 15%, 34%;
  --clr-default-700: 217, 22%, 23%;
  --clr-default-800: 214, 33%, 17%;
  --clr-default-900: 219, 66%, 10%;
  /* Warning */
  --clr-warning-50: 47, 100%, 94%;
  --clr-warning-100: 47, 91%, 86%;
  --clr-warning-200: 47, 87%, 79%;
  --clr-warning-400: 47, 91%, 50%;
  --clr-warning-600: 40, 94%, 44%;
  --clr-warning-900: 41, 67%, 20%;
  /* Danger */
  --clr-danger-50: 0, 100%, 95%;
  --clr-danger-100: 0, 100%, 89%;
  --clr-danger-200: 0, 94%, 79%;
  --clr-danger-400: 0, 93%, 48%;
  --clr-danger-600: 0, 90%, 40%;
  --clr-danger-900: 0, 91%, 26%; }

/* Breakpoints */
/* media queries */
.flex {
  display: flex;
  gap: var(--gap, 1rem); }

.flex-vertical {
  flex-direction: column; }

.grid {
  display: grid;
  gap: var(--gap, 1rem); }

.block {
  display: block; }

.container-fluidnew {
  padding-inline: 1rem; }
  @media (min-width: 80rem) {
    .container-fluidnew {
      padding-inline: 2rem; } }

.containernew {
  width: 100%;
  margin-inline: auto; }
  @media (min-width: 64rem) {
    .containernew {
      width: 60rem; } }
  @media (min-width: 80rem) {
    .containernew {
      width: 72rem; } }
  @media (min-width: 96rem) {
    .containernew {
      width: 88rem; } }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0; }

.hidden {
  display: none; }

/* ------------------------------ */
/* Background and text color classes */
/* ------------------------------ */
.bgnew-primary-50 {
  background-color: hsl(var(--clr-primary-50)); }

.bgnew-default-50 {
  background-color: hsl(var(--clr-default-50)); }

.txtnew-primary-50 {
  color: hsl(var(--clr-primary-50)); }

.txtnew-default-50 {
  color: hsl(var(--clr-default-50)); }

.bgnew-primary-100 {
  background-color: hsl(var(--clr-primary-100)); }

.bgnew-default-100 {
  background-color: hsl(var(--clr-default-100)); }

.txtnew-primary-100 {
  color: hsl(var(--clr-primary-100)); }

.txtnew-default-100 {
  color: hsl(var(--clr-default-100)); }

.bgnew-primary-200 {
  background-color: hsl(var(--clr-primary-200)); }

.bgnew-default-200 {
  background-color: hsl(var(--clr-default-200)); }

.txtnew-primary-200 {
  color: hsl(var(--clr-primary-200)); }

.txtnew-default-200 {
  color: hsl(var(--clr-default-200)); }

.bgnew-primary-300 {
  background-color: hsl(var(--clr-primary-300)); }

.bgnew-default-300 {
  background-color: hsl(var(--clr-default-300)); }

.txtnew-primary-300 {
  color: hsl(var(--clr-primary-300)); }

.txtnew-default-300 {
  color: hsl(var(--clr-default-300)); }

.bgnew-primary-400 {
  background-color: hsl(var(--clr-primary-400)); }

.bgnew-default-400 {
  background-color: hsl(var(--clr-default-400)); }

.txtnew-primary-400 {
  color: hsl(var(--clr-primary-400)); }

.txtnew-default-400 {
  color: hsl(var(--clr-default-400)); }

.bgnew-primary-500 {
  background-color: hsl(var(--clr-primary-500)); }

.bgnew-default-500 {
  background-color: hsl(var(--clr-default-500)); }

.txtnew-primary-500 {
  color: hsl(var(--clr-primary-500)); }

.txtnew-default-500 {
  color: hsl(var(--clr-default-500)); }

.bgnew-primary-600 {
  background-color: hsl(var(--clr-primary-600)); }

.bgnew-default-600 {
  background-color: hsl(var(--clr-default-600)); }

.txtnew-primary-600 {
  color: hsl(var(--clr-primary-600)); }

.txtnew-default-600 {
  color: hsl(var(--clr-default-600)); }

.bgnew-primary-700 {
  background-color: hsl(var(--clr-primary-700)); }

.bgnew-default-700 {
  background-color: hsl(var(--clr-default-700)); }

.txtnew-primary-700 {
  color: hsl(var(--clr-primary-700)); }

.txtnew-default-700 {
  color: hsl(var(--clr-default-700)); }

.bgnew-primary-800 {
  background-color: hsl(var(--clr-primary-800)); }

.bgnew-default-800 {
  background-color: hsl(var(--clr-default-800)); }

.txtnew-primary-800 {
  color: hsl(var(--clr-primary-800)); }

.txtnew-default-800 {
  color: hsl(var(--clr-default-800)); }

.bgnew-primary-900 {
  background-color: hsl(var(--clr-primary-900)); }

.bgnew-default-900 {
  background-color: hsl(var(--clr-default-900)); }

.txtnew-primary-900 {
  color: hsl(var(--clr-primary-900)); }

.txtnew-default-900 {
  color: hsl(var(--clr-default-900)); }

.bgnew-warning-50 {
  background-color: hsl(var(--clr-warning-50)); }

.bgnew-danger-50 {
  background-color: hsl(var(--clr-danger-50)); }

.txtnew-warning-50 {
  color: hsl(var(--clr-warning-50)); }

.txtnew-danger-50 {
  color: hsl(var(--clr-danger-50)); }

.bgnew-warning-100 {
  background-color: hsl(var(--clr-warning-100)); }

.bgnew-danger-100 {
  background-color: hsl(var(--clr-danger-100)); }

.txtnew-warning-100 {
  color: hsl(var(--clr-warning-100)); }

.txtnew-danger-100 {
  color: hsl(var(--clr-danger-100)); }

.bgnew-warning-200 {
  background-color: hsl(var(--clr-warning-200)); }

.bgnew-danger-200 {
  background-color: hsl(var(--clr-danger-200)); }

.txtnew-warning-200 {
  color: hsl(var(--clr-warning-200)); }

.txtnew-danger-200 {
  color: hsl(var(--clr-danger-200)); }

.bgnew-warning-400 {
  background-color: hsl(var(--clr-warning-400)); }

.bgnew-danger-400 {
  background-color: hsl(var(--clr-danger-400)); }

.txtnew-warning-400 {
  color: hsl(var(--clr-warning-400)); }

.txtnew-danger-400 {
  color: hsl(var(--clr-danger-400)); }

.bgnew-warning-600 {
  background-color: hsl(var(--clr-warning-600)); }

.bgnew-danger-600 {
  background-color: hsl(var(--clr-danger-600)); }

.txtnew-warning-600 {
  color: hsl(var(--clr-warning-600)); }

.txtnew-danger-600 {
  color: hsl(var(--clr-danger-600)); }

.bgnew-warning-900 {
  background-color: hsl(var(--clr-warning-900)); }

.bgnew-danger-900 {
  background-color: hsl(var(--clr-danger-900)); }

.txtnew-warning-900 {
  color: hsl(var(--clr-warning-900)); }

.txtnew-danger-900 {
  color: hsl(var(--clr-danger-900)); }

.bgnew-white {
  background-color: hsl(var(--clr-white)); }

.bgnew-black {
  background-color: hsl(var(--clr-black)); }

.txtnew-white {
  color: hsl(var(--clr-white)); }

.txtnew-black {
  color: hsl(var(--clr-black)); }

.bgnew-white-blur {
  background-color: white; }

@supports (backdrop-filter: blur(5rem)) {
  .bgnew-white-blur {
    background-color: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(5rem); } }
/* ------------------------------ */
/* Text alignment */
/* ------------------------------ */
.txt-start {
  text-align: left; }

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

.txt-end {
  text-align: right; }

/* ------------------------------ */
/* Spacing system */
/* ------------------------------ */
/* 
0-0px, 1-4px, 2-8px, 3-12px, 4-16px, 5-20px, 6-24px, 7-28px, 8-32px, 9-40px, 10-48px, 
11-56px, 12-64px, 13-80px, 14-96px, 15-128px, 16-160px, 17-192px, 18-224px, 19-256px 
*/
.p-0 {
  padding: 0rem; }

.pr-0 {
  padding-right: 0rem; }

.pl-0 {
  padding-left: 0rem; }

.pb-0 {
  padding-bottom: 0rem; }

.pt-0 {
  padding-top: 0rem; }

.pv-0 {
  padding-top: 0rem;
  padding-bottom: 0rem; }

.ph-0 {
  padding-left: 0rem;
  padding-right: 0rem; }

.m-0 {
  margin: 0rem; }

.mr-0 {
  margin-right: 0rem; }

.ml-0 {
  margin-left: 0rem; }

.mb-0 {
  margin-bottom: 0rem; }

.mt-0 {
  margin-top: 0rem; }

.mv-0 {
  margin-top: 0rem;
  margin-bottom: 0rem; }

.mh-0 {
  margin-left: 0rem;
  margin-right: 0rem; }

.p-1 {
  padding: 0.25rem; }

.pr-1 {
  padding-right: 0.25rem; }

.pl-1 {
  padding-left: 0.25rem; }

.pb-1 {
  padding-bottom: 0.25rem; }

.pt-1 {
  padding-top: 0.25rem; }

.pv-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem; }

.ph-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem; }

.m-1 {
  margin: 0.25rem; }

.mr-1 {
  margin-right: 0.25rem; }

.ml-1 {
  margin-left: 0.25rem; }

.mb-1 {
  margin-bottom: 0.25rem; }

.mt-1 {
  margin-top: 0.25rem; }

.mv-1 {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem; }

.mh-1 {
  margin-left: 0.25rem;
  margin-right: 0.25rem; }

.p-2 {
  padding: 0.5rem; }

.pr-2 {
  padding-right: 0.5rem; }

.pl-2 {
  padding-left: 0.5rem; }

.pb-2 {
  padding-bottom: 0.5rem; }

.pt-2 {
  padding-top: 0.5rem; }

.pv-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem; }

.ph-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem; }

.m-2 {
  margin: 0.5rem; }

.mr-2 {
  margin-right: 0.5rem; }

.ml-2 {
  margin-left: 0.5rem; }

.mb-2 {
  margin-bottom: 0.5rem; }

.mt-2 {
  margin-top: 0.5rem; }

.mv-2 {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem; }

.mh-2 {
  margin-left: 0.5rem;
  margin-right: 0.5rem; }

.p-3 {
  padding: 0.75rem; }

.pr-3 {
  padding-right: 0.75rem; }

.pl-3 {
  padding-left: 0.75rem; }

.pb-3 {
  padding-bottom: 0.75rem; }

.pt-3 {
  padding-top: 0.75rem; }

.pv-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem; }

.ph-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem; }

.m-3 {
  margin: 0.75rem; }

.mr-3 {
  margin-right: 0.75rem; }

.ml-3 {
  margin-left: 0.75rem; }

.mb-3 {
  margin-bottom: 0.75rem; }

.mt-3 {
  margin-top: 0.75rem; }

.mv-3 {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem; }

.mh-3 {
  margin-left: 0.75rem;
  margin-right: 0.75rem; }

.p-4 {
  padding: 1rem; }

.pr-4 {
  padding-right: 1rem; }

.pl-4 {
  padding-left: 1rem; }

.pb-4 {
  padding-bottom: 1rem; }

.pt-4 {
  padding-top: 1rem; }

.pv-4 {
  padding-top: 1rem;
  padding-bottom: 1rem; }

.ph-4 {
  padding-left: 1rem;
  padding-right: 1rem; }

.m-4 {
  margin: 1rem; }

.mr-4 {
  margin-right: 1rem; }

.ml-4 {
  margin-left: 1rem; }

.mb-4 {
  margin-bottom: 1rem; }

.mt-4 {
  margin-top: 1rem; }

.mv-4 {
  margin-top: 1rem;
  margin-bottom: 1rem; }

.mh-4 {
  margin-left: 1rem;
  margin-right: 1rem; }

.p-5 {
  padding: 1.25rem; }

.pr-5 {
  padding-right: 1.25rem; }

.pl-5 {
  padding-left: 1.25rem; }

.pb-5 {
  padding-bottom: 1.25rem; }

.pt-5 {
  padding-top: 1.25rem; }

.pv-5 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem; }

.ph-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem; }

.m-5 {
  margin: 1.25rem; }

.mr-5 {
  margin-right: 1.25rem; }

.ml-5 {
  margin-left: 1.25rem; }

.mb-5 {
  margin-bottom: 1.25rem; }

.mt-5 {
  margin-top: 1.25rem; }

.mv-5 {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem; }

.mh-5 {
  margin-left: 1.25rem;
  margin-right: 1.25rem; }

.p-6 {
  padding: 1.5rem; }

.pr-6 {
  padding-right: 1.5rem; }

.pl-6 {
  padding-left: 1.5rem; }

.pb-6 {
  padding-bottom: 1.5rem; }

.pt-6 {
  padding-top: 1.5rem; }

.pv-6 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem; }

.ph-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem; }

.m-6 {
  margin: 1.5rem; }

.mr-6 {
  margin-right: 1.5rem; }

.ml-6 {
  margin-left: 1.5rem; }

.mb-6 {
  margin-bottom: 1.5rem; }

.mt-6 {
  margin-top: 1.5rem; }

.mv-6 {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem; }

.mh-6 {
  margin-left: 1.5rem;
  margin-right: 1.5rem; }

.p-7 {
  padding: 1.75rem; }

.pr-7 {
  padding-right: 1.75rem; }

.pl-7 {
  padding-left: 1.75rem; }

.pb-7 {
  padding-bottom: 1.75rem; }

.pt-7 {
  padding-top: 1.75rem; }

.pv-7 {
  padding-top: 1.75rem;
  padding-bottom: 1.75rem; }

.ph-7 {
  padding-left: 1.75rem;
  padding-right: 1.75rem; }

.m-7 {
  margin: 1.75rem; }

.mr-7 {
  margin-right: 1.75rem; }

.ml-7 {
  margin-left: 1.75rem; }

.mb-7 {
  margin-bottom: 1.75rem; }

.mt-7 {
  margin-top: 1.75rem; }

.mv-7 {
  margin-top: 1.75rem;
  margin-bottom: 1.75rem; }

.mh-7 {
  margin-left: 1.75rem;
  margin-right: 1.75rem; }

.p-8 {
  padding: 2rem; }

.pr-8 {
  padding-right: 2rem; }

.pl-8 {
  padding-left: 2rem; }

.pb-8 {
  padding-bottom: 2rem; }

.pt-8 {
  padding-top: 2rem; }

.pv-8 {
  padding-top: 2rem;
  padding-bottom: 2rem; }

.ph-8 {
  padding-left: 2rem;
  padding-right: 2rem; }

.m-8 {
  margin: 2rem; }

.mr-8 {
  margin-right: 2rem; }

.ml-8 {
  margin-left: 2rem; }

.mb-8 {
  margin-bottom: 2rem; }

.mt-8 {
  margin-top: 2rem; }

.mv-8 {
  margin-top: 2rem;
  margin-bottom: 2rem; }

.mh-8 {
  margin-left: 2rem;
  margin-right: 2rem; }

.p-9 {
  padding: 2.5rem; }

.pr-9 {
  padding-right: 2.5rem; }

.pl-9 {
  padding-left: 2.5rem; }

.pb-9 {
  padding-bottom: 2.5rem; }

.pt-9 {
  padding-top: 2.5rem; }

.pv-9 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem; }

.ph-9 {
  padding-left: 2.5rem;
  padding-right: 2.5rem; }

.m-9 {
  margin: 2.5rem; }

.mr-9 {
  margin-right: 2.5rem; }

.ml-9 {
  margin-left: 2.5rem; }

.mb-9 {
  margin-bottom: 2.5rem; }

.mt-9 {
  margin-top: 2.5rem; }

.mv-9 {
  margin-top: 2.5rem;
  margin-bottom: 2.5rem; }

.mh-9 {
  margin-left: 2.5rem;
  margin-right: 2.5rem; }

.p-10 {
  padding: 3rem; }

.pr-10 {
  padding-right: 3rem; }

.pl-10 {
  padding-left: 3rem; }

.pb-10 {
  padding-bottom: 3rem; }

.pt-10 {
  padding-top: 3rem; }

.pv-10 {
  padding-top: 3rem;
  padding-bottom: 3rem; }

.ph-10 {
  padding-left: 3rem;
  padding-right: 3rem; }

.m-10 {
  margin: 3rem; }

.mr-10 {
  margin-right: 3rem; }

.ml-10 {
  margin-left: 3rem; }

.mb-10 {
  margin-bottom: 3rem; }

.mt-10 {
  margin-top: 3rem; }

.mv-10 {
  margin-top: 3rem;
  margin-bottom: 3rem; }

.mh-10 {
  margin-left: 3rem;
  margin-right: 3rem; }

.p-11 {
  padding: 3.5rem; }

.pr-11 {
  padding-right: 3.5rem; }

.pl-11 {
  padding-left: 3.5rem; }

.pb-11 {
  padding-bottom: 3.5rem; }

.pt-11 {
  padding-top: 3.5rem; }

.pv-11 {
  padding-top: 3.5rem;
  padding-bottom: 3.5rem; }

.ph-11 {
  padding-left: 3.5rem;
  padding-right: 3.5rem; }

.m-11 {
  margin: 3.5rem; }

.mr-11 {
  margin-right: 3.5rem; }

.ml-11 {
  margin-left: 3.5rem; }

.mb-11 {
  margin-bottom: 3.5rem; }

.mt-11 {
  margin-top: 3.5rem; }

.mv-11 {
  margin-top: 3.5rem;
  margin-bottom: 3.5rem; }

.mh-11 {
  margin-left: 3.5rem;
  margin-right: 3.5rem; }

.p-12 {
  padding: 4rem; }

.pr-12 {
  padding-right: 4rem; }

.pl-12 {
  padding-left: 4rem; }

.pb-12 {
  padding-bottom: 4rem; }

.pt-12 {
  padding-top: 4rem; }

.pv-12 {
  padding-top: 4rem;
  padding-bottom: 4rem; }

.ph-12 {
  padding-left: 4rem;
  padding-right: 4rem; }

.m-12 {
  margin: 4rem; }

.mr-12 {
  margin-right: 4rem; }

.ml-12 {
  margin-left: 4rem; }

.mb-12 {
  margin-bottom: 4rem; }

.mt-12 {
  margin-top: 4rem; }

.mv-12 {
  margin-top: 4rem;
  margin-bottom: 4rem; }

.mh-12 {
  margin-left: 4rem;
  margin-right: 4rem; }

.p-13 {
  padding: 5rem; }

.pr-13 {
  padding-right: 5rem; }

.pl-13 {
  padding-left: 5rem; }

.pb-13 {
  padding-bottom: 5rem; }

.pt-13 {
  padding-top: 5rem; }

.pv-13 {
  padding-top: 5rem;
  padding-bottom: 5rem; }

.ph-13 {
  padding-left: 5rem;
  padding-right: 5rem; }

.m-13 {
  margin: 5rem; }

.mr-13 {
  margin-right: 5rem; }

.ml-13 {
  margin-left: 5rem; }

.mb-13 {
  margin-bottom: 5rem; }

.mt-13 {
  margin-top: 5rem; }

.mv-13 {
  margin-top: 5rem;
  margin-bottom: 5rem; }

.mh-13 {
  margin-left: 5rem;
  margin-right: 5rem; }

.p-14 {
  padding: 6rem; }

.pr-14 {
  padding-right: 6rem; }

.pl-14 {
  padding-left: 6rem; }

.pb-14 {
  padding-bottom: 6rem; }

.pt-14 {
  padding-top: 6rem; }

.pv-14 {
  padding-top: 6rem;
  padding-bottom: 6rem; }

.ph-14 {
  padding-left: 6rem;
  padding-right: 6rem; }

.m-14 {
  margin: 6rem; }

.mr-14 {
  margin-right: 6rem; }

.ml-14 {
  margin-left: 6rem; }

.mb-14 {
  margin-bottom: 6rem; }

.mt-14 {
  margin-top: 6rem; }

.mv-14 {
  margin-top: 6rem;
  margin-bottom: 6rem; }

.mh-14 {
  margin-left: 6rem;
  margin-right: 6rem; }

.p-15 {
  padding: 8rem; }

.pr-15 {
  padding-right: 8rem; }

.pl-15 {
  padding-left: 8rem; }

.pb-15 {
  padding-bottom: 8rem; }

.pt-15 {
  padding-top: 8rem; }

.pv-15 {
  padding-top: 8rem;
  padding-bottom: 8rem; }

.ph-15 {
  padding-left: 8rem;
  padding-right: 8rem; }

.m-15 {
  margin: 8rem; }

.mr-15 {
  margin-right: 8rem; }

.ml-15 {
  margin-left: 8rem; }

.mb-15 {
  margin-bottom: 8rem; }

.mt-15 {
  margin-top: 8rem; }

.mv-15 {
  margin-top: 8rem;
  margin-bottom: 8rem; }

.mh-15 {
  margin-left: 8rem;
  margin-right: 8rem; }

.p-16 {
  padding: 10rem; }

.pr-16 {
  padding-right: 10rem; }

.pl-16 {
  padding-left: 10rem; }

.pb-16 {
  padding-bottom: 10rem; }

.pt-16 {
  padding-top: 10rem; }

.pv-16 {
  padding-top: 10rem;
  padding-bottom: 10rem; }

.ph-16 {
  padding-left: 10rem;
  padding-right: 10rem; }

.m-16 {
  margin: 10rem; }

.mr-16 {
  margin-right: 10rem; }

.ml-16 {
  margin-left: 10rem; }

.mb-16 {
  margin-bottom: 10rem; }

.mt-16 {
  margin-top: 10rem; }

.mv-16 {
  margin-top: 10rem;
  margin-bottom: 10rem; }

.mh-16 {
  margin-left: 10rem;
  margin-right: 10rem; }

.p-17 {
  padding: 12rem; }

.pr-17 {
  padding-right: 12rem; }

.pl-17 {
  padding-left: 12rem; }

.pb-17 {
  padding-bottom: 12rem; }

.pt-17 {
  padding-top: 12rem; }

.pv-17 {
  padding-top: 12rem;
  padding-bottom: 12rem; }

.ph-17 {
  padding-left: 12rem;
  padding-right: 12rem; }

.m-17 {
  margin: 12rem; }

.mr-17 {
  margin-right: 12rem; }

.ml-17 {
  margin-left: 12rem; }

.mb-17 {
  margin-bottom: 12rem; }

.mt-17 {
  margin-top: 12rem; }

.mv-17 {
  margin-top: 12rem;
  margin-bottom: 12rem; }

.mh-17 {
  margin-left: 12rem;
  margin-right: 12rem; }

.p-18 {
  padding: 14rem; }

.pr-18 {
  padding-right: 14rem; }

.pl-18 {
  padding-left: 14rem; }

.pb-18 {
  padding-bottom: 14rem; }

.pt-18 {
  padding-top: 14rem; }

.pv-18 {
  padding-top: 14rem;
  padding-bottom: 14rem; }

.ph-18 {
  padding-left: 14rem;
  padding-right: 14rem; }

.m-18 {
  margin: 14rem; }

.mr-18 {
  margin-right: 14rem; }

.ml-18 {
  margin-left: 14rem; }

.mb-18 {
  margin-bottom: 14rem; }

.mt-18 {
  margin-top: 14rem; }

.mv-18 {
  margin-top: 14rem;
  margin-bottom: 14rem; }

.mh-18 {
  margin-left: 14rem;
  margin-right: 14rem; }

.p-19 {
  padding: 16rem; }

.pr-19 {
  padding-right: 16rem; }

.pl-19 {
  padding-left: 16rem; }

.pb-19 {
  padding-bottom: 16rem; }

.pt-19 {
  padding-top: 16rem; }

.pv-19 {
  padding-top: 16rem;
  padding-bottom: 16rem; }

.ph-19 {
  padding-left: 16rem;
  padding-right: 16rem; }

.m-19 {
  margin: 16rem; }

.mr-19 {
  margin-right: 16rem; }

.ml-19 {
  margin-left: 16rem; }

.mb-19 {
  margin-bottom: 16rem; }

.mt-19 {
  margin-top: 16rem; }

.mv-19 {
  margin-top: 16rem;
  margin-bottom: 16rem; }

.mh-19 {
  margin-left: 16rem;
  margin-right: 16rem; }

.hidden {
  display: none; }

.aspect-1 {
  aspect-ratio: 1; }

.list {
  --gap: 1px;
  margin-top: auto; }

.list-item {
  color: hsl(var(--clr-default-900)); }
  .list-item:first-child {
    border-radius: .5rem .5rem 0 0; }
  .list-item:last-child {
    border-radius: 0 0 .5rem .5rem; }

.full-width {
  width: 100%; }

/* ------------------------- */
/* Buttons */
/* ------------------------- */
.btnnew {
  position: relative;
  display: inline-flex;
  gap: 0.8rem;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding-inline: 1.6rem;
  height: 4rem;
  background-color: hsl(var(--clr-white));
  color: hsl(var(--clr-default-600));
  border: 1px solid hsl(var(--clr-default-300));
  border-radius: 4px;
  cursor: pointer;
  font-size: 1.4rem;
  font-weight: 700;
  text-decoration: none !important;
  line-height: 1;
  outline: none;
  z-index: auto; }

.btnnew:not(:disabled):hover {
  border-color: var(--clr-default-900);
  box-shadow: 0px 16px 24px -12px hsl(var(--clr-default-600), 0.4); }

.btnnew:focus {
  outline: 4px solid hsl(var(--clr-default-400), 0.2); }

.btnnew:disabled {
  color: hsl(var(--clr-default-400));
  cursor: auto; }

/* Button primary */
.btnnew-primary {
  background-color: hsl(var(--clr-primary-400));
  color: hsl(var(--clr-default-900));
  border-color: hsl(var(--clr-primary-400)); }

.btnnew-primary:not(:disabled):hover {
  background-color: hsl(var(--clr-primary-300));
  border-color: hsl(var(--clr-primary-300));
  box-shadow: 0px 16px 24px -12px hsl(var(--clr-primary-300), 0.3); }

.btnnew-primary:focus {
  outline: 4px solid hsl(var(--clr-primary-400), 0.2); }

.btnnew-primary:disabled {
  color: hsl(var(--clr-white));
  background-color: hsl(var(--clr-primary-200));
  border-color: hsl(var(--clr-primary-200)); }

/* Button default */
.btnnew-default {
  background-color: hsl(var(--clr-default-700));
  color: hsl(var(--clr-white));
  border-color: hsl(var(--clr-default-700)); }

.btnnew-default:not(:disabled):hover {
  background-color: hsl(var(--clr-default-900));
  border-color: hsl(var(--clr-default-900));
  box-shadow: 0px 16px 24px -12px hsl(var(--clr-default-600), 0.3); }

.btnnew-default:focus {
  outline: 4px solid hsl(var(--clr-default-400), 0.4); }

.btnnew-default:disabled {
  color: hsl(var(--clr-default-200));
  background-color: hsl(var(--clr-default-400));
  border-color: hsl(var(--clr-default-400)); }

/* Button link */
.btnnew-link {
  background-color: transparent;
  color: hsl(var(--clr-primary-900));
  border-color: transparent; }

.btnnew-link:not(:disabled):hover {
  background-color: transparent;
  color: hsl(var(--clr-primary-700));
  border-color: transparent;
  box-shadow: none; }

.btnnew-link:focus {
  outline: 4px solid hsl(var(--clr-default-400), 1);
  color: hsl(var(--clr-primary-700)); }

.btnnew-link:disabled {
  background-color: hsl(var(--clr-white));
  color: hsl(var(--clr-default-400));
  border-color: hsl(var(--clr-white)); }

/* Button warning */
.btnnew-warning {
  background-color: hsl(var(--clr-warning-400));
  color: hsl(var(--clr-default-900));
  border-color: hsl(var(--clr-warning-400)); }

.btnnew-warning:not(:disabled):hover {
  background-color: hsl(var(--clr-warning-200));
  border-color: hsl(var(--clr-warning-200));
  box-shadow: 0px 16px 24px -12px hsl(var(--clr-warning-400), 0.3); }

.btnnew-warning:focus {
  outline: 4px solid hsl(var(--clr-warning-400), 0.2); }

.btnnew-warning:disabled {
  color: hsl(var(--clr-white));
  background-color: hsl(var(--clr-warning-200));
  border-color: hsl(var(--clr-warning-200)); }

/* Button danger */
.btnnew-danger {
  background-color: hsl(var(--clr-danger-600));
  color: hsl(var(--clr-white));
  border-color: hsl(var(--clr-danger-600)); }

.btnnew-danger:not(:disabled):hover {
  background-color: hsl(var(--clr-danger-400));
  border-color: hsl(var(--clr-danger-400));
  box-shadow: 0px 16px 24px -12px hsl(var(--clr-danger-400), 0.3); }

.btnnew-danger:focus {
  outline: 4px solid hsl(var(--clr-danger-400), 0.2); }

.btnnew-danger:disabled {
  color: hsl(var(--clr-danger-50));
  background-color: hsl(var(--clr-danger-200));
  border-color: hsl(var(--clr-danger-200)); }

/* ----------- */
.icon-sup {
  display: grid;
  place-items: center;
  position: absolute;
  aspect-ratio: 1/1;
  top: -10px;
  right: -10px;
  background: white;
  padding: 4px;
  border-radius: 50%;
  color: black;
  box-shadow: 0px 4px 8px -2px rgba(9, 21, 44, 0.12), 0px 2px 4px -2px rgba(9, 21, 44, 0.06); }

/* Button sizes */
/* button 2XL */
.btnnew-2xl {
  padding-inline: 2.8rem;
  height: 6rem;
  font-size: 1.8rem; }

.btnnew-2xl .icon-sup {
  width: 36px; }

/* button XL */
.btnnew-xl {
  padding-inline: 2rem;
  height: 4.8rem;
  font-size: 1.6rem; }

.btnnew-xl .icon-sup {
  width: 28px; }

/* button LG */
.btnnew-lg {
  padding-inline: 1.8rem;
  height: 4.4rem;
  font-size: 1.6rem; }

.btnnew-lg .icon-sup {
  width: 28px; }

/* button MD */
.btnnew-md {
  padding-inline: 1.6rem;
  height: 4rem;
  font-size: 1.4rem; }

.btn-md .icon-sup {
  width: 24px; }

/* button SM */
.btnnew-sm {
  padding-inline: 1.2rem;
  height: 3.6rem;
  font-size: 1.4rem; }

.btnnew-sm .icon-sup {
  width: 24px; }

/* button ICON */
.btnnew-square {
  padding: 0;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1; }

.btnnew-square  i {
    margin: 0;
}

/* Typography */
.ff-sans-normal {
  font-family: var(--ff-sans-normal); }

/* .letter-spacing-1 {letter-spacing: 4.75rem }
.letter-spacing-2 {letter-spacing: 2.7rem }
.letter-spacing-3 {letter-spacing: 2.35rem } */
.uppercase {
  text-transform: uppercase; }

.txt-xs {
  font-size: var(--txt-xs); }

.txt-sm {
  font-size: var(--txt-sm); }

.txt-base {
  font-size: var(--txt-base); }

.txt-lg {
  font-size: var(--txt-lg); }

.txt-xl {
  font-size: var(--txt-xl); }

.txt-2xl {
  font-size: var(--txt-2xl); }

.txt-3xl {
  font-size: var(--txt-3xl); }

.txt-4xl {
  font-size: var(--txt-4xl); }

.txt-5xl {
  font-size: var(--txt-5xl); }

.txt-6xl {
  font-size: var(--txt-6xl); }

.txt-7xl {
  font-size: var(--txt-7xl); }

.txt-8xl {
  font-size: var(--txt-8xl); }

.txt-lg,
.txt-xl,
.txt-2xl {
  line-height: 1.4; }

.txt-3xl,
.txt-4xl,
.txt-5xl,
.txt-6xl,
.txt-7xl,
.txt-8xl {
  line-height: 1.2; }

.txt-regular {
  font-weight: normal; }

.txt-medium {
  font-weight: 500; }

.txt-semibold {
  font-weight: 600; }

.txt-bold {
  font-weight: 700; }

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

/* https://erikmonjas.github.io/css-grid-12-column-layout/ */
.grid-container {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  /*HERE YOU CAN SET YOUR CUSTOM COLUMN GAP*/
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  /*grid-auto-flow DETERMINES HOW THE GRID WILL FILL UP. IF YOU ENABLE THE grid-auto-flow PROPERTY, grid-column-gap WILL HAVE NO EFFECT ON THE AUTO-GENERATED ROWS, SO YOU WILL NEED TO SET A MARGIN TOP &/OR BOTTOM TO THE ELEMENTS INSIDE THE GRID CONTAINER IF YOU WANT A ROW GAP.
  dense tells the auto-placement algorithm to attempt to fill in holes earlier in the grid if smaller items come up later,
  row TELLS THE AUTO-PLACEMENT ALGORITHM TO FILL IN EACH ROW IN TURN, ADDING NEW ROWS AS NECESSARY
  
  column TELLS THE AUTO-PLACEMENT ALGORITHM TO FILL IN EACH COLUMN IN TURN, ADDING NEW COLUMNS AS NECESSARY */
  grid-auto-flow: dense; }
  @media (min-width: 80rem) {
    .grid-container {
      grid-column-gap: 2rem; } }

.colnew-xs-1 {
  grid-column-end: span 1; }

.colnew-xs-offset-1 {
  grid-column-start: 1; }

.colnew-xs-2 {
  grid-column-end: span 2; }

.colnew-xs-offset-2 {
  grid-column-start: 2; }

.colnew-xs-3 {
  grid-column-end: span 3; }

.colnew-xs-offset-3 {
  grid-column-start: 3; }

.colnew-xs-4 {
  grid-column-end: span 4; }

.colnew-xs-offset-4 {
  grid-column-start: 4; }

.colnew-xs-5 {
  grid-column-end: span 5; }

.colnew-xs-offset-5 {
  grid-column-start: 5; }

.colnew-xs-6 {
  grid-column-end: span 6; }

.colnew-xs-offset-6 {
  grid-column-start: 6; }

.colnew-xs-7 {
  grid-column-end: span 7; }

.colnew-xs-offset-7 {
  grid-column-start: 7; }

.colnew-xs-8 {
  grid-column-end: span 8; }

.colnew-xs-offset-8 {
  grid-column-start: 8; }

.colnew-xs-9 {
  grid-column-end: span 9; }

.colnew-xs-offset-9 {
  grid-column-start: 9; }

.colnew-xs-10 {
  grid-column-end: span 10; }

.colnew-xs-offset-10 {
  grid-column-start: 10; }

.colnew-xs-11 {
  grid-column-end: span 11; }

.colnew-xs-offset-11 {
  grid-column-start: 11; }

.colnew-xs-12 {
  grid-column-end: span 12; }

.colnew-xs-offset-12 {
  grid-column-start: 12; }

@media only screen and (min-width: 48em) {
  .colnew-sm-1 {
    grid-column-end: span 1; }

  .colnew-sm-offset-1 {
    grid-column-start: 1; }

  .colnew-sm-2 {
    grid-column-end: span 2; }

  .colnew-sm-offset-2 {
    grid-column-start: 2; }

  .colnew-sm-3 {
    grid-column-end: span 3; }

  .colnew-sm-offset-3 {
    grid-column-start: 3; }

  .colnew-sm-4 {
    grid-column-end: span 4; }

  .colnew-sm-offset-4 {
    grid-column-start: 4; }

  .colnew-sm-5 {
    grid-column-end: span 5; }

  .colnew-sm-offset-5 {
    grid-column-start: 5; }

  .colnew-sm-6 {
    grid-column-end: span 6; }

  .colnew-sm-offset-6 {
    grid-column-start: 6; }

  .colnew-sm-7 {
    grid-column-end: span 7; }

  .colnew-sm-offset-7 {
    grid-column-start: 7; }

  .colnew-sm-8 {
    grid-column-end: span 8; }

  .colnew-sm-offset-8 {
    grid-column-start: 8; }

  .colnew-sm-9 {
    grid-column-end: span 9; }

  .colnew-sm-offset-9 {
    grid-column-start: 9; }

  .colnew-sm-10 {
    grid-column-end: span 10; }

  .colnew-sm-offset-10 {
    grid-column-start: 10; }

  .colnew-sm-11 {
    grid-column-end: span 11; }

  .colnew-sm-offset-11 {
    grid-column-start: 11; }

  .colnew-sm-12 {
    grid-column-end: span 12; }

  .colnew-sm-offset-12 {
    grid-column-start: 12; } }
@media only screen and (min-width: 62em) {
  .colnew-md-1 {
    grid-column-end: span 1; }

  .colnew-md-offset-1 {
    grid-column-start: 1; }

  .colnew-md-2 {
    grid-column-end: span 2; }

  .colnew-md-offset-2 {
    grid-column-start: 2; }

  .colnew-md-3 {
    grid-column-end: span 3; }

  .colnew-md-offset-3 {
    grid-column-start: 3; }

  .colnew-md-4 {
    grid-column-end: span 4; }

  .colnew-md-offset-4 {
    grid-column-start: 4; }

  .colnew-md-5 {
    grid-column-end: span 5; }

  .colnew-md-offset-5 {
    grid-column-start: 5; }

  .colnew-md-6 {
    grid-column-end: span 6; }

  .colnew-md-offset-6 {
    grid-column-start: 6; }

  .colnew-md-7 {
    grid-column-end: span 7; }

  .colnew-md-offset-7 {
    grid-column-start: 7; }

  .colnew-md-8 {
    grid-column-end: span 8; }

  .colnew-md-offset-8 {
    grid-column-start: 8; }

  .colnew-md-9 {
    grid-column-end: span 9; }

  .colnew-md-offset-9 {
    grid-column-start: 9; }

  .colnew-md-10 {
    grid-column-end: span 10; }

  .colnew-md-offset-10 {
    grid-column-start: 10; }

  .colnew-md-11 {
    grid-column-end: span 11; }

  .colnew-md-offset-11 {
    grid-column-start: 11; }

  .colnew-md-12 {
    grid-column-end: span 12; }

  .colnew-md-offset-12 {
    grid-column-start: 12; } }
@media only screen and (min-width: 75em) {
  .colnew-lg-1 {
    grid-column-end: span 1; }

  .colnew-lg-offset-1 {
    grid-column-start: 1; }

  .colnew-lg-2 {
    grid-column-end: span 2; }

  .colnew-lg-offset-2 {
    grid-column-start: 2; }

  .colnew-lg-3 {
    grid-column-end: span 3; }

  .colnew-lg-offset-3 {
    grid-column-start: 3; }

  .colnew-lg-4 {
    grid-column-end: span 4; }

  .colnew-lg-offset-4 {
    grid-column-start: 4; }

  .colnew-lg-5 {
    grid-column-end: span 5; }

  .colnew-lg-offset-5 {
    grid-column-start: 5; }

  .colnew-lg-6 {
    grid-column-end: span 6; }

  .colnew-lg-offset-6 {
    grid-column-start: 6; }

  .colnew-lg-7 {
    grid-column-end: span 7; }

  .colnew-lg-offset-7 {
    grid-column-start: 7; }

  .colnew-lg-8 {
    grid-column-end: span 8; }

  .colnew-lg-offset-8 {
    grid-column-start: 8; }

  .colnew-lg-9 {
    grid-column-end: span 9; }

  .colnew-lg-offset-9 {
    grid-column-start: 9; }

  .colnew-lg-10 {
    grid-column-end: span 10; }

  .colnew-lg-offset-10 {
    grid-column-start: 10; }

  .colnew-lg-11 {
    grid-column-end: span 11; }

  .colnew-lg-offset-11 {
    grid-column-start: 11; }

  .colnew-lg-12 {
    grid-column-end: span 12; }

  .colnew-lg-offset-12 {
    grid-column-start: 12; } }
.header {
  --gap: 1.6rem;
  position: relative;
  background-color: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(8rem);
  display: flex;
  padding: 1.6rem;
  flex-direction: column; }
  @media (min-width: 64rem) {
    .header {
      flex-direction: row; } 
    }
  @media (min-width: 80rem) {
    .header {
      padding: 1.6rem } 
  }

.utility-header {
  display: none;
  padding-inline: 1.6rem;
  box-shadow: inset 0px -1px 0px hsl(var(--clr-default-200)); }
  @media (min-width: 64rem) {
    .utility-header {
      display: block; } }
  .utility-header ul {
    justify-content: flex-end; }

.nav-l {
  align-items: center;
  flex: 1;
  display: none; }
  @media (min-width: 64rem) {
    .nav-l {
      display: flex; } }

.navigation {
  list-style: none; 
margin: 0;
padding:0;}

  .navigation  li, .navigation ul {
    margin: 0;
    padding: 0;
  }
  .navigation a {
    text-decoration: none;
    color: hsl(var(--clr-default-900));
    font-weight: 600; }
  
    .navigation a:hover {
      color: hsl(var(--clr-primary-600));
    }

.secondary-navigation {
  --gap: 0.8rem;
  /* margin-left: auto; */
  /* align-items: center; */
 }
  .secondary-navigation a {
    font-size: 1.4rem;
    font-weight: 500; }
  @media (min-width: 64rem) {
    .secondary-navigation {
      --gap: inherit; } }

.right-header {
  margin-left: auto;
  align-items: center; }

.navigation-link {
  color: inherit;
  font-size: 1.4rem;
  line-height: 1rem;
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-weight: 500; }
  .navigation-link:hover {
    color: hsl(var(--clr-primary-600)); }

.navigation-link-icon {
  display: none; }
  @media (min-width: 64rem) {
    .navigation-link-icon {
      display: inline; } }

.vertical-divider {
  display: none;
  width: 1px;
  height: 15px; }
  @media (min-width: 64rem) {
    .vertical-divider {
      display: block; } }

.dropdownNew-menu,
.dropdownNew-menu-lang {
  position: absolute;
  background: hsl(var(--clr-default-200));
  left: 0;
  top: 100%;
  width: 100%;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-10px);
  transition: opacity 150ms ease-in-out, transform 150ms ease-in-out;
  border-top: 1px solid hsl(var(--clr-default-300)); }

.dropdownNew.active > .dropdownNew-button + .dropdownNew-menu {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0px); }

.dropdownNew-menu-lang {
  left: auto;
  right: 0;
  z-index: 12;
  width: auto;
  border: none;
}

.dropdownNew-menu-lang .wpml-custom-container ul {
  padding: 0.8rem 0;
}

.dropdownNew-menu-lang .wpml-custom-container a {
  display: block;
  border: none;
  padding: .4rem 1.6rem;
  line-height: inherit;
  font-size: 1.4rem;
}


.logo {
  background-image: url(/wp-content/img/alf/VEDAMO-Logo.svg);
  background-repeat: no-repeat;
  background-position: center;
  width: 125px;
  background-size: contain;
 
}

  @media (min-width: 64rem) {
    .logo {
      width: 150px;
       } 
  }

.start-btn {
  width: 100%;
  padding-inline: 0.8rem; }
  @media (min-width: 64rem) {
    .start-btn {
      width: auto;
      padding-inline: 1.6rem; } }
  @media (min-width: 80rem) {
    .start-btn {
      margin-left: auto;
      padding-inline: 2rem;
      height: 4.8rem;
      font-size: 1.6rem; } }

@media (min-width: 64rem) {
  .mobile-nav-open {
    display: none; } }

.mobile-nav-close {
  position: fixed;
  top: 1.6rem;
  left: 1.6rem;
  display: none;
  z-index: 10; }

.nav-sliding {
  position: fixed;
  flex-direction: column;
  width: 100%;
  height: 100vh;
  top: 0;
  z-index: 3;
  overflow: scroll;
  transform: translateX(-100%);
  transition: transform 100ms ease-in-out; }

  .nav-sliding[data-visible="true"] {
    transform: translateX(0);
    transition: transform 320ms ease-in-out; }

.nav-sliding ul{
    margin: 0;
    padding: 0;
}

.nav-sliding li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.menu-top-right-mobile li {
  border-top: 1px solid #eee;
}

.menu-top-right-mobile li:last-child {
  border-bottom: 1px solid #eee;
}





/* MOBILE LANGUAGE SWITCHER - WPML CLASSES */

.nav-languages .wpml-custom-container li {
    margin: 0 0 1px 0 !important;
    padding: 0
}
.nav-languages .wpml-custom-container a {
    color: hsl(var(--clr-default-900)); 
    padding-left: 2rem;
    padding-right: 2rem; 
    padding-top: 1rem;
    padding-bottom: 1rem;
    background-color: hsl(var(--clr-white));
    font-size: var(--txt-xl);
    line-height: 1.4;
    font-weight: 500;
    border: none;
}

.nav-languages .wpml-custom-container li:first-child a {
    border-radius: .5rem .5rem 0 0; 
}
.nav-languages .wpml-custom-container li:last-child a {
    border-radius: 0 0 .5rem .5rem 
}

.nav-languages .wpml-custom-container a span {
  position: relative;
  display: inline-block;
}

.nav-languages .wpml-ls-current-language a span:after {
  content: "✔";
  color:hsl(var(--clr-primary-400));
  margin-left: 1.6rem
}




/* list-item ph-8 pv-4 bgnew-white txt-xl txt-medium */
/*# sourceMappingURL=main.css.map */