:root{--ink:#1e2433;--muted:#788096;--line:#e9ebf2;--paper:#fbfbfd;--accent:#6256e8;--accent2:#a9a1ff;--navy:#252b48;--radius:20px;--shadow:0 14px 48px rgba(40,46,78,.08)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans','Noto Sans TC',sans-serif}button,input{font:inherit}button{cursor:pointer}.topbar{height:74px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.9);display:flex;align-items:center;position:sticky;top:0;z-index:30;backdrop-filter:blur(18px);padding:0 max(calc((100vw - 1380px)/2),32px);gap:36px}.brand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none;font-weight:800;letter-spacing:-.04em;font-size:19px;white-space:nowrap}.brand-mark{width:34px;height:34px;border-radius:11px;background:linear-gradient(145deg,#685cf2,#ae8dff);color:white;display:grid;place-items:center;font-size:17px;box-shadow:0 5px 13px #857bf258}.brand em{font-style:normal;color:var(--accent)}.top-nav{display:flex;gap:27px;margin-left:10px}.top-nav a{font-size:13px;font-weight:600;text-decoration:none;color:#70768a}.top-nav a:hover{color:var(--accent)}.top-actions{margin-left:auto;display:flex;align-items:center;gap:16px}.saved-link{border:0;background:none;color:#636b7e;font-size:13px;font-weight:700}.saved-link span{color:var(--accent);margin-left:5px}.cta-small{background:var(--navy);color:white;border:0;border-radius:10px;padding:10px 15px;font-weight:700;font-size:12px}.wrap{max-width:1380px;margin:auto;padding:0 34px}.hero{padding:58px 0 32px;display:grid;grid-template-columns:1fr 300px;gap:40px;align-items:center}.eyebrow{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--accent);font-weight:800;display:flex;align-items:center;gap:8px}.eyebrow:before{content:'';width:23px;height:1px;background:currentColor}.hero h1{font-size:clamp(40px,5.4vw,70px);line-height:1.1;letter-spacing:-.055em;margin:18px 0 17px;max-width:830px}.hero h1 .serif{font-family:'Playfair Display',serif;color:var(--accent);font-weight:500;letter-spacing:-.06em}.hero-copy{color:var(--muted);font-size:15px;line-height:1.8;max-width:650px;margin:0}.hero-side{background:#f0efff;border-radius:20px;padding:22px 23px;border:1px solid #e7e4ff;position:relative;overflow:hidden}.hero-side:after{content:'';width:160px;height:160px;border-radius:50%;background:#d2ccff;position:absolute;right:-75px;top:-77px;opacity:.6}.hero-count{font:600 43px 'Playfair Display',serif;color:var(--accent)}.hero-side p{font-size:12px;color:#6e6c8a;margin:2px 0 16px;line-height:1.6}.hero-meta{display:flex;gap:7px;flex-wrap:wrap}.pill{border-radius:99px;background:white;color:#716baf;padding:6px 10px;font-size:10px;font-weight:700}.toolbar{display:flex;align-items:center;gap:10px;margin:13px 0 18px}.searchbox{height:48px;display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:white;border-radius:13px;padding:0 15px;flex:1;max-width:480px;box-shadow:0 3px 12px #242b4810}.searchbox svg{width:17px;color:#9097a9}.searchbox input{border:0;outline:0;width:100%;font-size:13px;color:var(--ink)}.sort-select{height:46px;border:1px solid var(--line);border-radius:12px;background:white;padding:0 13px;color:#596074;font-size:12px}.results{margin-left:auto;color:#878da0;font-size:12px}.results strong{color:#2b3041}.category-row{display:flex;gap:8px;overflow:auto;padding:0 0 18px;scrollbar-width:none}.category-row::-webkit-scrollbar{display:none}.category-chip{border:1px solid var(--line);border-radius:999px;background:white;color:#6d7488;padding:9px 13px;font-size:11px;font-weight:700;white-space:nowrap;transition:.2s}.category-chip:hover,.category-chip.active{background:#282d4b;color:white;border-color:#282d4b}.section-label{display:flex;align-items:baseline;justify-content:space-between;margin:6px 0 15px}.section-label h2{font-size:18px;letter-spacing:-.03em;margin:0}.section-label p{font-size:11px;color:#9297a7;margin:0}.gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding-bottom:65px}.card{border:1px solid #e9ebf1;background:white;border-radius:17px;overflow:hidden;transition:transform .24s,box-shadow .24s,border-color .24s;cursor:pointer;position:relative}.card:hover{transform:translateY(-4px);box-shadow:0 17px 44px #30395818;border-color:#d6d3ff}.thumb{height:190px;position:relative;overflow:hidden;background:#ececf2}.thumb-art{position:absolute;inset:0;background-image:url('/assets/template-contact-sheet.png');background-size:500% 1000%;background-position:var(--x) var(--y);transition:transform .6s cubic-bezier(.2,.8,.2,1)}.card:hover .thumb-art{transform:scale(1.055)}.thumb:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(0deg,#10152877,transparent);pointer-events:none}.thumb-id{position:absolute;z-index:2;top:12px;left:12px;background:#ffffffeb;color:#60677a;padding:6px 9px;border-radius:7px;font-size:9px;font-weight:800;letter-spacing:.06em}.fav{position:absolute;z-index:3;right:11px;top:10px;border:0;background:#ffffffed;width:31px;height:31px;display:grid;place-items:center;border-radius:50%;font-size:15px;color:#646c7d;box-shadow:0 2px 9px #10152a15}.fav.on{color:#ec6683}.thumb-open{position:absolute;z-index:2;bottom:12px;right:12px;color:white;font-size:10px;font-weight:700;opacity:0;transform:translateY(5px);transition:.2s}.card:hover .thumb-open{opacity:1;transform:none}.card-body{padding:15px 16px 16px}.card-kicker{display:flex;align-items:center;gap:7px;color:#8179d7;font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.card-kicker i{width:5px;height:5px;background:#9388f4;border-radius:50%}.card h3{font-size:15px;letter-spacing:-.025em;margin:8px 0 6px}.card-desc{font-size:11px;color:#82899a;line-height:1.65;margin:0;min-height:37px}.card-foot{border-top:1px solid #f0f1f5;margin-top:14px;padding-top:11px;display:flex;justify-content:space-between;align-items:center}.taglist{display:flex;gap:5px}.tag{background:#f5f5fa;color:#747b8e;border-radius:5px;padding:4px 6px;font-size:9px;font-weight:600}.arrow{color:#989ead;font-size:14px}.empty{grid-column:1/-1;padding:70px 20px;text-align:center;color:#7c8394}.empty b{font-size:17px;display:block;color:#30364b;margin-bottom:7px}.footer{border-top:1px solid var(--line);padding:24px 0 32px;color:#949aab;font-size:11px;display:flex;justify-content:space-between}.footer b{color:#565d73}.detail-head{padding:26px 0 18px;display:flex;align-items:center;gap:10px}.back{border:1px solid var(--line);background:white;border-radius:10px;color:#555d71;padding:9px 12px;font-size:12px;font-weight:700}.crumb{font-size:11px;color:#8a90a0}.detail-title{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end;padding:23px 0 28px}.detail-title h1{font-size:clamp(34px,4.5vw,55px);line-height:1.12;letter-spacing:-.055em;margin:11px 0 10px}.detail-title p{font-size:14px;line-height:1.7;color:#7c8293;margin:0;max-width:700px}.detail-actions{display:flex;gap:9px}.btn-primary,.btn-ghost{border-radius:11px;padding:12px 17px;font-weight:700;font-size:12px;border:1px solid var(--line)}.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent)}.btn-ghost{background:#fff;color:#555e73}.preview-shell{border:1px solid #e1e4ed;border-radius:18px;overflow:hidden;background:white;box-shadow:var(--shadow);margin-bottom:30px}.preview-chrome{height:41px;background:#f7f8fb;border-bottom:1px solid #e8eaf0;display:flex;align-items:center;padding:0 14px;gap:7px}.chrome-dot{width:8px;height:8px;border-radius:50%;background:#d5d8e2}.chrome-dot:first-child{background:#f08d8e}.chrome-dot:nth-child(2){background:#f3c777}.chrome-dot:nth-child(3){background:#73c79b}.urlbar{height:22px;background:#fff;border:1px solid #e8eaf0;border-radius:6px;margin-left:11px;flex:1;max-width:530px;color:#9a9faf;font-size:9px;display:flex;align-items:center;padding:0 9px}.device-toggle{margin-left:auto;border:1px solid #e1e3eb;background:#fff;border-radius:6px;padding:5px 8px;font-size:9px;color:#666e83}.template-site{--site-accent:#5951d8;--site-ink:#1d2540;--site-soft:#eef0ff;min-height:560px;background:white;color:var(--site-ink);font-family:'DM Sans','Noto Sans TC',sans-serif}.demo-nav{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 5.2%;border-bottom:1px solid #eef0f5}.demo-logo{font-weight:800;letter-spacing:-.045em;font-size:16px}.demo-links{display:flex;gap:23px;color:#737b90;font-size:10px;font-weight:600}.demo-cta{border:0;border-radius:7px;background:var(--site-accent);color:white;padding:10px 14px;font-size:10px;font-weight:700}.demo-hero{position:relative;padding:64px 7% 54px;min-height:315px;overflow:hidden;background:linear-gradient(100deg,var(--site-soft),#fff 75%);display:flex;align-items:center}.demo-hero-copy{max-width:58%;position:relative;z-index:1}.demo-overline{font-size:9px;text-transform:uppercase;letter-spacing:.17em;color:var(--site-accent);font-weight:800}.demo-hero h2{font-size:clamp(32px,4vw,52px);line-height:1.08;letter-spacing:-.06em;margin:14px 0 11px;max-width:540px}.demo-hero p{color:#737c91;line-height:1.7;font-size:12px;max-width:410px}.demo-hero-visual{position:absolute;right:7%;top:12%;width:34%;height:75%;border-radius:18px;background-image:url('/assets/template-contact-sheet.png');background-size:500% 1000%;background-position:var(--x) var(--y);box-shadow:0 18px 45px #11152a22}.demo-stats{display:flex;gap:23px;margin-top:19px}.demo-stat b{font-size:19px;display:block}.demo-stat span{font-size:8px;color:#8d94a4}.demo-section{padding:36px 7%}.demo-section.alt{background:#fafbfe}.demo-section-head{text-align:center;margin:0 auto 22px;max-width:570px}.demo-section-head small{font-size:9px;letter-spacing:.13em;color:var(--site-accent);font-weight:800;text-transform:uppercase}.demo-section-head h3{font-size:24px;letter-spacing:-.04em;margin:8px 0}.demo-section-head p{font-size:10px;color:#858c9c;line-height:1.7}.demo-features{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.demo-feature{border:1px solid #e9ecf3;border-radius:12px;padding:17px;background:white}.demo-feature-icon{width:30px;height:30px;border-radius:9px;background:var(--site-soft);color:var(--site-accent);display:grid;place-items:center;font-size:13px}.demo-feature h4{font-size:11px;margin:12px 0 5px}.demo-feature p{font-size:9px;color:#81889a;line-height:1.6;margin:0}.demo-band{padding:26px 7%;background:var(--site-ink);color:white;display:flex;align-items:center;justify-content:space-between}.demo-band b{font-size:17px}.demo-band span{font-size:9px;color:#c9ccdb}.details-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:18px;margin-bottom:60px}.info-panel{border:1px solid var(--line);border-radius:16px;background:white;padding:22px}.info-panel h3{font-size:15px;margin:0 0 15px}.info-panel p{font-size:11px;color:#777f92;line-height:1.8;margin:0}.spec-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}.spec{border:1px solid #eff0f5;background:#fbfbfd;border-radius:10px;padding:12px}.spec small{display:block;color:#959bad;font-size:9px;margin-bottom:5px}.spec b{font-size:11px}.section-list{display:flex;flex-wrap:wrap;gap:7px}.section-pill{border-radius:99px;background:#f1f0ff;color:#6860bd;padding:7px 10px;font-size:10px;font-weight:700}.mobile .template-site{width:390px;min-height:760px;margin:auto}.mobile .demo-nav{height:54px;padding:0 17px}.mobile .demo-links{display:none}.mobile .demo-hero{min-height:455px;padding:25px 22px 210px;align-items:flex-start}.mobile .demo-hero-copy{max-width:100%}.mobile .demo-hero h2{font-size:37px}.mobile .demo-hero-visual{left:22px;right:22px;top:auto;bottom:20px;width:auto;height:165px}.mobile .demo-section{padding:28px 20px}.mobile .demo-features{grid-template-columns:1fr}.mobile .demo-band{padding:22px;gap:12px;align-items:flex-start;flex-direction:column}.mobile .demo-links+.demo-cta{padding:8px 10px}.mobile .demo-stats{gap:15px}.mobile .template-site{overflow:hidden}.mobile .preview-shell{overflow:auto}.mobile .demo-section-head h3{font-size:21px}.mobile .demo-feature{padding:13px}.saved-toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:#262b46;color:white;padding:11px 16px;border-radius:10px;font-size:12px;z-index:70;box-shadow:var(--shadow)}@media(max-width:1050px){.gallery{grid-template-columns:repeat(3,1fr)}.hero{grid-template-columns:1fr 240px}.thumb{height:170px}}@media(max-width:760px){.topbar{height:62px;padding:0 17px;gap:12px}.top-nav{display:none}.top-actions{gap:8px}.saved-link{font-size:11px}.cta-small{font-size:10px;padding:9px 10px}.wrap{padding:0 17px}.hero{padding:39px 0 22px;grid-template-columns:1fr;gap:17px}.hero h1{font-size:43px;margin-top:13px}.hero-copy{font-size:13px}.hero-side{padding:15px 17px;display:flex;align-items:center;gap:15px}.hero-count{font-size:35px}.hero-side p{margin:0;flex:1}.hero-meta{display:none}.toolbar{flex-wrap:wrap}.searchbox{max-width:none;flex-basis:100%}.sort-select{flex:1}.results{margin-left:5px;font-size:10px}.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;padding-bottom:42px}.thumb{height:135px}.card-body{padding:11px}.card h3{font-size:13px}.card-desc{font-size:10px;min-height:48px}.taglist .tag:nth-child(2){display:none}.section-label p{display:none}.footer{gap:12px;line-height:1.6}.detail-title{grid-template-columns:1fr;gap:14px}.detail-title h1{font-size:37px}.detail-actions{justify-content:flex-start}.template-site{min-height:510px}.demo-nav{height:53px;padding:0 4%}.demo-logo{font-size:13px}.demo-links{display:none}.demo-hero{min-height:275px;padding:40px 5%}.demo-hero-copy{max-width:61%}.demo-hero h2{font-size:30px}.demo-hero p{font-size:10px}.demo-hero-visual{right:4%;width:31%;height:61%}.demo-section{padding:27px 5%}.demo-section-head h3{font-size:20px}.demo-features{grid-template-columns:repeat(2,1fr)}.demo-feature{padding:12px}.demo-feature h4{font-size:10px}.demo-feature p{font-size:8px}.demo-band{padding:19px 5%}.details-grid{grid-template-columns:1fr}.preview-shell{margin-left:-4px;margin-right:-4px}.device-toggle{font-size:8px}.mobile .template-site{width:340px}.mobile .demo-hero{min-height:430px}.mobile .demo-hero h2{font-size:34px}.spec-list{gap:7px}}


/* Multi-page website experience and clickable sitemap */
.detail-wrap{max-width:1480px}.site-meta-strip{display:flex;align-items:center;gap:20px;padding:12px 15px;margin:4px 0 13px;background:#f5f6fa;border:1px solid #ebedf4;border-radius:11px;color:#70788d;font-size:10px;font-weight:700}.site-meta-strip span:first-child{color:#3b8067}.site-meta-strip i,.tree-status i,.stage-live-dot{width:7px;height:7px;border-radius:50%;background:#49b78c;display:inline-block;margin-right:6px;box-shadow:0 0 0 3px #49b78c20}.site-workspace{display:grid;grid-template-columns:250px minmax(0,1fr);gap:13px;align-items:stretch;min-height:760px;margin-bottom:25px}.site-tree{background:#fff;border:1px solid #e6e8f0;border-radius:15px;padding:15px 11px;display:flex;flex-direction:column;min-width:0}.tree-heading{display:flex;align-items:center;gap:10px;padding:4px 7px 15px;border-bottom:1px solid #eff0f5}.tree-symbol{width:33px;height:33px;display:grid;place-items:center;border-radius:10px;color:#675ce2;background:#efedff;font-size:17px}.tree-heading small,.tree-heading b{display:block}.tree-heading small{font-size:8px;color:#959bad;margin-bottom:3px;letter-spacing:.08em}.tree-heading b{font-size:11px;white-space:nowrap;max-width:165px;overflow:hidden;text-overflow:ellipsis}.tree-status{margin:13px 7px 9px;padding:8px 9px;background:#f1faf6;border-radius:7px;font-size:9px;color:#458269;font-weight:700}.tree-status i{width:6px;height:6px}.tree-nav{display:flex;flex-direction:column;gap:2px}.tree-row{min-height:34px;display:flex;align-items:center;gap:8px;padding:0 8px;border:0;border-radius:7px;background:transparent;text-align:left;color:#697186;text-decoration:none;font-size:10px;font-weight:600;cursor:pointer;width:100%;position:relative}.tree-row:hover{background:#f5f5fb;color:#5b52c6}.tree-row.selected{background:#eeedff;color:#5148c6;font-weight:800}.tree-parent{color:#424a60;font-weight:800}.tree-parent[aria-expanded="false"] .tree-chevron{transform:rotate(-90deg)}.tree-chevron{font-size:13px;width:10px;color:#9299aa;transition:transform .18s}.tree-icon{width:14px;color:#8b91a4;text-align:center;font-size:11px;flex:none}.tree-row.selected .tree-icon{color:#655bdc}.tree-link{padding-left:calc(8px + var(--level)*17px)}.tree-children{border-left:1px solid #e8e9f0;margin-left:14px;padding-left:5px}.tree-children[hidden]{display:none}.tree-count{margin-left:auto;font-size:8px;color:#9da3b2;background:#f3f4f7;border-radius:8px;padding:2px 5px}.tree-out{margin-left:auto;opacity:0;font-size:10px}.tree-link:hover .tree-out,.tree-link.selected .tree-out{opacity:.8}.tree-help{margin-top:auto;background:#f7f7fb;border-radius:9px;padding:11px 10px}.tree-help b,.tree-help span{display:block}.tree-help b{font-size:9px;margin-bottom:5px;color:#50576b}.tree-help span{font-size:8px;line-height:1.6;color:#8a91a1}.site-stage{min-width:0;background:#f1f2f7;border:1px solid #e5e7ef;border-radius:15px;padding:10px;display:flex;flex-direction:column;overflow:hidden}.stage-toolbar{height:36px;display:flex;align-items:center;gap:12px;padding:0 4px 9px;flex:none}.stage-location{display:flex;align-items:center;gap:7px;color:#81889a;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.stage-location b{color:#b0b5c2}.stage-location span:last-child{color:#4f566d;font-weight:700;overflow:hidden;text-overflow:ellipsis}.stage-live-dot{width:6px;height:6px;flex:none;margin:0}.stage-actions{margin-left:auto;display:flex;gap:3px;flex:none}.stage-device,.stage-share{border:0;border-radius:6px;background:transparent;color:#81889a;font-size:9px;padding:6px 7px}.stage-device.active{background:#fff;color:#4d4b82;font-weight:800;box-shadow:0 1px 3px #15152a0c}.stage-share{margin-left:4px;background:#fff;color:#5e6477;border:1px solid #e9eaf0}.stage-scroll{background:#fff;border-radius:8px;overflow:auto;flex:1;box-shadow:0 2px 7px #292e4510}.stage-site{--site-accent:#655bdc;--site-soft:#efefff;--site-ink:#252842;min-height:100%;background:#fff;color:var(--site-ink);font-family:'DM Sans','Noto Sans TC',sans-serif;transition:max-width .25s,box-shadow .25s}.stage-site.mobile-site{max-width:390px;margin:14px auto;min-height:780px;border:7px solid #292c39;border-radius:25px;overflow:hidden;box-shadow:0 15px 36px #22274125}.sample-page{--site-accent:#6057d5;--site-soft:#eeedff;--site-ink:#242840;background:#fff;color:var(--site-ink);min-height:100%;font-family:'DM Sans','Noto Sans TC',sans-serif}.sample-nav{height:64px;padding:0 5.3%;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid #edf0f3;background:rgba(255,255,255,.96);position:sticky;top:0;z-index:4}.sample-brand{display:flex;align-items:center;gap:8px;min-width:0;color:var(--site-ink);font-size:12px;font-weight:800;letter-spacing:-.03em;text-decoration:none;white-space:nowrap}.sample-brand>span:last-child{max-width:150px;overflow:hidden;text-overflow:ellipsis}.sample-logo{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:var(--site-accent);color:#fff;font:700 13px 'Noto Sans TC',sans-serif;flex:none}.sample-nav nav{display:flex;align-items:center;gap:clamp(9px,1.55vw,22px)}.sample-nav nav>a,.sample-dropbtn{font-size:9px;font-weight:700;color:#777f91;text-decoration:none;border:0;background:none;padding:8px 0;white-space:nowrap}.sample-nav nav>a:hover,.sample-nav nav>a.current{color:var(--site-accent)}.sample-dropdown{position:relative}.sample-dropmenu{display:none;position:absolute;right:-10px;top:28px;min-width:160px;padding:6px;background:#fff;border:1px solid #eceef3;border-radius:9px;box-shadow:0 12px 30px #22274120;z-index:8}.sample-dropdown:hover .sample-dropmenu,.sample-dropdown:focus-within .sample-dropmenu{display:block}.sample-dropmenu a{display:block;padding:9px 10px;border-radius:6px;font-size:9px;text-decoration:none;color:#626a7d}.sample-dropmenu a:hover{background:var(--site-soft);color:var(--site-accent)}.sample-nav-cta{border-radius:7px;background:var(--site-accent);color:white;text-decoration:none;font-size:9px;font-weight:800;padding:10px 12px;white-space:nowrap}.sample-nav-cta span{margin-left:4px}.sample-menu{display:none;border:0;background:none;color:var(--site-ink);font-size:18px}.sample-page .sample-hero{min-height:340px;position:relative;display:flex;align-items:center;padding:48px 7%;overflow:hidden;background:linear-gradient(108deg,var(--site-soft),#fff 75%)}.sample-copy{max-width:55%;position:relative;z-index:1}.sample-overline{font-size:8px;letter-spacing:.15em;text-transform:uppercase;color:var(--site-accent);font-weight:900}.sample-overline i{width:16px;height:1px;background:var(--site-accent);display:inline-block;vertical-align:middle;margin-right:7px}.sample-copy h1{font-size:clamp(28px,3.4vw,45px);line-height:1.12;letter-spacing:-.06em;margin:14px 0 10px;max-width:560px}.sample-copy>p{font-size:10px;color:#737b8e;line-height:1.85;max-width:440px;margin:0}.sample-hero-actions{display:flex;align-items:center;gap:15px;margin-top:19px}.sample-primary{background:var(--site-accent);border-radius:7px;color:white;padding:11px 14px;text-decoration:none;font-size:9px;font-weight:800}.sample-secondary{color:#667085;text-decoration:none;font-size:9px;font-weight:700}.sample-proof{display:flex;gap:14px;flex-wrap:wrap;color:#8b91a0;font-size:7px;margin-top:21px}.web-hero-image{position:absolute;right:7%;top:10%;width:34%;height:80%;border-radius:16px;background-image:url('/assets/template-contact-sheet.png');background-size:500% 1000%;background-position:var(--x) var(--y);box-shadow:0 18px 40px #18213a25;overflow:hidden}.web-hero-image:after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(0deg,#10152e86,transparent)}.web-hero-image span{position:absolute;z-index:1;bottom:12px;left:13px;color:white;font-size:8px;font-weight:700}.sample-hero.inner-hero{min-height:235px}.inner-hero .web-hero-image{width:27%;height:72%;opacity:.94}.sample-intro{padding:34px 7% 22px;display:grid;grid-template-columns:1fr .8fr;gap:28px;align-items:end}.sample-intro small,.sample-contact small,.sample-cta-band small{font-size:7px;letter-spacing:.15em;color:var(--site-accent);font-weight:900}.sample-intro h2{font-size:22px;line-height:1.25;letter-spacing:-.04em;margin:7px 0 0;max-width:440px}.sample-intro>p{font-size:9px;line-height:1.8;color:#81889a;margin:0 0 2px}.sample-cards{padding:12px 7% 38px;display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.web-card{border:1px solid #e9ebf1;border-radius:11px;padding:14px;background:#fff;min-height:145px;position:relative;transition:transform .2s,box-shadow .2s}.web-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px #21284512}.web-card-num{position:absolute;right:13px;top:13px;color:#b5b9c6;font-size:8px;font-weight:800}.web-card-icon{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:var(--site-soft);color:var(--site-accent);font-size:11px}.web-card h3{font-size:10px;margin:10px 0 5px}.web-card p{font-size:8px;color:#858b9b;line-height:1.65;margin:0 0 9px}.web-card a{font-size:8px;font-weight:800;color:var(--site-accent);text-decoration:none}.sample-quote{text-align:center;background:var(--site-soft);padding:27px 10% 25px}.sample-quote>span{font:40px Georgia;color:var(--site-accent);line-height:.7}.sample-quote blockquote{font:500 18px/1.45 'Playfair Display','Noto Sans TC',serif;max-width:620px;margin:6px auto 8px}.sample-quote small{color:#858b9c;font-size:7px;letter-spacing:.12em}.web-cta-band{background:var(--site-ink);color:#fff;padding:24px 7%;display:flex;align-items:center;justify-content:space-between;gap:15px}.web-cta-band small{color:#c5c6df}.web-cta-band h2{font-size:17px;letter-spacing:-.03em;margin:6px 0}.web-cta-band p{font-size:8px;color:#c7cada;margin:0}.web-cta-band>a{background:var(--site-accent);color:white;text-decoration:none;padding:10px 12px;border-radius:7px;font-size:8px;font-weight:800;white-space:nowrap}.sample-footer{padding:19px 7%;display:flex;align-items:center;justify-content:space-between;gap:14px;border-top:1px solid #edf0f3}.sample-footer>div{display:flex;gap:12px;flex-wrap:wrap}.sample-footer>div a{font-size:7px;text-decoration:none;color:#777f91}.sample-footer>span:last-child{font-size:7px;color:#9a9faf}.sample-contact{padding:36px 7%;background:var(--site-soft);display:grid;grid-template-columns:.9fr 1.1fr;gap:27px;align-items:start}.sample-contact h2{font-size:24px;line-height:1.22;letter-spacing:-.05em;margin:8px 0}.sample-contact>div>p{font-size:9px;color:#7e8595;line-height:1.7}.contact-detail{display:flex;flex-direction:column;gap:5px;margin-top:20px;font-size:8px;color:#6f7688}.contact-detail span{color:#9096a4}.site-contact-form{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:16px;background:#fff;border:1px solid #e7e7ef;border-radius:12px}.site-contact-form label{font-size:8px;color:#555d70;font-weight:800;display:flex;flex-direction:column;gap:5px}.site-contact-form label:nth-child(3),.site-contact-form label:nth-child(4),.site-contact-form>button,.site-contact-form>small{grid-column:1/-1}.site-contact-form input,.site-contact-form select,.site-contact-form textarea{border:1px solid #e6e8ef;border-radius:6px;padding:8px;font:400 9px 'DM Sans','Noto Sans TC',sans-serif;outline-color:var(--site-accent);color:#51596d;background:#fff}.site-contact-form textarea{resize:vertical}.site-contact-form>button{border:0;background:var(--site-accent);border-radius:7px;color:white;padding:10px;font-size:9px;font-weight:800}.site-contact-form>small{font-size:7px;color:#a0a5b1}.style-0 .sample-page,.style-0.sample-page{font-family:'Playfair Display','Noto Sans TC',serif}.style-0 .sample-nav nav a,.style-0 .sample-nav-cta,.style-0 .sample-copy>p,.style-0 .sample-proof{font-family:'DM Sans','Noto Sans TC',sans-serif}.style-0 .web-card{border-radius:3px;box-shadow:3px 3px 0 var(--site-soft)}.style-1 .sample-hero{background:linear-gradient(110deg,#f1f8ff,#fff 80%)}.style-1 .web-card{border-radius:15px;box-shadow:0 6px 20px #304c7510}.style-2 .sample-page{background:#161a27;color:#f4f4fa}.style-2 .sample-nav{background:#1c2030;border-color:#303548}.style-2 .sample-brand,.style-2 .sample-copy h1,.style-2 .sample-intro h2,.style-2 .web-card h3{color:#f4f4fa}.style-2 .sample-hero{background:linear-gradient(120deg,#242b40,#171a28 75%)}.style-2 .sample-copy>p,.style-2 .sample-proof,.style-2 .sample-intro>p{color:#b4bbcf}.style-2 .web-card{background:#202538;border-color:#33394e}.style-2 .sample-quote{background:#202538}.style-2 .sample-quote blockquote{color:#f4f4fa}.style-2 .sample-footer{border-color:#303548}.style-3 .sample-hero{background:linear-gradient(95deg,#14233a99,#24365033),linear-gradient(115deg,var(--site-soft),#fff)}.style-3 .web-hero-image{width:38%;right:5%;border-radius:4px}.style-3 .sample-copy h1{font-family:'Playfair Display','Noto Sans TC',serif}.style-4 .sample-hero{background:linear-gradient(105deg,#faf5ef,#fff 77%)}.style-4 .web-hero-image{border-radius:24px 4px 24px 4px}.style-4 .sample-logo{border-radius:50%}.style-5 .sample-page{background:#11131b;color:#f5f4f2}.style-5 .sample-nav{background:#151720;border-color:#30303a}.style-5 .sample-brand,.style-5 .sample-copy h1,.style-5 .sample-intro h2,.style-5 .web-card h3{color:#f5f4f2}.style-5 .sample-hero{background:#171a24}.style-5 .sample-copy>p,.style-5 .sample-proof,.style-5 .sample-intro>p{color:#b8b7c0}.style-5 .web-card{background:#1b1e29;border-color:#333540}.style-5 .sample-quote{background:#1b1e29}.style-5 .sample-quote blockquote{color:#f5f4f2}.style-5 .sample-footer{border-color:#30303a}.style-6 .sample-hero{background:linear-gradient(120deg,#fff3e8,#fff 73%)}.style-6 .sample-logo{border-radius:50%}.style-6 .web-card{border-radius:5px}.style-7 .sample-hero{background:linear-gradient(120deg,#eaf1fb,#fff 75%)}.style-7 .sample-nav-cta,.style-7 .sample-primary{border-radius:3px}.style-7 .web-card{border-top:2px solid var(--site-accent);border-radius:7px}.style-8 .sample-hero{background:#f7f7f4}.style-8 .sample-copy h1{font-weight:500;letter-spacing:-.07em}.style-8 .web-card{border:0;border-top:1px solid #d9ddd9;border-radius:0;background:transparent}.style-9 .sample-hero{background:linear-gradient(120deg,#e9f7f3,#fff 75%)}.style-9 .web-card{border-radius:16px;background:#fcfefd}.detail-specs{margin-top:5px}.detail-specs .info-panel p{font-size:10px}.mobile-site .sample-nav{height:55px;padding:0 15px}.mobile-site .sample-nav nav{display:none}.mobile-site .sample-nav .sample-nav-cta{display:none}.mobile-site .sample-menu{display:block}.mobile-site .sample-nav.menu-open nav{display:flex;position:absolute;top:53px;left:10px;right:10px;align-items:stretch;flex-direction:column;gap:0;padding:8px 13px;background:white;border:1px solid #eee;border-radius:9px;box-shadow:0 9px 23px #20243a1a}.mobile-site .sample-nav.menu-open nav>a{padding:10px 0}.mobile-site .sample-hero{min-height:470px;align-items:flex-start;padding:30px 21px 220px}.mobile-site .sample-copy{max-width:100%}.mobile-site .sample-copy h1{font-size:35px}.mobile-site .sample-copy>p{font-size:9px}.mobile-site .web-hero-image{top:auto;bottom:16px;left:20px;right:20px;width:auto;height:175px}.mobile-site .sample-hero.inner-hero{min-height:430px}.mobile-site .sample-intro{grid-template-columns:1fr;gap:10px;padding:24px 20px 14px}.mobile-site .sample-intro h2{font-size:19px}.mobile-site .sample-cards{grid-template-columns:1fr;padding:12px 20px 25px}.mobile-site .web-card{min-height:0;padding:13px}.mobile-site .sample-contact{grid-template-columns:1fr;padding:25px 20px}.mobile-site .site-contact-form{grid-template-columns:1fr}.mobile-site .site-contact-form label:nth-child(n){grid-column:1/-1}.mobile-site .web-cta-band{align-items:flex-start;flex-direction:column;padding:22px 20px}.mobile-site .sample-footer{align-items:flex-start;flex-direction:column;padding:18px 20px}.mobile-site .sample-footer>div{gap:9px}.mobile-site .sample-proof{font-size:6px}.mobile-site .sample-quote{padding:22px 20px}.mobile-site .sample-quote blockquote{font-size:15px}
@media(max-width:1000px){.site-workspace{grid-template-columns:218px minmax(0,1fr)}.site-tree{padding:12px 8px}.sample-nav{padding:0 4%}.sample-nav nav{gap:10px}.sample-nav nav>a,.sample-dropbtn{font-size:8px}.sample-nav-cta{padding:9px}.sample-copy h1{font-size:35px}}
@media(max-width:760px){.site-meta-strip{overflow:auto;white-space:nowrap;gap:14px;font-size:8px}.site-workspace{grid-template-columns:1fr;min-height:auto}.site-tree{padding:10px;max-height:340px;overflow:auto}.tree-help{display:none}.tree-heading{padding-bottom:9px}.tree-status{margin:8px 7px}.tree-nav{display:grid;grid-template-columns:1fr 1fr;gap:2px}.tree-children{grid-column:1/-1}.site-stage{min-height:690px;padding:6px}.stage-toolbar{gap:4px}.stage-location{font-size:8px}.stage-device{padding:5px}.stage-device span{display:none}.stage-share{font-size:8px}.stage-scroll{min-height:630px}.sample-nav{height:55px;padding:0 14px}.sample-nav nav{display:none}.sample-nav-cta{display:none}.sample-menu{display:block}.sample-nav.menu-open nav{display:flex;position:absolute;top:53px;left:10px;right:10px;align-items:stretch;flex-direction:column;gap:0;padding:8px 13px;background:white;border:1px solid #eee;border-radius:9px;box-shadow:0 9px 23px #20243a1a}.sample-nav.menu-open nav>a{padding:10px 0}.sample-nav.menu-open .sample-dropdown{display:block}.sample-hero{min-height:455px!important;align-items:flex-start!important;padding:28px 20px 210px!important}.sample-copy{max-width:100%}.sample-copy h1{font-size:34px}.sample-copy>p{font-size:9px}.web-hero-image{top:auto;bottom:16px;left:20px;right:20px;width:auto!important;height:170px!important}.sample-intro{grid-template-columns:1fr;gap:10px;padding:24px 20px 14px}.sample-intro h2{font-size:19px}.sample-intro>p{font-size:8px}.sample-cards{grid-template-columns:1fr;padding:12px 20px 25px}.web-card{min-height:0;padding:13px}.sample-contact{grid-template-columns:1fr;padding:25px 20px}.site-contact-form{grid-template-columns:1fr}.site-contact-form label:nth-child(n){grid-column:1/-1}.web-cta-band{align-items:flex-start;flex-direction:column;padding:22px 20px}.sample-footer{align-items:flex-start;flex-direction:column;padding:18px 20px}.sample-footer>div{gap:9px}.detail-title{gap:12px}.detail-title h1{font-size:32px}.detail-actions{flex-wrap:wrap}.detail-specs{margin-bottom:35px}}
.style-2.sample-page{background:#161a27;color:#f4f4fa}.style-5.sample-page{background:#11131b;color:#f5f4f2}