/* Locked reference palette, Manrope typography, native interactive content. */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
html body { margin: 0; background: #fff; }
img { max-width: 100%; }
section { scroll-margin-top: 24px; }
a:focus-visible, summary:focus-visible { outline: 3px solid #6a9c12; outline-offset: 4px; }
.contact-card { display: flex; flex-direction: column; gap: 24px; padding: 24px 0; }
.contact-card h3 { margin: 0; font-size: 32px; line-height: 1.15; font-weight: 800; letter-spacing: -.03em; }
.contact-card p { margin: 0; font-size: 18px; line-height: 1.65; color: #5a605a; }
.contact-card .contact-note { font-size: 14px; }
.contact-button { display: block; padding: 20px; border-radius: 32px; text-align: center; text-decoration: none; font-size: 18px; font-weight: 700; color: #fff; background: linear-gradient(180deg,#2b342d,#141a16); box-shadow: 0 12px 28px rgba(20,26,22,.24); overflow-wrap: anywhere; }
.contact-button:hover { color: #a9e02c; }
.language-switch { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; }
.language-switch a, .language-switch span { padding: 8px; border-radius: 12px; text-decoration: none; }
.language-switch [aria-current="page"] { background: #eef5dd; color: #3d5e00; }
/* Zori has dedicated space below the photo, never over meal text or badges. */
.hero-visual { height: 870px !important; }
.hero-photo { bottom: 170px !important; }
.hero-mascot { left: 16px !important; bottom: 0 !important; width: 120px !important; animation: none !important; pointer-events: none; }
/* Hero calls to action stay on one line each; the row wraps instead. */
#top > div:first-child > div:first-of-type { flex-wrap: wrap; }
#top > div:first-child > div > a { white-space: nowrap; }
@media (max-width: 1400px) {
  .hero-week-card { width: min(300px, calc(100% - 24px)) !important; }
  .hero-why-card { top: 250px !important; right: 0 !important; width: min(250px, calc(100% - 24px)) !important; }
}
@media (max-width: 1200px) {
  header { padding: 22px 32px !important; }
  header nav { display: none !important; }
  body > div > section { padding-left: 48px !important; padding-right: 48px !important; }
  h1 { font-size: 62px !important; }
  #top { gap: 32px !important; }
  #top > div:first-child > div { flex-wrap: wrap; }
}
@media (max-width: 760px) {
  header { padding: 20px !important; }
  header > a[href="#contact"] { display: none !important; }
  header > a:last-child { height: 44px !important; padding: 0 18px !important; font-size: 14px !important; }
  body > div > section { padding: 64px 24px !important; grid-template-columns: minmax(0,1fr) !important; gap: 32px !important; }
  #top { padding-top: 24px !important; }
  #top > div:first-child { padding-left: 0 !important; }
  h1 { font-size: 48px !important; line-height: 1.06 !important; }
  h2 { font-size: clamp(30px, 9.5vw, 38px) !important; overflow-wrap: anywhere; }
  #top > div > span { font-size: 12px !important; gap: 6px !important; }
  #top p { font-size: 17px !important; }
  #top > div:first-child > div { gap: 12px !important; }
  #top > div:first-child > div > a { height: 54px !important; padding: 0 20px !important; font-size: 14px !important; }
  #top > div:last-child { min-width: 0; transform: scale(.85); transform-origin: center; margin: -20px -20px; }
  body > div > section > div[style*="grid-column"] { grid-column: auto !important; }
  body > div > section > div[style*="grid-template-columns"] { grid-template-columns: minmax(0,1fr) !important; }
  #contact > div:last-child { padding: 24px !important; }
  #faq details { padding: 20px !important; }
  #faq summary { font-size: 16px !important; }
  footer { padding: 48px 24px !important; }
  footer > div:first-child { flex-direction: column !important; gap: 28px !important; }
  footer nav { flex-wrap: wrap; gap: 20px !important; }
  #principes > div { grid-template-columns: minmax(0,1fr) !important; }
  body > div > section[style*="margin: 0 40px"] { margin: 0 16px !important; }
  #boucle > div:first-child { flex-direction: column !important; align-items: flex-start !important; gap: 24px !important; }
  #beta > div > div[style*="grid-template-columns"] { grid-column: auto !important; grid-template-columns: minmax(0,1fr) !important; }
  #beta > div > div[style*="grid-template-columns"] > div:last-child { padding: 28px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation: none !important; }
}
