@font-face{font-family:"Archivo";src:url(assets/fonts/archivo-600-800.woff2) format("woff2");font-weight:600 800;font-style:normal;font-display:block}
@font-face{font-family:"Inter";src:url(assets/fonts/inter-400-700.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:block}
:root{--ink:#10231A;--fairway:#21402F;--lime:#B7E4A0;--lime-dk:#2F6B2E;--paper:#F6F1E7;--gold:#E1BC55}
html,body{margin:0;height:100%;background:#000;overflow:hidden;cursor:none}
body{font-family:"Inter",Arial,sans-serif;color:var(--paper);-webkit-font-smoothing:antialiased}
#stage{position:absolute;left:0;top:0;width:1080px;height:1920px;transform-origin:0 0;background:var(--ink);overflow:hidden}
#slides{position:absolute;left:0;top:0;width:1080px;height:1920px}
.slide{position:absolute;left:0;top:0;width:1080px;height:1920px;opacity:0;transition:opacity 1.2s ease;overflow:hidden}
.slide.on{opacity:1;z-index:2}
.slide.off{z-index:1}
.bg{position:absolute;left:-80px;top:-142px;width:1240px;height:2204px;background-size:cover;background-position:center;will-change:transform;transform:scale(1)}
.slide.on .bg{animation-duration:10s;animation-timing-function:linear;animation-fill-mode:both}
.slide.on .kb-in{animation-name:kbIn}.slide.on .kb-out{animation-name:kbOut}
.slide.on .kb-left{animation-name:kbLeft}.slide.on .kb-right{animation-name:kbRight}
@keyframes kbIn{from{transform:scale(.92)}to{transform:scale(1)}}
@keyframes kbOut{from{transform:scale(1)}to{transform:scale(.92)}}
@keyframes kbLeft{from{transform:scale(.94) translateX(40px)}to{transform:scale(.94) translateX(-40px)}}
@keyframes kbRight{from{transform:scale(.94) translateX(-40px)}to{transform:scale(.94) translateX(40px)}}
.shade{position:absolute;left:0;top:0;width:100%;height:100%;
 background:linear-gradient(180deg,rgba(16,35,26,.85) 0,rgba(16,35,26,.2) 15%,rgba(16,35,26,0) 28%,rgba(16,35,26,.6) 40%,rgba(16,35,26,.93) 54%,rgba(16,35,26,.98) 100%)}
.card{position:absolute;left:84px;top:290px;width:480px;height:600px;border-radius:36px;overflow:hidden;box-shadow:0 40px 90px rgba(0,0,0,.55);border:6px solid rgba(183,228,160,.9)}
.card img{width:100%;height:100%;object-fit:cover;display:block}
.txt{position:absolute;left:84px;right:84px;bottom:190px}
.kicker{display:inline-block;font:700 34px/1 "Inter",Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);background:var(--lime);padding:16px 24px 14px;border-radius:12px;margin:0 0 36px}
h1{font:800 150px/.98 "Archivo",Arial,sans-serif;letter-spacing:-.02em;margin:0 0 34px;color:#fff;text-shadow:0 4px 30px rgba(0,0,0,.35)}
h1 em{font-style:normal;color:var(--lime)}
h1 .out{display:block;font-size:76px;line-height:1.05;color:#fff;margin-bottom:16px}
h1 .out i{font-style:normal;color:var(--gold)}
.sub{font:600 46px/1.25 "Inter",Arial,sans-serif;color:#e9efe9;margin:0 0 54px;max-width:900px}
.cta{display:table}
.cta .qr{display:table-cell;vertical-align:middle;width:250px;height:250px;background:#fff;border-radius:22px;padding:14px}
.cta .qr img{width:250px;height:250px;display:block}
.cta .ct{display:table-cell;vertical-align:middle;padding-left:44px;font:800 76px/1.02 "Archivo",Arial,sans-serif;color:#fff}
.cta .ct small{display:block;font:600 34px/1.3 "Inter",Arial,sans-serif;color:var(--lime);margin-top:14px;letter-spacing:.02em}
/* in-animation */
.slide .kicker,.slide h1,.slide .sub,.slide .cta{opacity:0;transform:translateY(40px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.slide.on .kicker{opacity:1;transform:none;transition-delay:.35s}
.slide.on h1{opacity:1;transform:none;transition-delay:.55s}
.slide.on .sub{opacity:1;transform:none;transition-delay:.8s}
.slide.on .cta{opacity:1;transform:none;transition-delay:1.05s}
/* topbar */
#topbar{position:absolute;left:0;top:0;width:1080px;height:250px;z-index:5}
#logo{position:absolute;left:64px;top:40px;width:200px;height:203px;padding:14px;background:rgba(16,35,26,.85);border-radius:28px}
#info{position:absolute;right:64px;top:66px;text-align:right}
#wx{display:inline-block;vertical-align:top;margin-right:34px;background:rgba(16,35,26,.72);border-radius:22px;padding:18px 26px 14px;line-height:1}
#wx.hide{display:none}
#wxicon{display:inline-block;width:76px;height:76px;vertical-align:middle;margin-right:14px}
#wxicon svg{width:76px;height:76px}
#wxtemp{display:inline-block;vertical-align:middle;font:800 78px/1 "Archivo",Arial,sans-serif;color:#fff}
#clock{display:inline-block;vertical-align:top;background:rgba(16,35,26,.72);border-radius:22px;padding:18px 26px 16px;text-align:right}
#clock b{display:block;font:800 66px/1 "Archivo",Arial,sans-serif;color:#fff}
#clock span{display:block;font:600 26px/1.2 "Inter",Arial,sans-serif;color:var(--lime);margin-top:6px}
/* footer */
#foot{position:absolute;left:84px;right:84px;bottom:70px;height:60px;z-index:5;border-top:3px solid rgba(183,228,160,.35);padding-top:26px}
#addr{float:left;font:700 36px/1 "Inter",Arial,sans-serif;color:#fff;letter-spacing:.01em}
#dots{float:right;padding-top:8px}
#dots i{display:inline-block;width:22px;height:22px;border-radius:11px;background:rgba(246,241,231,.3);margin-left:14px;transition:all .6s}
#dots i.on{width:64px;background:var(--lime)}
