:root {
  /* Colors */
  --clr-primary: #d70018;
  --clr-white: #FFFFFF;
  --clr-gray-100: #F5F5F5;
  --clr-gray-200: #E0E0E0;
  --clr-dark: #333333;
  --clr-text-main: var(--clr-dark);
  --clr-bg-body: var(--clr-white);

  /* Typography */
  --font-main: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-secondary: "Playfair Display", Georgia, serif;

  /* Spacing */
  --space-1: clamp(0.25rem, 0.5vw, 0.5rem);
  --space-2: clamp(0.5rem, 1vw, 1rem);
  --space-3: clamp(1rem, 2vw, 2rem);
  --space-4: clamp(2rem, 4vw, 4rem);
  --space-5: clamp(4rem, 8vw, 8rem);

  /* Z-Index */
  --z-negative: -1;
  --z-base: 1;
  --z-sticky: 100;
  --z-fixed: 1000;
  --z-header: var(--z-fixed);
  --z-footer: var(--z-sticky);

  /* Header height */
  --header-height: 80px;
}

.zalo-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' style='width: 24px; height: 24px;'%3E%3Cpath d='M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z'%3E%3C/path%3E%3Ctext x='8.5' y='15.5' font-size='10' font-family='Inter' font-weight='bold' fill='currentColor' stroke='none'%3EZ%3C/text%3E%3C/svg%3E");
}

.youtube-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-youtube' style='width: 24px; height: 24px;'%3E%3Cpath d='M2.5 17a24.12 24.12 0 0 1 0-10 2 2 0 0 1 1.4-1.4 49.56 49.56 0 0 1 16.2 0A2 2 0 0 1 21.5 7a24.12 24.12 0 0 1 0 10 2 2 0 0 1-1.4 1.4 49.55 49.55 0 0 1-16.2 0A2 2 0 0 1 2.5 17z'%3E%3C/path%3E%3Cpath d='m10 15 5-3-5-3z'%3E%3C/path%3E%3C/svg%3E");
}

.facebook-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-facebook' style='width: 24px; height: 24px;'%3E%3Cpath d='M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z'%3E%3C/path%3E%3C/svg%3E");
}

.linkined-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-linkedin' style='width: 24px; height: 24px;'%3E%3Cpath d='M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z'%3E%3C/path%3E%3Crect width='4' height='12' x='2' y='9'%3E%3C/rect%3E%3Ccircle cx='4' cy='4' r='2'%3E%3C/circle%3E%3C/svg%3E");
}