/* Custom keyframes that are awkward with utilities */
@keyframes gradientShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.hero-gradient {
  background: linear-gradient(120deg, #588157, #3A5A40, #A3B18A, #588157);
  background-size: 300% 300%;
  animation: gradientShift 14s ease infinite;
}

@keyframes floatY {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-10px); }
}
.float-card { animation: floatY 6s ease-in-out infinite; }
.float-card.delay-1 { animation-delay: 1.2s; }
.float-card.delay-2 { animation-delay: 2.4s; }

/* Fade/slide in on scroll */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .8s ease, transform .8s ease;
}
.reveal.visible { opacity: 1; transform: translateY(0); }

/* Accordion */
.faq-panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height .4s ease;
}

/* Floating labels */
.field { position: relative; }
.field input, .field textarea {
  width: 100%;
  background: transparent;
  border: 1px solid #A3B18A;
  border-radius: 14px;
  padding: 18px 16px 8px 16px;
  outline: none;
  font: inherit;
  color: #1B1B1B;
  transition: border-color .2s;
}
.field textarea { min-height: 120px; resize: vertical; }
.field label {
  position: absolute;
  left: 16px;
  top: 14px;
  color: #3A5A40;
  pointer-events: none;
  transition: all .2s ease;
  background: transparent;
  padding: 0 4px;
}
.field input:focus, .field textarea:focus { border-color: #588157; }
.field input:focus + label,
.field textarea:focus + label,
.field input:not(:placeholder-shown) + label,
.field textarea:not(:placeholder-shown) + label {
  top: -8px;
  font-size: 12px;
  color: #588157;
  background: #DAD7CD;
}

/* Cart drawer */
.drawer {
  transform: translateX(100%);
  transition: transform .35s ease;
}
.drawer.open { transform: translateX(0); }
.backdrop {
  opacity: 0; pointer-events: none;
  transition: opacity .3s ease;
}
.backdrop.open { opacity: 1; pointer-events: auto; }

/* Testimonial slider */
.t-track { transition: transform .6s ease; }

/* Mobile: prevent horizontal overflow */
html, body { overflow-x: hidden; }

/* Mobile: hero title scale */
@media (max-width: 480px) {
  .hero-gradient { min-height: 360px !important; }
}

/* Mobile: shop product grid images */
@media (max-width: 639px) {
  .shop-item .aspect-square { aspect-ratio: 4/3; }
}

/* Mobile: bento grid fix — don't stretch cards too tall */
@media (max-width: 767px) {
  #offers .grid > article:first-child { grid-column: span 1 !important; grid-row: span 1 !important; }
}

/* Legal pages translation */
html[lang="en"] .lang-de { display: none !important; }
html[lang="de"] .lang-en { display: none !important; }