:root {
  /* Linen */
  --linen-100: #623600;
  --linen-200: #c46c00;
  --linen-300: #ff9e27;
  --linen-400: #ffca89;
  --linen-500: #fff6eb;
  --linen-600: #fff8ef;
  --linen-700: #fff9f3;
  --linen-800: #fffbf7;
  --linen-900: #fffdfb;
  --linen-default: #fff6eb;

  /* Dark Cyan */
  --dark-cyan-100: #081d1e;
  --dark-cyan-200: #0f3a3c;
  --dark-cyan-300: #17575a;
  --dark-cyan-400: #1f7478;
  --dark-cyan-500: #279095;
  --dark-cyan-600: #34c2c9;
  --dark-cyan-700: #66d2d7;
  --dark-cyan-800: #99e1e5;
  --dark-cyan-900: #ccf0f2;
  --dark-cyan-default: #279095;

  /* White */
  --white-100: #333333;
  --white-200: #666666;
  --white-300: #999999;
  --white-400: #cccccc;
  --white-500: #fefefe;
  --white-600: #ffffff;
  --white-700: #ffffff;
  --white-800: #ffffff;
  --white-900: #ffffff;
  --white-default: #fefefe;

  /* Verdigris */
  --verdigris-100: #152424;
  --verdigris-200: #2a4948;
  --verdigris-300: #3f6d6b;
  --verdigris-400: #53918f;
  --verdigris-500: #70adab;
  --verdigris-600: #8dbdbc;
  --verdigris-700: #aacecd;
  --verdigris-800: #c6dedd;
  --verdigris-900: #e3efee;
  --verdigris-default: #70adab;

  /* Mikado Yellow */
  --mikado-yellow-100: #332702;
  --mikado-yellow-200: #654d05;
  --mikado-yellow-300: #987407;
  --mikado-yellow-400: #cb9a0a;
  --mikado-yellow-500: #f4bd17;
  --mikado-yellow-600: #f6ca44;
  --mikado-yellow-700: #f8d773;
  --mikado-yellow-800: #fbe4a1;
  --mikado-yellow-900: #fdf2d0;
  --mikado-yellow-default: #f4bd17;
}
*,
html {
  scroll-behavior: smooth !important;
}
main {
  scroll-snap-type: y mandatory;
  height: 100vh;
  overflow-y: scroll;
}
section {
  scroll-snap-align: start;
}
.fade-in {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}
.fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}

.item-ar::before {
  content: "+";
  color: var(--verdigris-300);
  padding-left: 3rem;
}

.item-en::before {
  content: "+";
  color: var(--verdigris-300);
  padding-right: 3rem;
}

.direction-rtl {
  direction: rtl;
}

.direction-ltr {
  direction: ltr;
}