:root{--ink:#182e25;--cream:#f6f4ea;--pine:#18382d;--copper:#f5b76c;--body:"Segoe UI","Microsoft YaHei",sans-serif;--serif:Georgia,"Times New Roman",serif;color:var(--ink);font-family:var(--body);font-synthesis:none}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);line-height:1.55}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;color:inherit}
img{max-width:100%;display:block}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #e7a25a;outline-offset:5px}
.skip{position:absolute;left:12px;top:-100px;background:white;padding:8px;z-index:10}.skip:focus{top:10px}
.icon{display:inline-block;flex-shrink:0;width:1em;height:1em;background:currentColor;mask:var(--icon) center/contain no-repeat}
.monitor{--icon:url(assets/icons/monitor.svg)}.northeast{--icon:url(assets/icons/arrow-up-right.svg)}.down{--icon:url(assets/icons/arrow-down.svg)}.wifi{--icon:url(assets/icons/wifi.svg)}.battery{--icon:url(assets/icons/battery-full.svg)}.menu{--icon:url(assets/icons/menu.svg)}
.nav{background:#142d25;color:var(--cream);border-bottom:1px solid #ffffff24}
.nav-inner{max-width:1344px;margin:auto;padding:0 clamp(22px,5vw,80px);height:68px;display:flex;align-items:center;justify-content:space-between}
.brand{display:inline-flex;align-items:center;gap:12px;font:600 28px/1 var(--serif);letter-spacing:-1.2px}.brand img{width:32px;height:32px}
#menu{display:flex;align-items:center;gap:37px;font-size:14px}#menu a{display:flex;align-items:center;gap:8px}#menu a:hover{color:var(--copper)}
.menu-toggle{display:none}
#header{background:#19382c;color:#fff9e9;position:relative;isolation:isolate;overflow:hidden}
.hero-inner{width:min(1220px,90%);min-height:clamp(630px,82svh,900px);margin:auto;display:grid;grid-template-columns:1.13fr .87fr;align-items:center;padding:70px 5%;gap:5%}
.content{position:relative;z-index:1}
.platform{display:flex;align-items:center;gap:10px;font-size:14px;letter-spacing:.04em;color:#cbd8c8}
.platform .icon{font-size:19px}
h1{font:normal clamp(110px,13vw,188px)/.98 var(--serif);letter-spacing:-.075em;margin:18px 0 12px}
.hero-lead{font-size:clamp(23px,2.15vw,32px);font-weight:400;letter-spacing:.09em;margin:0}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:38px}
.actions a{display:inline-flex;align-items:center;justify-content:center;gap:17px;min-height:46px;padding:0 20px;font-size:14px;font-weight:600;border-radius:6px;transition:color .2s,background-color .2s}
.primary{background:#fff7e8;color:#183326}.primary:hover{background:#f8ddb9}
.secondary{border:1px solid #ffffff66;background:#18342866;color:white}.secondary:hover{background:#365747}
.device-stage{display:flex;align-items:center;justify-content:center}
.phone{width:clamp(180px,15.5vw,230px);aspect-ratio:0.49;padding:6px;border:2px solid #a2ada0;border-radius:37px;background:#1b201c;box-shadow:2px 1px 0 #a2ada1,inset 1px 0 1px #eff0e1,14px 23px 30px #06191063;position:relative}
.screen{position:relative;overflow:hidden;border-radius:29px;background:radial-gradient(ellipse at bottom right,#be7839,transparent 57%),linear-gradient(145deg,#264934,#688261 58%,#31483a);height:100%}
.island{position:absolute;left:50%;top:9px;transform:translateX(-50%);height:12px;width:47px;background:#121715;border-radius:10px}
.phone-status{display:flex;justify-content:flex-end;margin:11px 15px;font:600 8px/1 var(--body)}.phone-status span:last-child{display:flex;gap:3px}.phone-status i{font-size:11px}
.screen-brand{position:absolute;bottom:41%;left:0;right:0;display:grid;justify-items:center;gap:4px;font:normal 17px var(--serif)}
.screen-brand img{width:80px;filter:drop-shadow(0 4px 8px #16251780)}.home-line{position:absolute;width:32%;bottom:7px;left:34%;height:3px;border-radius:5px;background:#f7f5df}
section{scroll-margin-top:16px} main>section{min-height:360px;padding:40px 6vw} footer{padding:32px 6vw}
@media(max-width:700px){
 .nav-inner{height:58px}.brand{font-size:25px}.brand img{width:29px;height:29px}
 .menu-toggle{display:grid;place-items:center;background:none;border:0;padding:10px;color:white;font-size:22px}.nav{position:relative;z-index:3}
 #menu{display:none;position:absolute;left:0;right:0;top:100%;padding:4px 22px 18px;background:#142d25}#menu.open{display:grid;gap:0}#menu a{padding:12px 0}
 .hero-inner{width:100%;display:flex;flex-direction:column-reverse;min-height:0;gap:20px;padding:32px 22px 42px}
 .content{text-align:center}.platform{justify-content:center;font-size:12px}.platform .icon{font-size:15px}
 h1{font-size:84px;margin:7px 0}.hero-lead{font-size:20px}.actions{margin:22px 0 0;justify-content:center}.actions a{min-height:44px;padding:0 16px;gap:10px}
 .phone{width:116px;border-radius:22px;padding:3px}.screen{border-radius:17px}
 .phone-status{margin:8px;font-size:6px}.phone-status i{font-size:7px}.island{width:28px;height:7px;top:5px}
 .screen-brand img{width:44px}.screen-brand{font-size:12px}.home-line{height:2px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}