:root {
  --bg: #060812;
  --bg-soft: #090c18;
  --panel: rgba(16, 20, 38, .72);
  --line: rgba(158, 174, 255, .14);
  --line-strong: rgba(158, 174, 255, .25);
  --text: #f5f7ff;
  --muted: #959cb3;
  --blue: #50a9ff;
  --violet: #8069ff;
  --cyan: #70e0ff;
  --shell: 1180px;
}

* { box-sizing: border-box; }
html { background: var(--bg); scroll-behavior: smooth; }
body { margin: 0; color: var(--text); background: var(--bg); font-family: "Noto Sans SC", "Microsoft YaHei", "PingFang SC", Inter, Arial, sans-serif; font-size: 16px; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
::selection { background: rgba(105, 112, 255, .45); color: #fff; }

.site-frame { min-width: 0; overflow: hidden; background: radial-gradient(circle at 65% 0%, rgba(44, 53, 127, .16), transparent 28%), var(--bg); }
.shell { width: min(var(--shell), calc(100% - 100px)); margin-inline: auto; }

.site-header { position: fixed; inset: 0 0 auto; height: 90px; z-index: 20; border-bottom: 1px solid rgba(255,255,255,.07); background: rgba(5,7,16,.8); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.header-inner { height: 100%; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.brand { display: inline-flex; align-items: center; gap: 12px; width: fit-content; }
.brand-mark { position: relative; width: 34px; height: 34px; display: grid; place-items: center; transform: rotate(45deg); }
.brand-mark::before, .brand-mark::after { content: ""; position: absolute; border: 1px solid rgba(105,151,255,.6); }
.brand-mark::before { width: 22px; height: 22px; }
.brand-mark::after { width: 10px; height: 10px; background: linear-gradient(135deg, var(--cyan), var(--violet)); box-shadow: 0 0 18px #667dff; }
.brand-mark i, .brand-mark b { position: absolute; width: 34px; height: 1px; background: rgba(105,151,255,.45); }
.brand-mark b { transform: rotate(90deg); }
.brand-mark em { width: 4px; height: 4px; border-radius: 50%; background: white; z-index: 2; }
.brand-name { display: flex; flex-direction: column; gap: 1px; }
.brand-name strong { font-size: 16px; line-height: 1.1; letter-spacing: .14em; }
.brand-name small { color: #7d849a; font-size: 7px; letter-spacing: .24em; }
.site-header nav { height: 100%; display: flex; align-items: stretch; gap: 42px; }
.site-header nav a { position: relative; display: grid; place-items: center; color: #a7adbd; font-size: 13px; letter-spacing: .04em; transition: color .25s ease; }
.site-header nav a:hover, .site-header nav a.active { color: white; }
.site-header nav a.active::after { content: ""; position: absolute; left: 50%; bottom: -1px; width: 22px; height: 2px; transform: translateX(-50%); background: linear-gradient(90deg, var(--blue), var(--violet)); box-shadow: 0 0 12px var(--blue); }

.hero { position: relative; height: 800px; min-height: 720px; display: flex; align-items: center; border-bottom: 1px solid var(--line); overflow: hidden; }
.hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 72% 48%, rgba(81,85,224,.17), transparent 24%), linear-gradient(110deg, transparent 56%, rgba(50,60,140,.07) 56% 57%, transparent 57%); }
.hero-grid, .page-hero-grid { position: absolute; inset: 0; opacity: .26; background-image: linear-gradient(rgba(139,157,255,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(139,157,255,.07) 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(90deg, transparent 4%, #000 65%, transparent 98%); }
.hero-content { position: relative; z-index: 3; padding-top: 55px; }
.eyebrow, .kicker { color: #8f9ac0; font-size: 10px; font-weight: 700; letter-spacing: .26em; }
.eyebrow { display: flex; align-items: center; gap: 10px; }
.eyebrow span { width: 24px; height: 1px; background: linear-gradient(90deg, var(--blue), var(--violet)); box-shadow: 0 0 9px var(--blue); }
.hero h1 { margin: 30px 0 25px; font-size: clamp(58px, 5.3vw, 82px); line-height: 1.16; letter-spacing: -.05em; font-weight: 540; }
.gradient-text { color: transparent; background: linear-gradient(96deg, #f7fbff 0%, #7ec8ff 45%, #967eff 90%); -webkit-background-clip: text; background-clip: text; }
.hero-lead { color: var(--muted); font-size: 15px; line-height: 2; letter-spacing: .03em; }
.hero-actions { display: flex; align-items: center; gap: 34px; margin-top: 38px; }
.button { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 26px; min-width: 175px; height: 50px; padding: 0 22px; font-size: 12px; letter-spacing: .08em; border: 1px solid transparent; transition: transform .25s, border-color .25s, box-shadow .25s; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: linear-gradient(112deg, #445be0, #7250dc); box-shadow: 0 12px 38px rgba(70,76,208,.18), inset 0 1px rgba(255,255,255,.18); }
.button-primary:hover { box-shadow: 0 14px 44px rgba(80,93,240,.34); }
.button-ghost { border-color: var(--line-strong); background: rgba(14,17,33,.45); }
.button-ghost:hover { border-color: #6478d7; }
.arrow-icon { font-size: 17px; font-weight: 300; transition: transform .25s; }
.button:hover .arrow-icon, .text-link:hover .arrow-icon { transform: translateX(4px); }
.text-link { display: inline-flex; align-items: center; gap: 13px; color: #c7cbd8; font-size: 12px; letter-spacing: .06em; }
.text-link span { color: var(--cyan); }
.text-link.lined { margin-top: 36px; padding-bottom: 8px; border-bottom: 1px solid #364167; }
.scroll-cue { position: absolute; z-index: 4; left: calc(50% - var(--shell)/2); bottom: 28px; display: flex; align-items: center; gap: 12px; color: #596077; font-size: 7px; letter-spacing: .23em; }
.scroll-cue span { width: 1px; height: 28px; background: linear-gradient(var(--blue), transparent); animation: scrollPulse 1.8s ease-in-out infinite; }

.hero-architecture { position:absolute; z-index:2; top:158px; left:calc(50% + 150px); width:500px; height:500px; padding:22px 24px; border:1px solid rgba(118,136,232,.16); background:linear-gradient(145deg,rgba(16,21,44,.56),rgba(7,9,19,.18)); box-shadow:0 35px 90px rgba(0,0,0,.2); }
.architecture-head { display:flex; justify-content:space-between; color:#5f6a89; font-size:7px; letter-spacing:.2em; }
.architecture-stage { position:relative; height:390px; margin-top:20px; overflow:hidden; border-top:1px solid rgba(124,143,239,.13); border-bottom:1px solid rgba(124,143,239,.13); background-image:linear-gradient(rgba(126,144,235,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(126,144,235,.06) 1px,transparent 1px); background-size:44px 44px; perspective:900px; }
.data-plane { position:absolute; display:block; width:155px; height:300px; top:45px; border:1px solid rgba(104,132,255,.23); background:linear-gradient(160deg,rgba(67,85,181,.18),rgba(13,16,32,.03)); clip-path:polygon(0 12%,100% 0,100% 88%,0 100%); }
.plane-one { left:38px; transform:rotateY(28deg) skewY(-6deg); }
.plane-two { left:146px; border-color:rgba(129,105,243,.27); background:linear-gradient(160deg,rgba(108,70,207,.2),rgba(13,16,32,.03)); transform:translateY(-9px) rotateY(12deg) skewY(-6deg); }
.plane-three { left:260px; border-color:rgba(90,190,255,.2); background:linear-gradient(160deg,rgba(50,119,192,.16),rgba(13,16,32,.03)); transform:translateY(7px) rotateY(-16deg) skewY(-6deg); }
.architecture-core { position:absolute; z-index:4; left:137px; top:106px; width:190px; height:174px; padding:21px 22px; border:1px solid rgba(134,154,255,.33); background:rgba(8,11,25,.86); box-shadow:0 24px 60px rgba(0,0,0,.36),inset 0 0 40px rgba(65,78,173,.08); }
.architecture-core > span { color:#667298; font-size:7px; font-weight:700; letter-spacing:.2em; }
.architecture-core strong { display:block; margin-top:19px; color:transparent; background:linear-gradient(120deg,#8ed5ff,#8976ff); -webkit-background-clip:text; background-clip:text; font-size:58px; line-height:.9; font-weight:500; letter-spacing:-.08em; }
.architecture-core p { margin:22px 0 0; color:#777f98; font-size:7px; line-height:1.65; letter-spacing:.18em; }
.architecture-scan { position:absolute; z-index:6; left:18px; top:0; width:1px; height:100%; background:linear-gradient(transparent,rgba(111,204,255,.8),transparent); box-shadow:0 0 20px rgba(86,173,255,.75); animation:dataScan 7s ease-in-out infinite; }
.data-node { position:absolute; z-index:7; width:6px; height:6px; border:1px solid #75b9ff; background:#0a0d1e; transform:rotate(45deg); box-shadow:0 0 13px rgba(88,171,255,.65); animation:dataPulse 3.6s ease-in-out infinite; }
.node-one { left:54px; top:82px; }.node-two { right:50px; top:144px; animation-delay:-1.2s; }.node-three { right:95px; bottom:49px; animation-delay:-2.4s; }
.architecture-foot { height:45px; display:flex; align-items:flex-end; gap:13px; color:#59627f; font-size:7px; letter-spacing:.17em; }
.architecture-foot i { flex:1; height:1px; margin-bottom:3px; background:linear-gradient(90deg,rgba(90,111,209,.5),rgba(90,111,209,.08)); }

.section { position: relative; padding: 120px 0; }
.section-heading, .direction-top { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 60px; }
.section-heading h2, .direction-top h2, .intro-grid h2, .contact-layout h2 { margin: 15px 0 0; font-size: 38px; font-weight: 520; letter-spacing: -.035em; }
.section-heading > p, .direction-top > p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.9; }
.capabilities-section { background: radial-gradient(circle at 53% 45%, rgba(39,44,105,.13), transparent 40%); }
.capability-grid { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.capability-card { position: relative; min-height: 365px; padding: 42px 38px 35px; border-right: 1px solid var(--line); background: linear-gradient(145deg, rgba(18,22,43,.28), rgba(7,9,18,.15)); overflow: hidden; transition: background .35s, transform .35s; }
.capability-card:first-child { border-left: 1px solid var(--line); }
.capability-card:hover { background: linear-gradient(145deg, rgba(38,46,94,.45), rgba(10,12,26,.25)); transform: translateY(-5px); }
.card-index { display: flex; align-items: center; justify-content: space-between; color: #697087; font-size: 8px; letter-spacing: .2em; }
.card-index span { color: #7888cb; font-size: 10px; }
.capability-card h3 { margin: 135px 0 15px; font-size: 22px; font-weight: 500; }
.capability-card p { margin: 0; max-width: 260px; color: var(--muted); font-size: 13px; line-height: 1.8; }
.card-line { position: absolute; left: 38px; right: 38px; bottom: 0; height: 2px; transform: scaleX(0); transform-origin: left; background: linear-gradient(90deg, var(--blue), var(--violet)); transition: transform .35s; }
.capability-card:hover .card-line { transform: scaleX(1); }
.line-icon { position: absolute; top: 96px; left: 38px; width: 48px; height: 48px; opacity: .85; }
.line-icon::before, .line-icon::after, .line-icon i, .line-icon b, .line-icon span { content:""; position: absolute; }
.line-icon.ai::before, .line-icon.ai::after { width: 34px; height: 34px; border: 1px solid #6d92ff; transform: rotate(45deg); top: 7px; left: 7px; }
.line-icon.ai::after { width: 14px; height: 14px; top: 17px; left: 17px; background: rgba(104,115,255,.18); }
.line-icon.ai i, .line-icon.ai b { width: 48px; height: 1px; top: 23px; background: #6979bd; }.line-icon.ai b { transform: rotate(90deg); }
.line-icon.software::before { inset: 6px; border: 1px solid #6d92ff; box-shadow: 7px 7px 0 rgba(86,101,190,.25); }
.line-icon.software i, .line-icon.software b { left: 14px; width: 20px; height: 1px; top: 18px; background: #7b8ddd; }.line-icon.software b { top: 26px; width: 13px; }
.line-icon.create::before, .line-icon.create::after { width: 29px; height: 29px; top: 9px; left: 9px; border: 1px solid #718dff; border-radius: 50%; }.line-icon.create::after { width: 8px; height: 8px; top: 19px; left: 19px; background: #7bbaff; box-shadow: 0 0 16px #5a7eff; }
.line-icon.create i { width: 45px; height: 1px; left: 1px; top: 23px; background: #6877bd; transform: rotate(-35deg); }

.philosophy-section { padding: 150px 0; border-top: 1px solid rgba(255,255,255,.03); background: linear-gradient(135deg, #060812, #0a0d1c); }
.philosophy-grid { display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 100px; }
.philosophy-grid h2 { margin: 18px 0 28px; font-size: 48px; line-height: 1.33; font-weight: 520; letter-spacing: -.04em; }
.body-copy { max-width: 480px; color: var(--muted); font-size: 14px; line-height: 2; }
.philosophy-visual { position: relative; height: 430px; }
.visual-word { position: absolute; top: -30px; right: -40px; color: transparent; -webkit-text-stroke: 1px rgba(118,132,201,.13); font-size: 150px; font-weight: 800; letter-spacing: -.09em; }
.visual-stage { position: absolute; inset: 25px 0 0 50px; transform: perspective(900px) rotateY(-8deg); }
.visual-stage::before { content: ""; position: absolute; left: -28px; bottom: -5px; width: 470px; height: 180px; border: 1px solid rgba(104,118,202,.16); transform: skewY(-13deg); background: radial-gradient(circle at 70% 20%, rgba(94,83,225,.16), transparent 52%); }
.stage-label { position: absolute; top: 16px; right: 15px; color: #4e587c; font-size: 7px; letter-spacing: .23em; writing-mode: vertical-rl; }
.stage-card { position: absolute; width: 255px; height: 315px; border: 1px solid rgba(130,146,244,.25); background: rgba(12,15,29,.86); box-shadow: 0 30px 70px rgba(0,0,0,.35); }
.stage-card-back { left: 50px; top: 58px; transform: rotate(-11deg); background: linear-gradient(145deg, rgba(63,72,159,.22), rgba(8,10,20,.8)); }
.stage-card-back span { position: absolute; right: 18px; top: 17px; color: #6270aa; font-size: 9px; }
.stage-card-main { left: 190px; top: 22px; padding: 28px; transform: rotate(5deg); background: radial-gradient(circle at 20% 15%, rgba(79,96,219,.22), transparent 34%), rgba(12,15,29,.92); }
.stage-card-main p { position: absolute; left: 30px; bottom: 45px; margin: 0; font-size: 31px; line-height: 1.18; letter-spacing: -.05em; }
.stage-card-main p strong { color: #8395ff; font-weight: 520; }
.stage-card-main > span { position: absolute; right: 22px; bottom: 20px; color: #4e587c; font-size: 8px; }
.tiny-orb { width: 74px; height: 74px; border-radius: 50%; background: radial-gradient(circle at 34% 30%, #aee9ff, #656bdf 26%, #251c5a 68%); box-shadow: 0 0 38px rgba(87,87,223,.55); }

.direction-section { background: #070914; border-top: 1px solid var(--line); }
.direction-list { border-top: 1px solid var(--line); }
.direction-row { display: grid; grid-template-columns: 95px 1fr 180px; align-items: center; height: 108px; border-bottom: 1px solid var(--line); transition: padding .3s, background .3s; }
.direction-row:hover { padding-inline: 14px; background: linear-gradient(90deg, rgba(67,79,165,.16), transparent); }
.direction-row > span { color: #606b92; font-size: 9px; }.direction-row h3 { margin: 0; font-size: 28px; font-weight: 430; letter-spacing: -.02em; }.direction-row p { color: var(--muted); font-size: 13px; }

.product-section { border-top:1px solid var(--line); background:radial-gradient(circle at 18% 50%,rgba(45,73,129,.16),transparent 34%),#060812; }
.product-heading { margin-bottom:42px; }
.product-row { position:relative; min-height:230px; padding:38px 42px; display:flex; align-items:center; justify-content:space-between; gap:50px; border:1px solid var(--line); background:linear-gradient(120deg,rgba(18,30,52,.76),rgba(9,12,24,.38)); overflow:hidden; transition:border-color .3s,transform .3s,background .3s; }
.product-row::before { content:""; position:absolute; inset:0; opacity:.28; background-image:linear-gradient(rgba(125,150,215,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(125,150,215,.07) 1px,transparent 1px); background-size:54px 54px; mask-image:linear-gradient(90deg,#000,transparent 75%); }
.product-row:hover { border-color:rgba(123,163,230,.4); transform:translateY(-4px); background:linear-gradient(120deg,rgba(25,44,73,.82),rgba(10,13,26,.42)); }
.product-identity, .product-state { position:relative; z-index:2; }
.product-identity { display:flex; align-items:center; gap:34px; }
.product-identity img { width:132px; height:132px; flex:0 0 auto; border-radius:31px; object-fit:cover; box-shadow:0 22px 55px rgba(0,12,29,.46); }
.product-identity span { color:#6e7f9c; font-size:8px; font-weight:700; letter-spacing:.2em; }
.product-identity h3 { margin:13px 0 9px; font-size:38px; font-weight:500; letter-spacing:-.035em; }
.product-identity p { margin:0; color:var(--muted); font-size:13px; line-height:1.8; }
.product-state { min-width:130px; display:flex; align-items:center; justify-content:flex-end; gap:12px; color:#bfd6e7; }
.product-state i { width:7px; height:7px; border-radius:50%; background:#8bbcd3; box-shadow:0 0 18px rgba(139,188,211,.62); }
.product-state strong { font-size:12px; font-weight:500; letter-spacing:.12em; }

.cta-section { position: relative; height: 510px; display: grid; place-items: center; overflow: hidden; border-top: 1px solid var(--line); }
.cta-section::before { content:""; position:absolute; inset:0; background-image: linear-gradient(rgba(129,145,232,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(129,145,232,.055) 1px,transparent 1px); background-size:74px 74px; mask-image:radial-gradient(circle at 50% 50%,#000,transparent 72%); }
.cta-glow { position: absolute; width: 560px; height: 270px; left: 50%; top: 55%; transform: translate(-50%,-50%); background: radial-gradient(ellipse, rgba(66,75,216,.28), transparent 66%); filter: blur(10px); }
.cta-inner { position: relative; z-index: 2; text-align: center; }
.cta-inner h2 { margin: 18px 0 32px; font-size: 50px; line-height: 1.28; font-weight: 520; letter-spacing: -.04em; }
.cta-actions { display: flex; justify-content: center; gap: 12px; }

.site-footer { padding: 65px 0 26px; border-top: 1px solid var(--line); background: #050710; }
.footer-main { display: grid; grid-template-columns: 1.7fr .65fr 1fr; gap: 80px; padding-bottom: 55px; }
.footer-main > div:first-child > p { margin: 25px 0 0; color: #777e91; font-size: 12px; line-height: 1.8; }
.footer-nav, .footer-contact { display: flex; flex-direction: column; gap: 13px; color: #aeb3c2; font-size: 12px; }
.footer-nav > span, .footer-contact > span { margin-bottom: 8px; color: #596077; font-size: 8px; letter-spacing: .2em; }
.footer-nav a:hover, .footer-contact a:hover { color: var(--cyan); }
.footer-contact p { margin: 0; color: #6f768c; }
.footer-bottom { display: flex; justify-content: space-between; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.06); color: #4e556a; font-size: 8px; letter-spacing: .13em; }
.footer-legal { display: flex; align-items: center; gap: 22px; }
.footer-legal a { color: #737b92; transition: color .25s; }
.footer-legal a:hover { color: var(--cyan); }

.page-hero { position: relative; padding-top: 90px; overflow: hidden; border-bottom: 1px solid var(--line); }
.page-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 72% 35%, rgba(68,73,196,.18), transparent 28%); }
.page-hero-inner { position: relative; z-index: 2; height: 615px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; }
.page-hero h1 { margin: 25px 0 0; font-size: 64px; line-height: 1.28; letter-spacing: -.05em; font-weight: 520; }
.about-hero-panel { position:relative; justify-self:end; width:440px; min-height:420px; padding:30px 32px; overflow:hidden; border:1px solid rgba(126,143,235,.2); background:linear-gradient(145deg,rgba(24,29,57,.54),rgba(8,10,21,.24)); box-shadow:0 28px 70px rgba(0,0,0,.2); }
.about-hero-panel::before { content:"SP"; position:absolute; right:-15px; bottom:-54px; color:transparent; -webkit-text-stroke:1px rgba(126,143,235,.1); font-size:200px; font-weight:800; letter-spacing:-.12em; }
.about-panel-top { position:relative; z-index:2; display:flex; justify-content:space-between; color:#586482; font-size:8px; letter-spacing:.2em; }
.about-hero-panel > p { position:relative; z-index:2; margin:70px 0 20px; color:#6f7ca5; font-size:8px; font-weight:700; letter-spacing:.24em; }
.about-panel-words { position:relative; z-index:2; display:flex; flex-direction:column; align-items:flex-start; }
.about-panel-words strong { color:#dce2f1; font-size:40px; line-height:1.22; font-weight:470; letter-spacing:-.04em; }
.about-panel-words strong:nth-child(2) { color:transparent; background:linear-gradient(90deg,#78c8ff,#8d75ff); -webkit-background-clip:text; background-clip:text; }
.about-panel-foot { position:absolute; z-index:2; left:32px; right:32px; bottom:28px; display:flex; align-items:center; gap:14px; color:#68718c; font-size:7px; line-height:1.7; letter-spacing:.17em; }
.about-panel-foot i { width:35px; height:1px; background:linear-gradient(90deg,var(--blue),var(--violet)); }
.hero-statement { position: relative; z-index: 3; height: 118px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); }
.hero-statement span { color: #596079; font-size: 8px; letter-spacing: .22em; }.hero-statement p { margin: 0; font-size: 20px; line-height: 1.55; text-align: right; }
.intro-section { background: #070914; }
.intro-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: 120px; }
.intro-grid > div:first-child { position: relative; min-height: 330px; }
.section-number { position: absolute; left: 0; bottom: 0; color: transparent; -webkit-text-stroke: 1px rgba(128,142,206,.15); font-size: 100px; font-weight: 700; }
.intro-copy { max-width: 700px; }
.intro-copy .large-copy { margin-top: 0; color: #e2e6f2; font-size: 22px; line-height: 1.75; }
.intro-copy > p:not(.large-copy) { color: var(--muted); font-size: 13px; line-height: 2; }
.intro-copy .closing-copy { margin-top: 28px; padding-left: 18px; border-left: 2px solid #6876df; color: #d8dded; font-size: 15px; }
.approach-section { border-top: 1px solid var(--line); background: radial-gradient(circle at 50% 60%, rgba(42,49,126,.12), transparent 38%); }
.approach-grid { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.approach-grid article { position: relative; min-height: 340px; padding: 28px 26px 34px; border-right: 1px solid var(--line); background: linear-gradient(145deg,rgba(18,22,43,.3),rgba(8,10,20,.14)); }
.approach-grid article:first-child { border-left: 1px solid var(--line); }
.approach-index { display: flex; justify-content: space-between; color: #657092; font-size: 8px; letter-spacing: .17em; }
.approach-index i { font-style: normal; }
.approach-path { position: relative; height: 115px; display: flex; align-items: center; }
.approach-path::before { content: ""; width: 100%; height: 1px; background: linear-gradient(90deg,#5466c5,rgba(84,102,197,.08)); }
.approach-path span { position: absolute; left: 0; width: 9px; height: 9px; border: 1px solid #79aaff; transform: rotate(45deg); background: #0b0e1c; box-shadow: 0 0 18px rgba(91,135,255,.5); }
.approach-grid h3 { margin: 25px 0 14px; font-size: 19px; font-weight: 500; }
.approach-grid p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.85; }
.scene-section { min-height: 680px; overflow: hidden; border-top: 1px solid var(--line); background: linear-gradient(135deg,#080a16,#0b0d1d); }
.scene-word { position: absolute; left: 50%; top: -40px; color: transparent; -webkit-text-stroke: 1px rgba(128,142,206,.07); font-size: 170px; font-weight: 800; letter-spacing: -.08em; }
.scene-layout { position: relative; z-index: 2; display: grid; grid-template-columns: .7fr 1.3fr; gap: 110px; }
.scene-layout > div:first-child h2 { margin: 17px 0 28px; font-size: 43px; line-height: 1.35; font-weight: 500; }
.scene-layout > div:first-child > p:last-child { color: var(--muted); font-size: 13px; line-height: 1.9; }
.scene-list { border-top: 1px solid var(--line); }
.scene-row { display: grid; grid-template-columns: 45px 175px 1fr; align-items: center; min-height: 105px; border-bottom: 1px solid var(--line); }
.scene-row > span { color: #596483; font-size: 8px; }
.scene-row i { color: #5f6b93; font-size: 7px; font-style: normal; letter-spacing: .14em; }
.scene-row h3 { margin: 7px 0 0; font-size: 20px; font-weight: 500; }
.scene-row > p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.8; }
.about-vision { position: relative; min-height: 500px; display: grid; place-items: center; overflow: hidden; border-top: 1px solid var(--line); text-align: center; }
.about-vision::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(129,145,232,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(129,145,232,.05) 1px,transparent 1px); background-size: 74px 74px; mask-image: radial-gradient(circle at 50% 50%,#000,transparent 70%); }
.vision-glow { position: absolute; left: 50%; top: 50%; width: 600px; height: 280px; transform: translate(-50%,-50%); background: radial-gradient(ellipse,rgba(66,75,216,.22),transparent 66%); }
.vision-inner { position: relative; z-index: 2; }
.vision-inner h2 { margin: 18px 0 20px; font-size: 48px; line-height: 1.3; font-weight: 500; }
.vision-inner > p:not(.kicker) { margin: 0 0 28px; color: var(--muted); font-size: 13px; line-height: 1.9; }
.principles-section { border-top: 1px solid var(--line); }
.principle-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.principle-grid article { position: relative; min-height: 370px; padding: 28px 30px; border: 1px solid var(--line); background: linear-gradient(145deg, rgba(18,22,43,.36), rgba(8,10,20,.2)); overflow: hidden; transition: border-color .3s, transform .3s; }
.principle-grid article:hover { border-color: rgba(116,133,235,.4); transform: translateY(-5px); }
.principle-top { display: flex; justify-content: space-between; color: #6b7390; font-size: 8px; letter-spacing: .2em; }.principle-top i { font-style: normal; }
.principle-symbol { height: 170px; display: grid; place-items: center; }
.principle-symbol span { width: 78px; height: 78px; display: grid; place-items: center; border: 1px solid rgba(111,134,252,.4); border-radius: 50%; color: #84b6ff; font-size: 28px; box-shadow: inset 0 0 35px rgba(72,74,186,.18), 0 0 25px rgba(72,74,186,.12); }
.principle-grid h3 { margin: 15px 0; font-size: 23px; font-weight: 500; }.principle-grid p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.8; }
.business-section { min-height: 570px; display: flex; align-items: center; border-top: 1px solid var(--line); background: linear-gradient(135deg,#080a16,#0b0d1d); overflow: hidden; }
.business-bg-text { position: absolute; right: -25px; top: 8px; color: transparent; -webkit-text-stroke: 1px rgba(129,145,214,.06); font-size: 150px; font-weight: 800; letter-spacing: -.08em; }
.business-inner { position: relative; z-index: 2; }
.business-inner > div:first-child { display: flex; align-items: flex-end; justify-content: space-between; }
.business-inner h2 { margin: 16px 0 54px; font-size: 39px; font-weight: 500; }
.business-columns { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--line); }
.business-columns > div { padding: 34px 35px 10px 0; min-height: 190px; border-right: 1px solid var(--line); }.business-columns > div + div { padding-left: 35px; }
.business-columns span { color: #5c668c; font-size: 9px; letter-spacing: .2em; }.business-columns h3 { font-size: 20px; font-weight: 500; }.business-columns p { color: var(--muted); font-size: 12px; line-height: 1.8; }
.mini-cta { padding: 90px 0; border-top: 1px solid var(--line); }
.mini-cta .shell { display: flex; align-items: center; justify-content: space-between; }.mini-cta h2 { margin: 14px 0 0; font-size: 36px; line-height: 1.4; font-weight: 500; }

.contact-hero { height:460px; display:flex; align-items:center; border-bottom:0; }
.contact-hero::after { content:"CONTACT"; position:absolute; right:calc(50% - 600px); bottom:-37px; color:transparent; -webkit-text-stroke:1px rgba(121,136,207,.07); font-size:145px; font-weight:800; letter-spacing:-.06em; }
.contact-hero-inner { position:relative; z-index:3; height:auto; display:flex; align-items:center; }
.contact-hero-copy { padding-top:20px; }
.contact-hero h1 { font-size:58px; line-height:1.2; }.contact-hero .hero-lead { margin-top:20px; }
.contact-info-section { padding:34px 0 64px; background:linear-gradient(115deg,rgba(35,42,94,.13),transparent 45%),#070914; }
.contact-info-heading { display:grid; grid-template-columns:.9fr 1.1fr; align-items:end; gap:80px; margin-bottom:26px; }
.contact-info-heading h2 { margin:11px 0 0; font-size:25px; line-height:1.45; font-weight:500; letter-spacing:-.025em; }
.contact-info-heading > p { margin:0; max-width:460px; color:var(--muted); font-size:11px; line-height:1.9; }
.contact-info-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.contact-info-item { position:relative; min-height:150px; padding:28px 30px; display:grid; grid-template-columns:105px minmax(0,1fr); align-items:center; gap:28px; background:linear-gradient(rgba(113,136,235,.32),rgba(113,136,235,.32)) left top/54px 1px no-repeat,linear-gradient(rgba(113,136,235,.32),rgba(113,136,235,.32)) left top/1px 54px no-repeat,linear-gradient(rgba(113,136,235,.18),rgba(113,136,235,.18)) right top/54px 1px no-repeat,linear-gradient(rgba(113,136,235,.18),rgba(113,136,235,.18)) right top/1px 54px no-repeat,linear-gradient(rgba(113,136,235,.16),rgba(113,136,235,.16)) left bottom/54px 1px no-repeat,linear-gradient(rgba(113,136,235,.16),rgba(113,136,235,.16)) left bottom/1px 54px no-repeat,linear-gradient(rgba(113,136,235,.28),rgba(113,136,235,.28)) right bottom/54px 1px no-repeat,linear-gradient(rgba(113,136,235,.28),rgba(113,136,235,.28)) right bottom/1px 54px no-repeat,linear-gradient(145deg,rgba(20,24,47,.28),rgba(8,10,20,.1)); }
.contact-info-item h3 { margin:0; color:#7f889f; font-size:13px; font-weight:500; letter-spacing:.05em; }
.contact-info-item p { margin:0; color:#d9deeb; font-size:15px; line-height:1.8; letter-spacing:.01em; }

.app-detail-page { background:#060812; }
.app-detail-hero { position:relative; min-height:760px; padding-top:90px; display:flex; align-items:center; overflow:hidden; border-bottom:1px solid var(--line); background:radial-gradient(circle at 76% 44%,rgba(56,105,150,.19),transparent 30%),radial-gradient(circle at 25% 40%,rgba(45,56,124,.16),transparent 35%),#060812; }
.app-detail-hero::after { content:"OPEN SLEEP"; position:absolute; right:-35px; bottom:-40px; color:transparent; -webkit-text-stroke:1px rgba(125,153,208,.06); font-size:146px; font-weight:800; letter-spacing:-.07em; }
.app-detail-hero-inner { position:relative; z-index:2; display:grid; grid-template-columns:1fr 470px; align-items:center; gap:95px; padding-block:70px; }
.app-detail-status { width:fit-content; margin-top:36px; display:flex; align-items:center; gap:10px; color:#9bb9ca; font-size:9px; font-weight:700; letter-spacing:.18em; }
.app-detail-status i { width:7px; height:7px; border-radius:50%; background:#8bbcd3; box-shadow:0 0 16px rgba(139,188,211,.55); }
.app-detail-copy h1 { margin:25px 0 22px; font-size:92px; line-height:1; font-weight:520; letter-spacing:-.07em; }
.app-detail-tagline { margin:0; color:#b7becc; font-size:28px; line-height:1.55; letter-spacing:-.025em; }
.app-icon-stage { position:relative; width:470px; height:470px; display:grid; place-items:center; border:1px solid rgba(113,145,205,.18); background:linear-gradient(145deg,rgba(22,38,58,.64),rgba(6,9,18,.24)); box-shadow:0 42px 90px rgba(0,0,0,.28); }
.app-icon-stage::before, .app-icon-stage::after { content:""; position:absolute; width:62px; height:62px; }
.app-icon-stage::before { left:-1px; top:-1px; border-left:1px solid rgba(123,174,214,.65); border-top:1px solid rgba(123,174,214,.65); }
.app-icon-stage::after { right:-1px; bottom:-1px; border-right:1px solid rgba(123,174,214,.45); border-bottom:1px solid rgba(123,174,214,.45); }
.app-icon-stage > span { position:absolute; left:24px; top:24px; color:#60728d; font-size:7px; letter-spacing:.22em; }
.app-icon-stage img { width:280px; height:280px; border-radius:64px; object-fit:cover; box-shadow:0 34px 75px rgba(0,9,21,.55); }
.app-icon-stage > div { position:absolute; left:24px; right:24px; bottom:24px; display:flex; align-items:center; gap:14px; color:#61738c; font-size:7px; letter-spacing:.2em; }
.app-icon-stage > div i { flex:1; height:1px; background:linear-gradient(90deg,rgba(102,151,191,.42),transparent); }

.app-story-section { background:linear-gradient(135deg,#070a14,#09111a); }
.app-story-grid { display:grid; grid-template-columns:.72fr 1.28fr; gap:115px; }
.app-story-grid > div:first-child { position:relative; min-height:390px; }
.app-story-grid h2 { margin:18px 0 0; font-size:46px; line-height:1.38; font-weight:500; letter-spacing:-.04em; }
.app-story-number { position:absolute; left:0; bottom:0; color:transparent; -webkit-text-stroke:1px rgba(128,151,203,.14); font-size:108px; font-weight:700; }
.app-story-copy { max-width:680px; }
.app-story-lead { margin:0 0 24px; color:#e1e7ee; font-size:24px; line-height:1.75; }
.app-story-copy > p:not(.app-story-lead):not(.app-closing-copy) { margin:0; color:var(--muted); font-size:14px; line-height:2; }
.app-feature-block { margin-top:52px; }
.app-feature-block > span { display:block; margin-bottom:18px; color:#73849b; font-size:9px; font-weight:700; letter-spacing:.2em; }
.app-feature-block ul { margin:0; padding:0; list-style:none; border-top:1px solid var(--line); }
.app-feature-block li { min-height:72px; display:grid; grid-template-columns:48px 1fr; align-items:center; border-bottom:1px solid var(--line); }
.app-feature-block li i { color:#566784; font-size:8px; font-style:normal; letter-spacing:.13em; }
.app-feature-block li p { margin:0; color:#c8ced9; font-size:14px; }
.app-closing-copy { margin:38px 0 0; padding-left:20px; border-left:2px solid #74a5c0; color:#dce5ec; font-size:17px; line-height:1.8; }

.app-screens-section { overflow:hidden; border-top:1px solid var(--line); background:#050710; }
.app-screenshot-grid { display:grid; grid-template-columns:repeat(3,1fr); align-items:start; gap:28px; }
.app-shot { min-width:0; margin:0; }
.app-shot-image { position:relative; overflow:hidden; border:1px solid rgba(128,151,200,.18); border-radius:28px; background:#091019; box-shadow:0 30px 70px rgba(0,0,0,.25); }
.app-shot-image::after { content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit; box-shadow:inset 0 0 0 1px rgba(255,255,255,.035); }
.app-shot-image img { display:block; width:100%; height:auto; }
.app-shot figcaption { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:20px 4px 0; }
.app-shot figcaption span { color:#62718a; font-size:8px; letter-spacing:.16em; }
.app-shot figcaption p { margin:0; color:#aeb6c5; font-size:11px; text-align:right; }

.app-coming-section { position:relative; min-height:430px; display:flex; align-items:center; overflow:hidden; border-top:1px solid var(--line); background:radial-gradient(circle at 50% 58%,rgba(54,87,131,.18),transparent 42%),#060812; }
.app-coming-section::before { content:""; position:absolute; inset:0; opacity:.35; background-image:linear-gradient(rgba(128,151,207,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(128,151,207,.06) 1px,transparent 1px); background-size:68px 68px; mask-image:radial-gradient(circle at 50% 50%,#000,transparent 74%); }
.app-coming-inner { position:relative; z-index:2; display:flex; align-items:flex-end; justify-content:space-between; gap:60px; }
.app-coming-inner h2 { margin:18px 0 0; font-size:48px; line-height:1.3; font-weight:500; letter-spacing:-.04em; }

.legal-page { background:#070914; }
.legal-hero { position:relative; min-height:610px; padding-top:90px; display:flex; align-items:center; overflow:hidden; border-bottom:1px solid var(--line); background:radial-gradient(circle at 72% 28%,rgba(69,73,198,.18),transparent 30%),#060812; }
.legal-hero::after { content:""; position:absolute; right:calc(50% - 590px); top:155px; width:390px; height:390px; border:1px solid rgba(106,126,237,.13); border-radius:50%; box-shadow:inset 0 0 90px rgba(70,76,195,.06); }
.legal-glow { position:absolute; right:calc(50% - 445px); top:260px; width:110px; height:110px; border-radius:50%; background:radial-gradient(circle at 35% 30%,#b5ebff,#706ce8 27%,#292361 66%); box-shadow:0 0 75px rgba(80,79,220,.5); animation:float 7s ease-in-out infinite; }
.legal-hero-inner { position:relative; z-index:2; padding-top:20px; }
.legal-hero h1 { margin:26px 0 16px; font-size:68px; line-height:1.2; font-weight:520; letter-spacing:-.05em; }
.legal-subtitle { margin:0; color:var(--muted); font-size:15px; line-height:2; }
.legal-meta { display:flex; align-items:center; gap:18px; margin-top:46px; color:#606983; font-size:9px; letter-spacing:.14em; }
.legal-meta strong { color:#a9b0c4; font-size:10px; font-weight:500; }
.legal-body-section { padding:105px 0 135px; }
.legal-layout { display:grid; grid-template-columns:260px 1fr; gap:105px; align-items:start; }
.legal-aside { position:sticky; top:38px; }
.legal-aside > div { padding:26px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.legal-aside > div > p { margin:0 0 20px; color:#59627f; font-size:8px; letter-spacing:.22em; }
.legal-aside nav { display:flex; flex-direction:column; gap:0; }
.legal-aside nav a { display:grid; grid-template-columns:28px 1fr; padding:9px 0; color:#81899e; font-size:11px; line-height:1.45; transition:color .25s,padding .25s; }
.legal-aside nav a span { color:#4f5b83; font-size:8px; padding-top:3px; }
.legal-aside nav a:hover { color:#dce3f5; padding-left:4px; }
.legal-content { min-width:0; }
.legal-summary { margin-bottom:58px; padding:28px 32px; border:1px solid rgba(112,133,241,.22); border-left:2px solid #6677e8; background:linear-gradient(110deg,rgba(47,56,128,.22),rgba(15,18,36,.45)); }
.legal-summary p { margin:0; color:#aeb5c9; font-size:13px; line-height:1.95; }
.legal-summary .legal-summary-label { margin-bottom:10px; color:#8da8ff; font-size:8px; font-weight:700; letter-spacing:.22em; }
.legal-section { scroll-margin-top:35px; padding:0 0 58px; margin-bottom:58px; border-bottom:1px solid var(--line); }
.legal-section:last-child { margin-bottom:0; }
.legal-section-title { display:grid; grid-template-columns:48px 1fr; align-items:baseline; margin-bottom:26px; }
.legal-section-title > span { color:#59678f; font-size:9px; letter-spacing:.16em; }
.legal-section-title h2 { margin:0; font-size:28px; font-weight:500; letter-spacing:-.025em; }
.legal-copy { padding-left:48px; }
.legal-copy p { margin:0 0 18px; color:#9ca4ba; font-size:13px; line-height:2; }
.legal-copy h3 { margin:29px 0 12px; color:#d8ddea; font-size:15px; font-weight:500; }
.legal-copy h3:first-child { margin-top:0; }
.legal-copy ul { margin:0 0 20px; padding-left:20px; color:#9ca4ba; }
.legal-copy li { padding-left:5px; margin:8px 0; font-size:13px; line-height:1.85; }
.legal-copy strong { color:#dfe5f5; font-weight:500; }
.legal-copy a { color:#8bb9ff; border-bottom:1px solid rgba(139,185,255,.35); }

[data-reveal] { opacity:0; transform:translateY(24px); transition:opacity .7s ease var(--delay,0ms),transform .7s ease var(--delay,0ms); }
[data-reveal].is-visible { opacity:1; transform:none; }
.enter { opacity:0; animation:enter .75s cubic-bezier(.2,.7,.2,1) forwards; animation-delay:var(--delay,0ms); }
@keyframes enter { to { opacity:1; transform:none; } from { opacity:0; transform:translateY(18px); } }
@keyframes dataScan { 0%,100% { transform:translateX(0); opacity:.15; } 50% { transform:translateX(414px); opacity:.85; } }
@keyframes dataPulse { 0%,100% { opacity:.35; } 50% { opacity:1; } }
@keyframes float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-12px); } }
@keyframes scrollPulse { 0%,100% { opacity:.35; transform:scaleY(.6); transform-origin:top; } 50% { opacity:1; transform:scaleY(1); } }

/* 平板与窄屏桌面 */
@media (max-width: 1180px) {
  :root { --shell: 100%; }
  .shell { width: calc(100% - 64px); }
  .scroll-cue { left: 32px; }
  .hero-architecture { left:auto; right:32px; width:430px; transform:scale(.88); transform-origin:center right; }
  .hero h1 { font-size:60px; }
  .app-detail-hero-inner { grid-template-columns:1fr 410px; gap:55px; }
  .app-icon-stage { width:410px; height:410px; }
  .app-icon-stage img { width:250px; height:250px; }
  .app-story-grid { gap:70px; }
  .philosophy-grid { gap:55px; }
  .visual-stage { transform:perspective(900px) rotateY(-8deg) scale(.88); transform-origin:center left; }
  .footer-main { grid-template-columns:1.35fr .6fr 1fr; gap:45px; }
  .page-hero-inner { grid-template-columns:.9fr 1.1fr; gap:45px; }
  .about-hero-panel { width:100%; max-width:440px; }
  .intro-grid { gap:70px; }
  .scene-layout { gap:60px; }
  .legal-layout { grid-template-columns:220px 1fr; gap:65px; }
  .legal-hero::after { right:-80px; }
  .legal-glow { right:90px; }
}

/* 平板竖屏与大屏手机 */
@media (max-width: 900px) {
  .shell { width:calc(100% - 48px); }
  .site-header { height:78px; }
  .header-inner { display:flex; justify-content:space-between; }
  .site-header nav { gap:28px; }

  .hero { height:auto; min-height:720px; padding:155px 0 110px; align-items:flex-start; }
  .hero-content { padding-top:0; }
  .hero-architecture { top:190px; right:-100px; width:430px; opacity:.28; transform:scale(.82); }
  .hero h1 { font-size:clamp(52px,8vw,66px); }
  .hero-lead { max-width:560px; }
  .scroll-cue { left:24px; }

  .section { padding:95px 0; }
  .section-heading, .direction-top { margin-bottom:44px; }
  .capability-card { min-height:315px; padding-inline:28px; }
  .capability-card h3 { margin-top:125px; }
  .line-icon { left:28px; }
  .card-line { left:28px; right:28px; }

  .philosophy-section { padding:110px 0; }
  .philosophy-grid { grid-template-columns:1fr; gap:60px; }
  .philosophy-grid > div:first-child { max-width:600px; }
  .philosophy-visual { max-width:560px; width:100%; }
  .visual-stage { transform:none; }
  .direction-row { grid-template-columns:70px 1fr 130px; }
  .product-row { min-height:205px; padding:32px; }
  .product-identity { gap:26px; }
  .product-identity img { width:112px; height:112px; border-radius:27px; }
  .product-identity h3 { font-size:34px; }
  .cta-section { height:470px; }

  .footer-main { grid-template-columns:1fr 1fr; gap:45px 70px; }
  .footer-main > div:first-child { grid-column:1 / -1; }
  .footer-bottom { align-items:flex-start; gap:30px; }
  .footer-legal { flex-wrap:wrap; justify-content:flex-end; }

  .page-hero { padding-top:78px; }
  .page-hero-inner { height:auto; padding:95px 0 65px; grid-template-columns:1fr; gap:55px; }
  .page-hero h1 { font-size:56px; }
  .about-hero-panel { justify-self:start; max-width:520px; }
  .hero-statement { height:auto; min-height:110px; padding:26px 0; }
  .intro-grid { grid-template-columns:1fr; gap:38px; }
  .intro-grid > div:first-child { min-height:0; padding-bottom:25px; }
  .section-number { left:auto; right:0; bottom:-10px; font-size:78px; }
  .approach-grid { grid-template-columns:repeat(2,1fr); }
  .approach-grid article:nth-child(3) { border-left:1px solid var(--line); }
  .scene-section { min-height:0; }
  .scene-layout { grid-template-columns:1fr; gap:50px; }
  .scene-layout > div:first-child { max-width:520px; }
  .scene-word { left:20%; font-size:130px; }
  .principle-grid { grid-template-columns:1fr; }
  .principle-grid article { min-height:300px; }
  .business-columns { grid-template-columns:1fr; }
  .business-columns > div, .business-columns > div + div { min-height:0; padding:30px 0; border-right:0; border-bottom:1px solid var(--line); }
  .mini-cta .shell { align-items:flex-start; gap:35px; }

  .contact-hero { height:auto; min-height:430px; padding-top:78px; }
  .contact-hero-inner { padding:85px 0 70px; }
  .contact-hero::after { right:-45px; font-size:115px; }
  .contact-info-section { padding:45px 0 70px; }
  .contact-info-heading { grid-template-columns:1fr; align-items:start; gap:16px; }
  .contact-info-grid { gap:18px; }
  .contact-info-item { min-height:145px; padding:26px; grid-template-columns:1fr; align-content:center; gap:12px; }
  .contact-info-item p { overflow-wrap:anywhere; }

  .app-detail-hero { min-height:680px; padding-top:78px; }
  .app-detail-hero-inner { grid-template-columns:.9fr 1.1fr; gap:38px; padding-block:62px; }
  .app-detail-copy h1 { font-size:72px; }
  .app-detail-tagline { font-size:23px; }
  .app-icon-stage { width:100%; height:auto; aspect-ratio:1; }
  .app-icon-stage img { width:62%; height:auto; border-radius:22%; }
  .app-story-grid { grid-template-columns:1fr; gap:42px; }
  .app-story-grid > div:first-child { min-height:0; padding-bottom:25px; }
  .app-story-number { left:auto; right:0; bottom:-10px; font-size:82px; }
  .app-story-copy { max-width:none; }
  .app-screenshot-grid { gap:18px; }
  .app-shot-image { border-radius:22px; }
  .app-coming-inner { align-items:flex-start; }

  .legal-hero { min-height:530px; padding-top:78px; }
  .legal-hero h1 { font-size:60px; }
  .legal-body-section { padding:80px 0 110px; }
  .legal-layout { grid-template-columns:1fr; gap:50px; }
  .legal-aside { position:static; }
  .legal-aside nav { display:grid; grid-template-columns:repeat(2,1fr); column-gap:30px; }
}

/* 手机 */
@media (max-width: 640px) {
  .shell { width:calc(100% - 32px); }
  .site-header { height:68px; }
  .brand { gap:8px; }
  .brand-mark { width:30px; height:30px; transform:rotate(45deg) scale(.88); }
  .brand-name small { display:none; }
  .brand-name strong { font-size:13px; }
  .site-header nav { gap:14px; }
  .site-header nav a { font-size:11px; white-space:nowrap; }

  .hero { min-height:0; padding:128px 0 80px; }
  .hero::before { background:radial-gradient(circle at 72% 28%,rgba(81,85,224,.18),transparent 36%); }
  .hero-grid, .page-hero-grid { background-size:44px 44px; mask-image:linear-gradient(90deg,transparent,#000 42%,transparent); }
  .hero-architecture { display:none; }
  .hero h1 { margin:24px 0 22px; font-size:clamp(40px,12vw,52px); line-height:1.2; }
  .hero-lead { font-size:14px; line-height:1.85; }
  .hero-lead br { display:none; }
  .hero-actions { align-items:flex-start; flex-direction:column; gap:22px; margin-top:32px; }
  .button { min-width:168px; min-height:48px; }
  .scroll-cue { display:none; }

  .section { padding:76px 0; }
  .section-heading, .direction-top { align-items:flex-start; flex-direction:column; gap:20px; margin-bottom:35px; }
  .section-heading h2, .direction-top h2, .intro-grid h2, .contact-layout h2 { font-size:31px; }
  .section-heading > p br, .direction-top > p br { display:none; }
  .capability-grid { grid-template-columns:1fr; }
  .capability-card { min-height:245px; padding:28px 26px; border-left:1px solid var(--line); border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
  .capability-card h3 { margin:105px 0 12px; }
  .line-icon { top:72px; left:26px; transform:scale(.85); transform-origin:left top; }
  .card-line { left:26px; right:26px; }

  .philosophy-section { padding:82px 0; }
  .philosophy-grid { gap:45px; }
  .philosophy-grid h2 { font-size:38px; }
  .body-copy { font-size:13px; }
  .philosophy-visual { height:330px; }
  .visual-word { top:-15px; right:-10px; font-size:94px; }
  .visual-stage { inset:28px 0 0; }
  .visual-stage::before { left:0; bottom:3px; width:100%; height:130px; }
  .stage-card { width:190px; height:250px; }
  .stage-card-back { left:0; top:58px; }
  .stage-card-main { left:auto; right:0; top:20px; padding:22px; }
  .stage-card-main p { left:22px; bottom:38px; font-size:25px; }
  .tiny-orb { width:60px; height:60px; }

  .direction-row { height:auto; min-height:108px; padding:22px 0; grid-template-columns:38px 1fr; row-gap:9px; }
  .direction-row:hover { padding-inline:8px; }
  .direction-row h3 { font-size:21px; overflow-wrap:anywhere; }
  .direction-row p { grid-column:2; margin:0; }
  .product-heading { margin-bottom:30px; }
  .product-row { min-height:0; padding:24px; align-items:flex-start; flex-direction:column; gap:24px; }
  .product-identity { width:100%; align-items:center; gap:18px; }
  .product-identity img { width:84px; height:84px; border-radius:21px; }
  .product-identity span { font-size:7px; letter-spacing:.14em; }
  .product-identity h3 { margin:8px 0 5px; font-size:29px; }
  .product-identity p { font-size:12px; }
  .product-state { min-width:0; align-self:flex-end; }
  .cta-section { height:430px; }
  .cta-inner h2 { font-size:36px; }
  .cta-actions { align-items:center; flex-direction:column; }
  .cta-actions .button { width:min(240px,100%); }

  .site-footer { padding-top:52px; }
  .footer-main { grid-template-columns:1fr; gap:38px; padding-bottom:42px; }
  .footer-main > div:first-child { grid-column:auto; }
  .footer-nav { flex-flow:row wrap; gap:14px 22px; }
  .footer-nav > span { flex-basis:100%; }
  .footer-contact a { overflow-wrap:anywhere; }
  .footer-bottom { flex-direction:column; gap:20px; line-height:1.7; }
  .footer-legal { justify-content:flex-start; gap:14px 20px; }
  .footer-legal > span { flex-basis:100%; }

  .page-hero { padding-top:68px; }
  .page-hero-inner { padding:68px 0 48px; gap:42px; }
  .page-hero h1 { font-size:clamp(39px,11vw,48px); line-height:1.24; }
  .about-hero-panel { min-height:330px; padding:24px; }
  .about-hero-panel > p { margin-top:50px; }
  .about-panel-words strong { font-size:32px; }
  .about-panel-foot { left:24px; right:24px; bottom:22px; }
  .hero-statement { align-items:flex-start; flex-direction:column; gap:15px; padding:24px 0; }
  .hero-statement p { font-size:17px; text-align:left; }
  .intro-grid { gap:25px; }
  .intro-copy .large-copy { font-size:18px; line-height:1.75; }
  .intro-copy > p:not(.large-copy) { line-height:1.9; }
  .section-number { font-size:66px; }
  .approach-grid { grid-template-columns:1fr; }
  .approach-grid article, .approach-grid article:nth-child(3) { min-height:285px; border-left:1px solid var(--line); }
  .scene-word { left:-20px; top:0; font-size:84px; }
  .scene-layout { gap:38px; }
  .scene-layout > div:first-child h2 { font-size:35px; }
  .scene-row { padding:20px 0; grid-template-columns:34px 1fr; min-height:0; row-gap:14px; }
  .scene-row > p { grid-column:2; }
  .vision-inner h2 { font-size:36px; }
  .vision-inner > p:not(.kicker) br { display:none; }
  .about-vision { min-height:450px; }
  .business-inner > div:first-child { align-items:flex-start; flex-direction:column; }
  .business-inner h2 { font-size:32px; }
  .mini-cta { padding:70px 0; }
  .mini-cta .shell { flex-direction:column; }
  .mini-cta h2 { font-size:30px; }

  .contact-hero { min-height:390px; padding-top:68px; }
  .contact-hero-inner { padding:60px 0 48px; }
  .contact-hero h1 { font-size:clamp(38px,11vw,48px); }
  .contact-hero::after { right:-20px; bottom:-10px; font-size:72px; }
  .contact-info-section { padding:38px 0 58px; }
  .contact-info-grid { grid-template-columns:1fr; }
  .contact-info-heading h2 { font-size:23px; }
  .contact-info-item { min-height:135px; padding:24px; }
  .contact-info-item p { font-size:14px; }

  .app-detail-hero { min-height:0; padding-top:68px; }
  .app-detail-hero::after { right:-10px; bottom:-20px; font-size:74px; }
  .app-detail-hero-inner { grid-template-columns:1fr; gap:52px; padding-block:64px 74px; }
  .app-detail-status { margin-top:28px; }
  .app-detail-copy h1 { margin-top:20px; font-size:62px; }
  .app-detail-tagline { font-size:22px; }
  .app-icon-stage { max-width:390px; justify-self:center; }
  .app-icon-stage > span { left:18px; top:18px; }
  .app-icon-stage > div { left:18px; right:18px; bottom:18px; }
  .app-story-grid { gap:28px; }
  .app-story-grid h2 { font-size:36px; }
  .app-story-number { font-size:66px; }
  .app-story-lead { font-size:19px; line-height:1.7; }
  .app-feature-block { margin-top:38px; }
  .app-feature-block li { min-height:68px; grid-template-columns:38px 1fr; }
  .app-feature-block li p { font-size:13px; }
  .app-closing-copy { margin-top:30px; font-size:15px; }
  .app-screens-section .section-heading { margin-bottom:28px; }
  .app-screenshot-grid { width:calc(100% + 16px); display:flex; gap:16px; padding-right:16px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
  .app-screenshot-grid::-webkit-scrollbar { display:none; }
  .app-shot { flex:0 0 82vw; scroll-snap-align:start; }
  .app-shot-image { border-radius:20px; }
  .app-coming-section { min-height:390px; }
  .app-coming-inner { align-items:flex-start; flex-direction:column; gap:36px; }
  .app-coming-inner h2 { font-size:36px; }

  .legal-hero { min-height:450px; padding-top:68px; }
  .legal-hero::after { width:260px; height:260px; right:-130px; top:135px; }
  .legal-glow { display:none; }
  .legal-hero-inner { padding-top:0; }
  .legal-hero h1 { font-size:46px; }
  .legal-subtitle { font-size:14px; }
  .legal-meta { margin-top:34px; }
  .legal-body-section { padding:65px 0 90px; }
  .legal-aside { display:none; }
  .legal-summary { margin-bottom:44px; padding:23px 21px; }
  .legal-section { scroll-margin-top:90px; padding-bottom:43px; margin-bottom:43px; }
  .legal-section-title { grid-template-columns:38px 1fr; margin-bottom:22px; }
  .legal-section-title h2 { font-size:23px; }
  .legal-copy { padding-left:0; }
  .legal-copy p, .legal-copy li { font-size:13px; line-height:1.9; }
}

@media (max-width: 380px) {
  .brand-name { display:none; }
  .site-header nav { gap:10px; }
  .site-header nav a { font-size:10px; }
  .hero h1 { font-size:39px; }
  .product-identity p { display:none; }
  .app-detail-copy h1 { font-size:56px; }
  .app-detail-tagline { font-size:20px; }
  .philosophy-visual { height:300px; }
  .stage-card { width:172px; height:226px; }
  .stage-card-main p { font-size:23px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.01ms !important; }
  [data-reveal] { opacity:1; transform:none; }
}


/* 静态导出：脚本不可用时，内容仍保持可见。 */
html:not(.js) [data-reveal] {
  opacity: 1;
  transform: none;
}
