/* Sticky navbar — appears on scroll, brown #4A3731 */
.navbar {
  position: fixed; top: 0; left: 0; width: 100%; height: 88px;
  background: #4A3731; z-index: 1000;
  display: flex; justify-content: center;
  transform: translateY(-100%); transition: transform .35s ease;
  box-shadow: 0 6px 24px rgba(0,0,0,.18);
}
.navbar.show { transform: none; }
.navbar__inner {
  width: 1920px; height: 100%;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 64px;
}
.navbar__logo { width: 130px; height: auto; display: block; } /* ~130×56 */
.navbar__links { display: flex; gap: 42px; }
.navbar__links a {
  color: #fff; font-family: "Golos Text", sans-serif; font-size: 22px;
  text-decoration: none; letter-spacing: .01em; transition: opacity .2s;
}
.navbar__links a:hover { opacity: .7; }

/* FAQ accordion — right column over the brown section */
.faq { position: absolute; left: 943px; top: 11131px; width: 597px; }
.faq__item { border-top: 1.5px solid #fff; }
.faq__q {
  width: 100%; background: none; border: 0; cursor: pointer;
  color: #fff; font-family: "Golos Text", sans-serif; font-size: 32px;
  line-height: 38px; font-weight: 400; text-align: left;
  padding: 20px 64px 20px 0; position: relative; display: block;
}
.faq__chev {
  position: absolute; right: 8px; top: 30px; width: 17px; height: 17px;
  border-right: 2.5px solid #fff; border-bottom: 2.5px solid #fff;
  transform: rotate(45deg); transition: transform .3s ease;
}
.faq__item.open .faq__chev { transform: rotate(-135deg); top: 38px; }
.faq__a { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.faq__a p {
  margin: 0; max-width: 424px; color: #fff;
  font-family: "Golos Text", sans-serif; font-size: 20px; line-height: 24px;
  padding: 0 0 24px 0;
}
.faq__item.open .faq__a { max-height: 320px; }

/* Recipe carousel */
.rec-slide { display: none; }
.rec-slide.active { display: block; }
.rec-photo { position: absolute; left: 480px; top: 3923px; width: 500px; height: 501px; object-fit: cover; }
.rec-title {
  position: absolute; left: 1040px; top: 3915px; width: 400px;
  font-family: "Golos Text", sans-serif; font-size: 32px; line-height: 38.4px;
  font-weight: 400; color: #4A3731; white-space: pre-wrap;
}
.rec-title.upper { text-transform: uppercase; }
.rec-desc {
  position: absolute; left: 1040px; top: 4088px;
  font-family: "Golos Text", sans-serif; font-size: 20px; line-height: 24px;
  font-weight: 400; color: #4A3731; white-space: pre-wrap;
}
/* Carousel arrows (CSS chevrons matching Figma stroke #4A3731, 3px) */
.car-arrow {
  position: absolute; top: 4157px; width: 18px; height: 46px;
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  transition: opacity .2s;
}
.car-arrow:hover { opacity: .55; }
.car-arrow.left { left: 380px; }
.car-arrow.right { left: 1522px; }
.car-arrow i {
  display: block; width: 16px; height: 16px;
  border-top: 3px solid #4A3731; border-right: 3px solid #4A3731;
}
.car-arrow.left i { transform: rotate(-135deg); margin-left: 4px; }
.car-arrow.right i { transform: rotate(45deg); margin-right: 4px; }

/* Fit-to-width safety + scroll anchors offset under sticky navbar */
html, body { overflow-x: hidden; }
.z97, .z8, .z9, .z53 { scroll-margin-top: 120px; }

/* ─── Адаптив плавающего меню (navbar) ─── */
@media (max-width: 1024px) {
  .navbar { height: 56px; }
  .navbar__inner { width: 100%; padding: 0 18px; }
  .navbar__logo { width: 92px; }
  .navbar__links { gap: 20px; }
  .navbar__links a { font-size: 15px; }
}
@media (max-width: 560px) {
  .navbar { height: 46px; }
  .navbar__inner { padding: 0 10px; }
  .navbar__logo { width: 56px; }
  .navbar__links { display: flex; gap: 9px; }
  .navbar__links a { font-size: 11px; letter-spacing: 0; }
}
@media (max-width: 380px) {
  .navbar__logo { width: 50px; }
  .navbar__links { gap: 7px; }
  .navbar__links a { font-size: 10px; }
}
