/* styles.css */
body {
  background-image: url('data:image/svg+xml;utf8,<svg width="100" height="100" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><g fill="%236B705C" fill-opacity="0.03" fill-rule="evenodd"><circle cx="3" cy="3" r="1.5"/><circle cx="50" cy="50" r="1.5"/></g></svg>');
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Playfair Display', serif;
}

html {
  scroll-behavior: smooth;
}

/* Custom Webkit Scrollbar */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #FAF9F6;
}
::-webkit-scrollbar-thumb {
  background: #C2C5AA;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #A4A881;
}

/* Animations */
@keyframes dash {
  from {
    stroke-dashoffset: 1000;
  }
  to {
    stroke-dashoffset: 0;
  }
}
.animate-dash {
  animation: dash 5s linear forwards;
}

/* Soft Diamond Divider */
.diamond-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 4rem 0;
}
.diamond-divider::before, .diamond-divider::after {
  content: '';
  height: 1px;
  width: 80px;
  background-color: #D4A853; /* Soft Gold */
  opacity: 0.6;
}
.diamond-divider .diamond {
  width: 6px;
  height: 6px;
  background-color: #D4A853;
  transform: rotate(45deg);
  margin: 0 16px;
}

.perspective-1000 {
  perspective: 1000px;
}
.transform-style-3d {
  transform-style: preserve-3d;
}
.backface-hidden {
  backface-visibility: hidden;
}

/* DNA Helix Animations */
@keyframes helixRotate {
  0% { transform: rotateY(0deg); }
  100% { transform: rotateY(360deg); }
}
@keyframes helixPulse {
  0%, 100% { opacity: 0.6; }
  50% { opacity: 1; }
}
@keyframes floatSequence {
  0% { transform: translateY(0) translateX(0); opacity: 0; }
  10% { opacity: 0.7; }
  90% { opacity: 0.7; }
  100% { transform: translateY(-60px) translateX(15px); opacity: 0; }
}
@keyframes basePairGlow {
  0%, 100% { stroke-opacity: 0.3; }
  50% { stroke-opacity: 0.8; }
}
.animate-helix-pulse {
  animation: helixPulse 3s ease-in-out infinite;
}
.animate-float-seq {
  animation: floatSequence 8s ease-in-out infinite;
}
.animate-base-glow {
  animation: basePairGlow 4s ease-in-out infinite;
}