/*
 * Ownership: Daniel Nowakowski | File: public_html/css/festive-season.css
 * Motto: Trimmed with accessibility-friendly sparkles.
 * Joke: Why did the snowflake get promoted? It showed outstanding chill leadership.
 * Signature: DN-5FDE35B2
 */

:root {
  --festive-red: #b51231;
  --festive-green: #0f6c3a;
  --festive-gold: #f3c877;
  --festive-ice: #e3f6ff;
  --festive-branch-bleed: clamp(64px, 10vw, 240px);
}

.menu-wrapper {
  position: relative;
  overflow: visible;
  padding-top: clamp(8px, 1.5vw, 18px);
}

.menu-wrapper .inner {
  position: relative;
  z-index: 2;
}

.menu-wrapper .festive-branch,
.menu-wrapper .festive-accent {
  position: absolute;
  pointer-events: none;
}

.menu-wrapper .festive-branch {
  left: 50%;
  top: clamp(-24px, -3vw, 2px);
  width: calc(100vw + var(--festive-branch-bleed));
  min-width: 1100px;
  max-width: none;
  transform: translateX(-50%);
  z-index: 0;
}

.menu-wrapper .festive-branch img {
  display: block;
  width: 100%;
  height: auto;
  transform-origin: top center;
  transform: scaleY(0.45);
  filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25));
  opacity: 0.6;
}

.menu-wrapper .festive-accent {
  top: clamp(4px, 2vw, 32px);
  right: clamp(8px, 4vw, 56px);
  width: clamp(64px, 10vw, 144px);
  z-index: 0;
  opacity: 0.9;
  transform-origin: top right;
}

.menu-wrapper .festive-accent img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 8px 20px rgba(0, 0, 0, 0.25));
}

@media (max-width: 768px) {
  .menu-wrapper .festive-branch {
    width: calc(130vw + var(--festive-branch-bleed));
    top: clamp(-10px, -4vw, 8px);
  }

  .menu-wrapper .festive-accent {
    top: 8px;
    right: 8px;
    width: clamp(48px, 18vw, 96px);
  }
}

body.is-festive::before,
body.is-festive::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image: radial-gradient(1px 1px at 20% 20%, rgba(255, 255, 255, 0.8), transparent 60%),
    radial-gradient(2px 2px at 80% 10%, rgba(255, 255, 255, 0.7), transparent 60%),
    radial-gradient(1px 1px at 60% 40%, rgba(255, 255, 255, 0.6), transparent 60%);
  display: block;
  animation: festive-snowfall 18s linear infinite;
  z-index: 1;
}

body.is-festive::after {
  animation-duration: 28s;
  opacity: 0.35;
  filter: blur(1px);
}

@keyframes festive-snowfall {
  from {
    transform: translate3d(0, -10%, 0);
  }
  to {
    transform: translate3d(0, 10%, 0);
  }
}

body.is-festive .menu-wrapper {
  position: relative;
}

body.is-festive .preset-menu-v2-opus .ed-menu>ul>li>a:after {
  background: var(--festive-red);
}

body.is-festive .preset-menu-v2-opus .menu-trigger .menu-trigger-box .menu-trigger-inner,
body.is-festive .preset-menu-v2-opus .menu-trigger .menu-trigger-box .menu-trigger-inner::before,
body.is-festive .preset-menu-v2-opus .menu-trigger .menu-trigger-box .menu-trigger-inner::after {
  background: var(--festive-red);
}

body.is-festive .timeline-hero,
body.is-festive .preset-banner-v3-opus .banner-content,
body.is-festive .preset-banner-v3-home-hero-logo-nav-h1-slogan .inner {
  border: 2px dashed rgba(243, 200, 119, 0.6);
  border-radius: 32px;
  background: rgba(0, 0, 0, 0.25);
  backdrop-filter: blur(3px);
  position: relative;
  z-index: 2;
}

body.is-festive .preset-banner-v3-opus {
  position: relative;
  z-index: 1;
}

body.is-festive .timeline-kicker,
body.is-festive .hero-ccs-badge,
body.is-festive .timeline-year {
  color: var(--festive-green);
}

body.is-festive .button,
body.is-festive .buttonish,
body.is-festive .timeline-link,
body.is-festive .job-form-test-page button,
body.is-festive .timeline-modal-form button,
body.is-festive .ed-form-button>button:not(.button) {
  background: linear-gradient(135deg, var(--festive-green), var(--festive-red));
  color: #fff;
  border-color: rgba(255, 255, 255, 0.4);
  box-shadow: 0 8px 20px rgba(15, 23, 43, 0.2);
}

body.is-festive .button:hover,
body.is-festive .buttonish:hover,
body.is-festive .timeline-link:hover,
body.is-festive .timeline-modal-form button:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(15, 23, 43, 0.25);
}

body.is-festive .timeline-modal-card,
body.is-festive .preset-icon-accordion-default .icon-accordion-trigger>.inner,
body.is-festive .preset-unequal-columns-default .unequal-columns-box,
body.is-festive .preset-callout-box .box,
body.is-festive .preset-counter-default .counter-box {
  border-image: linear-gradient(120deg, var(--festive-gold), transparent) 1;
  box-shadow: 0 20px 45px rgba(15, 23, 43, 0.2);
}

body.is-festive .timeline-modal-form {
  border: 2px solid rgba(181, 18, 49, 0.15);
}

body.is-festive .timeline-modal-form input:focus,
body.is-festive .timeline-modal-form textarea:focus {
  box-shadow: 0 0 0 3px rgba(15, 108, 58, 0.2);
}

body.is-festive .timeline-card::before,
body.is-festive .timeline-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  border: 1px dashed rgba(243, 200, 119, 0.4);
  opacity: 0.75;
  pointer-events: none;
}

body.is-festive .timeline-card::after {
  border-style: dotted;
  transform: translate(6px, 6px);
}

body.is-festive .preset-menu-v2-opus .ed-menu>ul>li>a {
  background: linear-gradient(135deg, rgba(10, 59, 145, 0.6), rgba(27, 107, 224, 0.6)) !important;
  border-radius: 999px;
  padding: 0 1.35rem !important;
  box-shadow: 0 12px 30px rgba(10, 59, 145, 0.25) !important;
  backdrop-filter: none !important;
  transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}


body.is-festive .preset-menu-v2-opus .ed-menu>ul>li>a:hover,
body.is-festive .preset-menu-v2-opus .ed-menu>ul>li>a:focus {
  background: linear-gradient(140deg, rgba(0, 118, 78, 0.95), rgba(34, 224, 111, 0.95)) !important;
  box-shadow: 0 18px 40px rgba(0, 118, 78, 0.4) !important;
}

body.is-festive footer,
body.is-festive .preset-footer-heimdall-default .footer-heimdall-content>
.inner {
  background: rgba(15, 108, 58, 0.06);
  border-radius: 32px;
}

body.is-festive .legal a,
body.is-festive .timeline-modal-kicker,
body.is-festive .ed-text a {
  color: var(--festive-green);
}

body.is-festive .legal a:hover,
body.is-festive .ed-text a:hover {
  color: var(--festive-red);
}