/* Folded paper, painted once. Only a deliberate hover changes the pose. */
.contact-object{
 --envelope-pose:rotateX(12deg) rotateY(-16deg) rotateZ(-7deg);
 --letter-lift:0px;
 position:relative;width:min(210px,100%);aspect-ratio:3/2;margin:20px 0;
 perspective:700px;pointer-events:none;user-select:none;
}
.contact-object-shadow{
 position:absolute;left:13%;top:86%;width:72%;height:6%;border-radius:50%;
 background:#0004;box-shadow:0 0 14px 7px #0003;transform:rotate(-7deg);
}
.contact-object-envelope{
 position:absolute;left:12%;top:36%;width:76%;height:55%;
 transform-style:preserve-3d;transform:var(--envelope-pose);
 transition:transform .45s cubic-bezier(.2,.7,.2,1);
}
.contact-object-back{
 position:absolute;inset:0;background:#ba930b;border:1px solid #151710;
 box-shadow:0 2px 0 #66510a;
}
.contact-object-flap{
 position:absolute;bottom:calc(100% - 1px);left:0;width:100%;height:60%;
 clip-path:polygon(0 100%,48%0,52%0,100%100%);
 background:linear-gradient(155deg,#ffdf39,#d9ad0d);
 transform:translateZ(-1px) rotateX(-9deg);transform-origin:center bottom;
}
.contact-object-letter{
 position:absolute;left:9%;top:-34%;width:82%;height:110%;
 background:#f4f0e5;border:1px solid #d2c9b2;
 box-shadow:1px 2px 0 #c0b79f,2px 4px 0 #a89d82;
 transform:translate3d(0,var(--letter-lift),3px) rotate(-2deg);
 transition:transform .45s cubic-bezier(.2,.7,.2,1);
}
.contact-object-letter i{
 position:absolute;left:12%;top:36%;width:47%;height:2px;background:#33372c;
}
.contact-object-letter i:nth-child(2){top:46%;width:57%}
.contact-object-letter i:nth-child(3){top:56%;width:39%}
.contact-object-letter span{
 position:absolute;right:9%;top:11%;width:19%;aspect-ratio:1;
 background:#ffd600;border:1px solid #32372c;
}
.contact-object-letter span::before,.contact-object-letter span::after{
 content:"";position:absolute;left:24%;top:25%;width:50%;height:2px;
 background:#242820;transform:rotate(-45deg);transform-origin:right center;
}
.contact-object-letter span::after{
 top:22%;left:45%;width:29%;height:29%;background:none;
 border-top:2px solid #242820;border-right:2px solid #242820;transform:none;
}
.contact-object-fold{position:absolute;inset:0;transform:translateZ(6px)}
.contact-object-fold-left{
 clip-path:polygon(0 0,55%54%,0 100%);background:linear-gradient(125deg,#f8d032,#dfaf08);
}
.contact-object-fold-right{
 clip-path:polygon(100%0,45%54%,100%100%);background:linear-gradient(235deg,#ffe364,#efc016);
}
.contact-object-fold-bottom{
 clip-path:polygon(0 100%,0 98%,49%43%,51%43%,100%98%,100%100%);
 background:linear-gradient(0deg,#ffd600,#ffdc34);
}
.contact-object-edge{position:absolute;background:#a78309}
.contact-object-edge-bottom{
 left:0;top:100%;width:100%;height:6px;
 transform-origin:top;transform:translateZ(6px) rotateX(-90deg);
}
.contact-object-edge-right{
 top:0;left:100%;width:6px;height:100%;
 transform-origin:left;transform:translateZ(6px) rotateY(90deg);background:#97780e;
}
@media(hover:hover) and (pointer:fine){
 .home-contact-copy:hover .contact-object{
  --envelope-pose:rotateX(7deg) rotateY(-10deg) rotateZ(-4deg);--letter-lift:-7px;
 }
}
.motion-reduced .contact-object,.motion-off .contact-object,
.motion-reduced .home-contact-copy:hover .contact-object,.motion-off .home-contact-copy:hover .contact-object{
 --envelope-pose:rotateX(12deg) rotateY(-16deg) rotateZ(-7deg);--letter-lift:0px;
}
.motion-reduced .contact-object-envelope,.motion-off .contact-object-envelope,
.motion-reduced .contact-object-letter,.motion-off .contact-object-letter{transition:none}
@media(prefers-reduced-motion:reduce){
 .contact-object,.home-contact-copy:hover .contact-object{
  --envelope-pose:rotateX(12deg) rotateY(-16deg) rotateZ(-7deg);--letter-lift:0px;
 }
 .contact-object-envelope,.contact-object-letter{transition:none}
}