:root{color-scheme:light;--blue:#0875f9;--ink:#1b293f;--muted:#64748b;--line:#d7e3f2;font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",system-ui,sans-serif}
*{box-sizing:border-box}
html{min-height:100%;scroll-behavior:smooth;scroll-padding-top:24px}
body{min-width:320px;min-height:100vh;min-height:100svh;margin:0;display:flex;flex-direction:column;background:#f8fbff;color:var(--ink);isolation:isolate}
a{color:inherit;text-decoration:none}
button,summary,a{-webkit-tap-highlight-color:transparent}
a:focus-visible,summary:focus-visible{outline:3px solid var(--blue);outline-offset:5px;border-radius:5px}
svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.skip-link{position:fixed;left:20px;top:12px;z-index:20;padding:12px 18px;border-radius:8px;background:#fff;color:var(--blue);transform:translateY(-150%)}
.skip-link:focus{transform:translateY(0)}
.backdrop{position:fixed;inset:0;overflow:hidden;z-index:-1;pointer-events:none;background:#f8fbff}
.scene{display:block;width:100%;height:100%;object-fit:cover;object-position:center center;animation:scene-drift 28s ease-in-out infinite alternate;transform-origin:60% 60%;will-change:transform}
.site-header{width:min(100% - 112px,1360px);height:86px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative;z-index:5;animation:appear .6s ease both}
.brand{font-size:32px;letter-spacing:.02em;line-height:1.3;font-weight:800;color:var(--blue);white-space:nowrap}
.site-nav{display:flex;align-items:center;gap:32px;font-size:17px}
.site-nav>a{padding:12px 4px;transition:color .18s ease}
.site-nav>a:hover{color:var(--blue)}
.home-link{color:var(--blue)}
.tools-menu{position:relative}
.tools-menu>summary{display:flex;align-items:center;justify-content:center;gap:10px;padding:11px 16px;min-height:46px;border:1px solid transparent;border-radius:12px;list-style:none;cursor:pointer;user-select:none;color:var(--ink);transition:background .18s ease,color .18s ease,border-color .18s ease}
.tools-menu>summary::-webkit-details-marker{display:none}
.tools-menu>summary:hover,.tools-menu[open]>summary{background:#e8f2ff;border-color:#c9e0ff;color:var(--blue)}
.chevron{width:18px;height:18px;transition:transform .2s ease}
.tools-menu[open] .chevron{transform:rotate(180deg)}
.tool-panel{position:absolute;top:calc(100% + 9px);right:0;width:262px;padding:9px;border:1px solid #d9e4f1;border-radius:13px;background:rgba(255,255,255,.98);box-shadow:0 10px 30px #233c6518;transform-origin:top right}
.tools-menu[open] .tool-panel{animation:dropdown .18s ease-out both}
.tool-panel a{display:flex;align-items:center;gap:15px;padding:14px 12px;border-radius:7px;min-height:52px;white-space:nowrap;font-size:15px;transition:background .16s ease,color .16s ease}
.tool-panel a>svg{width:23px;height:23px;color:#526887}
.tool-panel a:hover,.tool-panel a:focus-visible{background:#eff6ff;color:var(--blue)}
.item-arrow{margin-left:auto;font-size:26px;line-height:1;color:#60728d;transition:transform .18s ease}
.tool-panel a:hover .item-arrow{transform:translateX(3px);color:var(--blue)}
main{flex:1;display:flex;justify-content:center;position:relative;outline:none}
.hero{width:100%;text-align:center;padding:clamp(78px,14vh,172px) 24px 110px;position:relative}
.hero h1{position:relative;margin:0;font-weight:800;font-size:clamp(36px,5.7vw,88px);line-height:1.35;letter-spacing:.025em;animation:rise .85s cubic-bezier(.2,.7,.2,1) .05s both}
.welcome{position:relative;margin:24px 0 0;font-size:clamp(20px,2.1vw,30px);line-height:1.8;letter-spacing:.08em;color:#60718c;animation:rise .85s cubic-bezier(.2,.7,.2,1) .16s both}
.contact-link{position:relative;display:inline-flex;align-items:center;gap:10px;min-height:44px;margin-top:36px;padding:6px 8px;color:var(--blue);font-size:20px;animation:rise .85s cubic-bezier(.2,.7,.2,1) .28s both;transition:color .18s ease}
.contact-link span{text-underline-offset:5px;text-decoration:underline;text-decoration-thickness:1px}
.contact-link:hover{color:#045ac4}
.external-icon{width:19px;height:19px;margin-left:3px;transition:transform .2s ease}
.contact-link:hover .external-icon{transform:translate(2px,-2px)}
.footer-shell{position:relative;width:calc(100% - 76px);margin:0 auto;border-top:1px solid #cad9eb;background:linear-gradient(180deg,#ffffffb8,#ffffffed);animation:appear .7s ease .35s both}
.footer-inner{max-width:1356px;min-height:90px;margin:auto;padding:15px 26px;display:flex;align-items:center;justify-content:space-between;gap:22px}
.site-name{font-size:13px;color:#64748b;white-space:nowrap}
.footer-inner footer{display:grid;grid-template-columns:20px auto;justify-content:center;align-items:center;column-gap:7px;row-gap:5px;font-size:13px;line-height:1.7;color:#536681;text-align:center}
.footer-inner footer>img{display:block;width:20px;height:22px;object-fit:contain;grid-column:1;grid-row:1}
.footer-inner footer>a{grid-column:2;grid-row:1}
.footer-inner footer>p{grid-column:1/-1;grid-row:2;margin:0}
.footer-inner footer a{color:inherit;text-underline-offset:3px}
.footer-inner footer a:hover{color:var(--blue);text-decoration:underline}
.page-paused .scene{animation-play-state:paused}
@keyframes scene-drift{from{transform:scale(1.015) translate3d(0,0,0)}to{transform:scale(1.035) translate3d(-5px,3px,0)}}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes appear{from{opacity:0}to{opacity:1}}
@keyframes dropdown{from{opacity:0;transform:translateY(-5px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(min-width:1800px){.hero{padding-top:18vh}.scene{object-position:center 55%}}
@media(max-width:760px){.site-header{width:calc(100% - 40px);height:76px;gap:12px}.brand{font-size:26px}.site-nav{gap:12px;font-size:15px}.tools-menu>summary{gap:6px;padding:9px 10px;min-height:44px}.tool-panel{right:-46px;width:246px}.scene{object-position:72% center;opacity:.75}.hero{padding:110px 18px 160px}.hero:before{content:"";position:absolute;left:0;right:0;top:35px;height:330px;background:radial-gradient(ellipse at center,#ffffffd6 0%,#ffffff8c 50%,transparent 75%);pointer-events:none}.hero h1{font-size:clamp(32px,6.8vw,48px);letter-spacing:0}.welcome{font-size:21px;margin-top:18px}.contact-link{font-size:18px;margin-top:28px}.footer-shell{width:calc(100% - 32px)}.footer-inner{flex-direction:column;gap:10px;padding:16px 4px;min-height:118px}.footer-inner footer{font-size:12px}.site-name{font-size:12px}}
@media(max-width:360px){.site-header{width:calc(100% - 28px)}.brand{font-size:24px}.site-nav{gap:5px;font-size:14px}.tools-menu>summary{padding:8px}.hero{padding-inline:12px}.hero h1{font-size:30px}}
@media(max-height:570px) and (min-width:761px){.hero{padding-top:42px;padding-bottom:55px}.hero h1{font-size:60px}.welcome{margin-top:14px}.contact-link{margin-top:22px}.footer-inner{min-height:76px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.scene{transform:none;will-change:auto}}
