.concept-envelope-stage { position: relative; min-height: 430px; perspective: 1400px; transition: min-height .65s ease; }
.concept-envelope-stage.is-open { min-height: 690px; }
.concept-envelope-stage [hidden] { display: none !important; }
.concept-envelope { position:absolute; z-index:3; inset:0; height:430px; overflow:hidden; border:5px solid #e4cba9; border-radius:18px; background:radial-gradient(circle at 50% 20%,#1a6957,#0a453a 74%); box-shadow:0 40px 70px rgba(4,48,39,.25),inset 0 0 0 2px #0b4b3f,inset 0 0 0 5px rgba(246,227,201,.42); transform-origin:center center; transition:opacity .55s ease,transform 1.5s cubic-bezier(.15,.82,.23,1.03); }
.concept-envelope::before { content:""; position:absolute; z-index:5; inset:11px; border:1px solid rgba(240,192,155,.78); border-radius:10px; pointer-events:none; }
.concept-envelope::after { content:""; position:absolute; z-index:1; inset:0; opacity:.14; background:radial-gradient(circle,rgba(245,231,210,.7) .7px,transparent 1.1px) 0 0/8px 8px; pointer-events:none; }
.concept-envelope-fold { position:absolute; inset:0; pointer-events:none; }
.concept-envelope-fold-left { z-index:2; clip-path:polygon(0 0,50% 56%,0 100%); background:linear-gradient(35deg,#084337,#16634f); }
.concept-envelope-fold-right { z-index:2; clip-path:polygon(100% 0,50% 56%,100% 100%); background:linear-gradient(-35deg,#073f35,#155c4d); }
.concept-envelope-fold-bottom { z-index:3; clip-path:polygon(0 100%,50% 49%,100% 100%); background:linear-gradient(180deg,#176a55,#0c4d3f 75%); filter:drop-shadow(0 -3px 4px rgba(1,32,26,.3)); }
.concept-envelope-flap { position:absolute; z-index:4; inset:0 0 auto; height:71%; clip-path:polygon(0 0,100% 0,50% 100%); background:linear-gradient(160deg,#21806a 0%,#135d4b 47%,#0b483d 100%); filter:drop-shadow(0 8px 8px rgba(1,31,26,.45)); transform-origin:top center; backface-visibility:hidden; transition:transform .8s cubic-bezier(.2,.78,.2,1); }
.concept-envelope-ornament { position:absolute; z-index:5; inset:0; width:100%; height:100%; object-fit:fill; pointer-events:none; opacity:.9; transition:opacity .3s ease; }
.concept-envelope-face { position:absolute; z-index:6; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:30px; text-align:center; transition:opacity .25s ease; }
.concept-envelope-title { margin:-6px 0 0; color:#f1aa83; font-family:Georgia,serif; font-size:clamp(3rem,6vw,6rem); font-style:italic; line-height:1; text-shadow:0 4px 16px rgba(2,36,29,.48); }
.concept-envelope-open { min-width:206px; min-height:60px; padding:13px 25px; border:2px solid #f3dfc4; border-radius:100px; background:#f2e6d2; color:#0b4b3f; font:800 clamp(1rem,1.4vw,1.2rem)/1.2 var(--display); cursor:pointer; box-shadow:0 0 0 5px rgba(11,75,63,.65),0 10px 30px rgba(1,35,29,.3); transition:transform .2s ease,background .2s ease,box-shadow .2s ease; }
.concept-envelope-open:hover { transform:translateY(-3px); background:#fff6e8; box-shadow:0 16px 36px rgba(1,35,29,.29); }
.concept-envelope-open:focus-visible { outline:3px solid #f5b398; outline-offset:5px; }
.concept-envelope-open span { padding-left:8px; font-size:1.35em; }
.concept-envelope-seal { position:absolute; bottom:17px; display:grid; place-items:center; width:57px; height:57px; border:3px double #f2c3a7; border-radius:50%; background:radial-gradient(circle at 30% 25%,#dd7854,#ad402c 74%); color:#fff0dc; font:800 .68rem/1 var(--display); letter-spacing:.08em; box-shadow:0 6px 10px rgba(2,34,29,.36),inset 0 2px 3px rgba(255,255,255,.16); }
.concept-envelope-stage.concept-envelope-enhanced:not(.is-arrived):not(.is-open) .concept-envelope { opacity:0; transform:translate3d(0,105px,-850px) rotate(-540deg) scale(.36); }
.concept-envelope-stage.is-opening .concept-envelope-flap { transform:rotateX(178deg); }
.concept-envelope-stage.is-opening .concept-envelope-face { opacity:0; }
.concept-envelope-stage.is-opening .concept-envelope-ornament { opacity:0; }
.concept-envelope-stage.is-opening .concept-envelope { opacity:0; transform:translateY(-22px) scale(.975); pointer-events:none; transition-duration:.65s; }

.version-two .concept-envelope-ideas { min-height:690px; background:linear-gradient(145deg,#f8f0e3,#e8dac3); color:#0b4b3f; box-shadow:0 22px 50px rgba(29,59,46,.1); }
.concept-envelope-ideas::before { border-color:rgba(11,75,63,.24); }
.concept-envelope-ideas::after,.concept-envelope-ideas .concept-v6-lines { display:none; }
.concept-envelope-ideas .concept-v6-center { width:clamp(145px,17vw,200px); height:auto; z-index:1; }
.concept-envelope-ideas .concept-v6-center img { display:block; width:100%; height:auto; filter:drop-shadow(0 8px 14px rgba(7,60,51,.11)); }
.concept-envelope-ideas .concept-v6-piece p { color:#426d60; }
.concept-envelope-ideas .concept-v6-piece p span { color:#c85536; }
.concept-envelope-ideas .concept-v6-piece h3 { color:#0b4b3f; }
.concept-envelope-ideas .concept-v6-piece strong { color:#b94d32; }
.concept-envelope-ideas .concept-v6-piece-one { grid-column:1/6; grid-row:1; align-self:start; }
.concept-envelope-ideas .concept-v6-piece-two { grid-column:9/13; grid-row:1; align-self:start; margin-top:48px; }
.concept-envelope-ideas .concept-v6-piece-three { grid-column:2/7; grid-row:2; align-self:end; }
.concept-envelope-ideas .concept-v6-piece-four { grid-column:9/13; grid-row:2; align-self:end; }
@media (prefers-reduced-motion:no-preference) {
  .concept-envelope-ideas.is-revealed .concept-v6-piece { animation:concept-fly-out 1s cubic-bezier(.2,.8,.2,1) both; animation-delay:var(--delay); }
  .concept-envelope-ideas .concept-v6-piece-one { --from-x:125%; --from-y:80%; --delay:.06s; }
  .concept-envelope-ideas .concept-v6-piece-two { --from-x:-115%; --from-y:85%; --delay:.16s; }
  .concept-envelope-ideas .concept-v6-piece-three { --from-x:95%; --from-y:-90%; --delay:.25s; }
  .concept-envelope-ideas .concept-v6-piece-four { --from-x:-120%; --from-y:-75%; --delay:.34s; }
  @keyframes concept-fly-out { from { opacity:0; transform:translate(var(--from-x),var(--from-y)) scale(.65); filter:blur(8px); } to { opacity:1; transform:translate(0,0) scale(1); filter:blur(0); } }
  .concept-envelope-ideas.is-revealed .concept-v6-center { animation:concept-logo-in .9s ease both; }
  @keyframes concept-logo-in { from { opacity:0; transform:scale(.75); } to { opacity:1; transform:scale(1); } }
}
@media (max-width:700px) {
  .concept-envelope-stage { min-height:290px; }
  .concept-envelope-stage.is-open { min-height:0; }
  .concept-envelope { height:290px; border-width:3px; border-radius:13px; }
  .concept-envelope::before { inset:7px; }
  .concept-envelope-face { gap:24px; }
  .concept-envelope-title { font-size:clamp(2.5rem,10vw,4.3rem); }
  .concept-envelope-open { min-width:180px; min-height:54px; }
  .concept-envelope-seal { bottom:12px; width:41px; height:41px; font-size:.5rem; }
  .version-two .concept-envelope-ideas { min-height:0; padding:185px 30px 36px; }
  .concept-envelope-ideas .concept-v6-center { top:38px; left:50%; bottom:auto; width:116px; translate:-50% 0; }
  .concept-envelope-ideas .concept-v6-center::before { display:none; }
  .concept-envelope-ideas .concept-v6-piece { border-left-color:rgba(11,75,63,.32); }
  .concept-envelope-ideas .concept-v6-piece:nth-of-type(even) { margin-left:16px; }
  .concept-envelope-ideas .concept-v6-piece h3 { color:#0b4b3f; }
  .concept-envelope-ideas .concept-v6-piece-three h3 { color:#0b4b3f; }
  .concept-envelope-ideas .concept-v6-piece-four h3 { color:#b94d32; }
}
@media (max-width:700px) and (prefers-reduced-motion:no-preference) {
  .concept-envelope-ideas .concept-v6-piece { --from-x:0 !important; --from-y:-25px !important; }
}
@media (prefers-reduced-motion:reduce) {
  .concept-envelope,.concept-envelope-flap,.concept-envelope-face,.concept-envelope-stage { transition:none !important; }
}
