/* Fonday flyer — load sequence, ambient motion, ° motif */

@keyframes rise {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: none; }
}
@keyframes chip-in {
  from { opacity: 0; transform: translateY(10px) scale(0.92); }
  to { opacity: 1; transform: none; }
}
@keyframes drift {
  from { transform: translateY(0); }
  to { transform: translateY(-7px); }
}

/* hero load sequence */
.hero-copy .eyebrow { animation: rise 0.7s cubic-bezier(0.22, 1, 0.36, 1) both; }
.hero-copy h1 { animation: rise 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.08s both; }
.hero-copy .hero-sub { animation: rise 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.16s both; }
.hero-copy .hero-cta { animation: rise 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.24s both; }
.hero-copy .hero-index { animation: rise 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.32s both; }

/* chips: pop in after photo, then gentle drift */
.chip-temp {
  animation: chip-in 0.55s cubic-bezier(0.22, 1, 0.36, 1) 0.55s both,
    drift 3.8s ease-in-out 1.1s infinite alternate;
}
.chip-humid {
  animation: chip-in 0.55s cubic-bezier(0.22, 1, 0.36, 1) 0.75s both,
    drift 4.6s ease-in-out 1.3s infinite alternate;
}

/* FAQ answer easing */
.faq-item[open] p { animation: rise 0.35s cubic-bezier(0.22, 1, 0.36, 1) both; }

/* ° motif — brand degree watermark */
.quote { position: relative; overflow: hidden; }
.quote::before {
  content: "°";
  position: absolute;
  top: -0.32em;
  right: 4%;
  font-family: Fraunces, Georgia, serif;
  font-size: clamp(280px, 38vw, 520px);
  line-height: 1;
  color: var(--panel);
  z-index: 0;
  pointer-events: none;
}
.quote p { position: relative; z-index: 1; }

.closing { position: relative; overflow: hidden; }
.closing::before {
  content: "°";
  position: absolute;
  bottom: -0.72em;
  left: 3%;
  font-family: Fraunces, Georgia, serif;
  font-size: clamp(240px, 32vw, 440px);
  line-height: 1;
  color: rgba(229, 62, 62, 0.07);
  z-index: 0;
  pointer-events: none;
}
.closing > * { position: relative; z-index: 1; }

@media (prefers-reduced-motion: reduce) {
  .hero-copy .eyebrow, .hero-copy h1, .hero-copy .hero-sub,
  .hero-copy .hero-cta, .hero-copy .hero-index,
  .chip-temp, .chip-humid, .faq-item[open] p {
    animation: none;
    opacity: 1;
    transform: none;
  }
}