/* ══ Cosmic hero — animated night-dusk sky over the heritage theme ══ */

.hz-cosmos-hero {
  position: relative;
  overflow: clip;
  isolation: isolate;
  background:
    radial-gradient(ellipse 120% 90% at 50% -20%, #14090178 0%, transparent 60%),
    linear-gradient(178deg, #1c0e02 0%, #3a2008 46%, #5c380f 78%, transparent 100%);
}

#hzCosmos {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  z-index: 0;
  pointer-events: none;
}

.hz-cosmos-content { position: relative; z-index: 3; }

/* ── Rotating zodiac ring behind the headline ── */
.hz-zodiac-ring {
  position: absolute;
  left: 50%; top: 46%;
  width: min(92vw, 760px);
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  z-index: 1;
  opacity: 0.34;
  pointer-events: none;
}
.hz-zodiac-ring svg { width: 100%; height: 100%; display: block; }
.hz-ring-spin      { animation: hzSpin 180s linear infinite; transform-origin: 50% 50%; }
.hz-ring-spin-rev  { animation: hzSpinRev 240s linear infinite; transform-origin: 50% 50%; }
@keyframes hzSpin    { to { transform: rotate(360deg); } }
@keyframes hzSpinRev { to { transform: rotate(-360deg); } }

/* ── Floating planet orbs ── */
.hz-planet {
  position: absolute;
  border-radius: 50%;
  z-index: 1;
  pointer-events: none;
  filter: blur(0.4px);
}
.hz-planet::after {
  content: ''; position: absolute; inset: -40%;
  border-radius: 50%;
  background: radial-gradient(circle, var(--pl-glow) 0%, transparent 68%);
  opacity: 0.55;
}
.hz-planet-a { /* saffron Jupiter */
  --pl-glow: rgba(227, 182, 79, 0.5);
  width: 74px; height: 74px;
  left: 7%; top: 16%;
  background: radial-gradient(circle at 32% 30%, #f6d992, #cf9433 52%, #7a4d12 100%);
  animation: hzFloat 16s ease-in-out infinite alternate;
}
.hz-planet-b { /* dusk-red Mars */
  --pl-glow: rgba(196, 92, 58, 0.45);
  width: 34px; height: 34px;
  right: 10%; top: 12%;
  background: radial-gradient(circle at 35% 32%, #e8a075, #b05430 55%, #5e2410 100%);
  animation: hzFloat 12s ease-in-out infinite alternate-reverse;
}
.hz-planet-c { /* pale Venus */
  --pl-glow: rgba(240, 227, 194, 0.4);
  width: 20px; height: 20px;
  right: 20%; bottom: 18%;
  background: radial-gradient(circle at 35% 32%, #fdf6e3, #d9c49a 60%, #8f7748 100%);
  animation: hzFloat 19s ease-in-out infinite alternate;
}
.hz-planet-a::before { /* ring */
  content: ''; position: absolute; left: 50%; top: 50%;
  width: 152%; height: 46%;
  border: 2px solid rgba(246, 217, 146, 0.5);
  border-radius: 50%;
  transform: translate(-50%, -50%) rotate(-18deg);
}
@keyframes hzFloat {
  from { transform: translateY(-10px) translateX(0); }
  to   { transform: translateY(14px)  translateX(10px); }
}

/* Hero text sits on the night sky — lift contrast */
.hz-cosmos-hero .hz-display { color: #f7ecd4; text-shadow: 0 2px 26px rgba(0,0,0,0.55); }
.hz-cosmos-hero .hz-lede    { color: #e8d9b4; }
.hz-cosmos-hero .hz-stat b,
.hz-cosmos-hero .hz-stat span { color: #f1e2bd; }

/* Primary CTA — soft golden pulse */
.hz-cosmos-hero .hz-btn-gold {
  animation: hzCtaGlow 3.6s ease-in-out infinite;
}
@keyframes hzCtaGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(227, 182, 79, 0.0), 0 6px 22px rgba(0,0,0,0.35); }
  50%      { box-shadow: 0 0 26px 4px rgba(227, 182, 79, 0.38), 0 6px 22px rgba(0,0,0,0.35); }
}

/* Twinkling ✦ ornaments */
.hz-twinkle { display: inline-block; animation: hzTwinkle 2.8s ease-in-out infinite; }
@keyframes hzTwinkle {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: 0.45; transform: scale(0.82); }
}

/* ── Scroll-reveal ── */
.hz-reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 0.7s cubic-bezier(.2,.65,.3,1), transform 0.7s cubic-bezier(.2,.65,.3,1);
}
.hz-reveal.hz-in { opacity: 1; transform: none; }
/* stagger children of card grids */
.hz-reveal :is(.hz-service, .hz-step, .hz-quote, .hz-product) {
  opacity: 0; transform: translateY(22px);
  transition: opacity 0.65s ease, transform 0.65s cubic-bezier(.2,.65,.3,1);
}
.hz-reveal.hz-in :is(.hz-service, .hz-step, .hz-quote, .hz-product) {
  opacity: 1; transform: none;
}
.hz-in .hz-service:nth-child(2), .hz-in .hz-step:nth-child(2), .hz-in .hz-quote:nth-child(2) { transition-delay: .12s; }
.hz-in .hz-service:nth-child(3), .hz-in .hz-step:nth-child(3), .hz-in .hz-quote:nth-child(3) { transition-delay: .24s; }
.hz-in .hz-service:nth-child(4) { transition-delay: .36s; }

/* Service cards — floating hover with gold halo */
.hz-service { transition: transform 0.35s cubic-bezier(.2,.65,.3,1), box-shadow 0.35s ease; }
.hz-service:hover {
  transform: translateY(-7px);
  box-shadow: 0 18px 44px rgba(30, 16, 2, 0.5), 0 0 0 1px rgba(227, 182, 79, 0.45);
}
.hz-service .svc-icon { transition: transform 0.4s cubic-bezier(.3,1.6,.4,1); }
.hz-service:hover .svc-icon { transform: translateY(-4px) scale(1.15) rotate(-4deg); }

@media (max-width: 640px) {
  .hz-planet-a { width: 48px; height: 48px; left: 3%; top: 10%; }
  .hz-planet-b { width: 22px; height: 22px; }
  .hz-planet-c { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .hz-ring-spin, .hz-ring-spin-rev, .hz-planet,
  .hz-cosmos-hero .hz-btn-gold, .hz-twinkle { animation: none !important; }
  .hz-reveal, .hz-reveal :is(.hz-service, .hz-step, .hz-quote, .hz-product) {
    opacity: 1 !important; transform: none !important; transition: none !important;
  }
}