/* Dussehra festive layer — homepage only, injected by js/dussehra.js */

.site-header.has-toran {
  overflow: visible;
}

.dussehra-toran {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  height: 34px;
  pointer-events: none;
  z-index: 5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='34' viewBox='0 0 120 34'%3E%3Cpath d='M0 3 Q60 20 120 3' fill='none' stroke='%238B1A2B' stroke-width='1.4'/%3E%3Cpath d='M60 12 C52 18 54 28 60 33 C66 28 68 18 60 12Z' fill='%232E7D32'/%3E%3Cpath d='M60 13 L60 32' stroke='%231B5E20' stroke-width='0.8'/%3E%3Cpath d='M28 9 C23 13 24 20 28 24 C32 20 33 13 28 9Z' fill='%23388E3C'/%3E%3Cpath d='M92 9 C87 13 88 20 92 24 C96 20 97 13 92 9Z' fill='%23388E3C'/%3E%3Cg%3E%3Ccircle cx='0' cy='3.5' r='4.6' fill='%23F97316'/%3E%3Ccircle cx='0' cy='3.5' r='2.2' fill='%23FDBA74'/%3E%3Ccircle cx='120' cy='3.5' r='4.6' fill='%23F97316'/%3E%3Ccircle cx='120' cy='3.5' r='2.2' fill='%23FDBA74'/%3E%3Ccircle cx='14' cy='6.6' r='4.2' fill='%23FACC15'/%3E%3Ccircle cx='14' cy='6.6' r='1.9' fill='%23FEF08A'/%3E%3Ccircle cx='44' cy='10.6' r='4.2' fill='%23FACC15'/%3E%3Ccircle cx='44' cy='10.6' r='1.9' fill='%23FEF08A'/%3E%3Ccircle cx='76' cy='10.6' r='4.2' fill='%23FACC15'/%3E%3Ccircle cx='76' cy='10.6' r='1.9' fill='%23FEF08A'/%3E%3Ccircle cx='106' cy='6.6' r='4.2' fill='%23FACC15'/%3E%3Ccircle cx='106' cy='6.6' r='1.9' fill='%23FEF08A'/%3E%3Ccircle cx='60' cy='11.6' r='4.8' fill='%23EA580C'/%3E%3Ccircle cx='60' cy='11.6' r='2.3' fill='%23FDBA74'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-size: 120px 34px;
  filter: drop-shadow(0 3px 4px rgba(0, 0, 0, 0.18));
  transform-origin: top center;
  animation: toran-sway 6s ease-in-out infinite;
}

@keyframes toran-sway {
  0%, 100% { transform: rotate(0deg) translateY(0); }
  50% { transform: rotate(0.25deg) translateY(1px); }
}

/* Greeting badge on hero */
.dussehra-greeting {
  position: absolute;
  z-index: 4;
  top: 3.25rem;
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.55rem 1.2rem 0.55rem 0.7rem;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(139, 26, 43, 0.92), rgba(234, 88, 12, 0.92));
  border: 1px solid rgba(250, 204, 21, 0.7);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35), 0 0 24px rgba(250, 204, 21, 0.35);
  color: #fff;
  white-space: nowrap;
  pointer-events: none;
  animation: greeting-in 0.9s cubic-bezier(0.2, 0.8, 0.2, 1) both, greeting-glow 3.2s ease-in-out 1s infinite;
}

.dussehra-greeting-icon {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #fde68a, #f59e0b 70%);
  color: #7c2d12;
  font-size: 0.95rem;
}

.dussehra-greeting-text {
  display: flex;
  flex-direction: column;
  line-height: 1.15;
}

.dussehra-greeting-title {
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  background: linear-gradient(90deg, #fef08a, #fff, #fde047);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.dussehra-greeting-sub {
  font-size: 0.72rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.9);
}

@keyframes greeting-in {
  from { opacity: 0; transform: translate(-50%, -14px) scale(0.92); }
  to { opacity: 1; transform: translate(-50%, 0) scale(1); }
}

@keyframes greeting-glow {
  0%, 100% { box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35), 0 0 18px rgba(250, 204, 21, 0.3); }
  50% { box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35), 0 0 34px rgba(250, 204, 21, 0.6); }
}

/* Falling marigold petals + sparkles */
.dussehra-sky {
  position: absolute;
  inset: 0;
  z-index: 3;
  overflow: hidden;
  pointer-events: none;
}

.dussehra-petal {
  position: absolute;
  top: -24px;
  width: var(--size, 12px);
  height: calc(var(--size, 12px) * 0.7);
  border-radius: 60% 40% 60% 40% / 70% 50% 50% 30%;
  background: var(--color, #f97316);
  opacity: 0.9;
  box-shadow: inset -2px -1px 0 rgba(0, 0, 0, 0.12);
  animation:
    petal-fall var(--dur, 9s) linear var(--delay, 0s) infinite,
    petal-sway calc(var(--dur, 9s) / 3) ease-in-out var(--delay, 0s) infinite alternate;
}

@keyframes petal-fall {
  0% { transform: translateY(0) rotate(0deg); opacity: 0; }
  8% { opacity: 0.95; }
  90% { opacity: 0.85; }
  100% { transform: translateY(var(--fall, 700px)) rotate(var(--spin, 540deg)); opacity: 0; }
}

@keyframes petal-sway {
  from { margin-left: calc(var(--drift, 30px) * -1); }
  to { margin-left: var(--drift, 30px); }
}

.dussehra-spark {
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #fde68a;
  box-shadow: 0 0 8px 2px rgba(253, 224, 71, 0.85);
  opacity: 0;
  animation: spark-twinkle var(--dur, 3s) ease-in-out var(--delay, 0s) infinite;
}

@keyframes spark-twinkle {
  0%, 100% { opacity: 0; transform: scale(0.4); }
  50% { opacity: 1; transform: scale(1.2); }
}

@media (max-width: 640px) {
  .dussehra-toran {
    height: 26px;
    background-size: 92px 26px;
  }

  .dussehra-greeting {
    top: 2.4rem;
    padding: 0.4rem 0.9rem 0.4rem 0.5rem;
    gap: 0.45rem;
  }

  .dussehra-greeting-icon {
    width: 1.6rem;
    height: 1.6rem;
    font-size: 0.8rem;
  }

  .dussehra-greeting-title { font-size: 0.85rem; }
  .dussehra-greeting-sub { font-size: 0.62rem; }
}

@media (prefers-reduced-motion: reduce) {
  .dussehra-toran,
  .dussehra-greeting,
  .dussehra-petal,
  .dussehra-spark {
    animation: none !important;
  }

  .dussehra-petal,
  .dussehra-spark {
    display: none;
  }
}
