.promotion-detail-page{min-height:100vh}.hero-section{background:linear-gradient(135deg,#0a3d7e,#008ddd);position:relative;overflow:hidden}.hero-section:before{content:"";position:absolute;inset:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="50" cy="50" r="1" fill="white" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>');opacity:.3}.step-card{transition:all .3s ease;padding:2rem;border-radius:1rem;background:#fff;box-shadow:0 4px 6px -1px #0000001a}.step-card:hover{transform:translateY(-8px);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}.step-circle-container{position:relative;width:384px;height:384px;display:flex;align-items:center;justify-content:center}.step-circle-bg{position:absolute;width:300px;height:300px;padding:20px;background:radial-gradient(circle at center,#00306fe6,#00306fb3,#008dddcc);border-radius:50%;box-shadow:0 0 0 20px #008ddd4d,0 0 0 40px #008ddd33,0 0 50px #008ddd66;z-index:1}.step-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2rem;width:100%;height:100%}.step-number-large{font-family:TroisMille Bold,serif;font-size:56px;font-weight:700;line-height:56px;color:#fff;margin-bottom:8px;text-shadow:0 2px 4px rgba(0,0,0,.3)}.step-title{font-family:TroisMille,serif;font-size:22px;font-weight:400;line-height:32px;color:#fff;margin-bottom:16px;text-shadow:0 2px 4px rgba(0,0,0,.3);max-width:200px}.step-image-container{width:120px;height:120px}.step-image-figma{width:100%;height:100%;-o-object-fit:contain;object-fit:contain;-o-object-position:center;object-position:center}@media (max-width: 768px){.step-circle-bg{width:200px;height:200px}.step-circle-container{width:280px;height:280px}.step-number-large{font-size:40px;line-height:40px}.step-title{font-size:16px;line-height:16px}.step-image-container{width:90px;height:90px}}.step-circle-container:hover .step-circle-bg{transform:scale(1.05);box-shadow:0 0 0 25px #008ddd66,0 0 0 50px #008ddd4d,0 0 60px #008ddd80;transition:all .3s ease}.step-circle-container:hover .step-content{transform:scale(1.02);transition:all .3s ease}.step-circle-container:hover .step-image-container{transform:scale(1.1);transition:all .3s ease}.step-image{position:relative;overflow:hidden;border-radius:.5rem}.step-image img{transition:transform .3s ease}.step-card:hover .step-image img{transform:scale(1.05)}.info-card{transition:all .3s ease;border:1px solid #e5e7eb}.info-card:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.share-section a{transition:all .3s ease;text-decoration:none}.share-section a:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0003}@keyframes slideInUp{0%{opacity:0;transform:translateY(50px) scale(.8)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes circleGlow{0%{box-shadow:0 0 0 20px #008ddd4d,0 0 0 40px #008ddd33,0 0 50px #008ddd66}50%{box-shadow:0 0 0 25px #008ddd66,0 0 0 50px #008ddd4d,0 0 60px #008ddd99}to{box-shadow:0 0 0 20px #008ddd4d,0 0 0 40px #008ddd33,0 0 50px #008ddd66}}.step-circle-container{animation:slideInUp .8s ease-out}.step-circle-bg{animation:circleGlow 3s ease-in-out infinite}.step-circle-container:nth-child(1){animation-delay:.1s}.step-circle-container:nth-child(2){animation-delay:.3s}.step-circle-container:nth-child(3){animation-delay:.5s}@keyframes fadeInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}.info-card{animation:fadeInLeft .6s ease-out}.info-card:nth-child(1){animation-delay:.1s}.info-card:nth-child(2){animation-delay:.2s}.info-card:nth-child(3){animation-delay:.3s}.info-card:nth-child(4){animation-delay:.4s}.info-card:nth-child(5){animation-delay:.5s}@media (max-width: 768px){.hero-section{text-align:center}.step-card{margin-bottom:2rem}.share-section .flex{flex-direction:column;gap:1rem}.share-section a{width:100%;text-align:center}}.steps-section{position:relative;background:linear-gradient(135deg,#0a3d7e,#008ddd)}.steps-section:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 50%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 80% 50%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 40% 20%,rgba(255,255,255,.05) 0%,transparent 50%);pointer-events:none}