/* Reusable animated "shine" button style.
   Apply class="tn-shine-btn" to any link/button element. */
.tn-shine-btn {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  background-color: #D9F2DB;
  color: #1E1E1E;
  border-radius: 999px;
  font-weight: 600;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.10);
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.tn-shine-btn .tn-molecule,
.tn-shine-btn .t396__group {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.tn-shine-btn * {
  position: static !important;
  left: auto !important;
  top: auto !important;
}

.tn-shine-btn:hover {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
  transform: translateY(-2px);
}

.tn-shine-btn::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 45%;
  height: 100%;
  background: linear-gradient(120deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.85) 50%, rgba(255, 255, 255, 0) 100%);
  transform: skewX(-20deg);
  animation: tn-shine-sweep 2.6s ease-in-out infinite;
  pointer-events: none;
}

@keyframes tn-shine-sweep {
  0% { left: -75%; }
  55% { left: 130%; }
  100% { left: 130%; }
}

/* Active/current-page menu item: Tilda applies an inline background
   (red) and text color (green) to the current nav button, but a more
   specific per-element rule on the text span was overriding the text
   color back to dark. This restores the intended green text color on
   whichever menu item is currently active, on every page. */
.tn-atom__button-content[style*="rgb(217, 242, 219)"] .tn-atom__button-text {
  color: rgb(217, 242, 219) !important;
}


/* Footer legal links (Политика обработки персональных данных / Публичная
   оферта): on narrow (mobile) screens these two links were forced into a
   single unwrapped row (width: min-content) wider than the viewport,
   causing them to be cut off. Stack them vertically on mobile so both
   remain fully visible. */
@media (max-width: 640px) {
  .tn-group__2356055271175758663084370170 {
    position: static !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    gap: 8px;
  }
  .tn-group__2356055271175758663084370170 .tn-molecule,
  .tn-group__2356055271175758663084370170 .t396__elem {
    position: static !important;
    left: auto !important;
    top: auto !important;
    width: auto !important;
    max-width: 100% !important;
  }
  .tn-group__2356055271175758663084370170 a {
    white-space: normal !important;
    text-align: center;
  }
}


/* Stronger override: force the two footer legal links (and their nested
   Tilda wrapper divs) to behave as a simple centered vertical stack on
   mobile, regardless of any inherited absolute widths/positions. */
@media (max-width: 640px) {
  .tn-group__2356055271175758663084370170 .tn-molecule {
    position: static !important;
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    justify-content: center !important;
    align-items: center !important;
  }
  .tn-elem__2356055271175758659977917140,
  .tn-elem__2356055271175758661483888460 {
    position: static !important;
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    text-align: center !important;
  }
  .tn-elem__2356055271175758659977917140 .tn-atom,
  .tn-elem__2356055271175758661483888460 .tn-atom {
    position: static !important;
    display: inline-block !important;
    width: auto !important;
    max-width: 100% !important;
  }
}


/* Correction: the actual flex ROW holding both links is the inner
   .tn-molecule that directly wraps both link elements. Force it to
   stack vertically too. */
@media (max-width: 640px) {
  .tn-group__2356055271175758663084370170 .tn-molecule {
    flex-direction: column !important;
    row-gap: 8px;
  }
}


/* ===== TABLET FIXES (main page "about us" section + footer) ===== */


/* Footer: the "Tres Belle" logo image and the legal links
   (Политика обработки персональных данных / Публичная оферта) sit in the
   same row. The links' container has a fixed width that is too narrow for
   their text, so the text overflows past its own box and visually collides
   with the logo image, at widths roughly 640-1290px (tablets and small
   laptops). Let the links size to fit their real content instead. */
@media (min-width: 640px) and (max-width: 1299px) {
  .tn-group__2356055271175758663084370170,
  .tn-group__2356055271175758663084370170 .tn-molecule {
    width: auto !important;
    max-width: none !important;
    flex-shrink: 0 !important;
  }
  .tn-elem__2356055271175758661483888460,
  .tn-elem__2356055271175758659977917140 {
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
  }
}




/* Footer row (copyright + logo + legal links) can still overflow the
   viewport horizontally at narrower tablet widths even after the links
   got their natural width back. Allow the row to wrap onto multiple
   centered lines instead of overflowing off-screen. */
@media (min-width: 640px) and (max-width: 1299px) {
  #molecule-1764077153871000006 {
    flex-wrap: wrap !important;
    row-gap: 12px !important;
    justify-content: center !important;
  }
  #molecule-1764077153871000006 > * {
    position: static !important;
    left: auto !important;
    top: auto !important;
  }
}

/* ===== TABLET (rec2354092031): hide "about us / bakery" block on all tablets 640-1199px ===== */
@media (min-width: 640px) and (max-width: 1199px) {
      #rec2354092031 { display: none !important; }
      }

/* Footer logo: round corners like header logo (30px) */
#rec2356055271 .tn-elem__23560552711780692918239000001 .tn-atom, #rec2356055271 .tn-elem__23560552711780692918239000001 .tn-atom__img { border-radius: 30px !important; overflow: hidden !important; }