html {
  scroll-behavior: smooth;
  scroll-padding-top: 80px; 
}

/* Base resets & typography logic */
body {
  font-family: 'Inter', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3 {
  overflow-wrap: break-word;
  word-wrap: break-word;
  hyphens: auto;
}

/* Premium touches */
button, a { 
  transition: all 0.2s cubic-bezier(0.23, 1, 0.32, 1); 
}
input, select, textarea { 
  transition: all .2s ease; 
}

section { 
  scroll-margin-top: 80px; 
}

/* Custom minimal scrollbar */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
  background: #E30613;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #c20510;
}

/* Smaller custom scrollbar for inner scrollable content like calculator */
.custom-scrollbar::-webkit-scrollbar {
  width: 4px;
}
.custom-scrollbar::-webkit-scrollbar-track {
  background: transparent;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
  background: #e5e7eb;
  border-radius: 4px;
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background: #d1d5db;
}

/* Infinite Marquee Carousel */
@keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

.animate-marquee {
  animation: marquee 20s linear infinite;
}

.marquee-container:hover .animate-marquee {
  animation-play-state: paused;
}


/* Fix horizontal scroll on mobile */
html, body {
  overflow-x: hidden;
  max-width: 100vw;
}

/* Gallery: hide text overlay on mobile */
@media (max-width: 767px) {
  .gallery-card-text {
    display: none !important;
  }
}

/* Service cards: truncate long descriptions on mobile */
@media (max-width: 639px) {
  #services-main-grid .group p {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  #services-main-grid .group h3 {
    font-size: 1.1rem;
  }
}