/* Праздничное украшение витрины. Включается атрибутом html[data-season]. */

html[data-season] header.site-header > .brand-logo{
  width:auto!important;
  max-width:min(230px, 62vw);
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
}
html[data-season] header.site-header > .brand-logo > picture img,
html[data-season] header.site-header > .brand-logo > img{
  width:min(148px, 40vw)!important;
  height:auto!important;
  flex:0 1 auto;
}

.season-mark{
  flex:0 0 34px;
  width:34px;
  height:40px;
  display:block;
  pointer-events:none;
}
.season-mark svg,
.season-mark img{
  display:block;
  width:34px;
  height:40px;
}
.season-mark img{
  width:30px;
  height:48px;
  object-fit:contain;
}
.season-mark:has(img){
  flex-basis:30px;
  width:30px;
  height:48px;
}

.season-strip{
  margin:0;
  padding:8px 16px;
  text-align:center;
  font-size:14px;
  line-height:1.4;
  font-weight:650;
  letter-spacing:-0.01em;
  color:#1e293b;
}
html[data-season="valentine"] .season-strip{background:#fff0f3;}
html[data-season="defender"] .season-strip{background:#f4f6f3;}
html[data-season="womens"] .season-strip{background:#fff5f7;}
html[data-season="victory"] .season-strip{background:#f7f5f2;}
html[data-season="grad"] .season-strip{background:#f7f6f2;}
html[data-season="school"] .season-strip{background:#fbf6ea;}
html[data-season="teacher"] .season-strip,
html[data-season="teacher"] .season-banner{background:#f8f6ef;}

a.season-banner{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:52px;
  margin:0;
  padding:6px 16px;
  text-decoration:none;
  color:#1e293b;
  font-size:15px;
  line-height:1.3;
  font-weight:650;
  letter-spacing:-0.01em;
}
a.season-banner img{
  width:36px;
  height:36px;
  border-radius:50%;
  object-fit:cover;
  background:#fff;
  flex:0 0 36px;
}
a.season-banner b{
  font-weight:650;
  color:#e2554a;
}
html[data-season="halloween"] .season-strip{background:#fff1e8;}
html[data-season="newyear"] .season-strip{background:#f3f7fb;}

.season-motion{
  position:fixed;
  left:0;
  right:0;
  top:0;
  height:200px;
  overflow:hidden;
  pointer-events:none;
  z-index:2;
}
.season-flake,
.season-balloon,
.season-leaf,
.season-heart,
.season-star,
.season-confetti{
  position:absolute;
  top:0;
  display:block;
}
.season-flake svg,
.season-leaf svg,
.season-heart svg,
.season-star svg{
  display:block;
  width:100%;
  height:100%;
}
.season-flake{
  width:16px;
  height:16px;
  opacity:.9;
  animation-name:season-snow;
  animation-timing-function:linear;
  animation-iteration-count:infinite;
}
.season-balloon{
  width:14px;
  height:18px;
  border-radius:50% 50% 50% 50%;
  animation:season-drift 11s ease-in 1 forwards;
}
.season-balloon:before{
  content:"";
  position:absolute;
  left:6px;
  bottom:-8px;
  width:1px;
  height:8px;
  background:currentColor;
  opacity:.45;
}
.season-leaf,
.season-heart,
.season-star{
  width:16px;
  height:16px;
  animation:season-leaf 8s ease-in 1 forwards;
}
.season-heart,
.season-star{
  animation-name:season-drift;
}
.season-confetti{
  width:7px;
  height:10px;
  border-radius:1px;
  animation:season-leaf 7s ease-in 1 forwards;
}

html[data-season="school"] .season-mark svg,
html[data-season="teacher"] .season-mark svg{
  transform-origin:50% 12%;
  animation:season-bell 1.15s ease-in-out 1;
}

@keyframes season-snow{
  0%{transform:translate3d(0,-16px,0);opacity:0;}
  12%{opacity:.8;}
  100%{transform:translate3d(16px,168px,0);opacity:0;}
}
@keyframes season-drift{
  0%{transform:translate3d(-40px,18px,0);opacity:0;}
  12%{opacity:.9;}
  100%{transform:translate3d(104vw,8px,0);opacity:0;}
}
@keyframes season-leaf{
  0%{transform:translate3d(0,-12px,0) rotate(0deg);opacity:0;}
  14%{opacity:.9;}
  100%{transform:translate3d(36px,150px,0) rotate(70deg);opacity:0;}
}
@keyframes season-bell{
  0%{transform:rotate(0);}
  18%{transform:rotate(14deg);}
  40%{transform:rotate(-11deg);}
  62%{transform:rotate(7deg);}
  82%{transform:rotate(-3deg);}
  100%{transform:rotate(0);}
}

@media (max-width:1020px){
  .season-motion{display:none!important;}
}
@media (prefers-reduced-motion:reduce){
  .season-motion{display:none!important;}
  html[data-season="school"] .season-mark svg,
  html[data-season="teacher"] .season-mark svg{animation:none!important;}
}