:root{--ink:#173644;--muted:#61747d;--blue:#dceef7;--blue-deep:#376985;--line:#e1eaee;--pale:#f5f9fb;--white:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit}button,a{touch-action:manipulation}:focus-visible{outline:3px solid #427899;outline-offset:5px}img{max-width:100%;display:block}.wrap,.nav{max-width:1240px;margin:auto;padding-left:40px;padding-right:40px}.nav{height:100px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:27px;font-weight:700;letter-spacing:-1.5px}.brand span{font-weight:450;color:var(--blue-deep)}#navlinks{display:flex;align-items:center;gap:33px;font-size:14px}#navlinks>a:not(.button):hover,.footer a:hover{text-decoration:underline;text-underline-offset:5px}.tiny-dot{display:inline-block;width:5px;height:5px;background:#6f9aaf;border-radius:50%;margin-left:3px;vertical-align:top}.button{display:inline-flex;justify-content:center;align-items:center;gap:24px;min-height:54px;background:var(--ink);color:white;border-radius:30px;font-size:14px;font-weight:600;padding:15px 24px;transition:background .2s,transform .2s}.button:hover{background:#2f596e;transform:translateY(-2px)}.button.small{min-height:43px;padding:12px 21px}.button span{font-size:20px}.text-link{font-size:14px;font-weight:550;display:inline-flex;gap:15px;align-items:center}.text-link:hover{text-decoration:underline;text-underline-offset:5px}.text-link span{font-size:22px}.hero{display:grid;grid-template-columns:1.03fr 1fr;gap:30px;align-items:center;padding-top:58px;padding-bottom:75px}.eyebrow{font-size:10px;font-weight:650;letter-spacing:1.8px;line-height:1.5;margin:0 0 25px}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#70a4be;margin-right:8px}.hero h1{font-size:clamp(54px,5.5vw,76px);font-weight:520;letter-spacing:-4px;line-height:1.05;margin:0 0 28px}.hero h1>span{color:#77a1b6}.lead{font-size:18px;line-height:1.65;color:var(--muted);max-width:410px;margin:0 0 32px}.actions{display:flex;align-items:flex-start;flex-direction:column;gap:23px}.hero-note{font-size:12px;color:var(--muted);margin-top:28px}.hero-art{background:#edf6fb;min-height:565px;border-radius:180px 180px 24px 24px;position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate}.hero-hat{width:113%;max-width:none;position:relative;margin-top:15px}.orbit{position:absolute;width:85%;height:75%;border:1px solid #d7e8f1;border-radius:50%;transform:rotate(-25deg);z-index:-1}.floating-label{position:absolute;top:46px;font-size:11px;letter-spacing:.6px;color:#517a91}.welcome-card{position:absolute;bottom:80px;left:-27px;right:20px;display:flex;align-items:center;gap:15px;padding:23px 20px;background:#fffffff5;border:1px solid #fff;border-radius:18px;box-shadow:0 15px 45px #23445410}.welcome-card b{font-size:15px;display:block;margin-bottom:6px}.welcome-card div>span{font-size:12px;color:#70828b}.mini-icon{font-size:27px;color:#6e9fb8}.round-arrow{display:flex;align-items:center;justify-content:center;width:34px;height:34px;flex-shrink:0;border-radius:50%;background:var(--blue);font-size:20px;color:#335f77}.welcome-card>.round-arrow{margin-left:auto}.service-tag{position:absolute;bottom:34px;font-size:10px;color:#5c7a89;letter-spacing:.6px}.intro-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:26px;padding-bottom:26px;color:var(--muted);font-size:14px}.intro-strip>span{font-size:9px;letter-spacing:1.3px;max-width:140px;line-height:1.6}.intro-strip i{width:4px;height:4px;border-radius:50%;background:#afcbd9}.section{padding-top:100px;padding-bottom:100px}.section-head{max-width:680px;margin-bottom:48px}.section-head h2,h2{font-size:47px;line-height:1.14;letter-spacing:-2px;font-weight:500;margin:0 0 24px}.section-head>p:last-child{max-width:510px;color:var(--muted);font-size:16px;line-height:1.7}.section-head>.eyebrow{color:#64889a}.demo-shell{display:grid;grid-template-columns:1fr 1.15fr;gap:75px;align-items:center}.scenario-list{display:flex;flex-direction:column}.scenario{position:relative;text-align:left;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--ink);padding:28px 35px 28px 0;cursor:pointer}.scenario span{display:block;color:#8499a3;font-size:9px;letter-spacing:1px}.scenario b{display:block;font-size:22px;font-weight:500;letter-spacing:-.5px;margin:12px 0 10px}.scenario small{color:var(--muted);font-size:13px;line-height:1.5}.scenario em{position:absolute;right:7px;top:58px;font-size:24px;font-style:normal;color:#bad1dc}.scenario.active{border-bottom:2px solid #6c9bb5}.scenario.active span,.scenario.active em{color:#376985}.demo-canvas{background:#edf5f9;border-radius:25px;padding:38px 35px 22px}.conversation{max-width:345px;margin:auto;background:white;border:1px solid #d9e7ee;border-radius:24px;box-shadow:0 12px 36px #1539490b;overflow:hidden}.chat-head{display:flex;align-items:center;padding:17px 20px;border-bottom:1px solid #edf1f3;gap:5px}.chat-head img{width:62px;height:62px;object-fit:contain;margin:-7px 0 -7px -10px}.chat-head b{font-size:15px;display:block}.chat-head div>span{display:block;font-size:9px;color:var(--muted);margin-top:3px}.chat-mark{margin-left:auto;font-size:24px;color:#6691a9}#scene-content{padding:21px 19px;min-height:300px}.bubble{font-size:12px;line-height:1.65;padding:12px 14px;border-radius:14px;margin:0 0 15px;max-width:92%}.bubble.guest{margin-left:auto;background:#e1f0f8;border-bottom-right-radius:3px}.bubble.viki{background:#f6f8f9;border-bottom-left-radius:3px}.chat-status{border:1px solid #cbdfe9;border-radius:13px;padding:16px;font-size:12px}.chat-status>span{font-size:9px;color:#698a9b;letter-spacing:.5px}.chat-status b{display:block;font-size:13px;margin:9px 0}.chat-status p{font-size:11px;line-height:1.5;color:var(--muted);margin:8px 0}.chat-status footer{font-size:10px;display:flex;align-items:center;gap:5px;padding-top:9px;color:#376985}.chat-input{margin:0 15px 17px;padding:8px 9px 8px 16px;border:1px solid #e1e9ed;border-radius:30px;display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#7e939e}.sample-label{text-align:center;font-size:9px;letter-spacing:.3px;color:#768e9a;margin:18px 0 0}.team-section{background:#f6f9fa;padding:100px 0}.team-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}.team-visual{max-width:420px}.request-card{width:85%;padding:27px;background:white;border:1px solid #e0eaf0;border-radius:20px}.label-row{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:9px;letter-spacing:1px;color:#75909e}.request-card h3{font-size:27px;font-weight:450;line-height:1.3;margin:20px 0}.request-owner{display:flex;align-items:center;font-size:11px;color:var(--muted)}.request-owner img{width:35px}.connection-line{display:flex;align-items:center;justify-content:center;color:#6c9ab0;width:85%;height:45px;font-size:23px}.connection-line span{width:1px;height:15px;background:#bad3e0;display:none}.team-ticket{margin-left:40px;background:white;border:1px solid #ccdfe9;border-radius:18px;padding:25px}.team-ticket b{display:block;margin-top:20px;font-size:16px}.team-ticket p{font-size:12px;color:var(--muted);margin-bottom:20px}.pill{padding:5px 7px;background:#edf5f3;border-radius:5px;font-size:8px;color:#47796e;letter-spacing:0}.ticket-bottom{display:flex;align-items:center;gap:8px;font-size:10px;color:#768995;border-top:1px solid #eef1f3;padding-top:15px}.ticket-bottom>span:last-child{margin-left:auto;color:#6b998f}.avatar{display:flex;width:25px;height:25px;align-items:center;justify-content:center;border-radius:50%;background:#e6edf4;color:#507087;font-size:9px}.team-copy h2{font-size:40px}.team-copy h2 span{color:#789cae}.team-copy>p:not(.eyebrow){font-size:15px;line-height:1.8;color:var(--muted)}.check-list{padding:5px 0 16px;list-style:none;font-size:12px;color:#496573;line-height:2.5}.check-list li:before{content:'✓';margin-right:12px;color:#719aac}.benefit-head{display:flex;max-width:none;align-items:end;gap:80px;justify-content:space-between}.benefit-head>p{max-width:340px!important;margin-bottom:27px}.benefits{display:grid;grid-template-columns:repeat(3,1fr)}.benefits article{padding:20px 36px 7px 0;border-right:1px solid var(--line);position:relative}.benefits article+article{padding-left:36px}.benefits article:last-child{border-right:0;padding-right:0}.benefit-number{position:absolute;right:32px;top:15px;font-size:10px;color:#9bb4c0}.benefit-symbol{height:65px;width:65px;display:flex;align-items:center;justify-content:center;font-size:43px;background:#edf5f9;border-radius:20px;color:#7ca7bd;margin:4px 0 30px}.benefits h3{font-size:24px;font-weight:500;letter-spacing:-.6px;line-height:1.25;margin:0 0 17px}.benefits p{color:var(--muted);font-size:13px;line-height:1.8;min-height:92px}.benefit-foot{font-size:8px;letter-spacing:1px;color:#819aa6;display:block;padding-top:20px}.closing{background:#e8f3f9;border-radius:30px;margin-top:15px;margin-bottom:65px;padding:65px 75px;display:flex;align-items:center;justify-content:space-between;overflow:hidden;max-width:1160px}.closing h2{font-size:47px}.closing img{width:330px;margin:-45px -15px -45px 20px}.career-strip{border-top:1px solid var(--line);padding-top:30px;padding-bottom:30px;display:flex;align-items:center;gap:40px;justify-content:space-between}.career-strip>span{font-size:8px;letter-spacing:1.4px;color:#7c94a0}.career-strip>p{font-size:18px;line-height:1.4;letter-spacing:-.3px}.career-strip .text-link{font-size:12px}.footer{display:flex;align-items:center;justify-content:space-between;padding-top:45px;padding-bottom:45px;border-top:1px solid var(--line);gap:25px}.footer .brand{font-size:23px}.footer>p,.footer>div{font-size:10px;color:#7a8b94}.footer>div{display:flex;gap:20px}.menu-toggle{display:none}.skip{position:absolute;top:-70px;left:20px;padding:10px;background:white;z-index:20}.skip:focus{top:10px}
@media(min-width:1500px){.hero{padding-top:75px;padding-bottom:100px}.hero-art{min-height:600px}}@media(max-width:1000px){.wrap,.nav{padding-left:28px;padding-right:28px}.hero{gap:20px}.hero h1{font-size:59px;letter-spacing:-3px}.lead{font-size:16px}.hero-art{min-height:480px}.welcome-card{left:-10px;right:10px;padding:18px 15px}.welcome-card b{font-size:13px}.hero .button{font-size:12px;padding:14px 19px;gap:15px}.demo-shell{gap:35px}.team-grid{gap:45px}.team-copy h2{font-size:34px}.section-head h2,h2{font-size:39px}.benefit-head{gap:40px}.closing{margin-left:28px;margin-right:28px;padding:55px}.closing h2{font-size:39px}.closing img{width:280px}.benefits article{padding-right:25px}.benefits article+article{padding-left:25px}.benefits h3{font-size:21px}.career-strip{gap:25px}.footer>p{display:none}}
@media(max-width:720px){html{scroll-padding-top:30px}.wrap,.nav{padding-left:22px;padding-right:22px}.nav{height:80px;position:relative;z-index:15}.brand{font-size:25px}.menu-toggle{display:block;background:none;border:1px solid #dbe6eb;border-radius:50%;width:40px;height:40px;font-size:19px;color:var(--ink)}#navlinks{display:none;position:absolute;top:72px;left:15px;right:15px;background:white;border:1px solid var(--line);border-radius:17px;box-shadow:0 20px 30px #17364412;padding:22px;align-items:stretch;gap:22px}#navlinks.open{display:flex;flex-direction:column}.hero{display:flex;flex-direction:column;align-items:stretch;padding-top:40px;padding-bottom:40px;gap:25px}.hero h1{font-size:58px;letter-spacing:-3.2px;max-width:450px}.eyebrow{margin-bottom:20px;font-size:9px}.lead{font-size:16px;max-width:400px}.actions{gap:21px}.hero .button{font-size:13px;min-height:51px}.hero-note{margin-top:23px}.hero-art{min-height:450px;border-radius:140px 140px 22px 22px;margin:5px 10px 0}.hero-hat{width:105%;max-height:425px;object-fit:contain}.floating-label{top:34px}.welcome-card{left:-10px;right:-10px;bottom:60px;padding:19px 17px}.service-tag{bottom:25px}.intro-strip{font-size:10px;gap:9px;flex-wrap:wrap;justify-content:center;padding-top:23px;padding-bottom:23px}.intro-strip>span{max-width:none;width:100%;text-align:center;font-size:8px;margin-bottom:8px}.intro-strip i{margin:0 5px}.section{padding-top:68px;padding-bottom:68px}.section-head{margin-bottom:30px}.section-head h2,h2{font-size:35px;letter-spacing:-1.6px}.section-head>p:last-child{font-size:14px}.demo-shell{grid-template-columns:1fr;gap:25px}.scenario{padding:20px 35px 20px 0}.scenario b{font-size:20px;margin:8px 0}.scenario em{top:37px}.scenario small{font-size:12px}.demo-canvas{padding:28px 15px 20px}.team-section{padding:65px 0}.team-grid{display:flex;flex-direction:column-reverse;gap:40px;align-items:stretch}.team-copy h2{font-size:34px}.team-copy>p:not(.eyebrow){font-size:14px}.team-visual{max-width:440px;width:100%;margin:auto}.request-card{padding:23px}.team-ticket{padding:21px;margin-left:25px}.label-row{font-size:8px;gap:4px}.benefit-head{display:block}.benefit-head>p{max-width:none!important}.benefits{grid-template-columns:1fr;gap:30px}.benefits article,.benefits article+article{border-right:0;border-bottom:1px solid var(--line);padding:10px 0 30px}.benefits article:last-child{border-bottom:0}.benefits p{min-height:0;max-width:420px;font-size:14px}.benefits h3{font-size:26px}.benefit-symbol{margin-bottom:23px}.benefit-foot{padding-top:15px}.closing{display:block;margin:0 15px 45px;padding:40px 28px 15px;text-align:left;border-radius:25px}.closing h2{font-size:35px}.closing img{width:240px;margin:0 auto -15px}.closing .button{font-size:13px}.career-strip{align-items:flex-start;flex-direction:column;gap:8px;padding-top:30px;padding-bottom:35px}.career-strip>p{font-size:21px}.career-strip .text-link{font-size:12px}.footer{flex-wrap:wrap;gap:22px;padding-top:30px;padding-bottom:35px}.footer>div{flex-wrap:wrap;width:100%;gap:20px}.footer>div>span{margin-left:auto}}
@media(max-width:360px){.hero h1{font-size:49px}.hero-art{min-height:390px;margin-left:0;margin-right:0}.hero-hat{margin-top:0}.welcome-card{gap:8px;padding:16px 12px}.welcome-card b{font-size:12px}.welcome-card div>span{font-size:10px}.team-copy h2{font-size:30px}.closing{padding-left:23px;padding-right:23px}.closing h2{font-size:31px}.chat-status{padding:13px}.footer>div>span{margin-left:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
/* Keep the decorative orbit inside the narrow-screen composition. */
@media(max-width:720px){.orbit{display:none}}

/* Hero composition: start the message near the navigation, independent of art height. */
@media(min-width:721px){
  .hero{align-items:start;padding-top:80px;padding-bottom:56px}
  .hero-art{min-height:0;height:clamp(440px,calc(100svh - 260px),550px)}
  .hero-hat{width:100%;max-width:100%;height:100%;max-height:100%;object-fit:contain;margin-top:0}
  .hero .welcome-card{left:-16px;right:16px;bottom:32px}
}
@media(min-width:1100px){html[lang=zh-CN] .hero{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}}
@media(max-width:720px){
  .hero{padding-top:28px;padding-bottom:36px;gap:24px}
  .hero-art{min-height:0;height:clamp(320px,94vw,380px)}
  .hero-hat{width:100%;max-width:100%;height:100%;max-height:100%;object-fit:contain;margin-top:0}
  .hero .welcome-card{bottom:22px}
}
/* Approved Chinese headline: each sentence stays on one line on narrow screens.
   Body specificity keeps this scoped rule above the later language defaults. */
@media(max-width:720px){
 html[lang=zh-CN] body .hero h1{font-size:clamp(34px,10.75vw,54px);line-height:1.2}
}

/* V14: the mascot motion has its own layer, separate from entry and pointer motion. */
.hero-viki{width:100%;height:100%;min-width:0;display:grid;place-items:center;position:relative}
.hero-viki .hero-hat{width:100%;height:100%;max-height:100%;object-fit:contain}
/* Optional visual B. The default page deliberately keeps its approved white hero. */
body.hero-hotel-background .hero{position:relative;isolation:isolate}
body.hero-hotel-background .hero::before{content:"";position:absolute;inset:-30px 0 0;z-index:-2;pointer-events:none;background:url("assets/viki-value-hotel.png") no-repeat calc(50% - 520px) center / 1000px auto;filter:blur(1.6px);-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 12%,#000 88%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 12%,#000 88%,transparent 100%)}
body.hero-hotel-background .hero::after{content:"";position:absolute;inset:-30px 0 0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,.82) 0%,rgba(255,255,255,.79) 42%,rgba(255,255,255,.95) 66%,#fff 80%),linear-gradient(180deg,#fff 0%,rgba(255,255,255,0) 18%,rgba(255,255,255,0) 75%,#fff 100%)}
@media(max-width:720px){
 body.hero-hotel-background .hero::before{inset:0;background-size:720px auto;background-position:calc(50% - 280px) 24px;filter:blur(1.2px)}
 body.hero-hotel-background .hero::after{inset:0;background:linear-gradient(90deg,rgba(255,255,255,.84),rgba(255,255,255,.82) 70%,rgba(255,255,255,.95)),linear-gradient(180deg,#fff 0%,rgba(255,255,255,0) 12%,rgba(255,255,255,0) 38%,#fff 58%)}
}
