/* Diwali theme. Loaded only while themes/diwali is enabled. */

body.theme-diwali {
  --accent: #c2410c;
  --accent-hover: #9a3412;
  --accent-soft: #fff7ed;
  --accent-border: #fed7aa;
  --accent-light: #fdba74;
  --hero-dark-gradient: linear-gradient(145deg, #3b1208 0%, #7c2d12 58%, #9a3412 100%);
  --hero-dark-glow:
    radial-gradient(ellipse 70% 55% at 100% 0%, rgba(251, 191, 36, 0.28) 0%, transparent 55%),
    radial-gradient(ellipse 50% 40% at 0% 100%, rgba(234, 88, 12, 0.22) 0%, transparent 50%);
}

.diwali-banner {
  position: relative;
  background:
    radial-gradient(circle at 12px 50%, rgba(253, 224, 71, 0.35) 0 2px, transparent 3px),
    radial-gradient(circle at calc(100% - 12px) 50%, rgba(253, 224, 71, 0.35) 0 2px, transparent 3px),
    linear-gradient(90deg, #7c2d12 0%, #c2410c 36%, #d97706 64%, #7c2d12 100%);
  box-shadow: inset 0 -2px 0 rgba(253, 224, 71, 0.45);
}

.diwali-greeting {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 8px 46px;
  color: #fff7ed;
  text-align: center;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.4;
}

.diwali-greeting strong {
  color: #fde68a;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.diwali-diya {
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  filter: drop-shadow(0 0 5px rgba(253, 224, 71, 0.75));
}

.diwali-flame {
  transform-box: fill-box;
  transform-origin: center bottom;
  animation: diwaliFlame 1.15s ease-in-out infinite;
}

.diwali-flame-inner {
  animation-delay: 0.12s;
}

.diwali-dismiss {
  display: none;
  position: absolute;
  top: 50%;
  right: 10px;
  width: 28px;
  height: 28px;
  margin: 0;
  padding: 0;
  transform: translateY(-50%);
  border: 1px solid rgba(255, 247, 237, 0.35);
  border-radius: 999px;
  background: rgba(60, 16, 8, 0.28);
  color: #fff7ed;
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
}

html.js .diwali-dismiss {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.diwali-dismiss:hover,
.diwali-dismiss:focus {
  background: rgba(60, 16, 8, 0.5);
  color: #fde68a;
  outline: 2px solid #fde68a;
  outline-offset: 2px;
}

.diwali-lights {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  justify-content: space-evenly;
  height: 22px;
  padding: 0 8px 2px;
  background: #2a1008;
  overflow: hidden;
  pointer-events: none;
}

html.diwali-banner-hidden .diwali-banner,
html.diwali-banner-hidden .diwali-lights,
html.diwali-banner-hidden .diwali-toran {
  display: none;
}

.diwali-toran {
  display: flex;
  align-items: flex-start;
  justify-content: space-evenly;
  height: 42px;
  padding: 0 6px;
  background: linear-gradient(180deg, #9a3412 0%, #ea580c 55%, #fbbf24 100%);
  overflow: hidden;
  pointer-events: none;
}

.diwali-flower {
  display: flex;
  transform-origin: top center;
  animation: diwaliSway 2.8s ease-in-out infinite;
}

.diwali-marigold {
  width: 26px;
  height: 40px;
  display: block;
  filter: drop-shadow(0 1px 0 rgba(124, 45, 18, 0.35));
}

.diwali-decor {
  position: fixed;
  inset: 0;
  z-index: 30;
  overflow: hidden;
  pointer-events: none;
}

.diwali-rangoli {
  position: absolute;
  width: 108px;
  height: 108px;
  filter: drop-shadow(0 8px 16px rgba(124, 45, 18, 0.18));
}

.diwali-rangoli-left { top: 28%; left: 14px; }
.diwali-rangoli-right { top: 58%; right: 14px; }

.diwali-side-diya {
  position: absolute;
  width: 52px;
  height: 52px;
}

.diwali-side-diya-left { top: 18%; left: 36px; }
.diwali-side-diya-right { top: 78%; right: 36px; }

.diwali-spark {
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fde68a;
  box-shadow: 0 0 8px 2px rgba(251, 191, 36, 0.85);
  animation: diwaliTwinkle 2.6s ease-in-out infinite;
}

.diwali-spark-1 { top: 16%; left: 2.5%; animation-delay: 0s; }
.diwali-spark-2 { top: 22%; right: 3%; animation-delay: 0.4s; }
.diwali-spark-3 { top: 46%; left: 1.5%; width: 5px; height: 5px; animation-delay: 0.8s; }
.diwali-spark-4 { top: 52%; right: 2%; animation-delay: 1.1s; }
.diwali-spark-5 { top: 70%; left: 3%; animation-delay: 0.2s; }
.diwali-spark-6 { top: 74%; right: 2.5%; width: 5px; height: 5px; animation-delay: 1.5s; }
.diwali-spark-7 { top: 34%; left: 4%; width: 4px; height: 4px; animation-delay: 0.6s; }
.diwali-spark-8 { top: 86%; right: 4%; animation-delay: 1.8s; }

@keyframes diwaliSway {
  0%, 100% { transform: rotate(-4deg); }
  50% { transform: rotate(4deg); }
}

@keyframes diwaliTwinkle {
  0%, 100% { opacity: 0.25; transform: scale(0.7); }
  50% { opacity: 1; transform: scale(1); }
}

.diwali-lights::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 4px;
  height: 2px;
  background: linear-gradient(90deg, #5c3317, #d6a15a, #5c3317);
  border-radius: 2px;
}

.diwali-bulb {
  position: relative;
  z-index: 1;
  width: 9px;
  height: 12px;
  border-radius: 50% 50% 46% 46%;
  flex: 0 0 auto;
  animation: diwaliGlow 2.1s ease-in-out infinite;
}

.diwali-bulb::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -4px;
  width: 2px;
  height: 5px;
  margin-left: -1px;
  background: #7a4a22;
}

.diwali-bulb-gold { color: #fde68a; background: #fde68a; }
.diwali-bulb-saffron { color: #fb923c; background: #fb923c; }
.diwali-bulb-red { color: #f87171; background: #f87171; }
.diwali-bulb-green { color: #4ade80; background: #4ade80; }
.diwali-bulb-pink { color: #f9a8d4; background: #f9a8d4; }

@keyframes diwaliGlow {
  0%, 100% { opacity: 0.45; box-shadow: 0 0 3px currentColor; }
  50% { opacity: 1; box-shadow: 0 0 8px 2px currentColor; }
}

@keyframes diwaliFlame {
  0%, 100% { transform: scaleY(1); opacity: 1; }
  50% { transform: scaleY(0.82); opacity: 0.82; }
}

body.theme-diwali:not(.page-landing) > header {
  position: sticky;
  top: 0;
  z-index: 100000;
  background: #fff;
}

body.theme-diwali .navbar-main {
  border-bottom-color: rgba(194, 65, 12, 0.18);
  box-shadow: 0 1px 0 rgba(194, 65, 12, 0.08), 0 8px 18px rgba(124, 45, 18, 0.06);
}

body.theme-diwali .navbar-main .btn-quote:hover {
  box-shadow: 0 4px 14px rgba(194, 65, 12, 0.35);
}

body.theme-diwali .btn-danger:hover,
body.theme-diwali .btn-danger:focus,
body.theme-diwali .btn-accent:hover,
body.theme-diwali .btn-accent:focus {
  box-shadow: 0 10px 24px rgba(194, 65, 12, 0.28);
}

body.theme-diwali.site-theme .page-hero-banner-light {
  background: linear-gradient(180deg, #fff7ed 0%, #fff 62%);
}

body.theme-diwali.site-theme .page-hero-banner-light::before,
body.theme-diwali.site-theme .page-header.page-hero-light::before,
body.theme-diwali.site-theme .page-service .service-hero-split:not(.service-hero-dark)::before {
  background-image:
    linear-gradient(rgba(194, 65, 12, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(194, 65, 12, 0.06) 1px, transparent 1px);
}

body.theme-diwali.site-theme .page-service .service-hero-split:not(.service-hero-dark) {
  background: linear-gradient(180deg, #fff7ed 0%, #fff 70%);
}

body.theme-diwali.site-theme .page-hero-banner-light .page-hero-banner-shape-1,
body.theme-diwali.site-theme .page-service .service-hero-split:not(.service-hero-dark) .service-hero-shape-1 {
  background: rgba(245, 158, 11, 0.32);
}

body.theme-diwali.site-theme .page-hero-banner-light .page-hero-banner-shape-2,
body.theme-diwali.site-theme .page-service .service-hero-split:not(.service-hero-dark) .service-hero-shape-2 {
  background: rgba(234, 88, 12, 0.2);
}

body.theme-diwali .page-service .service-hero-dark .service-hero-shape-1 {
  background: radial-gradient(circle, rgba(251, 191, 36, 0.32) 0%, transparent 68%);
}

body.theme-diwali .page-service .service-hero-dark .service-hero-shape-2 {
  background: radial-gradient(circle, rgba(234, 88, 12, 0.24) 0%, transparent 70%);
}

body.theme-diwali.site-theme .page-hero-banner-badge--dot,
body.theme-diwali.site-theme .page-hero-light .page-hero-label,
body.theme-diwali.site-theme .page-service .service-hero-split:not(.service-hero-dark) .hero-badge,
body.theme-diwali.site-theme .page-service .domain-search-hero-badge {
  color: var(--accent);
  background: rgba(194, 65, 12, 0.08);
  border-color: rgba(194, 65, 12, 0.18);
}

body.theme-diwali.site-theme .page-hero-banner-badge-dot {
  background: #ea580c;
  box-shadow: 0 0 0 3px rgba(234, 88, 12, 0.22);
}

body.theme-diwali.site-theme .page-hero-banner-light .page-hero-banner-accent,
body.theme-diwali.site-theme .page-hero-light .page-hero-accent,
body.theme-diwali.site-theme .page-service .domain-search-hero-accent,
body.theme-diwali .page-hero-banner-accent {
  background-color: transparent;
  background-image: linear-gradient(90deg, #9a3412 0%, #ea580c 100%);
  background-repeat: no-repeat;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #c2410c;
}

body.theme-diwali.site-theme .page-hero-banner-light .page-hero-banner-actions .btn-danger,
body.theme-diwali.site-theme .page-service .service-hero-split:not(.service-hero-dark) .service-hero-actions .btn-danger,
body.theme-diwali.site-theme .page-service .service-cta .btn-danger {
  background: linear-gradient(135deg, #c2410c 0%, #ea580c 100%);
  border-color: #c2410c;
  box-shadow: 0 4px 14px rgba(194, 65, 12, 0.28);
}

body.theme-diwali.site-theme .page-hero-banner-light .page-hero-banner-actions .btn-danger:hover,
body.theme-diwali.site-theme .page-service .service-hero-split:not(.service-hero-dark) .service-hero-actions .btn-danger:hover,
body.theme-diwali.site-theme .page-service .service-cta .btn-danger:hover {
  background: linear-gradient(135deg, #9a3412 0%, #c2410c 100%);
  border-color: #9a3412;
  box-shadow: 0 8px 22px rgba(154, 52, 18, 0.34);
}

body.theme-diwali.page-home .home-category-card .cat-icon {
  background: rgba(194, 65, 12, 0.1);
  color: var(--accent);
}

body.theme-diwali.page-home .home-cta-talk .cta-box,
body.theme-diwali .page-service .service-cta-inner {
  background: linear-gradient(135deg, #7c2d12 0%, #c2410c 52%, #d97706 100%);
  box-shadow: 0 16px 40px rgba(194, 65, 12, 0.28);
}

body.theme-diwali .page-service .service-cta-inner::before {
  background:
    radial-gradient(circle at 15% 50%, rgba(255, 255, 255, 0.08) 0%, transparent 45%),
    radial-gradient(circle at 85% 20%, rgba(253, 224, 71, 0.22) 0%, transparent 42%);
}

body.theme-diwali.page-home .home-cta-talk .btn-cta-primary {
  color: #9a3412;
}

body.theme-diwali .page-service .service-plan-card.is-featured {
  box-shadow: 0 8px 32px rgba(194, 65, 12, 0.16);
}

body.theme-diwali footer.site-footer {
  position: relative;
  background: linear-gradient(180deg, #3b1208 0%, #1c0a06 100%);
}

body.theme-diwali footer.site-footer::before,
body.theme-diwali.page-landing .landing-footer::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 12px;
  background:
    radial-gradient(circle at 10px 6px, #fde68a 0 2.5px, transparent 3px),
    radial-gradient(circle at 24px 6px, #fb923c 0 3.5px, transparent 4px),
    radial-gradient(circle at 38px 6px, #f87171 0 2.5px, transparent 3px),
    linear-gradient(#5c1f10, #5c1f10);
  background-size: 48px 12px;
  background-repeat: repeat-x;
  pointer-events: none;
}

body.theme-diwali.page-landing .landing-footer {
  position: relative;
}

body.theme-diwali footer.site-footer .brand-highlight,
body.theme-diwali .footer-bottom a:hover,
body.theme-diwali footer.site-footer a:hover {
  color: #fde68a;
}

body.theme-diwali .footer-bottom {
  background: #140804;
  border-top-color: rgba(253, 224, 71, 0.12);
}

body.theme-diwali.page-landing .landing-topbar {
  background: #fff7ed;
  border-bottom: 1px solid rgba(194, 65, 12, 0.16);
}

@media (max-width: 1599.98px) {
  .diwali-decor {
    display: none;
  }
}

body.page-landing .diwali-decor {
  display: none;
}

@media (max-width: 575.98px) {
  .diwali-toran {
    height: 28px;
  }

  .diwali-marigold {
    width: 16px;
    height: 26px;
  }

  .diwali-greeting {
    gap: 8px;
    padding: 8px 40px 8px 12px;
    font-size: 0.8rem;
  }

  .diwali-diya {
    width: 22px;
    height: 22px;
  }

  .diwali-greeting .diwali-diya:last-of-type {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .diwali-bulb,
  .diwali-flame,
  .diwali-flower,
  .diwali-spark {
    animation: none;
  }

  .diwali-bulb {
    opacity: 1;
  }
}

@media print {
  .diwali-theme,
  .diwali-decor {
    display: none !important;
  }
}