.armita-intro .intro-layout{grid-template-columns:.65fr 1.35fr;gap:7%;max-width:1220px;align-items:center}
.letter-flight{--carrier-size:180px;position:relative;isolation:isolate;min-width:0;margin:110px 24px 30px;perspective:1000px}
.letter-cargo{position:relative;transform-origin:50% 35px;perspective:1000px}
.armita-intro .fairy-letter{position:relative;padding:60px clamp(30px,4.5vw,65px) 55px;background:url('assets/burnt-letter.webp') 0% 55.556%/164.103% 111.79% no-repeat;border:0;border-radius:0;box-shadow:none;filter:drop-shadow(0 12px 13px #54422c1c);transform-origin:50% 0}
.fairy-letter:after{display:none}
.armita-intro .fairy-letter h2{font-size:clamp(40px,4.4vw,64px);margin:14px 0 24px}
.armita-intro .fairy-letter>p{font-size:16px;line-height:1.85;max-width:none;margin:20px 0;color:#36432f}
.armita-intro .fairy-letter .photography-heading{font-size:14px;letter-spacing:1px}
.letter-roll{position:absolute;z-index:4;top:0;left:2%;width:96%;height:clamp(58px,8vw,100px);background:url('assets/burnt-letter.webp') 100% 51.35%/256.856% 417.96% no-repeat;filter:drop-shadow(0 12px 10px #3a241b28);opacity:0;pointer-events:none;transform-origin:50% 0}
.letter-carrier{position:absolute;top:-40px;width:var(--carrier-size);aspect-ratio:840/1024;z-index:5;pointer-events:none;filter:drop-shadow(0 5px 7px #40523518);opacity:0}
.carrier-left{left:calc(12% - var(--carrier-size)*.95)}.carrier-right{right:calc(12% - var(--carrier-size)*.95);transform:scaleX(-1)}
.carrier-hover{position:relative;width:100%;height:100%;aspect-ratio:840/1024;transform-origin:94.047619% 28.613281%}
.carrier-body,.carrier-wings{position:absolute;display:block;background-image:url('assets/letter-fairy.webp');background-repeat:no-repeat;pointer-events:none}
.carrier-body{inset:0;background-size:182.857143% 100%;background-position:left center;z-index:2}
.carrier-wings{width:82.857143%;height:100%;left:-24%;top:-42%;background-size:220.689655% 100%;background-position:right center;transform-origin:96% 68.4%;z-index:1}
.letter-pending .letter-cargo{opacity:0;pointer-events:none}
.letter-active .fairy-letter{clip-path:inset(0 0 100% 0)}
.letter-active .letter-carrier,.letter-active .letter-roll{opacity:1}
.letter-active .carrier-wings{animation:letter-wingbeat .19s cubic-bezier(.4,0,.6,1) infinite alternate}
.letter-active .carrier-right .carrier-wings{animation-delay:-.11s;animation-duration:.23s}
.letter-active .carrier-hover{animation:letter-hover 1.1s ease-in-out infinite alternate}
.letter-active .carrier-right .carrier-hover{animation-delay:-.55s;animation-duration:1.25s}
.letter-landed .carrier-wings{animation-duration:.29s}
.letter-landed .carrier-right .carrier-wings{animation-duration:.32s}
.letter-done .letter-carrier,.letter-done .letter-roll{display:none}
.letter-done .fairy-letter{clip-path:none}
@keyframes letter-wingbeat{from{transform:perspective(420px) rotateY(-22deg) rotate(-5deg)}to{transform:perspective(420px) rotateY(72deg) rotate(7deg)}}
@keyframes letter-hover{0%{transform:rotate(-1.3deg)}60%{transform:rotate(.5deg)}100%{transform:rotate(1.3deg)}}
.letter-flight[data-motion-paused] .carrier-wings,.letter-flight[data-motion-paused] .carrier-hover{animation-play-state:paused}
@media(max-width:850px){.armita-intro .intro-layout{grid-template-columns:1fr;gap:20px}.armita-intro .intro-note{justify-self:center}.letter-flight{--carrier-size:140px;width:calc(100% - 28px);max-width:640px;justify-self:center;margin:100px 14px 20px}.letter-carrier{top:-30px}.armita-intro .fairy-letter{padding:48px 38px}.armita-intro .fairy-letter h2{font-size:44px}}
@media(max-width:430px){.letter-flight{--carrier-size:100px;width:100%;margin-left:0;margin-right:0}.letter-carrier{top:-22px}.armita-intro .fairy-letter{padding:42px 29px}.armita-intro .fairy-letter h2{font-size:38px}}
@media(prefers-reduced-motion:reduce){.letter-carrier,.letter-roll{display:none!important}.letter-cargo{opacity:1!important;transform:none!important}.letter-flight .fairy-letter{clip-path:none!important;transform:none!important}}

/* Keep the gripping hand pinned while the torso banks around it. */
.letter-active .carrier-hover{animation-name:letter-grip-bank}
@keyframes letter-grip-bank{0%{transform:rotate(-.8deg)}50%{transform:rotate(.3deg)}100%{transform:rotate(.8deg)}}
.letter-opening .carrier-hover{animation-duration:1.7s}
.letter-opening .carrier-right .carrier-hover{animation-duration:1.9s}

/* Full-surface 3D deformation. Every strip carries the original paper texture. */
.letter-cargo{transform-style:preserve-3d;perspective:1100px;perspective-origin:50% 15%}
.paper-curl-mesh{position:absolute;inset:0 auto auto 0;transform-style:preserve-3d;pointer-events:none;z-index:4}
.paper-curl-strip{position:absolute;top:0;left:0;width:100%;transform-style:preserve-3d;transform-origin:50% 0}
.paper-curl-face{position:absolute;inset:0;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.paper-curl-back{transform:rotateY(180deg)}
.armita-intro .paper-curl-copy{border:0;box-shadow:none}
.paper-curl-shade{display:none}
.has-paper-curl>.fairy-letter{visibility:hidden}
.letter-flight .letter-roll{display:none}
.letter-active.letter-unrolled .fairy-letter{clip-path:none;visibility:visible}
.letter-active .paper-curl-copy{clip-path:none}
@media(prefers-reduced-motion:reduce){.paper-curl-mesh{display:none}.has-paper-curl>.fairy-letter{visibility:visible}}