/* holidays.you-must-have.com — gift-wrap overlay.
   Ribbon frames the page with a big bow at top center; the RIGHT side is
   ripped open: the ribbon is torn into two jagged pieces with a gap, and the
   bottom piece hangs loose. Content is pushed down so the bow never covers
   the header. Decorative only: pointer-events none, hidden in print. */

body{ padding-top:148px; padding-bottom:28px; }

.holiday-wrap{ pointer-events:none; }

.hw-ribbon-top, .hw-ribbon-bottom{
  position:fixed; left:0; right:0; height:20px; z-index:60;
  background:linear-gradient(180deg, #a50e24 0%, #d81f30 28%, #f0545f 50%, #d81f30 72%, #a50e24 100%);
  box-shadow:0 0 10px rgba(130,10,25,.35);
}
.hw-ribbon-top{ top:0; }
.hw-ribbon-bottom{ bottom:0; }

.hw-ribbon-left{
  position:fixed; left:0; top:0; bottom:0; width:20px; z-index:59;
  background:linear-gradient(90deg, #a50e24 0%, #d81f30 28%, #f0545f 50%, #d81f30 72%, #a50e24 100%);
  box-shadow:0 0 10px rgba(130,10,25,.35);
}

/* Right side: ripped open. Two jagged ribbon remnants with a bare gap. */
.hw-rip-top{
  position:fixed; right:0; top:0; width:24px; height:26vh; z-index:59;
  background:linear-gradient(90deg, #a50e24 0%, #d81f30 28%, #f0545f 50%, #d81f30 72%, #a50e24 100%);
  clip-path:polygon(0 0, 100% 0, 100% 94%, 62% 100%, 38% 86%, 12% 96%, 0 88%);
  filter:drop-shadow(-2px 3px 4px rgba(130,10,25,.3));
}
.hw-rip-bottom{
  position:fixed; right:-3px; bottom:0; width:26px; height:44vh; z-index:59;
  background:linear-gradient(90deg, #a50e24 0%, #d81f30 28%, #f0545f 50%, #d81f30 72%, #a50e24 100%);
  clip-path:polygon(0 12%, 28% 2%, 52% 14%, 74% 0, 100% 8%, 100% 100%, 0 100%);
  transform:rotate(3deg);
  transform-origin:bottom right;
  filter:drop-shadow(-2px -3px 4px rgba(130,10,25,.3));
}

/* Short vertical ribbon drop behind the bow, tying it into the top band */
.hw-knotdrop{
  position:fixed; top:0; left:50%; transform:translateX(-50%);
  width:56px; height:96px; z-index:58;
  background:linear-gradient(90deg, #a50e24 0%, #d81f30 30%, #f0545f 50%, #d81f30 70%, #a50e24 100%);
  clip-path:polygon(0 0, 100% 0, 100% 78%, 50% 100%, 0 78%);
}

.hw-bow{
  position:fixed; top:-10px; left:50%; transform:translateX(-50%);
  width:min(240px, 52vw); height:auto; z-index:61;
  filter:drop-shadow(0 6px 14px rgba(0,0,0,.35));
}

@media (max-width:640px){
  body{ padding-top:92px; padding-bottom:16px; }
  .hw-ribbon-top, .hw-ribbon-bottom{ height:11px; }
  .hw-ribbon-left{ width:11px; }
  .hw-rip-top{ width:14px; }
  .hw-rip-bottom{ width:15px; right:-2px; }
  .hw-knotdrop{ width:38px; height:62px; }
  .hw-bow{ width:150px; top:-6px; }
}

@media print{ .holiday-wrap{ display:none; } }

/* Peeled-open corner at bottom right: the wrap folds back to reveal a sliver
   of what's inside the gift — small product icons on paper. */
.hw-peel{
  position:fixed; right:0; bottom:0; width:190px; height:190px; z-index:62;
  pointer-events:none;
}
.hw-peel-inside{
  position:absolute; inset:0;
  background:linear-gradient(135deg, #fffdf6, #fdf2d8);
  clip-path:polygon(100% 8%, 100% 100%, 8% 100%);
  box-shadow:inset 3px 3px 8px rgba(120,80,20,.18);
}
.hw-peel-inside span{
  position:absolute; font-size:24px; line-height:1; display:inline-block;
}
.hw-peel-flap{
  position:absolute; inset:0;
  background:linear-gradient(315deg, #f0545f 0%, #c8102e 42%, #8e0c20 100%);
  clip-path:polygon(8% 100%, 100% 8%, 24% 24%);
  filter:drop-shadow(-4px -4px 7px rgba(0,0,0,.3));
}
@media (max-width:640px){
  .hw-peel{ width:122px; height:122px; }
  .hw-peel-inside span{ font-size:16px; }
}