@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;700;900&display=swap');
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#171717;font-family:'Noto Sans TC',Arial,sans-serif}a{color:inherit;text-decoration:none}header{height:72px;position:absolute;z-index:9;top:0;left:0;right:0;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 3.2%}.logo{font:bold 22px Arial;letter-spacing:-1px}nav{display:flex;gap:84px;height:100%;align-items:center;margin-left:8%}nav a{font-size:15px;font-weight:700;height:100%;display:flex;align-items:center;position:relative}nav .on:after{content:'';position:absolute;bottom:19px;height:4px;background:#222;left:0;right:0}.lang{font-weight:700}.hero{height:100vh;min-height:790px;position:relative;overflow:hidden;color:white;padding-top:72px;background:#b8a48a}.photo{position:absolute;inset:72px 0 0;overflow:hidden;background:linear-gradient(120deg,#a9ad9e,#ddc8ad 45%,#a87959)}.photo:before{content:'';position:absolute;inset:-10%;background:radial-gradient(ellipse at 18% 35%,#159b48 0 15%,transparent 15.5%),linear-gradient(130deg,transparent 30%,#ead7c0 31% 55%,transparent 56%);transform:rotate(-10deg)}.stripes{position:absolute;right:-10%;top:-10%;width:65%;height:115%;border-radius:48%;transform:rotate(15deg);background:repeating-linear-gradient(132deg,#e9d9c8 0 13px,#b77e58 14px 25px,#d6b69a 26px 38px);opacity:.8}.phone{position:absolute;z-index:2;left:5%;top:3%;width:270px;height:610px;border:12px solid #f5f3ee;border-radius:40px;background:#f9f9f4;padding:12px;transform:rotate(-22deg);box-shadow:0 20px 60px #33271d66}.screen{height:100%;border-radius:25px;background:#06a94b;padding:95px 14px 20px}.screen b{display:block;text-align:center;font:bold 34px Arial;margin-bottom:60px}.screen p{background:white;color:#444;border-radius:15px;padding:12px;font-size:11px}.screen p:nth-of-type(2){background:#d9ffdf;margin-left:20px}.shade{position:absolute;inset:72px 0 0;background:linear-gradient(90deg,#211e1a99,#29231f50 55%,#2b241e25)}.copy{position:relative;z-index:3;margin-left:9.8%;padding-top:clamp(230px,29vh,360px)}.copy>small{letter-spacing:.3em;font-size:12px}.copy h1{font:bold clamp(76px,10vw,145px)/.98 Arial,sans-serif;letter-spacing:-.055em;margin:15px 0 27px}.copy h2{font-size:clamp(22px,2.7vw,38px);font-weight:500;margin:0 0 48px}.dl-label{display:flex;align-items:center;gap:12px;font-size:13px;margin-bottom:13px}.dl-label i{font:900 8px Arial;font-style:normal;color:#06c755;background:white;border-radius:50%;width:25px;height:25px;display:grid;place-items:center}.download{height:68px;width:330px;border:1px solid #ffffffb5;border-radius:4px;background:#ffffff16;backdrop-filter:blur(8px);display:flex;align-items:center;gap:15px;padding:0 17px;transition:.2s}.download:hover{background:#06c755}.download>b{font-size:25px}.download strong,.download small{display:block}.download strong{font-size:15px}.download small{font-size:10px;opacity:.8;margin-top:3px}.download em{font-style:normal;margin-left:auto;font-size:20px}.hint{font-size:10px;color:#ffffffd0}.scroll{position:absolute;z-index:4;bottom:28px;left:50%;transform:translateX(-50%);font-size:10px;font-weight:bold;display:flex;align-items:center;flex-direction:column;gap:12px}.scroll i{height:36px;width:1px;background:#fff}.index{position:absolute;right:4%;bottom:34px;z-index:4;font:700 11px Arial;letter-spacing:.15em}
.intro{padding:115px 6%;text-align:center}.intro>small,.words>small,.end>small{color:#06c755;font:bold 11px Arial;letter-spacing:.25em}.intro h2{font-size:clamp(30px,4vw,48px);margin:20px 0}.intro>p{font-size:15px;line-height:2;color:#777}.cards{max-width:1120px;margin:60px auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;text-align:left}.cards h3{font-size:19px;margin:22px 0 8px}.cards article>p{font-size:13px;line-height:1.9;color:#888}.art{height:190px;border-radius:5px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}.chat{background:linear-gradient(135deg,#e5f7e9,#c5f0d4)}.chat b,.chat i{position:absolute;background:white;border-radius:18px;padding:12px 18px;font-size:13px}.chat b{left:12%;top:25%}.chat i{right:10%;top:50%;background:#b7efc8;font-style:normal}.chat span{position:absolute;bottom:15%;left:30%;color:#06c755;font-size:25px}.call{background:linear-gradient(135deg,#e7f3ff,#d6e9fa)}.call b{border:1px solid #9bc7ed;border-radius:50%;width:95px;height:95px;display:grid;place-items:center;font-size:42px;color:#438bd2;box-shadow:0 0 0 20px #ffffff55}.share{background:linear-gradient(135deg,#fff0e3,#f9dfca)}.share b{font-size:45px;color:#d38c61}
.desktop{padding:110px 7%;background:#f7f8f6;display:grid;grid-template-columns:.85fr 1.15fr;gap:50px;align-items:center}.words{max-width:470px}.words h2{font-size:clamp(34px,4vw,51px);line-height:1.4}.words p{font-size:14px;line-height:2;color:#777}.words>a{display:inline-block;border-bottom:2px solid #06c755;padding:12px 0;margin-top:20px;font-weight:bold}.mock{height:350px;display:flex;background:white;border-radius:9px;overflow:hidden;box-shadow:0 25px 75px #1e35251c;transform:rotate(-2deg);font-size:11px}.mock aside{width:60px;background:#06c755;color:white;padding:18px 15px;font-weight:bold;line-height:2}.list{width:190px;border-right:1px solid #eee;padding:18px 12px}.list p{background:#f3f5f4;padding:7px;color:#aaa}.list div{padding:12px 0;border-bottom:1px solid #f3f3f3;font-size:10px}.list small{color:#999}.conversation{flex:1;padding:18px;position:relative}.conversation>b{display:block;border-bottom:1px solid #eee;padding-bottom:15px}.conversation small{color:#06c755}.conversation p{background:#f1f3f2;padding:11px;border-radius:13px;width:max-content;max-width:85%}.conversation .right{margin-left:auto;background:#d4f7dc}.conversation footer{position:absolute;bottom:12px;left:12px;right:12px;border:1px solid #eee;padding:12px;color:#999;font-size:9px}
.end{background:#06c755;color:white;text-align:center;padding:90px 20px}.end>small{color:#d9ffe5}.end h2{font:bold clamp(55px,9vw,110px) Arial;letter-spacing:-.06em;margin:15px 0 32px}.end>a{display:inline-block;background:white;color:#111;padding:16px 25px;font-size:13px;font-weight:bold}footer{display:flex;align-items:center;gap:25px;padding:26px 4%;font-size:10px;color:#888}footer b{font:bold 22px Arial;color:#222;margin-right:auto}footer a{color:#222;font-weight:bold}
@media(max-width:800px){header{height:62px;padding:0 20px}nav{gap:18px;margin:0}nav a{font-size:11px}.hero{min-height:720px}.photo,.shade{top:62px}.copy{margin-left:7%;padding-top:240px}.copy h1{font-size:clamp(60px,12vw,95px)}.cards{gap:14px}.desktop{grid-template-columns:1fr}.words{text-align:center;margin:auto}.mock{max-width:650px;width:100%;margin:auto}}
@media(max-width:540px){header{padding:0 16px}.logo{font-size:19px}nav{gap:12px}nav a{font-size:10px}nav a:last-child{display:none}.hero{min-height:700px}.copy{padding-top:245px;margin:0 22px}.copy h1{font-size:60px}.copy h2{font-size:21px}.download{width:min(330px,100%)}.phone{left:-20%;opacity:.6}.intro{padding:80px 22px}.intro h2{font-size:28px}.cards{grid-template-columns:1fr;gap:28px}.art{height:170px}.desktop{padding:75px 18px}.words h2{font-size:34px}.mock{height:270px;min-width:0}.mock aside{width:42px;padding:14px 10px}.list{width:130px;padding:12px 8px}.conversation{padding:12px 8px}.conversation p{font-size:9px}.end{padding:70px 18px}footer{flex-wrap:wrap;padding:22px}footer b{width:100%}}