:root{--pink:#ff46c7;--purple:#9e3dff;--navy:#05042c;--gold:#ffd329}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#fff;background:#05042c;font-family:Pretendard,"Noto Sans KR",Arial,sans-serif}a{color:inherit;text-decoration:none}header{height:104px;display:flex;align-items:center;gap:70px;padding:0 max(4vw,36px);position:absolute;z-index:20;width:100%;background:linear-gradient(#05042cee,transparent)}.logo{font-size:31px;font-weight:900;line-height:.72;text-shadow:0 0 18px #ff49b8}.logo span{color:#ff61c8}.logo small{display:block;font-size:7px;letter-spacing:1.5px;color:#ff87d5;margin-top:9px}nav{display:flex;gap:58px;margin:auto;font-weight:700;color:#ddd}nav a:hover{color:#ff75d5}.head-actions{display:flex;gap:18px;align-items:center}.login{border:1px solid #6c598b;background:#110b3c;color:#fff;border-radius:10px;padding:14px 31px;font-weight:700}.gold{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#ffe246,#ffc514);color:#1a1400;border-radius:18px;padding:20px 35px;font-size:20px;font-weight:900;box-shadow:0 0 10px #fff9,0 0 26px #ffbc27;transition:.2s}.gold:hover{transform:translateY(-2px);filter:brightness(1.08)}.gold.small{font-size:14px;padding:14px 27px;border-radius:10px}.hero{height:690px;position:relative;overflow:hidden;background:radial-gradient(circle at 68% 43%,#7803b4 0,#240066 28%,transparent 55%),radial-gradient(circle at 40% 15%,#2e1fa0,transparent 34%),#05042c;border-bottom:1px solid #201653}.fireworks{position:absolute;inset:0;background:radial-gradient(circle,#ff56dc 0 2px,transparent 3px) 70% 18%/23px 23px no-repeat,radial-gradient(circle,#ff8be9 0 1px,transparent 2px) 55% 14%/15px 15px no-repeat;opacity:.75}.hero-copy{position:absolute;z-index:4;top:122px;left:max(4vw,36px)}.live-pill{display:inline-flex;align-items:center;gap:8px;border:2px solid #554f8c;padding:9px 15px;border-radius:12px;font-size:16px;font-weight:900;color:#ff51bd;background:#0a0a3dcc}.live-pill i{width:15px;height:15px;border-radius:50%;background:red;box-shadow:0 0 10px red}.hero h1{font-size:55px;line-height:1.22;margin:18px 0;color:#fff;text-shadow:0 3px 20px #02021e}.hero h1 em,.benefits h2 em{font-style:normal;color:#ff50c2}.hero-copy p{font-size:18px;line-height:1.8;color:#d4d0e8;margin:10px 0}.hero-copy strong{color:#ff69c4}.hero-copy .gold{margin-top:18px;min-width:310px}.hero-copy b{font-size:28px;margin-left:18px}.hosts{position:absolute;z-index:2;width:min(68vw,900px);right:3%;bottom:-2%;filter:saturate(1.1) drop-shadow(0 0 25px #e124ff80)}.viewer{position:absolute;right:5%;top:117px;z-index:5;padding:10px 16px;border:1px solid #5a3c91;background:#100b43c9;border-radius:11px;font-weight:800}.chat{position:absolute;z-index:6;right:2%;top:194px;width:190px;padding:14px;border:1px solid #8734b7;border-radius:14px;background:#1c0d4bda;box-shadow:0 0 20px #b929d866}.chat h3{font-size:13px}.chat h3 span{float:right}.chat p{font-size:11px;background:#48217388;padding:7px;border-radius:8px;margin:7px 0}.chat div{font-size:10px;color:#9585ad;border-top:1px solid #4f3273;padding-top:12px}.onair{position:absolute;z-index:7;left:54%;bottom:22px;transform:translateX(-50%);border:3px solid #ff7be7;border-radius:13px;padding:7px 20px;font-size:34px;color:#ff8cf0;box-shadow:0 0 8px #fff,0 0 22px #fa00ff;text-shadow:0 0 8px #fff}.stats{position:relative;z-index:10;margin:-4px auto 0;max-width:920px;min-height:95px;border:1px solid #46306e;border-radius:18px;background:#171040;display:grid;grid-template-columns:repeat(4,1fr);box-shadow:0 12px 35px #0008}.stats div{padding:21px 23px;border-right:1px solid #312255;display:grid;grid-template-columns:40px 1fr}.stats div:last-child{border:0}.stats span{grid-row:1/3;font-size:30px;color:#fc55d4}.stats small{color:#aaa0c2}.stats b{font-size:19px;margin-top:5px}.benefits{padding:68px 5% 155px;min-height:730px;text-align:center;background:radial-gradient(circle at 50% 50%,#211063,transparent 58%),#070535}.benefits h2{font-size:34px;margin:0 0 42px}.cards{max-width:950px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.cards article{height:355px;padding:25px 15px;border:2px solid #b557c5;border-radius:22px;background:linear-gradient(#35135e,#140b43);box-shadow:inset 0 0 25px #8a2dbd77,0 0 15px #9e34d155;overflow:hidden}.cards i{font-style:normal;font-size:34px}.cards h3{font-size:20px;margin:12px 0}.cards p{color:#d7cde4;line-height:1.7}.people,.party,.crowd{font-size:32px;margin-top:22px}.chart{font-size:39px;color:#9d55ff;text-shadow:0 0 10px #5fcaff;margin-top:38px;transform:skewY(-8deg)}.join{margin-top:36px;min-width:500px;font-size:25px}.sticky{position:fixed;z-index:50;bottom:16px;left:50%;transform:translateX(-50%);width:min(860px,90%);display:flex;align-items:center;gap:16px;padding:12px 20px;background:#261052ef;border:1px solid #643895;border-radius:17px;box-shadow:0 0 25px #812ba788}.avatar{font-size:32px}.sticky p{margin:0;flex:1}.sticky b{color:#ff56bd}.sticky span{font-size:13px;color:#ddd}
@media(max-width:850px){header{height:72px;padding:0 20px}.logo{font-size:24px}nav,.login{display:none}.head-actions{margin-left:auto}.hero{height:860px}.hero-copy{left:22px;right:22px;top:95px}.hero h1{font-size:43px}.hero-copy p{font-size:16px}.hosts{width:145%;max-width:none;right:-31%;bottom:14px}.chat,.viewer{display:none}.onair{left:50%;bottom:28px;font-size:25px}.stats{grid-template-columns:1fr 1fr;margin:0 15px}.stats div{border-bottom:1px solid #312255}.benefits{padding:55px 18px 160px}.benefits h2{font-size:26px}.cards{grid-template-columns:1fr 1fr}.join{min-width:0;width:95%;font-size:20px}.sticky{width:94%;padding:10px 14px}.sticky p span{display:none}.sticky .gold{padding:12px;font-size:12px}}@media(max-width:520px){.hero{height:780px}.hero h1{font-size:38px}.hero-copy .gold{min-width:0;width:100%;font-size:17px}.hosts{width:175%;right:-47%;bottom:15px}.stats{grid-template-columns:1fr}.stats div{border-right:0}.cards{grid-template-columns:1fr}.cards article{height:300px}.sticky .avatar{display:none}}

/* Refined hero layout */
.head-actions{margin-left:auto}
.benefit-icon{position:relative;display:block!important;width:46px;height:46px;margin:0 auto 12px;border:1px solid rgba(255,103,218,.42);border-radius:14px;background:linear-gradient(145deg,rgba(255,83,205,.2),rgba(117,52,255,.14));box-shadow:inset 0 0 14px rgba(255,102,218,.12),0 0 18px rgba(217,64,255,.16)}
.icon-gift:before{content:"";position:absolute;left:9px;top:10px;width:28px;height:27px;border-left:2px solid #ff78dc;border-bottom:2px solid #ff78dc;border-radius:2px;background:linear-gradient(to top,#ff5ec9 0 70%,transparent 70%) 3px 100%/4px 58% no-repeat,linear-gradient(to top,#a760ff 0 70%,transparent 70%) 10px 100%/4px 82% no-repeat,linear-gradient(to top,#ffd66d 0 70%,transparent 70%) 17px 100%/4px 68% no-repeat,linear-gradient(to top,#ff5ec9 0 70%,transparent 70%) 24px 100%/4px 100% no-repeat}
.icon-gift:after{content:"";position:absolute;left:10px;top:15px;width:25px;height:2px;background:linear-gradient(90deg,#ff78dc,#ffd66d);transform:rotate(-18deg);transform-origin:left center;box-shadow:0 0 8px #ff65d5}
.icon-event:before{content:"";position:absolute;left:15px;top:15px;width:16px;height:16px;background:linear-gradient(135deg,#ff83e2,#ad55ff);transform:rotate(45deg);border-radius:3px;box-shadow:0 0 12px #f05cff}
.icon-event:after{content:"";position:absolute;left:21px;top:7px;width:4px;height:4px;border-radius:50%;background:#ffd66d;box-shadow:-12px 14px 0 #ff79dd,12px 14px 0 #ff79dd,0 28px 0 #ffd66d}
.icon-chat:before{content:"";position:absolute;left:8px;top:10px;width:30px;height:22px;border:2px solid #ff78dc;border-radius:8px;background:radial-gradient(circle at 28% 50%,#ffd8f4 0 2px,transparent 2.5px),radial-gradient(circle at 50% 50%,#ffd8f4 0 2px,transparent 2.5px),radial-gradient(circle at 72% 50%,#ffd8f4 0 2px,transparent 2.5px);box-shadow:0 0 9px rgba(255,90,210,.55)}
.icon-chat:after{content:"";position:absolute;left:14px;top:31px;width:8px;height:8px;border-left:2px solid #ff78dc;transform:skewY(-35deg)}
.contact-actions{display:flex;gap:12px;margin-top:14px;width:310px}
.contact-actions a{flex:1;padding:13px 10px;border-radius:12px;font-size:15px;font-weight:900;text-align:center;box-shadow:0 8px 22px #0005;transition:.2s}
.contact-actions a:hover{transform:translateY(-2px);filter:brightness(1.08)}
.contact-actions .kakao{background:#fee500;color:#191600}
.contact-actions .telegram{background:#229ed9;color:#fff}
.cards{grid-template-columns:repeat(3,1fr);max-width:780px}
.cards article p{position:relative;z-index:2}
.card-art{position:relative;z-index:1;height:198px;margin:-35px -15px -25px;background-repeat:no-repeat;background-size:cover;background-position:center;border-radius:0 0 18px 18px;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.72) 16%,#000 34%,#000 100%);mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.72) 16%,#000 34%,#000 100%)}
.card-art.art-1{background-image:url('assets/card-hosts.png?v=20260808-14');background-position:72% center}
.card-art.art-2{background-image:url('assets/card-finance.png?v=20260808-14')}
.card-art.art-3{background-image:url('assets/card-celebration.png?v=20260808-14')}
.card-art.art-4{background-image:url('assets/card-crowd.png?v=20260808-14')}
@media(min-width:851px){
  .hero{height:720px;background:#05042c}
  .hero:after{content:"";position:absolute;z-index:3;inset:0;background:linear-gradient(90deg,rgba(5,4,44,.97) 0%,rgba(5,4,44,.7) 27%,rgba(5,4,44,.08) 49%,transparent 72%);pointer-events:none}
  .fireworks{display:none}
  .hero-copy{top:124px;left:clamp(260px,20vw,390px)!important;right:auto;width:430px;margin:0}
  .hosts{inset:0;width:100%;height:100%;object-fit:cover;object-position:center 48%;filter:saturate(1.08)}
  .viewer{right:clamp(20px,2.4vw,46px);top:112px;width:190px;text-align:center;background:#100b43df}
  .chat{right:clamp(20px,2.4vw,46px);top:178px;width:190px;background:#1c0d4be8}
  .onair{left:55%;bottom:24px}
  .stats{margin:-22px auto 0;max-width:1120px}
}
@media(max-width:850px){
  .hero{height:820px;background:#05042c}
  .hero:after{content:"";position:absolute;z-index:3;inset:0;background:linear-gradient(180deg,rgba(5,4,44,.98) 0%,rgba(5,4,44,.82) 45%,rgba(5,4,44,.05) 68%,transparent 100%);pointer-events:none}
  .hosts{inset:auto auto 0 50%;width:178%;height:auto;max-width:none;transform:translateX(-72%);filter:saturate(1.08)}
  .hero-copy{z-index:4;left:22px;right:22px;width:auto;max-width:520px;margin-inline:auto;text-align:center}
  .hero-copy .live-pill{margin-inline:auto}
  .hero-copy .gold{margin:158px auto 0}
  .contact-actions{width:min(310px,100%);margin:14px auto 0}
  .cards{grid-template-columns:repeat(2,1fr);max-width:780px}
  .onair{z-index:7}
}
@media(max-width:520px){
  .hero{height:760px}
  .hosts{inset:auto auto 0 50%;width:190%;height:auto;transform:translateX(-72%)}
  .hero h1{font-size:36px;line-height:1.18}
  .hero-copy p{line-height:1.65}
  .cards{grid-template-columns:1fr}
}

/* Motion and interaction polish */
@keyframes reveal-up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes soft-pulse{0%,100%{opacity:.72;filter:brightness(1)}50%{opacity:1;filter:brightness(1.35)}}
@keyframes neon-pulse{0%,100%{box-shadow:0 0 8px #fff,0 0 20px #fa00ff;text-shadow:0 0 7px #fff}50%{box-shadow:0 0 13px #fff,0 0 34px #fa00ff;text-shadow:0 0 14px #fff;filter:brightness(1.16)}}
@keyframes shine{0%,12%{left:-48%;opacity:0;transform:skewX(-22deg)}18%{opacity:.9}58%{left:128%;opacity:.9;transform:skewX(-22deg)}64%,100%{left:128%;opacity:0;transform:skewX(-22deg)}}
@keyframes card-in{from{opacity:0;transform:translateY(34px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes image-breathe{0%,100%{filter:saturate(1) brightness(1)}50%{filter:saturate(1.12) brightness(1.08)}}
@keyframes chat-in{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:translateX(0)}}
@keyframes float-bar{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-5px)}}
.hero-copy{animation:reveal-up .85s cubic-bezier(.2,.7,.2,1) both}
.hosts{animation:soft-pulse 5s ease-in-out infinite}
.live-pill i{animation:soft-pulse 1.25s ease-in-out infinite}
.viewer{animation:reveal-up .7s .28s both}
.chat{animation:reveal-up .75s .38s both}
.chat p{animation:chat-in .5s both}
.chat p:nth-of-type(1){animation-delay:.5s}.chat p:nth-of-type(2){animation-delay:.62s}.chat p:nth-of-type(3){animation-delay:.74s}.chat p:nth-of-type(4){animation-delay:.86s}.chat p:nth-of-type(5){animation-delay:.98s}.chat p:nth-of-type(6){animation-delay:1.1s}
.onair{animation:neon-pulse 2s ease-in-out infinite}
.gold,.contact-actions a{position:relative;overflow:hidden}
.gold:after,.contact-actions a:after{content:"";position:absolute;top:-30%;bottom:-30%;left:-48%;width:30%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.78),transparent);animation:shine 4s ease-in-out infinite;pointer-events:none}
.cards article{opacity:0;animation:card-in .7s cubic-bezier(.2,.72,.25,1) forwards}
.cards article:nth-child(1){animation-delay:.12s}.cards article:nth-child(2){animation-delay:.25s}.cards article:nth-child(3){animation-delay:.38s}
.cards article:hover{transform:translateY(-9px);border-color:#ff77dd;box-shadow:inset 0 0 30px #8a2dbd99,0 8px 30px #d03cff66;transition:transform .3s,border-color .3s,box-shadow .3s}
.card-art{animation:image-breathe 7s ease-in-out infinite}
.benefit-icon{transition:transform .3s,box-shadow .3s}
.cards article:hover .benefit-icon{transform:translateY(-3px) scale(1.08);box-shadow:inset 0 0 16px rgba(255,102,218,.2),0 0 24px rgba(217,64,255,.48)}
.stats{animation:reveal-up .75s .55s both}
.sticky{animation:float-bar 3.2s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}