/* Additional custom styles */
:root {
  --color-charcoal-950: #14171d;
  --color-charcoal-900: #1f232c;
  --color-charcoal-800: #2a2f38;
  --color-coral-500: #ff6b4a;
  --color-coral-600: #f04a2a;
}

/* Smooth scroll behavior */
html {
  scroll-behavior: smooth;
}

/* Body font */
body {
  font-family: 'DM Sans', sans-serif;
}

/* Display font for headings */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Space Grotesk', sans-serif;
}

/* Custom focus styles */
button:focus,
a:focus,
input:focus,
textarea:focus {
  outline: none;
}

/* Geometric background animation */
@keyframes float {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-20px) rotate(5deg);
  }
}

.geometric-shape {
  animation: float 6s ease-in-out infinite;
}

.geometric-shape:nth-child(2) {
  animation-delay: -2s;
}

.geometric-shape:nth-child(3) {
  animation-delay: -4s;
}

/* Service card hover effect */
.service-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.service-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

/* Gallery item hover */
.gallery-item {
  overflow: hidden;
}

.gallery-item img {
  transition: transform 0.5s ease;
}

.gallery-item:hover img {
  transform: scale(1.05);
}

/* Mobile menu animation */
.mobile-menu {
  transform: translateX(100%);
  transition: transform 0.3s ease;
}

.mobile-menu.open {
  transform: translateX(0);
}

/* Geometric pattern background */
.geo-pattern {
  background-image: 
    radial-gradient(circle at 20% 20%, rgba(255, 107, 74, 0.1) 0%, transparent 50%),
    radial-gradient(circle at 80% 80%, rgba(255, 107, 74, 0.08) 0%, transparent 50%);
}

/* Accent shapes */
.accent-shape-1 {
  position: absolute;
  top: -50px;
  right: -50px;
  width: 200px;
  height: 200px;
  background: linear-gradient(135deg, #ff6b4a 0%, #ff8a6b 100%);
  border-radius: 50%;
  opacity: 0.1;
  z-index: 0;
}

.accent-shape-2 {
  position: absolute;
  bottom: -30px;
  left: -30px;
  width: 150px;
  height: 150px;
  background: linear-gradient(135deg, #ff6b4a 0%, #ffb89f 100%);
  clip-path: polygon(50% 0%, 100% 100%, 0% 100%);
  opacity: 0.15;
  z-index: 0;
}

.accent-shape-3 {
  position: absolute;
  top: 50%;
  left: -80px;
  width: 100px;
  height: 100px;
  background: #ff6b4a;
  transform: rotate(45deg);
  opacity: 0.1;
  z-index: 0;
}

/* Reveal animation for scroll */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

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

::-webkit-scrollbar-track {
  background: #1f232c;
}

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

::-webkit-scrollbar-thumb:hover {
  background: #f04a2a;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .accent-shape-1,
  .accent-shape-2,
  .accent-shape-3 {
    display: none;
  }
}

/* Print styles */
@media print {
  .geometric-shape,
  .accent-shape-1,
  .accent-shape-2,
  .accent-shape-3 {
    display: none;
  }
}