:root {
  --primary_color: #AA2325;
  --secondary_color: #673538;
  --theme_black: #272325;
  --header-offset: 4rem;
}

html {
  overflow-x: hidden;
  scroll-padding-top: var(--header-offset);
}

body {
  overflow-x: hidden;
}

section[id] {
  scroll-margin-top: calc(var(--header-offset) + 1.5rem);
}

/* Modern styling additions */
.glassmorphism {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.text-gradient {
  background: linear-gradient(135deg, #0F172A 30%, #E11D48 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.site-footer-bg {
  position: relative;
  overflow: hidden;
}

.site-footer-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.18;
  background-image:
    radial-gradient(circle at 20% 28%, rgba(255, 255, 255, 0.9) 1px, transparent 1.5px),
    radial-gradient(circle at 53% 52%, rgba(255, 255, 255, 0.75) 1px, transparent 1.5px),
    radial-gradient(circle at 84% 31%, rgba(255, 255, 255, 0.7) 1px, transparent 1.5px);
  background-size: 8px 8px, 9px 9px, 8px 8px;
  mask-image:
    radial-gradient(ellipse 30% 24% at 21% 30%, #000 54%, transparent 56%),
    radial-gradient(ellipse 19% 28% at 48% 56%, #000 54%, transparent 56%),
    radial-gradient(ellipse 37% 25% at 79% 31%, #000 54%, transparent 56%);
  -webkit-mask-image:
    radial-gradient(ellipse 30% 24% at 21% 30%, #000 54%, transparent 56%),
    radial-gradient(ellipse 19% 28% at 48% 56%, #000 54%, transparent 56%),
    radial-gradient(ellipse 37% 25% at 79% 31%, #000 54%, transparent 56%);
  pointer-events: none;
  overflow: hidden;
}

body.preloading .wrapper {
  opacity: 0;
  visibility: hidden;
}

.wrapper {
  transition: opacity 0.8s ease-out, visibility 0.8s ease-out;
  opacity: 1;
  visibility: visible;
  &.error_page{
    #header , #footer{
      display: none !important;
    }
  }
}

.footer-link {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  transition: color 180ms ease, transform 180ms ease;
}

.footer-link i {
  color: #E11D48;
  font-size: 0.75rem;
}

.footer-link:hover {
  color: #E11D48;
  transform: translateX(4px);
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #F1F5F9;
}

::-webkit-scrollbar-thumb {
  background: #CBD5E1;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #94A3B8;
}

@media (max-width: 640px) {
  .mobile-safe-text {
    overflow-wrap: anywhere;
  }

  .site-footer-bg .max-w-7xl {
    padding-top: 2.5rem;
    padding-bottom: 1.75rem;
  }

  .site-footer-bg .grid {
    gap: 1.75rem;
  }

  .site-footer-bg h3 {
    font-size: 1.25rem;
    line-height: 1.4;
    margin-bottom: 1rem;
  }

  .site-footer-bg ul {
    gap: 0.6rem;
  }

  .site-footer-bg li,
  .site-footer-bg p,
  .site-footer-bg a,
  .site-footer-bg input,
  .site-footer-bg button,
  .site-footer-bg span {
    font-size: 0.875rem;
    line-height: 1.5;
  }

  .site-footer-bg .mt-7 {
    margin-top: 1.25rem;
  }

  .site-footer-bg .mt-14 {
    margin-top: 2rem;
  }
}

/* Hide scrollbar for Chrome, Safari and Opera */
.scrollbar-hide::-webkit-scrollbar {
  display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
.scrollbar-hide {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

/* Lenis smooth scrolling support styles */
html.lenis,
html.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth body {
  scroll-behavior: auto !important;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.lenis.lenis-scrolling iframe {
  pointer-events: none;
}

/* Scroll reveal states */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform, opacity;
}

.reveal-fade {
  opacity: 0;
  transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity;
}

.reveal-scale {
  opacity: 0;
  transform: scale(0.95);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform, opacity;
}

/* Revealed active states */
.reveal.revealed,
.reveal-fade.revealed,
.reveal-scale.revealed {
  opacity: 1;
  transform: none;
}

/* Animation delay utility classes */
.delay-75 { transition-delay: 75ms; }
.delay-100 { transition-delay: 100ms; }
.delay-150 { transition-delay: 150ms; }
.delay-200 { transition-delay: 200ms; }
.delay-250 { transition-delay: 250ms; }
.delay-300 { transition-delay: 300ms; }
.delay-400 { transition-delay: 400ms; }
.delay-500 { transition-delay: 500ms; }

/* Custom light shadows tinted with logo brand color */
.shadow-sm {
  box-shadow: 0 4px 12px -2px rgba(39, 35, 37, 0.04), 0 2px 6px -1px rgba(39, 35, 37, 0.02) !important;
}

.shadow-md {
  box-shadow: 0 10px 25px -5px rgba(39, 35, 37, 0.06), 0 4px 12px -4px rgba(39, 35, 37, 0.03) !important;
}

.shadow-xl {
  box-shadow: 0 20px 40px -10px rgba(39, 35, 37, 0.08), 0 10px 20px -8px rgba(39, 35, 37, 0.04) !important;
}

.hover\:shadow-xl:hover {
  box-shadow: 0 20px 45px -10px rgba(39, 35, 37, 0.12), 0 10px 20px -8px rgba(39, 35, 37, 0.06) !important;
}

/* Prevent scrolling when preloader is active */
body.preloading {
  overflow: hidden !important;
}

/* Preloader Loading Bar Animation */
@keyframes loading-bar {
  0% {
    transform: scaleX(0);
    transform-origin: left;
  }
  50% {
    transform: scaleX(1);
    transform-origin: left;
  }
  50.1% {
    transform-origin: right;
  }
  100% {
    transform: scaleX(0);
    transform-origin: right;
  }
}

.animate-loading-bar {
  animation: loading-bar 1.5s infinite ease-in-out;
}


.user-select-none{
  user-select: none !important;
}
.content-visibility-auto{
  content-visibility: visible;
}