@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Noto+Sans+TC:wght@400;500;600;700;800&family=Noto+Serif+TC:wght@500;600;700&display=swap');
:root{--ink:#14211d;--muted:#6e7c73;--line:#dfe7df;--cream:#f5f8f2;--yellow:#d8f35f;--orange:#ff805a}*{box-sizing:border-box}html{scroll-behavior:smooth}.app-page{background:var(--cream);color:var(--ink);font-family:'Noto Sans TC',sans-serif;overflow:hidden}.app-page a{text-decoration:none;color:inherit}.app-shell{max-width:1240px;margin:auto;padding-left:52px;padding-right:52px}.app-nav{height:76px;max-width:1240px;margin:auto;padding:0 28px;display:flex;align-items:center;justify-content:space-between}.app-brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.04em;font-size:16px}.app-brand em{font-style:normal;color:#789080;font-weight:500}.brand-mark{display:grid;place-items:center;width:32px;height:32px;border-radius:10px 10px 10px 2px;background:var(--ink);color:var(--yellow);font:italic 18px Georgia}.nav-links{display:flex;gap:34px;color:var(--muted);font-size:12px}.nav-links a:hover{color:var(--ink)}.nav-button,.primary-button{display:inline-flex;align-items:center;gap:18px;border-radius:99px;background:var(--ink);color:#fff;padding:13px 18px 13px 21px;font-size:12px;font-weight:700}.nav-button b,.primary-button b{color:var(--yellow);font-size:16px}.hero{min-height:680px;padding-top:96px;padding-bottom:75px;display:grid;grid-template-columns:.92fr 1.08fr;align-items:center;gap:45px}.kicker{display:flex;align-items:center;gap:9px;color:#7d9183;font:10px 'DM Mono',monospace;letter-spacing:.13em;margin:0 0 19px}.kicker i{width:19px;height:1px;background:var(--orange)}.hero h1{margin:0;font:600 clamp(42px,5vw,72px)/1.16 'Noto Serif TC',serif;letter-spacing:-.08em}.hero h1 em,.pricing h2 em{font-style:normal;color:#557561}.hero-lead{max-width:465px;color:var(--muted);font-size:15px;line-height:2;margin:28px 0 31px}.hero-actions{display:flex;align-items:center;gap:23px}.text-button{color:#738479;font-size:12px;font-weight:600}.text-button:hover{color:var(--ink)}.proof{display:flex;align-items:center;gap:12px;margin-top:50px;color:#8b9a90;font-size:11px;line-height:1.55}.proof p{margin:0}.proof strong{color:var(--ink)}.avatars{display:flex;padding-left:7px}.avatars span{width:30px;height:30px;margin-left:-7px;border:2px solid var(--cream);display:grid;place-items:center;border-radius:50%;background:#dbedda;color:#57745d;font-size:10px}.avatars span:nth-child(2){background:#f5d9cd;color:#9b654e}.avatars span:nth-child(3){background:#d8e3ed;color:#547087}.avatars span:nth-child(4){background:var(--ink);color:var(--yellow)}.hero-preview{min-height:545px;display:grid;place-items:center;position:relative}.orbit{position:absolute;width:490px;height:490px;border:1px solid #d9e4d8;border-radius:50%;transform:rotate(-22deg)}.orbit-b{width:630px;height:240px;border-color:#e0eadf;transform:rotate(34deg)}.phone{position:relative;z-index:1;width:315px;height:545px;border:8px solid #20312a;border-radius:38px;background:#f6f8f2;box-shadow:20px 30px 50px #172a1f29;padding:15px 17px;overflow:hidden}.phone-status,.phone-brand,.phone-title{display:flex;justify-content:space-between;align-items:center}.phone-status{font:7px 'DM Mono',monospace;color:#82948a}.phone-brand{justify-content:flex-start;gap:7px;margin-top:20px;font-size:10px}.phone-brand>b{width:22px;height:22px;display:grid;place-items:center;border-radius:7px 7px 7px 1px;background:var(--ink);color:var(--yellow);font:italic 12px Georgia}.phone-brand span{margin-left:auto;color:#91a098;letter-spacing:3px}.phone-greeting{display:grid;gap:5px;margin-top:27px}.phone-greeting small{color:#87978d;font-size:9px}.phone-greeting strong{font:20px 'Noto Serif TC';letter-spacing:-.08em}.phone-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:19px}.phone-stats>div{padding:12px;border:1px solid #e0e7de;border-radius:13px;background:#fff}.phone-stats small,.phone-stats em{display:block;font-size:8px;color:#8fa097;font-style:normal}.phone-stats strong{display:block;font:28px Georgia;line-height:1.2;margin-top:7px}.phone-stats em{color:#6b9c73}.phone-title{margin-top:26px;font-size:10px}.phone-title span{color:#829287;font-size:8px}.phone-list{margin-top:10px;background:#fff;border-radius:13px;padding:4px 11px}.phone-list>div{display:flex;align-items:center;gap:7px;padding:10px 0;border-bottom:1px solid #edf1eb}.phone-list>div:last-child{border:0}.phone-list b{font-size:9px;flex:1}.phone-list small{position:absolute;margin:14px 0 0 0;color:#9aa89f;font-size:7px}.phone-list em{font-style:normal;font-size:7px;border-radius:30px;padding:4px 5px}.phone-list em.orange{background:#ffe3d8;color:#c26c4c}.phone-list em.green{background:#ddf1dd;color:#5d9167}.phone-list em.blue{background:#e1edf4;color:#648699}.phone-bottom{position:absolute;bottom:9px;left:17px;right:17px;display:flex;justify-content:space-around;padding-top:10px;border-top:1px solid #e8eee7;color:#9cac9f;text-align:center}.phone-bottom span{display:grid;gap:3px;font-size:14px}.phone-bottom small{font-size:7px}.float-note{position:absolute;z-index:2;display:flex;align-items:center;gap:9px;padding:12px 15px;border:1px solid #c9d9c9cc;border-radius:13px;background:#fffffadd;box-shadow:0 15px 30px #2a423212;font-size:14px}.float-note span{display:grid;gap:4px;color:#8b9a90;font-size:8px}.float-note strong{display:block;color:var(--ink);font-size:10px}.note-one{right:7px;top:126px;color:var(--ink);background:var(--yellow)}.note-two{left:4px;bottom:90px;color:#b96c50;background:#f7dfd4}.promise{max-width:1240px;margin:auto;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 52px;display:flex;justify-content:space-between;color:#89968c;font-size:11px}.promise span:before{content:'✦';color:var(--orange);margin-right:9px}.section{padding-top:116px;padding-bottom:116px}.section-head{display:flex;justify-content:space-between;align-items:end;gap:50px}.section-head h2,.builder h2,.pricing h2,.final-cta h2{font:600 clamp(31px,4vw,49px)/1.32 'Noto Serif TC',serif;letter-spacing:-.08em;margin:0}.section-head>p{max-width:290px;color:var(--muted);font-size:13px;line-height:1.9;margin:0 0 3px}.template-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:48px}.template{position:relative;text-align:left;min-height:220px;border:1px solid var(--line);border-radius:18px;background:#ffffff8c;padding:19px;color:var(--ink);cursor:pointer;transition:.2s}.template:hover,.template.active{transform:translateY(-4px);border-color:#a8c4aa;box-shadow:0 15px 30px #24432d14}.template.active:after{content:'現在預覽';position:absolute;right:17px;top:18px;color:#6b9b74;font:8px 'DM Mono'}.template-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:13px 13px 13px 2px;margin-bottom:37px;font-size:21px}.template.mint .template-icon{background:#d9f0da;color:#5c8466}.template.peach .template-icon{background:#f7dfd5;color:#b46d54}.template.blue .template-icon{background:#dceaf1;color:#5f7e91}.template.lavender .template-icon{background:#e8e1f1;color:#806b98}.template.yellow .template-icon{background:#eaf4bf;color:#6f7f37}.template small{display:block;color:#96a49a;font:8px 'DM Mono';letter-spacing:.12em;margin-bottom:9px}.template strong{display:block;font-size:16px;margin-bottom:9px}.template>span:not(.template-icon){color:#7e8d82;font-size:11px;line-height:1.7}.template>b{position:absolute;right:18px;bottom:17px;color:#94a398;font-size:17px}.builder{background:#e7eee3;border-top:1px solid #dfe8dd;border-bottom:1px solid #dfe8dd;padding:103px 0 116px}.builder-head{margin-bottom:55px}.builder-grid{display:grid;grid-template-columns:.74fr 1.26fr;gap:64px}.step{display:flex;gap:14px;padding-bottom:18px}.step>b{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border:1px solid #b3c7b3;border-radius:50%;color:#6c8b73;font:9px 'DM Mono'}.step small{display:block;color:#78907f;font-size:10px;margin:1px 0 5px}.step strong{font-size:15px}.choice-list{display:grid;gap:5px;margin:0 0 31px}.choice{display:flex;align-items:center;gap:10px;border:1px solid transparent;background:transparent;color:#607167;padding:9px 11px;border-radius:9px;text-align:left;font-size:11px;cursor:pointer}.choice:hover,.choice.active{color:var(--ink);background:#ffffffb3;border-color:#d0dfce}.choice b{margin-left:auto;color:#6b9770}.name-field{display:grid;gap:7px;margin:0 0 32px;color:#78907f;font-size:10px}.name-field input{border:1px solid #cad9c9;border-radius:8px;background:#ffffffa6;color:var(--ink);padding:12px 13px;font:12px 'Noto Sans TC';outline:0}.seat-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}.seat{position:relative;display:grid;gap:3px;text-align:left;border:1px solid #cbd9cb;border-radius:10px;background:#ffffff73;color:#718177;padding:13px;cursor:pointer}.seat.active{border-color:#73987b;background:#fff;box-shadow:0 6px 15px #3b5b3f14}.seat strong{font-size:15px;color:var(--ink)}.seat span{font-size:9px}.seat em{font-style:normal;color:#6a8e70;font-size:9px;margin-top:4px}.seat b{position:absolute;top:9px;right:9px;color:#b86d53;font-size:8px}.builder-submit{width:100%;border:0;border-radius:99px;background:var(--ink);color:#fff;padding:15px 18px;margin-top:20px;font:700 11px 'Noto Sans TC';cursor:pointer}.builder-submit b{float:right;color:var(--yellow);font-size:16px;margin-top:-3px}.live-preview{min-height:600px;border-radius:26px;background:#d3e7d1;padding:25px 27px 20px;position:relative;overflow:hidden}.live-preview.peach{background:#f4dcd0}.live-preview.blue{background:#d9e7ee}.live-preview.lavender{background:#e6dff0}.live-preview.yellow{background:#ebf2bd}.live-label{display:flex;justify-content:space-between;color:#5c7863;font:8px 'DM Mono'}.live-label i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#71a077}.live-label small{font:9px 'Noto Sans TC';color:#819485}.preview-window{width:min(100%,473px);margin:21px auto 0;border:7px solid #263b31;border-radius:22px;background:#f7f9f4;box-shadow:0 18px 35px #1f412728;overflow:hidden}.preview-top{height:44px;display:flex;justify-content:space-between;align-items:center;padding:0 17px;border-bottom:1px solid #e0e8df;color:#819487;font-size:13px}.preview-top strong{color:var(--ink);font-size:10px}.preview-body{padding:26px 29px 25px}.date{color:#91a094;font:8px 'DM Mono';letter-spacing:.09em}.preview-body h3{font:28px 'Noto Serif TC';letter-spacing:-.08em;margin:8px 0 3px}.preview-body>p{color:#89998e;font-size:10px;margin:0}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:21px 0 25px}.metrics>div{background:#fff;border:1px solid #e1e9e0;border-radius:12px;padding:13px}.metrics small,.metrics em{display:block;color:#899a8e;font-size:8px;font-style:normal}.metrics strong{display:block;font:29px Georgia;margin:6px 0 4px}.metrics em{color:#76a17b}.list-head{display:flex;justify-content:space-between;margin-bottom:8px;font-size:11px}.list-head span{color:#71917a;font-size:9px}.preview-row{display:flex;align-items:center;gap:10px;background:#fff;border-bottom:1px solid #edf1eb;padding:11px 8px}.preview-row:first-of-type{border-radius:10px 10px 0 0}.preview-row:nth-last-of-type(2){border-radius:0 0 10px 10px}.preview-row>b{display:grid;place-items:center;flex:0 0 31px;width:31px;height:31px;border-radius:9px 9px 9px 2px;background:#d9f0da;color:#5c8466;font-size:10px}.preview-row:nth-of-type(2)>b{background:#f7dfd5;color:#b46d54}.preview-row:nth-of-type(3)>b{background:#dceaf1;color:#5f7e91}.preview-row>div{flex:1}.preview-row strong,.preview-row small{display:block}.preview-row strong{font-size:10px}.preview-row small{color:#95a49a;font-size:8px;margin-top:4px}.preview-row em{border-radius:99px;background:#ffe3d8;color:#c26c4c;padding:5px 7px;font-size:8px;font-style:normal}.preview-row:nth-of-type(2) em{background:#ddf1dd;color:#5d9167}.preview-row:nth-of-type(3) em{background:#e1edf4;color:#648699}.add-row{width:100%;margin-top:14px;border:1px dashed #b4cbb5;border-radius:9px;background:transparent;color:#6d9174;padding:11px;font:10px 'Noto Sans TC';cursor:pointer}.preview-caption{max-width:473px;margin:16px auto 0;color:#718a77;font-size:10px}.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:52px}.how-grid article{min-height:315px;position:relative;overflow:hidden;border:1px solid var(--line);border-radius:17px;padding:23px}.how-grid article>b{color:#d87955;font:10px 'DM Mono'}.how-grid h3{font:23px 'Noto Serif TC';margin:30px 0 8px}.how-grid p{max-width:260px;color:#7c8e82;font-size:11px;line-height:1.9}.how-art{position:absolute;bottom:18px;left:23px;right:23px;padding:14px;border-radius:11px;background:#edf4ea;color:#7f9284;font-size:10px;line-height:2}.how-art.dark{background:#22382e;color:#fff}.how-art.peach-art{background:#f5e4db;color:#b57762}.how-art strong{font:20px Georgia;color:var(--ink)}.pricing{background:#1c3027;color:#fff;padding:115px 0}.pricing-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:77px;align-items:center}.pricing h2{color:#fff}.pricing h2 em{color:var(--yellow)}.pricing-grid>div>p:last-child{max-width:345px;color:#a7b9ab;font-size:12px;line-height:1.9;margin-top:24px}.price-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.price{background:#f2f7ee;color:var(--ink);border:2px solid transparent;border-radius:17px;padding:25px}.price.featured{border-color:var(--yellow)}.price>small{display:block;color:#728377;font-size:10px}.price>small b{float:right;color:#a86750;font-weight:500}.price>strong{display:block;font:30px Georgia;margin:28px 0 8px}.price>strong em{font:9px 'Noto Sans TC';color:#7c8d81}.price>p{min-height:37px;color:#7d8d82;font-size:10px;line-height:1.6}.price ul{list-style:none;padding:18px 0 13px;margin:13px 0 15px;border-top:1px solid #dce7da;border-bottom:1px solid #dce7da;display:grid;gap:10px}.price li{color:#63766a;font-size:10px}.price li:before{content:'✓';color:#6d9e75;margin-right:7px}.price button{width:100%;border:0;border-radius:99px;background:#dfe9dd;color:var(--ink);padding:12px;font:700 10px 'Noto Sans TC';cursor:pointer}.price.featured button{background:var(--ink);color:#fff}.price button b{float:right;color:var(--orange);font-size:14px}.final-cta{padding-top:116px;padding-bottom:116px;display:flex;justify-content:space-between;align-items:center}.primary-button.light{background:var(--yellow);color:var(--ink);padding:16px 22px}.primary-button.light b{color:var(--ink)}.app-footer{max-width:1240px;margin:auto;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:23px 52px;color:#8b998e;font-size:10px}.app-footer .app-brand{color:var(--ink)}.toast{position:fixed;z-index:9;bottom:24px;left:50%;transform:translateX(-50%);max-width:calc(100vw - 32px);border-radius:99px;background:var(--ink);color:#fff;padding:13px 18px;font-size:11px;opacity:0;pointer-events:none;transition:.2s}.toast.show{opacity:1}.toast:before{content:'✓';color:var(--yellow);margin-right:8px}@media(max-width:1000px){.hero{grid-template-columns:1fr;padding-top:70px}.template-grid{grid-template-columns:repeat(3,1fr)}.builder-grid{grid-template-columns:1fr}.builder-form{max-width:620px}.pricing-grid{grid-template-columns:1fr;gap:45px}}@media(max-width:700px){.app-shell{padding-left:20px;padding-right:20px}.app-nav{height:66px;padding:0 18px}.nav-links{display:none}.nav-button{padding:10px 13px;font-size:10px}.hero{padding-top:62px;padding-bottom:60px;min-height:auto}.hero h1{font-size:40px}.hero-lead{font-size:13px;line-height:1.9}.hero-actions{align-items:flex-start;flex-direction:column;gap:16px}.proof{margin-top:36px}.hero-preview{min-height:535px;transform:scale(.9);transform-origin:top center;margin-bottom:-50px}.orbit{width:410px;height:410px}.orbit-b{width:500px}.note-one{right:-8px}.note-two{left:-12px}.promise{overflow:auto;justify-content:flex-start;gap:27px;padding:18px 20px;white-space:nowrap}.section{padding-top:76px;padding-bottom:76px}.section-head{display:block}.section-head>p{margin-top:17px}.template-grid{grid-template-columns:1fr 1fr;gap:8px;margin-top:31px}.template{min-height:205px;padding:15px}.template-icon{margin-bottom:26px}.template strong{font-size:14px}.template>span:not(.template-icon){font-size:10px}.builder{padding:74px 0}.builder-head{margin-bottom:35px}.choice-list{margin-left:0}.name-field{margin-left:0}.live-preview{min-height:545px;margin-top:35px;padding:19px 14px}.preview-window{border-width:5px}.preview-body{padding:22px 18px}.preview-body h3{font-size:24px}.how-grid{grid-template-columns:1fr;gap:9px;margin-top:33px}.how-grid article{min-height:280px}.pricing{padding:75px 0}.price-cards{grid-template-columns:1fr}.final-cta{display:block;padding-top:75px;padding-bottom:75px}.final-cta .primary-button{margin-top:30px}.app-footer{padding:21px 20px;gap:20px;flex-wrap:wrap}.app-footer>span:nth-child(2){display:none}}