/* Christmas foreground hero, snowfall and gently waving snowmen.
   Decoration is pointer-events:none; storefront interactions remain untouched. */
html { scroll-behavior:smooth; }
body { background: radial-gradient(ellipse at 50% 0%, #17334b 0%, transparent 49%), linear-gradient(180deg,#050e21,#10061c 46%,#040b17 100%); }
.site-shell { position:relative; z-index:1; background:transparent; }
.header { background:linear-gradient(180deg,rgba(6,10,22,.96),rgba(5,8,20,.91)); border-bottom:1px solid rgba(160,238,255,.2); }
#categories.categories { background:linear-gradient(180deg,rgba(7,12,28,.65),rgba(8,4,21,.53)); }
.products-section { background:linear-gradient(180deg,rgba(4,9,21,.66),rgba(7,5,17,.86)); }
.holiday-hero { position:relative; isolation:isolate; overflow:hidden; background:radial-gradient(ellipse at 25% 44%,rgba(44,19,104,.62),transparent 58%), radial-gradient(ellipse at 82% 40%,rgba(19,65,87,.60),transparent 60%),linear-gradient(120deg,rgba(5,9,23,.42),rgba(17,6,34,.64)); border-bottom:1px solid rgba(154,240,255,.22); }
.holiday-hero:before { position:absolute;content:"";z-index:0;pointer-events:none;inset:0;opacity:.5;background-image:radial-gradient(1px 1px at 15% 30%,#e2f9ff 98%,transparent),radial-gradient(2px 2px at 80% 20%,#e2f9ff 98%,transparent),radial-gradient(1px 1px at 45% 65%,#f9d7ff 98%,transparent),radial-gradient(2px 2px at 67% 67%,#eafcff 98%,transparent);background-size:240px 210px,370px 290px,310px 270px,420px 310px; }
.holiday-hero:after { position:absolute;content:"";inset:auto 0 0;height:19px;background:linear-gradient(to bottom,transparent,#a5eafe20,#effbff6b);filter:blur(7px);pointer-events:none; }
.holiday-hero-inner { position:relative; z-index:1; max-width:1200px; margin-inline:auto; display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:clamp(15px,2.8vw,40px);padding:30px clamp(18px,4vw,58px) 38px; min-height:460px; }
.holiday-hero-cutout { display:block;justify-self:center;width:min(100%,485px);height:auto;object-fit:contain;filter:drop-shadow(0 18px 26px rgba(0,0,0,.34)) drop-shadow(0 0 20px #f12aff38);animation:hero-float 5.8s ease-in-out infinite; }
.holiday-hero-content { text-align:center;padding:16px 2px; }
.holiday-kicker {font-size:clamp(9px,1.35vw,13px);color:#c9faff;font-weight:900;letter-spacing:2.2px;margin-bottom:15px;}
.holiday-kicker-star {color:#ffee87;}
.holiday-hero-content h1 {font-family:Impact,'Arial Black',Arial,sans-serif;line-height:.95; margin:0; font-style:italic;letter-spacing:1.8px;font-size:clamp(44px,5vw,78px);text-transform:uppercase;}
.holiday-hero-content h1 span, .holiday-hero-content h1 strong, .holiday-hero-content h1 em { display:block;font-style:inherit;font-weight:900; }
.holiday-hero-content h1 span {color:#ff8dda;text-shadow:3px 4px 0 #7b145d,0 0 23px #fc22d75c;-webkit-text-stroke:1px #ffb4e7;}
.holiday-hero-content h1 strong {color:#7deeff;text-shadow:3px 4px 0 #173879,0 0 23px #39eeff6c;-webkit-text-stroke:1px #b1fcff;}
.holiday-hero-content h1 em {color:#b7ff42;text-shadow:3px 4px 0 #246b14,0 0 23px #99fa2480;-webkit-text-stroke:1px #d5ff84;}
.holiday-hero-content p {font-size:clamp(10px,1.4vw,14px);font-weight:800;letter-spacing:1px;line-height:1.8;color:#eff7fa;max-width:460px;margin:22px auto 26px;}
.holiday-hero-content p span {color:#e7c864;margin:0 3px;}
.holiday-shop-button { display:inline-flex;justify-content:center;align-items:center;gap:18px;min-height:52px;min-width:210px;padding:12px 30px;border:2px solid #ff3ada;border-radius:13px;color:white;background:rgba(15,3,25,.90);box-shadow:0 0 15px #ff3cdd, inset 0 0 12px #eb33b147;font-family:Impact,'Arial Narrow',Arial,sans-serif;font-size:23px;letter-spacing:1.3px;transition:transform .15s,box-shadow .15s;}
.holiday-shop-button:hover {transform:translateY(-2px);box-shadow:0 0 22px #ff3cdd;}
.holiday-shop-button:focus-visible {outline:3px solid #fff;outline-offset:5px;}
.holiday-hero-scenery {position:absolute;inset:0;z-index:0;pointer-events:none;}
.holiday-star {position:absolute;color:#c8faff;text-shadow:0 0 18px #bbebff;font-size:28px;animation:holiday-twinkle 4s ease-in-out infinite alternate;}
.holiday-star.star-a{left:3%;top:23%;}.holiday-star.star-b{left:42%;top:7%;font-size:19px;animation-delay:-1s}.holiday-star.star-c{right:7%;top:12%;font-size:27px;animation-delay:-3s}.holiday-star.star-d{right:16%;bottom:13%;font-size:18px;animation-delay:-2s}
.holiday-ambient { position:fixed; inset:0; z-index:5; pointer-events:none; overflow:hidden; contain:layout paint; }
.holiday-snowfall{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.holiday-flake { position:absolute; top:-4vh; left:var(--snow-left); line-height:1; font-size:var(--snow-size); color:#e9f9ff; opacity:var(--snow-opacity); text-shadow:0 0 5px rgba(158,238,255,.46); will-change:transform; animation:holiday-fall var(--snow-duration) linear var(--snow-delay) infinite; }
.holiday-snowman {position:absolute;bottom:clamp(6px,4vh,32px); width:clamp(76px,10vw,135px); height:auto; opacity:.67;filter:drop-shadow(0 3px 12px #b1ebff65);animation:snowman-sway 5s ease-in-out infinite alternate;transform-origin:center bottom;}
.holiday-snowman svg {width:100%;height:auto;display:block;}
.holiday-snowman-left {left:-19px;}
.holiday-snowman-right {right:-19px;animation-delay:-2.4s;}
.holiday-snowman-right svg {transform:scaleX(-1);}
.snowman-moving {transform-origin:76px 152px;animation:snowman-bob 3.5s ease-in-out infinite alternate;}
.snowman-arm-right{transform-origin:103px 110px;animation:snowman-wave 2.8s ease-in-out infinite alternate;}
.snowman-arm-left{transform-origin:48px 107px;animation:snowman-wave-left 3.3s ease-in-out infinite alternate;}
@keyframes holiday-fall {from{transform:translate3d(0,-12vh,0) rotate(0deg)}to{transform:translate3d(var(--snow-drift),112vh,0) rotate(280deg)}}
@keyframes hero-float {0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes holiday-twinkle {from{opacity:.34;transform:scale(.78)}to{opacity:1;transform:scale(1.06)}}
@keyframes snowman-sway {from{transform:rotate(-3deg)}to{transform:rotate(3deg)}}
@keyframes snowman-bob {from{transform:translateY(0)}to{transform:translateY(-5px)}}
@keyframes snowman-wave {from{transform:rotate(9deg)}to{transform:rotate(-15deg)}}
@keyframes snowman-wave-left {from{transform:rotate(-9deg)}to{transform:rotate(10deg)}}
@media(max-width:740px){
 .holiday-hero-inner {min-height:0;grid-template-columns:1fr;padding:20px 15px 30px;gap:2px;}
 .holiday-hero-cutout{width:min(64vw,280px);max-height:340px;}
 .holiday-hero-content{padding:0 0 7px;}
 .holiday-kicker{font-size:10px;letter-spacing:1.4px;margin:0 0 10px;}
 .holiday-hero-content h1{font-size:clamp(44px,11vw,66px);}
 .holiday-hero-content p{font-size:10px;line-height:1.55;margin:15px auto 20px;max-width:350px;}
 .holiday-shop-button{min-width:184px;min-height:47px;font-size:20px;}
 .holiday-snowman{width:clamp(63px,18vw,100px);opacity:.47;bottom:10vh;}
 .holiday-snowman-left{left:-26px}.holiday-snowman-right{right:-26px}
}
@media(max-width:400px){.holiday-hero-cutout{width:min(65vw,260px)}.holiday-hero-content h1{font-size:clamp(39px,10.7vw,48px)}.holiday-hero-inner{padding-bottom:28px}}
@media(prefers-reduced-motion:reduce){.holiday-flake{animation:none!important;display:none!important}.holiday-snowman,.snowman-moving,.snowman-arm-right,.snowman-arm-left,.holiday-star,.holiday-hero-cutout{animation:none!important}}


/* CHRISTMAS V2: perfectly mirrored, repeating fixed snowmen and denser snow.
   Each snowman is anchored to a viewport cell. Only limbs/body sway; neither
   the cell nor the pattern scrolls with the page. */
.holiday-ambient {display:none!important;}
.holiday-snowman-wallpaper {
  position:fixed;inset:0;z-index:0;overflow:hidden;
  pointer-events:none;user-select:none;contain:layout paint;
  background-image:
    radial-gradient(circle at 16% 13%,rgba(181,235,255,.045) 0 1px,transparent 2px),
    radial-gradient(circle at 82% 68%,rgba(240,254,255,.05) 0 1px,transparent 2px);
  background-size:150px 135px, 190px 162px;
}
.holiday-pattern-cell {
  position:absolute;left:var(--snowman-x);top:var(--snowman-y);
  transform:translate(-50%,-50%);width:clamp(62px,8vw,104px);
  aspect-ratio:150/207;pointer-events:none;
}
.holiday-pattern-cell .holiday-snowman {
  display:block;position:relative;left:auto;right:auto;bottom:auto;
  width:100%;height:auto;opacity:.44;
  filter:drop-shadow(0 0 8px rgba(145,231,255,.24));
  animation:snowman-sway 5.8s ease-in-out var(--snowman-delay) infinite alternate;
  transform-origin:center 85%;
}
.holiday-pattern-cell .holiday-snowman svg {display:block;width:100%;height:auto}
.holiday-pattern-cell.mirror .holiday-snowman svg{transform:scaleX(-1)}
.holiday-pattern-cell.inner-column .holiday-snowman {opacity:.27;}
.holiday-snow-overlay{position:fixed;inset:0;z-index:7;pointer-events:none;overflow:hidden;contain:layout paint;}
.holiday-snow-overlay .holiday-snowfall{position:absolute;inset:0;pointer-events:none;}
.holiday-snow-overlay .holiday-flake{
  color:#eafaff;filter:none;
  text-shadow:0 0 4px rgba(154,235,255,.55);
  opacity:var(--snow-opacity);
  will-change:transform;
}
/* Open spaces around the wallpaper: solid blocks would conceal the fixed design. */
.site-shell{position:relative;z-index:1;background:transparent}
#categories.categories {background:linear-gradient(180deg,rgba(5,8,20,.71),rgba(8,4,20,.68))}
.products-section {background:linear-gradient(180deg,rgba(3,7,18,.74),rgba(5,5,17,.79))}
@media(max-width:740px){
  .holiday-pattern-cell{width:clamp(46px,11.5vw,65px)}
  .holiday-pattern-cell .holiday-snowman{opacity:.46}
  .holiday-pattern-cell.inner-column .holiday-snowman{opacity:.24}
  .holiday-snow-overlay .holiday-flake{text-shadow:0 0 3px rgba(154,235,255,.40)}
}
@media(prefers-reduced-motion:reduce){
  .holiday-pattern-cell .holiday-snowman,
  .holiday-pattern-cell .snowman-moving,
  .holiday-pattern-cell .snowman-arm-left,
  .holiday-pattern-cell .snowman-arm-right {animation:none!important}
  .holiday-snow-overlay .holiday-flake{animation:none!important;display:none!important}
}