:root { --paper:#f1eee5; --white:#faf9f4; --ink:#202522; --muted:#69706a; --green:#3d5b51; --line:#c9cbc3; --warm:#dd694a; --max:1120px; --serif:"Songti SC","STSong","Noto Serif CJK SC",serif; --sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); font-size:16px; line-height:1.7; }
img { display:block; max-width:100%; }
a { color:inherit; }
:focus-visible { outline:3px solid var(--warm); outline-offset:3px; }
.skip { position:absolute; left:-9999px; z-index:100; padding:.5rem 1rem; background:var(--ink); color:#fff; }
.skip:focus { left:1rem; top:1rem; }
.site-header { position:sticky; top:0; z-index:20; border-bottom:1px solid var(--line); background:color-mix(in srgb,var(--paper) 92%,transparent); backdrop-filter:blur(12px); }
.nav { width:min(100%,var(--max)); min-height:4rem; margin:auto; padding:0 1.5rem; display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.brand-link { display:inline-flex; align-items:center; gap:.6rem; text-decoration:none; }
.brand-link img { width:2rem; height:2rem; border-radius:.45rem; }
.brand-link strong,.footer-brand { font-family:var(--serif); font-size:1.45rem; font-weight:600; letter-spacing:.13em; }
.nav-links { display:flex; align-items:center; gap:1.6rem; margin:0; padding:0; list-style:none; }
.nav-links a { color:var(--muted); text-decoration:none; font-size:.9rem; }
.nav-links a[aria-current="page"],.nav-links a:hover { color:var(--ink); }
.nav-toggle { display:none; border:1px solid var(--ink); border-radius:0; padding:.35rem .6rem; background:transparent; color:var(--ink); font:inherit; }
.eyebrow { margin:0; color:var(--green); font-size:.72rem; font-weight:700; letter-spacing:.18em; line-height:1.3; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { font-family:var(--serif); font-weight:600; line-height:1.18; letter-spacing:.03em; }
h1 { margin:.5rem 0 1rem; font-size:clamp(3rem,6vw,5.4rem); }
h1 em { color:var(--green); font-style:normal; }
h2 { margin:.65rem 0 0; font-size:clamp(2.05rem,4vw,3.5rem); }
h3 { margin:0 0 .4rem; font-size:1.35rem; }
.btn { display:inline-flex; justify-content:center; align-items:center; min-height:3rem; padding:.65rem 1.15rem; border:1px solid var(--ink); text-decoration:none; font-weight:600; font-size:.92rem; transition:background .2s,color .2s,transform .2s; }
.btn:hover { transform:translateY(-2px); }
.btn-dark { background:var(--ink); color:var(--white); }
.btn-dark:hover { background:var(--green); border-color:var(--green); }
.btn-outline { background:transparent; color:var(--ink); }
.btn-outline:hover { background:var(--ink); color:var(--white); }
.text-link { display:inline-flex; gap:.45rem; align-items:center; color:var(--green); text-decoration-thickness:1px; text-underline-offset:.25em; font-weight:600; }
.text-link span { font-size:1.2em; }
.home-hero,.page-hero,.download-hero { width:min(100%,var(--max)); margin:auto; padding:clamp(2rem,4vw,3.75rem) 1.5rem; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:clamp(1.5rem,4vw,3.5rem); }
.home-hero { min-height:0; }
.hero-copy { max-width:32rem; }
.hero-lead,.page-hero > div > p,.download-hero > div > p { max-width:29rem; margin:0 0 1.8rem; color:var(--muted); font-size:1.05rem; }
.cta-row { display:flex; flex-wrap:wrap; align-items:center; gap:1.2rem; }
.hero-visual,.page-image { position:relative; margin:0; padding:1.2rem; border:1px solid var(--line); background:var(--white); }
.hero-visual::before,.page-image::before { content:""; position:absolute; width:42%; aspect-ratio:1; right:-1px; top:-1px; z-index:0; background:var(--warm); }
.hero-visual img,.page-image img { position:relative; z-index:1; width:100%; height:clamp(22rem,42vw,32rem); object-fit:contain; object-position:center; }
.page-image img { height:clamp(17rem,28vw,24rem); }
.hero-visual figcaption { position:relative; z-index:1; padding:.85rem .2rem 0; color:var(--muted); font-size:.86rem; }
.section { width:min(100%,var(--max)); margin:auto; padding:clamp(2.75rem,5vw,4.75rem) 1.5rem; }
.section-rule { display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:end; border-top:1px solid var(--ink); }
.meaning-copy { max-width:31rem; color:var(--muted); }
.meaning-copy p { margin-bottom:1.7rem; font-size:1.1rem; }
.workflow-section { border-top:1px solid var(--line); }
.workflow { display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin:2rem 0 0; padding:0; list-style:none; border-top:1px solid var(--ink); border-bottom:1px solid var(--ink); }
.workflow li { min-height:11.5rem; padding:1.15rem 1.2rem; border-right:1px solid var(--line); }
.workflow li:last-child { border:0; }
.workflow span,.feature-list article > span,.destination-list span { display:block; margin-bottom:1.45rem; color:var(--warm); font-size:.8rem; font-weight:700; letter-spacing:.12em; }
.workflow p { max-width:16rem; color:var(--muted); font-size:.94rem; }
.case-section,.full-image-section { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1fr); gap:clamp(3rem,9vw,9rem); align-items:center; background:var(--ink); color:var(--white); }
.case-section { width:min(100%,var(--max)); margin:0 auto; padding:clamp(2rem,4vw,3.5rem); }
.case-copy { max-width:32rem; }
.case-copy .eyebrow,.full-image-section .eyebrow { color:#bbd3b7; }
.case-copy p:not(.eyebrow),.full-image-section p:not(.eyebrow) { color:#cfd5cc; }
.product-figure { display:grid; place-items:center; margin:0; min-height:24rem; background:linear-gradient(145deg,#e2ded0,#bdbcae); border:1px solid #6e756d; }
.product-figure img { width:86%; max-height:28rem; object-fit:contain; }
.case-copy .btn-outline { border-color:#d9ddd4; color:#fff; }
.case-copy .btn-outline:hover { background:#fff; color:var(--ink); }
.destination-section { padding-bottom:clamp(3rem,5vw,4.5rem); }
.destination-list { margin-top:2.8rem; border-top:1px solid var(--ink); }
.destination-list a { display:grid; grid-template-columns:5rem 1fr 1fr auto; gap:1rem; align-items:center; padding:1.2rem 0; border-bottom:1px solid var(--line); text-decoration:none; transition:padding .2s,color .2s; }
.destination-list a:hover { padding-left:.5rem; color:var(--green); }
.destination-list span { margin:0; }
.destination-list strong { font-family:var(--serif); font-size:1.35rem; }
.destination-list small { color:var(--muted); }
.destination-list b { font-size:1.4rem; }
.page-hero,.download-hero { min-height:0; }
.page-hero h1,.download-hero h1 { font-size:clamp(2.8rem,5vw,4.7rem); }
.page-hero .btn { margin-top:.6rem; }
.feature-section { display:grid; grid-template-columns:.8fr 1.2fr; gap:3rem; align-items:start; }
.feature-list { border-top:1px solid var(--ink); }
.feature-list article { display:grid; grid-template-columns:4.8rem 1fr; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--line); }
.feature-list article > span { margin:0; }
.feature-list p { max-width:35rem; margin:0; color:var(--muted); }
.full-image-section { width:min(100%,var(--max)); margin:0 auto; padding:clamp(2rem,4vw,3.5rem); }
.full-image { display:grid; place-items:center; margin:0; min-height:23rem; background:#e3e1d6; }
.full-image img { width:72%; max-height:25rem; object-fit:contain; }
.full-image-section .text-link { color:#fff; }
.download-hero { grid-template-columns:1fr .8fr; }
.download-card { margin-top:2rem; padding:1.25rem 1.35rem; border:1px solid var(--ink); background:var(--white); }
.download-card p { margin:0 0 .3rem; color:var(--muted); font-size:.8rem; }
.download-card strong { display:block; font-family:var(--serif); font-size:1.55rem; }
.download-card strong span { margin-left:.3rem; color:var(--warm); font-family:var(--sans); font-size:.8rem; font-weight:600; }
.download-card small { display:block; margin-top:.65rem; color:var(--muted); }
.download-product { min-height:27rem; background:#d9dfd3; }
.requirements { display:grid; grid-template-columns:.8fr 1.2fr; gap:3rem; }
.requirements ul { margin:0; padding:0; list-style:none; border-top:1px solid var(--ink); }
.requirements li { display:grid; grid-template-columns:8rem 1fr; gap:1rem; padding:1.2rem 0; border-bottom:1px solid var(--line); }
.requirements strong { font-family:var(--serif); font-size:1.25rem; }
.requirements span { color:var(--muted); }
.download-note { display:block; padding-top:0; }
.privacy-hero { width:min(100%,var(--max)); margin:auto; padding:clamp(2rem,4vw,3.75rem) 1.5rem 1.8rem; border-bottom:1px solid var(--ink); }
.privacy-hero > p:last-child { margin:.8rem 0 0; font-family:var(--serif); font-size:clamp(2.5rem,5vw,4.5rem); line-height:1.1; }
.privacy-doc { max-width:820px; padding-top:2.5rem; }
.privacy-doc .meta { color:var(--muted); }
.privacy-doc h2 { margin:2.7rem 0 .8rem; font-size:1.65rem; }
.privacy-doc p,.privacy-doc li { color:#4e5650; }
.privacy-doc a { color:var(--green); }
.table-scroll { overflow-x:auto; margin:1.25rem 0; border:1px solid var(--line); background:var(--white); }
.privacy-doc table { width:100%; min-width:630px; border-collapse:collapse; }
.privacy-doc th,.privacy-doc td { padding:.8rem; border-right:1px solid var(--line); border-bottom:1px solid var(--line); vertical-align:top; text-align:left; font-size:.92rem; }
.privacy-doc th { background:#e6e6da; color:var(--ink); }
.privacy-doc tr:last-child td { border-bottom:0; }
.site-footer { margin-top:2rem; border-top:1px solid var(--ink); background:#dfe1d8; }
.footer-inner { width:min(100%,var(--max)); margin:auto; padding:1.6rem 1.5rem; display:grid; grid-template-columns:1.2fr .8fr 1.2fr auto; gap:1rem; align-items:end; }
.footer-inner p { margin:0; color:var(--muted); font-size:.86rem; }
.footer-brand { font-size:1.7rem; }
.footer-links { display:flex; flex-wrap:wrap; gap:.7rem 1rem; margin:0; padding:0; list-style:none; }
.footer-links a { color:var(--muted); text-decoration:none; font-size:.9rem; }
.footer-links a:hover { color:var(--green); }
.footer-contact a { color:var(--ink); }
.footer-note { white-space:nowrap; }
@media (max-width:800px) { .nav { padding:0 1rem; }.nav-toggle { display:block; }.nav-links { display:none; position:absolute; top:4.5rem; left:0; right:0; padding:.5rem 1rem 1rem; flex-direction:column; align-items:stretch; gap:0; background:var(--paper); border-bottom:1px solid var(--line); }.nav-links.open { display:flex; }.nav-links a { display:block; padding:.7rem 0; }.home-hero,.page-hero,.download-hero,.section-rule,.feature-section,.requirements,.case-section,.full-image-section { grid-template-columns:1fr; gap:2.5rem; }.home-hero,.page-hero,.download-hero { min-height:auto; padding-top:3.5rem; }.hero-visual img { height:29rem; }.page-image img { height:22rem; }.workflow { grid-template-columns:1fr; }.workflow li { min-height:0; border-right:0; border-bottom:1px solid var(--line); }.workflow li:last-child { border-bottom:0; }.workflow span { margin-bottom:1.1rem; }.product-figure { min-height:24rem; }.product-figure img { max-height:28rem; }.feature-section,.requirements { gap:2.5rem; }.destination-list a { grid-template-columns:3rem 1fr auto; }.destination-list small { grid-column:2; }.footer-inner { grid-template-columns:1fr 1fr; align-items:start; }.footer-contact { grid-column:1 / -1; }.footer-note { grid-column:1 / -1; }.download-note { grid-template-columns:7rem 1fr; gap:1.2rem; }.download-note > img { width:7rem; height:7rem; } }
@media (max-width:480px) { body { font-size:15px; }.home-hero,.page-hero,.download-hero,.section,.privacy-hero { padding-left:1rem; padding-right:1rem; }.hero-visual,.page-image { padding:.7rem; }.hero-visual img { height:25rem; }.page-image img { height:18rem; }.product-figure { min-height:20rem; }.case-section,.full-image-section { padding:2rem 1rem; }.full-image { min-height:22rem; }.requirements li { grid-template-columns:1fr; gap:.15rem; }.footer-inner { grid-template-columns:1fr; }.destination-list a { grid-template-columns:2.2rem 1fr auto; }.destination-list small { display:none; }.download-note { grid-template-columns:1fr; }.download-note > img { width:6rem; height:6rem; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }