/* assets/css/pages/contact/hero.css */

.oy-hero--contact {
  --oy-hero-height: 480px;
}

@media (max-width: 1024px) {
  .oy-hero--contact { --oy-hero-height: 440px; }
}

@media (max-width: 768px) {
  .oy-hero--contact { --oy-hero-height: 360px; }
}

.oy-hero--contact .oy-contact-hero__row {
  margin: 12px auto 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  max-width: 100%;
}

.oy-hero--contact .oy-contact-hero__pre {
  color: var(--oy-color-white);
  font-size: var(--oy-hero-h3-font-size);
  line-height: var(--oy-hero-h3-line-height);
  font-weight: 700;
  text-shadow: var(--oy-hero-h3-shadow);
}

.oy-hero--contact .oy-contact-hero__h3 {
  margin: 0;
  display: inline-block;
  max-width: none;
}

.oy-hero--contact .oy-contact-hero__h3::before {
  width: calc(100% + 28px);
}

@media (max-width: 420px) {
  .oy-hero--contact .oy-contact-hero__row {
    flex-wrap: wrap;
  }
}

/* ===========================================================
   Scroll Reveal (same style as About)
=========================================================== */
.oy-reveal {
  opacity: 0;
  transform: translateY(30px);
  visibility: hidden;
  transition: opacity 0.6s ease, transform 0.6s ease, visibility 0.6s ease;
  will-change: transform, opacity;
}

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

/* Stagger delays */
.oy-delay-1 { transition-delay: 0.06s; }
.oy-delay-2 { transition-delay: 0.12s; }
.oy-delay-3 { transition-delay: 0.18s; }
.oy-delay-4 { transition-delay: 0.24s; }
.oy-delay-5 { transition-delay: 0.30s; }
.oy-delay-6 { transition-delay: 0.36s; }

@media (prefers-reduced-motion: reduce) {
  .oy-reveal,
  .oy-reveal.oy-reveal--visible {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
    transition: none !important;
  }
}