/* MARUSYA wishlist: thin bookmark instead of the Tilda heart (ST110 block, .t1002__addBtn). Same shape as the bookmark in the header. */
a.t1002__addBtn.t1002__addBtn,
a.t1002__addBtn.t1002__addBtn_active {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  background-color: transparent !important;
  border-width: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
a.t1002__addBtn.t1002__addBtn svg { display: none !important; }
a.t1002__addBtn.t1002__addBtn::before {
  content: "";
  display: block;
  width: 32px;
  height: 32px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26' fill='none'%3E%3Cpath d='M8.94 6.91H17.06V19.09L13 16.41L8.94 19.09V6.91Z' stroke='%2333211f' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  /* soft milk halo: invisible on light photos, keeps the bookmark readable on dark ones */
  filter: drop-shadow(0 0 1px rgba(252, 249, 246, 1)) drop-shadow(0 0 3px rgba(252, 249, 246, 0.85));
}
a.t1002__addBtn.t1002__addBtn:hover::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26' fill='none'%3E%3Cpath d='M8.94 6.91H17.06V19.09L13 16.41L8.94 19.09V6.91Z' stroke='%237a1f23' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
a.t1002__addBtn.t1002__addBtn_active::before,
a.t1002__addBtn.t1002__addBtn_active:hover::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath d='M8.94 6.91H17.06V19.09L13 16.41L8.94 19.09V6.91Z' fill='%237a1f23' stroke='%237a1f23' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
/* catalog photos: bookmark sits on a milk circle 12px from the corner, so it reads on light and dark photos alike */
.t1002__picture-wrapper a.t1002__addBtn.t1002__addBtn,
.t1002__picture-wrapper a.t1002__addBtn.t1002__addBtn_active {
  top: 12px !important;
  right: 12px !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  background-color: rgba(252, 249, 246, 0.92) !important;
  box-shadow: 0 1px 6px rgba(51, 33, 31, 0.14) !important;
}
.t1002__picture-wrapper a.t1002__addBtn.t1002__addBtn::before {
  width: 28px;
  height: 28px;
  filter: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26' fill='none'%3E%3Cpath d='M8.94 6.91H17.06V19.09L13 16.41L8.94 19.09V6.91Z' stroke='%2333211f' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.t1002__picture-wrapper a.t1002__addBtn.t1002__addBtn:hover::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26' fill='none'%3E%3Cpath d='M8.94 6.91H17.06V19.09L13 16.41L8.94 19.09V6.91Z' stroke='%237a1f23' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.t1002__picture-wrapper a.t1002__addBtn.t1002__addBtn_active::before,
.t1002__picture-wrapper a.t1002__addBtn.t1002__addBtn_active:hover::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath d='M8.94 6.91H17.06V19.09L13 16.41L8.94 19.09V6.91Z' fill='%237a1f23' stroke='%237a1f23' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
/* catalog photos: bookmark appears on hover; a saved piece keeps it visible */
.t1002__picture-wrapper a.t1002__addBtn.t1002__addBtn {
  opacity: 0;
  transition: opacity 0.2s ease;
}
.t1002__picture-wrapper:hover a.t1002__addBtn.t1002__addBtn,
.t1002__picture-wrapper a.t1002__addBtn.t1002__addBtn_active,
.t1002__picture-wrapper a.t1002__addBtn.t1002__addBtn:focus-visible {
  opacity: 1;
}
/* touch screens have no hover: show the bookmark right away */
@media (hover: none) {
  .t1002__picture-wrapper a.t1002__addBtn.t1002__addBtn { opacity: 1; }
}

/* Client care pop-ups (T390 on the Footer page): brand link colour instead of the Tilda default */
.t390 .t-descr a,
.t390 .t-descr a:visited {
  color: #7a1f23 !important;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.2s ease;
}
.t390 .t-descr a:hover { color: #33211f !important; }

/* Product colour option: the name is always visible next to a small swatch (Tilda shows it only as a hover tooltip).
   The colour button matches the Size buttons: 34px high, 1px border, darker border when selected.
   No hover effect (12.11.2026): hovering changes neither the border nor the name. Tilda's tilda-catalog css turns the
   name into a white tooltip on hover with color #fff !important and a .js-product selector, so the name rule below
   repeats classes to outweigh it - otherwise the name turns white on white and seems to vanish. */
.t-product__option-variants_custom.t-product__option-variants_buttons.t-product__option-variants_image,
.t-product__option-variants_custom.t-product__option-variants_buttons.t-product__option-variants_color { margin: 0 !important; }
.t-product__option-variants_buttons label.t-product__option-item_image,
.t-product__option-variants_buttons label.t-product__option-item_color {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px;
  min-height: 30px;
  padding: 8px 12px 8px 9px !important;
  margin: 0 7px 7px 0 !important;
  border: 1px solid #dddddd;
  background-color: #ffffff;
  cursor: pointer;
  transition: border-color 0.2s ease;
}
.t-product__option-variants_buttons label.t-product__option-item_image.t-product__option-item_active,
.t-product__option-variants_buttons label.t-product__option-item_color.t-product__option-item_active {
  border-color: rgba(51, 33, 31, 0.5);
}
.t-product__option-variants_buttons .t-product__option-checkmark_image,
.t-product__option-variants_buttons .t-product__option-checkmark_color {
  width: 16px !important;
  height: 16px !important;
  flex-shrink: 0;
  border: 1px solid rgba(51, 33, 31, 0.25) !important;
  border-radius: 0 !important;
}
.t-product__option-variants_buttons .t-product__option-input + .t-product__option-checkmark_image::before,
.t-product__option-variants_buttons .t-product__option-input + .t-product__option-checkmark_color::before { display: none !important; }
.t-product__option-variants_buttons .t-product__option-title_image,
.t-product__option-variants_buttons .t-product__option-title_color,
.js-product .t-product__option-variants_buttons .t-product__option-item.t-product__option-item:hover .t-product__option-title.t-product__option-title_image,
.js-product .t-product__option-variants_buttons .t-product__option-item.t-product__option-item:hover .t-product__option-title.t-product__option-title_color,
.t-product__option-variants_buttons .t-product__option-item.t-product__option-item:hover .t-product__option-title.t-product__option-title_image,
.t-product__option-variants_buttons .t-product__option-item.t-product__option-item:hover .t-product__option-title.t-product__option-title_color {
  display: block !important;
  position: static !important;
  transform: none !important;
  bottom: auto !important;
  padding: 0 !important;
  background: none !important;
  border-radius: 0 !important;
  color: #33211f !important;
  font-family: 'Manrope', Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  white-space: nowrap;
}
.t-product__option-variants_buttons .t-product__option-title_image::after,
.t-product__option-variants_buttons .t-product__option-title_color::after,
.js-product .t-product__option-variants_buttons .t-product__option-item.t-product__option-item:hover .t-product__option-title::after { display: none !important; }
/* swatch fill = HEX of the store Color option (variant photos are not linked, so Tilda leaves the square empty).
   A linked variant photo would cover this fill. New colour in the store -> add a line here. */
.t-product__option-input[value="beige"] + .t-product__option-checkmark { background-color: #ffd6b0; }
.t-product__option-input[value="black"] + .t-product__option-checkmark { background-color: #000000; }
.t-product__option-input[value="burgundy"] + .t-product__option-checkmark { background-color: #8a0f2c; }
.t-product__option-input[value="buttercream"] + .t-product__option-checkmark { background-color: #fdfff5; }
.t-product__option-input[value^="charcoal"] + .t-product__option-checkmark { background-color: #aba9ab; }
.t-product__option-input[value="chocolate"] + .t-product__option-checkmark { background-color: #94643d; }
.t-product__option-input[value="cream"] + .t-product__option-checkmark { background-color: #faf9e6; }
.t-product__option-input[value^="cream &"] + .t-product__option-checkmark { background-color: #f5f0b1; }
.t-product__option-input[value="red"] + .t-product__option-checkmark { background-color: #f2304d; }
.t-product__option-input[value^="white"] + .t-product__option-checkmark { background-color: #ffffff; }

/* MARUSYA client care pop-ups (12.11.2026, same as the RU site): T390 #care #contact and T868 #size on the Footer page.
   Card colour #fcf9f6, radius 20 (mobile 16), veil #decdc6 50%, Prata / Lora are set in the blocks; here: frosted veil, soft shadow, close button inside the card. Link colour - see the rule above. */
.t390 .t-popup,
.t868 .t-popup {
  -webkit-backdrop-filter: blur(16px) saturate(105%);
  backdrop-filter: blur(16px) saturate(105%);
}
.t390 .t-popup__container,
.t868 .t-popup__container {
  border: 1px solid rgba(122, 31, 35, 0.08);
  box-shadow: 0 30px 80px -24px rgba(51, 33, 31, 0.3), 0 2px 10px rgba(51, 33, 31, 0.05);
}
.t390 .t390__wrapper {
  padding: 48px !important;
}
.t390 .t390__descr strong,
.t390 .t390__descr b {
  font-weight: 600;
}
/* close, fallback: round milk button in the screen corner (used only if the head script has not moved it into the card) */
.t390 .t-popup__close,
.t868 .t-popup__close {
  top: 20px !important;
  right: 20px !important;
  width: 44px !important;
  height: 44px !important;
}
.t390 .t-popup__close-wrapper,
.t868 .t-popup__close-wrapper {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 44px !important;
  height: 44px !important;
  padding: 0 !important;
  border-radius: 50%;
  background-color: rgba(252, 249, 246, 0.92) !important;
  box-shadow: 0 2px 10px rgba(51, 33, 31, 0.12);
}
.t390 .t-popup__close-icon,
.t868 .t-popup__close-icon {
  width: 15px !important;
  height: 15px !important;
}
.t390 .t-popup__close-icon g,
.t868 .t-popup__close-icon g {
  transition: fill 0.2s ease;
}
.t390 .t-popup__close-wrapper:hover .t-popup__close-icon g,
.t868 .t-popup__close-wrapper:hover .t-popup__close-icon g {
  fill: #7a1f23 !important;
}
/* close inside the card (moved there by the script in the project head code): top right, sticky so it stays in view on long pop-ups */
.t390 .t-popup__container,
.t868 .t-popup__container {
  overflow: visible !important;
}
.t390 .t-popup__container > .t-popup__close,
.t868 .t-popup__container > .t-popup__close {
  position: sticky !important;
  top: 16px !important;
  left: auto !important;
  right: auto !important;
  display: block;
  width: 40px !important;
  height: 40px !important;
  margin: 16px 16px -56px auto;
  z-index: 3;
}
.t390 .t-popup__container > .t-popup__close .t-popup__close-wrapper,
.t868 .t-popup__container > .t-popup__close .t-popup__close-wrapper {
  width: 40px !important;
  height: 40px !important;
  background-color: #fcf9f6 !important;
  border: 1px solid rgba(51, 33, 31, 0.14);
  box-shadow: none !important;
  transition: border-color 0.2s ease;
}
.t390 .t-popup__container > .t-popup__close .t-popup__close-wrapper:hover,
.t868 .t-popup__container > .t-popup__close .t-popup__close-wrapper:hover {
  border-color: rgba(122, 31, 35, 0.5);
}
.t390 .t-popup__container > .t-popup__close .t-popup__close-icon,
.t868 .t-popup__container > .t-popup__close .t-popup__close-icon {
  width: 13px !important;
  height: 13px !important;
}
/* keep long titles clear of the close button */
.t390 .t390__title,
.mrs-size__title {
  padding-right: 40px;
}
@media screen and (max-width: 640px) {
  .t390 .t390__wrapper {
    padding: 32px 24px 28px !important;
  }
  .t390 .t-popup__close,
  .t868 .t-popup__close {
    top: 12px !important;
    right: 12px !important;
  }
  .t390 .t-popup__container > .t-popup__close,
  .t868 .t-popup__container > .t-popup__close {
    top: 12px !important;
    margin: 12px 12px -52px auto;
  }
}

/* MARUSYA press pop-up #press (12.11.2026): T1093 5763150903 + Zero 5763151303 on the Footer page, same look as the client care pop-ups.
   Veil #decdc6 50% is in the T1093 settings; card radius 20 (mobile 16), border, shadow and the round close (40px circle in the card corner) are in the Zero block.
   Here: frosted veil and the close hover (border turns burgundy, as on the client care pop-ups). */
#rec5763150903 .t-popup {
  -webkit-backdrop-filter: blur(16px) saturate(105%);
  backdrop-filter: blur(16px) saturate(105%);
}
#rec5763151303 .tn-elem[data-elem-id="1794507152911000005"] circle {
  transition: stroke 0.2s ease, stroke-opacity 0.2s ease;
}
#rec5763151303 .tn-elem[data-elem-id="1794507152911000005"]:hover circle {
  stroke: #7a1f23;
  stroke-opacity: 0.5;
}

/* MARUSYA sticky header (12.11.2026): the shared header (Header page 381955403, Zero 5752667103) follows the page.
   At the very top it looks as before (solid milk #fcf9f6). Once the page is scrolled, the head script adds html.mrs-header-scrolled:
   the bar turns frosted milk (86% + blur 14px) with a hairline and a soft shadow, fading in over 0.4s.
   Pop-ups of the Header page (menu, region, press, submenus) live inside #t-header and open above the bar;
   page pop-ups, cart and wishlist have a higher z-index than 990 and open above it too.
   Anchor links scroll to header height (79px; phones 64px): Tilda block T270 "anchor links" offset, where the page has one. */
#t-header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 990;
}
#rec5752667103 .t396__artboard {
  transition: background-color 0.4s ease, box-shadow 0.4s ease;
}
html.mrs-header-scrolled #rec5752667103 .t396__artboard {
  background-color: rgba(252, 249, 246, 0.86) !important;
  -webkit-backdrop-filter: blur(14px) saturate(110%);
  backdrop-filter: blur(14px) saturate(110%);
  box-shadow: 0 1px 0 rgba(122, 31, 35, 0.09), 0 12px 28px -20px rgba(51, 33, 31, 0.28);
}
@media (prefers-reduced-motion: reduce) {
  #rec5752667103 .t396__artboard { transition: none; }
}

/* MARUSYA footer Instagram links (12.11.2026): in the Contact column of the footer (Zero 5752668903) each handle is a Zero group with a link -
   a small Instagram icon + the handle, no underline, opens in a new tab. On hover the icon and the handle turn burgundy together. */
a.tn-group[data-group-id="1794512000000000001"],
a.tn-group[data-group-id="1794512000000000002"] {
  text-decoration: none !important;
}
a.tn-group[data-group-id="1794512000000000001"] .tn-atom,
a.tn-group[data-group-id="1794512000000000002"] .tn-atom {
  transition: color 0.2s ease-in-out;
}
a.tn-group[data-group-id="1794512000000000001"] svg *,
a.tn-group[data-group-id="1794512000000000002"] svg * {
  transition: stroke 0.2s ease-in-out, fill 0.2s ease-in-out;
}
a.tn-group[data-group-id="1794512000000000001"]:hover .tn-atom,
a.tn-group[data-group-id="1794512000000000002"]:hover .tn-atom {
  color: #7a1f23 !important;
}
a.tn-group[data-group-id="1794512000000000001"]:hover svg [stroke],
a.tn-group[data-group-id="1794512000000000002"]:hover svg [stroke] {
  stroke: #7a1f23;
}
a.tn-group[data-group-id="1794512000000000001"]:hover svg circle:not([stroke]),
a.tn-group[data-group-id="1794512000000000002"]:hover svg circle:not([stroke]) {
  fill: #7a1f23;
}
