/* =============================================================
   ✦ MOTHER'S DAY — minimal (10 May 2026 only)
   The inline date-check script in index.html auto-strips this
   theme on every other day.
   ============================================================= */

/* Hide every flagged element by default; the JS only reveals
   them when today is 10 May 2026, and removes them otherwise. */
[data-mday][hidden] { display: none !important; }

/* =============================================================
   ✦ Inline greeting — Happy ♥ Mother's Day
   (sits above "Inspiring Excellence Since 1986" inside the hero)
   ============================================================= */
.mday-title {
  display: block;
  margin: 0 0 18px;
  padding: 6px 4px 6px 8px;          /* breathing room for Great Vibes' tall ascenders */
  font-family: 'Great Vibes', cursive;
  font-weight: 400;
  font-style: normal;
  font-size: clamp(2.6rem, 5vw, 4rem);
  line-height: 1.1;
  letter-spacing: 1px;
  background: linear-gradient(135deg, #e94e77 0%, #be185d 60%, #831843 100%);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 4px 8px rgba(233, 78, 119, 0.18));
  animation: mdayTitleIn 1s cubic-bezier(.2, .8, .2, 1) both;
}
@keyframes mdayTitleIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* =============================================================
   ✦ Illustration in the hero text column
   ============================================================= */
.mday-art {
  margin: 28px 0 0;
  max-width: 480px;
  width: 100%;
}
.mday-art img {
  display: block;
  width: 100%;
  height: auto;
  mix-blend-mode: multiply;
  filter: drop-shadow(0 24px 40px rgba(190, 24, 93, 0.18));
  animation: mdayArtIn 1s cubic-bezier(.2, .8, .2, 1) .15s both;
}
@keyframes mdayArtIn {
  from { opacity: 0; transform: translateY(16px) scale(0.97); }
  to   { opacity: 1; transform: translateY(0)    scale(1); }
}

/* Keep the school photo at the top of the column on desktop */
.mday-active .hero-mday .hero-container { align-items: start; }
.mday-active .hero-mday .hero-image-col {
  align-self: start;
  position: sticky;
  top: 100px;
}
@media (max-width: 992px) {
  .mday-active .hero-mday .hero-image-col { position: static; top: auto; }
}

/* Responsive */
@media (max-width: 768px) {
  .mday-title { gap: 8px; margin-bottom: 12px; }
  .mday-art { margin-top: 22px; max-width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .mday-title,
  .mday-title__heart,
  .mday-art img { animation: none; }
}