/* SJNW responsive layout — no device-specific model or zoom rules. */
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{margin:0;min-height:100%;font-size:16px;-webkit-text-size-adjust:100%;text-size-adjust:100%;background:#faf7f1}
body{margin:0;min-width:0;min-height:100vh;min-height:var(--viewport-height,100vh);font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif;color:#655744;background:radial-gradient(ellipse at 50% 20%,#fffdf7,#f3ede1 70%,#eae1d1)}
img{display:block;max-width:100%;border:0}
a{text-decoration:none;cursor:pointer;touch-action:manipulation}
.mobile-wrap{position:relative;display:flex;flex-direction:column;width:100%;max-width:640px;min-height:100vh;min-height:var(--viewport-height,100vh);margin:0 auto;padding-top:env(safe-area-inset-top,0px);padding-bottom:calc(14px + env(safe-area-inset-bottom,0px));padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px);background:#faf7f1 url(../img/bg.png) center top/cover no-repeat}
@supports(height:100dvh){body,.mobile-wrap{min-height:100dvh}}
/* Extra height belongs to the illustration area; the footer follows the cards. */
.hero{flex:1 0 auto;display:flex;align-items:center;justify-content:center;min-width:0}
.hero-art{position:relative;width:100%}
.head{position:absolute;top:6px;left:0;width:100%;display:flex;justify-content:center;z-index:2;pointer-events:none}
.head .logo{width:58.6667%}
.head .logo img{width:100%;height:auto}
.banner{width:98%;margin:0 auto;padding-top:9.3333%}
.banner img{width:100%;height:auto}
.itemaaa,.itembbb{flex:none;width:90%;margin-left:auto;margin-right:auto}
.itemaaalist{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;height:auto;aspect-ratio:670/108;min-height:50px;margin-bottom:clamp(10px,2.6667vw,17px);padding:0 4.4444%;border-radius:14px;background:url(../img/itembtn.png) center/100% 100% no-repeat;transition:transform .18s}
.itemaaalist img{width:38.52%;height:auto;object-fit:contain;min-width:0}
.itemaaalist span{display:flex;align-items:center;justify-content:center;flex:0 0 29.63%;height:clamp(32px,7.4667vw,48px);padding:0 6px;border-radius:50px;background:linear-gradient(135deg,#dfc477,#cba64e 50%,#ba913e);box-shadow:0 3px 8px #ba913e38;color:#fff;font-size:clamp(14px,4vw,25px);white-space:nowrap}
.itembbb{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,2.6667vw,17px) clamp(12px,3.4667vw,22px)}
.itembbblist{display:flex;align-items:center;justify-content:center;min-width:0;min-height:50px;aspect-ratio:335/108;padding:0 9%;border-radius:14px;background:url(../img/itembtn222.png) center/100% 100% no-repeat;transition:transform .18s}
.itembbblist img{width:100%;height:auto;object-fit:contain}
.ft{flex:none;width:92%;margin:clamp(12px,2.9333vw,19px) auto 0;text-align:center}
.ft p{margin:0;color:#938774;font-size:clamp(10px,2.6667vw,14px);line-height:1.65;overflow-wrap:anywhere}
a:focus-visible{outline:2px solid #b9904e;outline-offset:3px}
@media(min-width:1024px){body{padding:16px 0}.mobile-wrap{max-width:min(620px,calc((100vh - 32px)*.70));min-height:calc(100vh - 32px);border-radius:18px;box-shadow:0 14px 65px #70522012}.itemaaalist span{height:36px;font-size:18px}.ft p{font-size:12px}@supports(height:100dvh){.mobile-wrap{max-width:min(620px,calc((100dvh - 32px)*.70));min-height:calc(100dvh - 32px)}}}
/* Short screens scroll naturally; never shrink controls below touch size. */
@media(orientation:landscape) and (max-height:600px){body{padding:0}.mobile-wrap{max-width:500px;min-height:100vh;min-height:var(--viewport-height,100vh);border-radius:0}.hero{flex-grow:0}@supports(height:100dvh){.mobile-wrap{min-height:100dvh}}}
@media(hover:hover) and (pointer:fine){.itemaaalist:hover,.itembbblist:hover{transform:translateY(-2px);filter:brightness(1.025)}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
