.gift-intro { perspective:1600px; background:transparent; }
.gift-intro[hidden] { display:none !important; }
.gift-lid { position:absolute; inset:-2%; background:radial-gradient(ellipse at 30% 15%,#244c3f 0%,#10372c 45%,#08271e 100%); box-shadow:16px 24px 60px #0009,inset 0 0 0 2px #53644d,inset 0 0 0 10px #09271e,inset 0 0 0 11px #bfa56a35; transform-origin:15% 25%; }
.gift-lid::after { content:"";position:absolute;inset:0;pointer-events:none;opacity:.13;background:repeating-linear-gradient(22deg,transparent 0 3px,#d4c8a022 4px,transparent 5px); }
.gift-lid-edge { position:absolute;inset:20px;border:1px solid #bfaa7540;box-shadow:inset 0 0 28px #0003; }
.gift-brand { position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);text-align:center;color:#cfb57a;white-space:nowrap; }
.gift-emblem { display:block;width:38px;height:38px;margin:0 auto 14px;background:#d8be84;mask:url('./images/atelier-emblem-white-v2.png') center/contain no-repeat;mask-mode:luminance; }
.gift-brand p { font-family:var(--serif);font-size:clamp(26px,3.3vw,48px);letter-spacing:.16em;margin:0 0 10px; }
.gift-brand > span:last-child { font:11px/1.5 var(--sans);letter-spacing:.32em; }
.gift-ribbon { position:absolute;z-index:2;box-shadow:0 6px 12px #0005;will-change:transform; }
.gift-ribbon-top,.gift-ribbon-bottom { width:clamp(38px,5.2vw,74px);height:calc(50% + 38px);left:50%;margin-left:calc(clamp(38px,5.2vw,74px) / -2);background:linear-gradient(90deg,#87642e,#e0c794 10%,#bea064 35%,#f4dfac 67%,#ac8649 92%,#efdbad);border-inline:1px solid #f4dfae; }
.gift-ribbon-top { top:0;transform-origin:center top; }.gift-ribbon-bottom { bottom:0;transform-origin:center bottom; }
.gift-ribbon-left,.gift-ribbon-right { height:clamp(38px,5.2vw,74px);width:calc(50% + 38px);top:50%;margin-top:calc(clamp(38px,5.2vw,74px) / -2);background:linear-gradient(#84602b,#e6cfa0 12%,#b7975d 36%,#f1dcab 68%,#a17e42 91%,#eed7a5);border-block:1px solid #f4dfae; }
.gift-ribbon-left { left:0;transform-origin:left center; }.gift-ribbon-right { right:0;transform-origin:right center; }
.gift-bow { position:absolute;left:50%;top:50%;width:clamp(260px,33vw,460px);aspect-ratio:400/260;transform:translate(-50%,-53%);z-index:4;filter:drop-shadow(0 9px 7px #0006); }
.bow-loop { position:absolute;inset:0;width:100%;height:100%;overflow:visible;transition:transform .95s cubic-bezier(.45,0,.3,1),opacity .7s .15s; }
.bow-loop-left { transform-origin:50% 53%; }.bow-loop-right { transform-origin:50% 53%; }
.bow-knot { position:absolute;left:44%;top:44%;width:13%;height:22%;border-radius:26% 36% 30% 32%;transform:rotate(-8deg);background:linear-gradient(100deg,#806030,#ead4a0 20%,#b49359 48%,#f3dfb0 73%,#ad864d);box-shadow:0 4px 8px #0006,inset 2px 0 2px #fff4;transition:transform .8s,opacity .7s; }
.is-untying .bow-loop-left { transform:translate(-29%,-10%) rotate(-24deg) scaleX(.65);opacity:0; }
.is-untying .bow-loop-right { transform:translate(29%,-10%) rotate(24deg) scaleX(.65);opacity:0; }
.is-untying .bow-knot { transform:rotate(28deg) scale(.35);opacity:0; }
.is-unwrapped .gift-ribbon { transition:transform 1.1s cubic-bezier(.65,0,.22,1); }
.is-unwrapped .gift-ribbon-top { transform:translateY(-103%); }.is-unwrapped .gift-ribbon-bottom { transform:translateY(103%); }
.is-unwrapped .gift-ribbon-left { transform:translateX(-103%); }.is-unwrapped .gift-ribbon-right { transform:translateX(103%); }
.is-opening .gift-lid { animation:gift-lid-open 2s cubic-bezier(.4,0,.16,1) both; }
.is-opening .intro-skip { opacity:0;pointer-events:none; }
@keyframes gift-lid-open { 0%{transform:translate3d(0,0,0) rotateZ(0) rotateY(0)} 25%{transform:translate3d(-2%,-3%,50px) rotateZ(-3deg) rotateY(-5deg)} 100%{transform:translate3d(-118%,-8%,90px) rotateZ(-8deg) rotateY(-8deg)} }
@media(max-width:600px) { .gift-brand { top:40%; } .gift-brand p { font-size:clamp(22px,5.6vw,30px);letter-spacing:.1em; }.gift-bow{width:290px;} }
@media(prefers-reduced-motion:reduce) { .gift-intro { display:none !important; } }
.gift-brand-rule { display:block; height:1px; width:75%; margin:15px auto; background:linear-gradient(90deg,transparent,#cbb079,transparent); }
@media(max-width:600px) { .gift-brand > span:last-child { font-size:8px;letter-spacing:.16em; } }
/* Retracted ribbons cannot return when their parent lid travels across the screen. */
.gift-intro[data-phase="holding"] .gift-ribbon,
.gift-intro[data-phase="holding"] .gift-bow,
.gift-intro.is-opening .gift-ribbon,
.gift-intro.is-opening .gift-bow { visibility:hidden; }






/* Intact top ribbons conceal all four withdrawal-piece joins until they move. */
.gift-ribbon:not(.gift-ribbon-cover) { box-shadow:none; }
.gift-ribbon-cover { z-index:3;box-shadow:0 6px 12px #0005; }
.gift-ribbon-cover-vertical { top:-2%;height:104%;left:50%;width:clamp(38px,5.2vw,74px);margin-left:calc(clamp(38px,5.2vw,74px) / -2);background:linear-gradient(90deg,#87642e,#e0c794 10%,#bea064 35%,#f4dfac 67%,#ac8649 92%,#efdbad);border-inline:1px solid #f4dfae; }
.gift-ribbon-cover-horizontal { left:-2%;width:104%;top:50%;height:clamp(38px,5.2vw,74px);margin-top:calc(clamp(38px,5.2vw,74px) / -2);background:linear-gradient(#84602b,#e6cfa0 12%,#b7975d 36%,#f1dcab 68%,#a17e42 91%,#eed7a5);border-block:1px solid #f4dfae; }
.is-unwrapped .gift-ribbon-cover { visibility:hidden; }