:root{--hd:60px;--navy:#0b1b36;--cream:#fdecad;--brown:#3a1606}
html{scroll-behavior:smooth;scroll-padding-top:var(--hd)}
body{font-family:Montserrat,"Noto Sans TC",sans-serif;background:#000;color:#fff}
.gold{background:linear-gradient(143deg, #b8893f, #ffd47c 25%, #f5bd4b 75%, #b8893f);-webkit-background-clip:text;background-clip:text;color:transparent}

/* header */
.navbar{height:var(--hd);padding:0;border-bottom:4px solid #e5e5e5}
.navbar .container{height:100%;padding-right:0}
.navbar .logo{height:30px}
.menu{width:60px;height:100%;border-left:1px solid #e5e5e5;
  background:linear-gradient(#222,#222) center 20px/24px 2px,linear-gradient(#222,#222) center/24px 2px,linear-gradient(#222,#222) center 34px/24px 2px;background-repeat:no-repeat}

/* section1 */
.hero{background:#000 url(../img/bg1.jpg) center bottom 4vw/200% auto no-repeat}
.hero .container{aspect-ratio:1/1.48;padding-top:9vw}
.hero h1{font-weight:900;font-size:9.5vw;line-height:1.25}
.hero .ai{position:relative}
.hero .star{position:absolute;width:.9em;left:45%;top:-28%;mix-blend-mode:screen;animation:twinkle 2.6s ease-in-out infinite}
.hero .sub{margin-top:4vw;font-size:4.6vw}
.hero .note{padding-bottom:4vw;font-size:2.8vw}
.hero .note span{color: #fde2ac;}
.hero .note b{font-size:3.2vw}

/* section2：手機版為扣掉 header 的滿版區塊 */
.funds{background:var(--navy)}
.funds .row{min-height:calc(100vh - var(--hd))}
.funds .item{border-bottom:1px solid;border-image:linear-gradient(90deg,transparent,#c9a45c,transparent) 1}
.funds .item:last-child{border:0}
.funds .code{font-weight:700;font-size:12vw;line-height:1.1}
.funds h3{font-size:6vw;font-weight:700}
.funds h3 small{font-size:inherit;font-weight:inherit}
.funds h4{font-size:5vw;font-weight:700;color:#e8c77c}

/* 手機版 container 不限寬 */
@media (max-width:767.98px){.container{max-width:none}}

/* 動態 */
@keyframes twinkle{0%,100%{opacity:1;transform:scale(1) rotate(0)}50%{opacity:.35;transform:scale(.7) rotate(15deg)}}
@keyframes float{0%,100%{transform:translateY(-30%)}50%{transform:translateY(-65%)}}

/* 桌機：--u 為容器寬度的 1%，超過 1200px 後固定，內容由 container 置中 */
@media (min-width:768px){
  :root{--hd:auto;--u:7.2px}
  .navbar{padding:12px 0;border:0}
  .navbar .container{padding-right:15px}
  .navbar .logo{height:calc(var(--u)*3.6)}
  .rby{height:calc(var(--u)*3.5)}

  .hero{background:#000}
  .hero .container{aspect-ratio:auto;height:calc(var(--u)*66);padding-top:calc(var(--u)*10);
    background:linear-gradient(90deg,#000 35%,transparent 58%,transparent 88%,#000),url(../img/bg1.jpg) right calc(var(--u)*-8) bottom/auto 130% no-repeat}
  .hero h1{font-size:calc(var(--u)*6.4);line-height:1.15}
  .hero .sub{font-size:calc(var(--u)*2.6);margin-top:calc(var(--u)*1.8)}
  .hero .note{padding-bottom:calc(var(--u)*10);font-size:calc(var(--u)*1.4)}
  .hero .note b{font-size:calc(var(--u)*1.6)}

  .funds{margin-top:calc(var(--u)*-7.5);padding-bottom:calc(var(--u)*7);color:var(--brown);
    background:linear-gradient(#000 calc(var(--u)*7.5),var(--cream) calc(var(--u)*7.5))}
  .funds .row{min-height:0}
  .funds .item{border:0;padding:0 calc(var(--u)*2)!important}
  .funds .box{position:relative;aspect-ratio:318/150;background:url(../img/gold_win.png) center/100% 100%;padding:0 6%;box-shadow: 10px 10px 25px 0px #180c20;border-radius: 16px;}
  .funds .box::before{content:"";position:absolute;left:-10%;top:50%;width:20%;aspect-ratio:60/57;
    background:url(../img/gold_arraw.png) center/contain no-repeat;animation:float 3s ease-in-out infinite}
  .funds .item:nth-child(2) .box::before{animation-duration:3.8s;animation-delay:-1.2s}
  .funds .item:nth-child(3) .box::before{animation-duration:4.6s;animation-delay:-2.5s}
  .funds .code{font-size:calc(var(--u)*3.8);background:none;color:var(--brown)}
  .funds h3{font-size:calc(var(--u)*2.2)}
  .funds h3 small{font-size:calc(var(--u)*1.75);line-height:1.2}
  .funds h4{margin-top:calc(var(--u)*3.2)!important;font-size:calc(var(--u)*2);color:var(--brown)}
  .funds p{margin-top:var(--u);font-size:calc(var(--u)*1.5);line-height:1.7}
}
@media (min-width:992px){:root{--u:9.6px}}
@media (min-width:1200px){:root{--u:11.4px}}

@media (prefers-reduced-motion:reduce){*{animation:none!important}html{scroll-behavior:auto}}