/* Centered hero adjustments and intro video */
.hero-centered { 
  display: grid; 
  gap: 40px; 
  padding: 32px 12px 48px; 
  justify-items: center;
  text-align: center;
  max-width: 1200px;
  margin: 0 auto;
}

.hero { 
  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 25%, #dee2e6 50%, #e9ecef 75%, #f8f9fa 100%);
  position: relative;
  overflow: hidden;
}

.hero::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: 
    radial-gradient(circle at 20% 80%, rgba(193, 58, 52, 0.1) 0%, transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(193, 58, 52, 0.08) 0%, transparent 50%),
    radial-gradient(circle at 40% 40%, rgba(255, 255, 255, 0.3) 0%, transparent 50%);
  pointer-events: none;
}

.hero-title.center { 
  text-align: center; 
  margin: 8px 0 16px 0; 
  font-size: 42px; 
  line-height: 1.1;
  position: relative;
  z-index: 2;
}

.intro-video-wrap {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 2;
}

/* Vertical video window (9:16) */
.intro-video {
  width: min(70vw, 400px); /* Increased from 240px to 400px for desktop */
  aspect-ratio: 9/16;
  border-radius: 16px; /* Increased border radius */
  background: #e5e5e5;
  object-fit: cover;
  box-shadow: 0 12px 40px rgba(0,0,0,0.15); /* Enhanced shadow */
  transition: transform 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.intro-video:hover {
  transform: scale(1.02);
  box-shadow: 0 20px 60px rgba(0,0,0,0.2);
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
  .intro-video {
    width: min(70vw, 240px); /* Keep mobile size the same */
  }
}

/* CTA bar under navbar */
.cta-bar {
  position: sticky;
  top: 50px; /* just below header */
  z-index: 900;
  background: transparent;
  border: 0;
  transform: translateY(0);
  transition: transform 200ms ease;
  display: grid;
  justify-items: center;
  padding: 6px 12px;
}
.cta-bar.hidden { transform: translateY(-120%); }

.cta-link {
  display: block;
  position: relative;
  padding: 12px 48px 12px 16px; /* space for right arrow */
  background: #2b2b2b; /* dark gray */
  color: #ffffff;
  text-decoration: none;
  font-weight: 700;
  border-radius: 0; /* squared edges */
  font-family: "SF Compact Rounded", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  width: 100%;
  text-align: center;
}

.cta-arrow { font-size: 22px; color: #ffffff; opacity: 1; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); }