/* ЗИМНИНА — разделът „Мазето“ на началната страница: слизаш от двора в мазето.
   Рисуваните буркани от играта на рафт, крушка, ръкописни етикети на мартенички конци и ленена кърпа с шевица. */
.mz { position: relative; min-height: 100svh; overflow: hidden; display: grid; grid-template-rows: 1fr auto; isolation: isolate; background: #1C1611; color: #F7EEDF; }
.mz-wall { position: absolute; inset: 0; z-index: -2; background: url("../img/tex/plaster.webp") 0 0 / 520px, #2B2119; background-blend-mode: multiply; filter: brightness(.42) sepia(.35); }
.mz-light {
  position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: 0;
  background:
    radial-gradient(ellipse 34% 42% at 50% 8%, rgba(255, 214, 140, .55), transparent 70%),
    radial-gradient(ellipse 70% 55% at 50% 66%, rgba(242, 180, 90, .26), transparent 72%),
    radial-gradient(ellipse 120% 90% at 50% 40%, transparent 40%, rgba(0, 0, 0, .65));
  mix-blend-mode: screen;
}
.mz-bulb { position: absolute; left: 50%; top: 0; z-index: 2; width: 34px; translate: -50% 0; transform-origin: 50% 0; }
.mz-cord { display: block; width: 2px; height: clamp(70px, 14vh, 130px); margin: 0 auto; background: #0E0B08; }
.mz-glass { display: block; width: 34px; height: 44px; margin-top: -2px; border-radius: 50% 50% 46% 46% / 58% 58% 42% 42%; background: radial-gradient(circle at 45% 40%, #5A4A35, #2A2119 70%); box-shadow: inset 0 -6px 0 #15100C; }
.mz.is-lit .mz-glass { background: radial-gradient(circle at 45% 40%, #FFF7DE, #FFD27E 45%, #E89A3A 80%); box-shadow: 0 0 40px 14px rgba(255, 200, 110, .55), 0 0 120px 40px rgba(242, 180, 90, .25); }
.mz-copy { position: relative; z-index: 3; align-self: center; padding: 150px var(--pad) 20px; max-width: 1000px; }
.mz-title { margin: 0; font: 900 clamp(3rem, 1.2rem + 6vw, 8rem)/.9 var(--display); color: #F7EEDF; text-shadow: 0 2px 30px rgba(0, 0, 0, .4); }
.mz-lead { max-width: 52ch; margin: 20px 0 0; font: 400 clamp(1.02rem, .95rem + .3vw, 1.2rem)/1.6 var(--text); color: #DCCFB9; }
.mz-shelf { position: relative; z-index: 2; padding: 0 var(--pad); }
.mz-jars { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); align-items: end; gap: clamp(4px, 1.4vw, 22px); }
.mz-jar { position: relative; display: flex; justify-content: center; }
.mz-jar img { width: 100%; max-width: 220px; height: auto; max-height: 28vh; object-fit: contain; object-position: 50% 100%; filter: drop-shadow(0 18px 18px rgba(0, 0, 0, .55)); }
.mz-jar:nth-child(2n) img { max-height: 23vh; }
.mz-tag { position: absolute; left: 50%; top: 56%; z-index: 2; translate: -50% 0; transform-origin: 50% 0; pointer-events: none; }
.mz-string { position: absolute; left: 50%; top: -18px; width: 2px; height: 22px; background: repeating-linear-gradient(160deg, #fff 0 3px, var(--red) 3px 6px); }
.mz-paper { display: block; padding: 4px 10px 6px; border-radius: 3px 3px 3px 12px; background: #EFE3C8; color: #3A2A1B; font: 700 clamp(.9rem, .6rem + .5vw, 1.2rem)/1 "Caveat", "Segoe Print", cursive; white-space: nowrap; box-shadow: 0 6px 10px -4px rgba(0, 0, 0, .5); }
.mz-plank { height: clamp(20px, 3.4vh, 34px); margin: -6px calc(var(--pad) * -1) 0; background: url("../img/tex/wood.webp") 0 0 / 512px 128px, #5B3A22; box-shadow: inset 0 3px 0 rgba(255, 220, 160, .18), 0 24px 40px rgba(0, 0, 0, .6); filter: brightness(.85); }
.mz-runner {
  position: relative; height: 34px; margin: 0 calc(var(--pad) * -1);
  background: url("../img/shevitsa.svg") repeat-x center 7px / 32px 16px, linear-gradient(#F6F0E2, #E9DFC9);
  -webkit-mask: linear-gradient(#000 0 0) top / 100% calc(100% - 7px) no-repeat, conic-gradient(from -45deg at 50% 100%, #000 90deg, transparent 0) bottom / 14px 7px repeat-x;
          mask: linear-gradient(#000 0 0) top / 100% calc(100% - 7px) no-repeat, conic-gradient(from -45deg at 50% 100%, #000 90deg, transparent 0) bottom / 14px 7px repeat-x;
}
.mz-runner::before { content: ""; position: absolute; left: 0; right: 0; top: 3px; border-top: 1.5px dashed rgba(214, 38, 18, .55); }
.mz-runner::after { content: ""; position: absolute; left: 0; right: 0; bottom: 10px; border-top: 1.5px dashed rgba(0, 150, 110, .6); }
@media (max-width: 900px) {
  .mz-copy { padding-top: 130px; }
  .mz-jars { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .mz-jar:nth-child(n+5) { display: none; }
  .mz-jar img { max-height: 22vh; }
}
/* Без скрипт или при „по-малко движение“ мазето е осветено. */
.mz.is-static .mz-light { opacity: 1; }