@import"https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Poppins:wght@300;400;500;600&display=swap";.hero-bg{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(#1a1a2ecc,#16213ee6),url(/graduation-bg.jpg) center/cover;z-index:-1;filter:brightness(.6)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Poppins,sans-serif;background:linear-gradient(135deg,#1a1a2e,#16213e);color:#fff;overflow-x:hidden;min-height:100vh}@keyframes glow{0%{text-shadow:0 0 20px #64ffda}to{text-shadow:0 0 30px #64ffda,0 0 40px #64ffda}}.hero-section{position:relative;height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}.hero-bg{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(#1a1a2ecc,#16213ee6),url(/graduation-bg.jpg) center/cover;z-index:-1;filter:brightness(.6)}.envelope-container{position:relative;width:100%;height:100vh;display:flex;justify-content:center;align-items:center;perspective:1000px;background:radial-gradient(circle at center,rgba(212,175,55,.05) 0%,transparent 70%)}.envelope{position:relative;width:400px;height:280px;cursor:pointer;transform-style:preserve-3d;transition:all .8s cubic-bezier(.25,.46,.45,.94);filter:drop-shadow(0 10px 25px rgba(0,0,0,.5));animation:pulse-glow 3s ease-in-out infinite alternate}@keyframes pulse-glow{0%{filter:drop-shadow(0 10px 25px rgba(100,255,218,.2))}to{filter:drop-shadow(0 20px 40px rgba(100,255,218,.4))}}.envelope:hover{transform:scale(1.05) rotateY(5deg);filter:drop-shadow(0 15px 35px rgba(212,175,55,.4))}.envelope-body{position:absolute;width:100%;height:100%;background:linear-gradient(135deg,#2c2c54,#40407a);border-radius:10px;box-shadow:0 15px 35px #00000080,inset 0 1px #ffffff1a,0 0 20px #64ffda1a;border:1px solid rgba(255,255,255,.1)}.envelope-flap{position:absolute;width:100%;height:50%;top:0;left:0;background:linear-gradient(135deg,#d4af37,#b8941f);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;transition:transform 1.2s cubic-bezier(.68,-.55,.265,1.55);z-index:2;border-radius:10px 10px 0 0;box-shadow:0 5px 15px #0000004d,inset 0 1px #fff3}.envelope.opened .envelope-flap{transform:rotateX(-180deg)}.envelope-seal{position:absolute;width:60px;height:60px;top:120px;left:50%;transform:translate(-50%);background:linear-gradient(135deg,#d4af37,#e6c547);border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:3;box-shadow:0 0 20px #d4af3799,inset 0 2px 4px #ffffff4d,0 0 15px #64ffda4d;transition:all .8s ease;border:2px solid rgba(255,255,255,.2);animation:seal-glow 2s ease-in-out infinite alternate}@keyframes seal-glow{0%{box-shadow:0 0 20px #d4af3799,0 0 15px #64ffda4d}to{box-shadow:0 0 30px #d4af37cc,0 0 25px #64ffda80}}.envelope:hover .envelope-seal{transform:translate(-50%) scale(1.1) rotate(360deg)}.envelope-content{position:absolute;width:90%;height:70%;top:20%;left:5%;background:#fffffffa;color:#1a1a2e;border-radius:8px;padding:20px;transform:translateY(100px) scale(.8);opacity:0;transition:all 1s cubic-bezier(.25,.46,.45,.94);z-index:1;box-shadow:0 10px 25px #0000004d;border:1px solid rgba(212,175,55,.2)}.envelope.opened .envelope-content{transform:translateY(0) scale(1);opacity:1;transition-delay:.5s}.bottom-hint{position:absolute;bottom:0;left:50%;transform:translate(-50%);text-align:center;mb:4}@media (max-width: 768px){.envelope{width:300px;height:210px}.hero-section h1{font-size:2.5rem!important}}