/* Shared styles for Středisko komplexní terapie website */

body {
  font-family: 'Outfit', system-ui, sans-serif;
}

/* Subtle grain texture overlay */
body::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
  opacity: 0.018;
  pointer-events: none;
  z-index: 1000;
}

/* Organic blob shapes */
.blob-1 {
  border-radius: 60% 40% 55% 45% / 55% 60% 40% 45%;
}
.blob-2 {
  border-radius: 45% 55% 40% 60% / 60% 45% 55% 40%;
}
.blob-3 {
  border-radius: 55% 45% 60% 40% / 40% 55% 45% 60%;
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #f7f0e3;
}
::-webkit-scrollbar-thumb {
  background: #a3bba7;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #789b7e;
}

/* Smooth hover for cards */
.service-card {
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.4s ease;
}
.service-card:hover {
  transform: translateY(-8px);
}

/* Decorative line animation */
.animated-line {
  background: linear-gradient(90deg, transparent, currentColor, transparent);
  background-size: 200% 100%;
  animation: shimmer 3s ease-in-out infinite;
}
@keyframes shimmer {
  0%, 100% { background-position: -200% 0; }
  50% { background-position: 200% 0; }
}

/* Link underline effect */
.link-underline {
  position: relative;
}
.link-underline::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  background: currentColor;
  border-radius: 1px;
  transition: width 0.3s ease;
}
.link-underline:hover::after {
  width: 100%;
}

/* Skip navigation link for accessibility */
.skip-nav {
  position: absolute;
  top: -40px;
  left: 0;
  background: #364f4a;
  color: #fdfcf9;
  padding: 8px 16px;
  text-decoration: none;
  border-radius: 0 0 8px 0;
  z-index: 100;
}
.skip-nav:focus {
  top: 0;
}
