﻿/* Ess Nutriments — shared site styles */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: 'Nunito', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  color: #46423C;
  background: #fff;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; }
a { -webkit-tap-highlight-color: transparent; }
details summary { list-style: none; }
details summary::-webkit-details-marker { display: none; }
details[open] .faq-icon { transform: rotate(45deg); }
.faq-icon { transition: transform .15s ease; }

@keyframes enmarquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.marquee {
  animation: enmarquee 34s linear infinite;
}
.marquee--med { animation-duration: 30s; }
.marquee:hover { animation-play-state: paused; }

@media (prefers-reduced-motion: reduce) {
  .marquee { animation: none; transform: none; }
}

/* ---------------- Mobile header / nav ---------------- */
.nav-toggle { cursor: pointer; }
.nav-links { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
@media (max-width: 860px) {
  .topbar { display: none !important; }

  .site-navbar {
    flex-wrap: wrap !important;
  }

  .nav-toggle {
    display: inline-flex !important;
  }

  .nav-links {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    background: #3A3733;
    box-shadow: 0 12px 24px rgba(0,0,0,.18);
    z-index: 40;
    padding: 6px 0;
  }
  .nav-links.open {
    display: flex;
  }
  .nav-links .nav-link {
    padding: 14px 24px !important;
    width: 100%;
    color: #fff !important;
  }
  .book-btn {
    display: none !important;
    margin-left: auto;
  }
}

/* ---------------- Mobile-safe form fields ---------------- */
.form-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
@media (max-width: 640px) {
  .form-grid-2 {
    grid-template-columns: 1fr !important;
  }
}

/* ---------------- Mobile footer ---------------- */
@media (max-width: 760px) {
  .footer-grid {
    grid-template-columns: 1fr 1fr !important;
    row-gap: 32px !important;
  }
  .footer-brand-col {
    grid-column: 1 / -1;
  }
}
@media (max-width: 460px) {
  .footer-grid {
    grid-template-columns: 1fr !important;
  }
}
