/* BookKeeper · design system
   Layout concept: a ledger page. Ruled lines, a red double margin, brass ticks and a seal-red stamp
   carry the brand; everything else stays quiet so the numbers and deadlines read first. */
:root{
  --ink:#0E3B32; --forest:#17594A; --leaf:#3F7A62;
  --paper:#F6F8F4; --surface:#FFFFFF; --mint:#E7F0EA; --rule:#D3E0D8; --rule-soft:#E4ECE7;
  --text:#1B2B27; --muted:#5A7068; --brass:#B8912F; --brass-soft:#F3EAD2; --seal:#C2402F; --seal-soft:#F8E4DF;
  --wa:#1F8F5F; --wa-hover:#18774E; --on-dark:#F3F7F4; --on-dark-muted:#BCD0C7;
  --hero-scrim:rgba(7,29,25,.92);
  --shadow:0 1px 2px rgba(14,59,50,.06),0 8px 24px rgba(14,59,50,.07);
  --f-display:"Noto Serif SC","Songti SC","STSong",Georgia,serif;
  --f-latin:"Fraunces",Georgia,serif;
  --f-body:"Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --radius:10px; --wrap:1180px; --prose:44rem;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --ink:#CFEADD; --forest:#9AD4BA; --leaf:#7FC3A3;
  --paper:#0B1E1A; --surface:#112A25; --mint:#16332D; --rule:#24453D; --rule-soft:#1B3832;
  --text:#E3EDE8; --muted:#9DB5AB; --brass:#D9B65E; --brass-soft:#2E2A1A; --seal:#E8735F; --seal-soft:#3A1F1A;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.25); color-scheme:dark}}
:root[data-theme="dark"]{
  --ink:#CFEADD; --forest:#9AD4BA; --leaf:#7FC3A3;
  --paper:#0B1E1A; --surface:#112A25; --mint:#16332D; --rule:#24453D; --rule-soft:#1B3832;
  --text:#E3EDE8; --muted:#9DB5AB; --brass:#D9B65E; --brass-soft:#2E2A1A; --seal:#E8735F; --seal-soft:#3A1F1A;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.25); color-scheme:dark}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--text);font-family:var(--f-body);font-size:17px;line-height:1.85;letter-spacing:.01em}
img{max-width:100%;height:auto;display:block}
a{color:var(--forest);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--leaf)}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px;border-radius:4px}
h1,h2,h3{font-family:var(--f-display);color:var(--ink);line-height:1.35;text-wrap:balance;letter-spacing:.01em}
h2{font-size:clamp(1.5rem,1.2rem + 1.2vw,2.1rem);margin:0 0 .7em}
h3{font-size:1.18rem;margin:0 0 .4em}
p{margin:0 0 1em}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.num,.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--paper);padding:8px 14px;z-index:100}
.skip:focus{left:12px}

/* ---------- header ---------- */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--surface)}
.site-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--rule)}
.site-header .wrap{display:flex;align-items:center;gap:20px;min-height:68px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);flex-shrink:0}
.brand img{width:38px;height:38px}
.brand-word{font-family:var(--f-latin);font-size:1.42rem;font-weight:700;letter-spacing:-.01em;line-height:1}
.brand-word span{font-weight:500;color:var(--forest)}
.brand-sub{display:block;font-family:var(--f-body);font-size:.66rem;letter-spacing:.18em;color:var(--muted);font-weight:500;margin-top:3px}
.nav{display:flex;align-items:center;gap:4px;margin-left:auto}
.nav>a,.nav .dd>button{font:inherit;font-size:.95rem;color:var(--text);text-decoration:none;padding:8px 12px;border-radius:8px;background:none;border:0;cursor:pointer;line-height:1.4}
.nav>a:hover,.nav .dd>button:hover,.nav>a[aria-current="page"]{background:var(--mint);color:var(--ink)}
.dd{position:relative}
.dd>button::after{content:"";display:inline-block;width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-3px);margin-left:8px}
.dd-menu{position:absolute;top:calc(100% + 6px);left:-8px;min-width:260px;background:var(--surface);border:1px solid var(--rule);border-radius:12px;box-shadow:var(--shadow);padding:8px;display:none}
.dd:hover .dd-menu,.dd:focus-within .dd-menu,.dd.open .dd-menu{display:grid}
.dd-menu a{display:block;padding:9px 12px;border-radius:8px;color:var(--text);text-decoration:none;font-size:.94rem;line-height:1.45}
.dd-menu a small{display:block;color:var(--muted);font-size:.8rem}
.dd-menu a:hover{background:var(--mint)}
.lang{display:flex;gap:2px;font-size:.8rem;border:1px solid var(--rule);border-radius:999px;padding:2px}
.lang a,.lang span{padding:3px 9px;border-radius:999px;text-decoration:none;color:var(--muted)}
.lang .on{background:var(--ink);color:var(--paper)}
.lang .soon{opacity:.55;cursor:not-allowed}
.menu-btn{display:none;margin-left:auto;background:none;border:1px solid var(--rule);border-radius:8px;padding:8px 10px;color:var(--ink);font:inherit;font-size:.9rem}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font:inherit;font-weight:600;font-size:1rem;line-height:1.2;padding:13px 22px;border-radius:999px;text-decoration:none;cursor:pointer;border:1.5px solid transparent;transition:background .2s,transform .2s,border-color .2s}
.btn:hover{transform:translateY(-1px)}
.btn-wa{background:var(--wa);color:#fff}
.btn-wa:hover{background:var(--wa-hover);color:#fff}
.btn-wa::before{content:"";width:18px;height:18px;flex-shrink:0;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm0 18.2a8.2 8.2 0 0 1-4.2-1.2l-.3-.2-3 .8.8-2.9-.2-.3A8.2 8.2 0 1 1 12 20.2zm4.5-6.1c-.2-.1-1.5-.7-1.7-.8-.2-.1-.4-.1-.6.1l-.8 1c-.1.2-.3.2-.5.1a6.7 6.7 0 0 1-3.3-2.9c-.3-.4.2-.4.7-1.4.1-.2 0-.3 0-.4l-.8-1.8c-.2-.5-.4-.4-.6-.4h-.5a1 1 0 0 0-.7.3 3 3 0 0 0-.9 2.2 5.2 5.2 0 0 0 1.1 2.7 11.8 11.8 0 0 0 4.5 4c1.7.7 2.3.8 3.2.6a2.7 2.7 0 0 0 1.8-1.3 2.2 2.2 0 0 0 .2-1.3c-.1-.1-.3-.2-.5-.3z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm0 18.2a8.2 8.2 0 0 1-4.2-1.2l-.3-.2-3 .8.8-2.9-.2-.3A8.2 8.2 0 1 1 12 20.2zm4.5-6.1c-.2-.1-1.5-.7-1.7-.8-.2-.1-.4-.1-.6.1l-.8 1c-.1.2-.3.2-.5.1a6.7 6.7 0 0 1-3.3-2.9c-.3-.4.2-.4.7-1.4.1-.2 0-.3 0-.4l-.8-1.8c-.2-.5-.4-.4-.6-.4h-.5a1 1 0 0 0-.7.3 3 3 0 0 0-.9 2.2 5.2 5.2 0 0 0 1.1 2.7 11.8 11.8 0 0 0 4.5 4c1.7.7 2.3.8 3.2.6a2.7 2.7 0 0 0 1.8-1.3 2.2 2.2 0 0 0 .2-1.3c-.1-.1-.3-.2-.5-.3z'/%3E%3C/svg%3E") center/contain no-repeat}
.btn-ghost{border-color:var(--rule);color:var(--ink);background:transparent}
.btn-ghost:hover{border-color:var(--forest);color:var(--ink)}
.btn-light{border-color:rgba(255,255,255,.45);color:#fff;background:rgba(255,255,255,.06)}
.btn-light:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.12)}
.btn-sm{padding:9px 16px;font-size:.9rem}

/* ---------- hero ---------- */
.hero{position:relative;color:var(--on-dark);background-color:#0A2621;background-position:center 72%;background-size:cover;background-repeat:no-repeat;isolation:isolate;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--hero-scrim) 0%,rgba(7,29,25,.78) 42%,rgba(7,29,25,.25) 100%),linear-gradient(0deg,rgba(7,29,25,.55),transparent 40%)}
.hero::after{content:"";position:absolute;top:0;bottom:0;left:clamp(10px,3vw,40px);width:6px;border-left:1.5px solid rgba(232,115,95,.55);border-right:1.5px solid rgba(232,115,95,.55);z-index:-1}
.hero .wrap{padding-block:clamp(48px,7vw,96px)}
.hero h1{color:#fff;font-size:clamp(1.9rem,1.3rem + 2.6vw,3.2rem);margin:.25em 0 .45em;max-width:22ch}
.hero p.sub{font-size:clamp(1.02rem,.95rem + .3vw,1.18rem);color:var(--on-dark-muted);max-width:40rem;margin-bottom:1.6em}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:.82rem;letter-spacing:.14em;font-weight:600;color:#E9CF8A}
.eyebrow::before{content:"";width:22px;height:1.5px;background:currentColor}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px}
.crumbs{font-size:.84rem;color:var(--on-dark-muted);display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px}
.crumbs a{color:var(--on-dark-muted);text-decoration:none}
.crumbs a:hover{color:#fff}
.crumbs span[aria-hidden]{opacity:.5}
.art-meta{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:.88rem;color:var(--on-dark-muted);margin-top:4px}
.art-meta b{color:#fff;font-weight:600}

/* home hero */
.hero-home .wrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(28px,5vw,72px);align-items:center;padding-block:clamp(56px,8vw,120px)}
.hero-home h1{font-size:clamp(2.1rem,1.4rem + 3vw,3.7rem);max-width:15ch}
.hero-home h1 em{font-style:normal;color:#F0D48E}
.trust-row{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:28px;font-size:.9rem;color:var(--on-dark-muted);padding:0;list-style:none}
.trust-row li{display:flex;align-items:center;gap:8px}
.trust-row li::before{content:"";width:14px;height:8px;border-left:2px solid #E9CF8A;border-bottom:2px solid #E9CF8A;transform:rotate(-45deg) translateY(-2px)}
.ledger-card{position:relative;background:#F6F8F2;color:#1B2B27;border-radius:6px;padding:26px 26px 22px 54px;box-shadow:0 30px 60px rgba(0,0,0,.35);transform:rotate(1.2deg);
  background-image:repeating-linear-gradient(180deg,transparent 0 37px,#CFE0D6 37px 38px);background-position:0 18px}
.ledger-card::before{content:"";position:absolute;top:0;bottom:0;left:34px;width:5px;border-left:1.5px solid #E08A7C;border-right:1.5px solid #E08A7C}
.ledger-card h2{font-size:1.05rem;color:#0E3B32;margin:0 0 6px;display:flex;justify-content:space-between;gap:12px}
.ledger-card h2 .num{color:#5A7068;font-size:.8rem;font-weight:400}
.ledger-card ul{list-style:none;margin:0;padding:0}
.ledger-card li{display:flex;justify-content:space-between;align-items:center;gap:12px;height:38px;font-size:.95rem;white-space:nowrap;overflow:hidden}
.ledger-card li>span{flex-shrink:0}
.ledger-card .ok{color:#17594A;font-weight:700;font-family:var(--f-mono);font-size:.82rem}
.ledger-card .due{color:#B8912F;font-family:var(--f-mono);font-size:.82rem}
.ledger-card .pending{color:#C2402F;font-family:var(--f-mono);font-size:.82rem}
.ledger-card .caption{font-size:.74rem;color:#5A7068;margin-top:10px;line-height:1.5}
.seal{position:absolute;right:-18px;bottom:-58px;width:118px;height:118px;border:3px solid #C2402F;border-radius:50%;display:grid;place-items:center;color:#C2402F;font-family:var(--f-display);font-weight:700;font-size:1.25rem;transform:rotate(-14deg);background:rgba(246,248,242,.85);line-height:1.1;text-align:center}
.seal small{display:block;font-family:var(--f-latin);font-size:.6rem;letter-spacing:.15em}

/* ---------- sections ---------- */
.sec{padding-block:clamp(48px,6vw,84px)}
.sec.alt{background:var(--surface);border-block:1px solid var(--rule-soft)}
.sec.ruled{background-color:var(--mint);background-image:repeating-linear-gradient(180deg,transparent 0 33px,var(--rule) 33px 34px)}
.sec-head{max-width:46rem;margin-bottom:34px}
.sec-head .kicker{font-size:.8rem;letter-spacing:.16em;font-weight:700;color:var(--brass);display:block;margin-bottom:8px}
.sec-head p{color:var(--muted)}
.prose{max-width:var(--prose)}
.prose h2{margin-top:1.4em}
.prose>h2:first-child,.prose>h3:first-child{margin-top:0}
.prose h3{margin-top:1.4em}
.prose ul,.prose ol{padding-left:1.3em}
.prose li{margin-bottom:.35em}
.wrap>*+*{margin-top:28px}
.hero .wrap>*+*,.final-cta .wrap>*+*,.site-header .wrap>*+*{margin-top:0}

.answer{position:relative;max-width:var(--prose);background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius);padding:22px 24px 20px 48px;margin-bottom:36px;box-shadow:var(--shadow)}
.answer::before{content:"";position:absolute;left:22px;top:16px;bottom:16px;width:5px;border-left:1.5px solid var(--seal);border-right:1.5px solid var(--seal);opacity:.7}
.answer-label{display:inline-block;font-size:.76rem;font-weight:700;letter-spacing:.12em;color:var(--seal);background:var(--seal-soft);padding:2px 10px;border-radius:999px;margin-bottom:8px}
.answer p{margin:0;font-size:1.04rem}

.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:18px}
.card{background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius);padding:22px 22px 18px;min-width:0}
.sec.alt .card{background:var(--paper)}
.card h3{font-size:1.08rem}
.card p{color:var(--muted);font-size:.96rem;margin-bottom:.6em}
.card p:last-child{margin-bottom:0}
a.card{text-decoration:none;color:inherit;display:block;transition:border-color .2s,transform .2s}
a.card:hover{border-color:var(--forest);transform:translateY(-2px)}
.card .more{font-size:.88rem;color:var(--forest);font-weight:600}

.steps{list-style:none;padding:0;margin:0;counter-reset:s;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:18px}
.steps li{counter-increment:s;position:relative;padding:54px 20px 18px;background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius);min-width:0}
.sec.alt .steps li{background:var(--paper)}
.steps li::before{content:counter(s,decimal-leading-zero);position:absolute;top:16px;left:20px;font-family:var(--f-mono);font-size:.85rem;font-weight:700;color:var(--brass);letter-spacing:.06em}
.steps li::after{content:"";position:absolute;top:26px;left:56px;right:20px;height:1px;background:var(--rule)}
.steps h3{font-size:1.04rem}
.steps p{color:var(--muted);font-size:.95rem;margin:0}

.checklist{list-style:none;padding:0;margin:0 0 1em;display:grid;gap:10px;max-width:var(--prose)}
.checklist li{position:relative;padding-left:32px}
.checklist li::before{content:"";position:absolute;left:4px;top:.55em;width:13px;height:7px;border-left:2.2px solid var(--brass);border-bottom:2.2px solid var(--brass);transform:rotate(-45deg)}

.table-wrap{overflow-x:auto;border:1px solid var(--rule);border-radius:var(--radius);background:var(--surface);max-width:100%}
table.data{width:100%;border-collapse:collapse;font-size:.95rem;min-width:520px}
table.data th{font-family:var(--f-body);text-align:left;font-weight:700;color:var(--ink);background:var(--mint);padding:12px 16px;border-bottom:1px solid var(--rule);white-space:nowrap}
table.data td{padding:12px 16px;border-bottom:1px solid var(--rule-soft);vertical-align:top;font-variant-numeric:tabular-nums}
table.data tr:last-child td{border-bottom:0}

.note{max-width:var(--prose);background:var(--brass-soft);border:1px solid color-mix(in srgb,var(--brass) 40%,transparent);border-radius:var(--radius);padding:18px 20px}
.note strong{display:block;color:var(--ink);margin-bottom:4px}
.note p:last-child{margin:0}
.scenario{max-width:var(--prose);position:relative;padding:20px 22px 18px;border-radius:var(--radius);background:var(--surface);border:1px dashed var(--leaf)}
.sec.alt .scenario{background:var(--paper)}
.scenario-label{display:inline-block;font-size:.76rem;font-weight:700;letter-spacing:.1em;color:var(--leaf);margin-bottom:6px}
.scenario p:last-child{margin:0}
.placeholder{max-width:var(--prose);border:1.5px dashed var(--seal);color:var(--seal);background:var(--seal-soft);border-radius:var(--radius);padding:12px 16px;font-size:.9rem}
.placeholder::before{content:"上线前替换 · ";font-weight:700}
.sources{font-size:.85rem;color:var(--muted);max-width:var(--prose)}
.sources a{color:var(--muted)}
.cta-inline{max-width:var(--prose);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px;background:var(--ink);color:var(--on-dark);border-radius:14px;padding:22px 24px}
:root[data-theme="dark"] .cta-inline{background:#0F3D33}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .cta-inline{background:#0F3D33}}
.cta-inline p{margin:0;font-weight:600;flex:1 1 260px;color:var(--on-dark)}

/* services grid on home */
.svc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.svc{display:flex;flex-direction:column;gap:6px;background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius);padding:24px;text-decoration:none;color:inherit;transition:border-color .2s,transform .2s;min-width:0}
.svc:hover{border-color:var(--forest);transform:translateY(-2px)}
.svc .ico{width:42px;height:42px;border-radius:10px;background:var(--mint);display:grid;place-items:center;color:var(--forest);margin-bottom:8px}
.svc .ico svg{width:22px;height:22px}
.svc h3{margin:0}
.svc p{color:var(--muted);font-size:.95rem;margin:0}
.svc .from{margin-top:auto;padding-top:12px;font-size:.88rem;color:var(--forest);font-weight:600}

/* deadlines */
.deadlines{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border:1px solid var(--rule);border-radius:var(--radius);overflow:hidden;background:var(--surface)}
.dl{padding:18px 20px;border-right:1px solid var(--rule-soft);border-bottom:1px solid var(--rule-soft);min-width:0}
.dl .when{font-family:var(--f-mono);font-size:.86rem;color:var(--seal);font-weight:700}
.dl h3{font-size:1rem;margin:.2em 0}
.dl p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.6}

/* price tiers */
.tiers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.tier{position:relative;background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius);padding:22px 20px;min-width:0}
.tier.pick{border-color:var(--forest);box-shadow:var(--shadow)}
.tier .badge{position:absolute;top:-11px;left:20px;background:var(--brass);color:#1B2B27;font-size:.74rem;font-weight:700;padding:2px 10px;border-radius:999px}
.tier h3{font-size:1rem;color:var(--muted);font-family:var(--f-body);font-weight:600;margin:0}
.tier .price{font-family:var(--f-latin);font-size:2rem;font-weight:700;color:var(--ink);line-height:1.2;margin:6px 0 2px}
.tier .price small{font-family:var(--f-body);font-size:.85rem;font-weight:400;color:var(--muted)}
.tier p{font-size:.92rem;color:var(--muted);margin:0}
.fineprint{font-size:.85rem;color:var(--muted)}

/* locations */
.loc-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.loc{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:3/4;max-width:100%;display:flex;align-items:flex-end;text-decoration:none;color:#fff;background-color:#0A2621;background-position:center 70%;background-size:cover}
.loc::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,29,25,.92),rgba(7,29,25,.1) 65%)}
.loc span{position:relative;padding:16px;line-height:1.4}
.loc b{display:block;font-family:var(--f-display);font-size:1.15rem}
.loc small{color:#CFE0D6;font-size:.82rem}
.loc:hover{color:#fff}
.loc:hover::before{background:linear-gradient(0deg,rgba(14,59,50,.95),rgba(14,59,50,.2) 70%)}

/* blog list */
.posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:20px}
.post{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius);overflow:hidden;text-decoration:none;color:inherit;transition:border-color .2s,transform .2s;min-width:0}
.post:hover{border-color:var(--forest);transform:translateY(-2px)}
.post img{aspect-ratio:16/9;object-fit:cover;width:100%}
.post div{padding:18px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
.post .cat{font-size:.78rem;font-weight:700;letter-spacing:.08em;color:var(--brass)}
.post h3{font-size:1.06rem;margin:0}
.post p{font-size:.92rem;color:var(--muted);margin:0}
.post .meta{margin-top:auto;padding-top:8px;font-size:.8rem;color:var(--muted)}

/* faq */
.faq{max-width:var(--prose);border-top:1px solid var(--rule)}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{cursor:pointer;list-style:none;padding:18px 40px 18px 0;position:relative;font-weight:600;color:var(--ink);font-size:1.03rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:8px;top:26px;width:9px;height:9px;border-right:2px solid var(--brass);border-bottom:2px solid var(--brass);transform:rotate(45deg);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(-135deg);top:30px}
.faq details p{margin:0 0 18px;color:var(--muted)}

/* standards list on home */
.standards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--rule)}
.standards div{padding:22px 22px 22px 0;border-bottom:1px solid var(--rule);min-width:0}
.standards .n{font-family:var(--f-mono);color:var(--brass);font-size:.8rem;font-weight:700}
.standards h3{font-size:1.05rem;margin:.2em 0 .3em}
.standards p{color:var(--muted);font-size:.94rem;margin:0}

.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:start}
.author-box{max-width:var(--prose);display:flex;gap:16px;align-items:flex-start;border:1px solid var(--rule);background:var(--surface);border-radius:var(--radius);padding:18px 20px;font-size:.92rem}
.author-box img{width:48px;height:48px}
.author-box p{margin:0;color:var(--muted)}
.author-box b{color:var(--ink)}
.related{margin-top:0}

/* contact form */
.lead-form{display:grid;grid-template-columns:1fr;gap:6px 18px;max-width:var(--prose);background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:24px}
.lead-form label{font-size:.88rem;font-weight:600;color:var(--ink);margin-top:10px}
.lead-form input,.lead-form select,.lead-form textarea{font:inherit;font-size:.98rem;padding:11px 12px;border:1px solid var(--rule);border-radius:8px;background:var(--paper);color:var(--text);width:100%}
.lead-form .field{display:flex;flex-direction:column;gap:6px;min-width:0}
.lead-form .full{grid-column:1/-1}
.lead-form button{grid-column:1/-1;margin-top:16px;justify-self:start}

/* final CTA */
.final-cta{background:var(--ink);color:var(--on-dark);position:relative;overflow:hidden}
:root[data-theme="dark"] .final-cta{background:#0F3D33}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .final-cta{background:#0F3D33}}
.final-cta::before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(180deg,transparent 0 35px,rgba(255,255,255,.05) 35px 36px)}
.final-cta .wrap{position:relative;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px;padding-block:clamp(44px,6vw,72px)}
.final-cta h2{color:#fff;margin:0 0 .3em;max-width:22ch}
.final-cta p{color:var(--on-dark-muted);margin:0;max-width:38rem}
.final-cta .hero-actions{flex-shrink:0}

/* footer */
.site-footer{background:#071D19;color:#BCD0C7;font-size:.92rem;padding-top:56px}
.site-footer a{color:#DCE8E1;text-decoration:none}
.site-footer a:hover{color:#fff;text-decoration:underline}
.f-grid{display:grid;grid-template-columns:1.4fr repeat(4,minmax(0,1fr));gap:28px}
.f-grid h4{font-family:var(--f-body);color:#fff;font-size:.86rem;letter-spacing:.12em;margin:0 0 12px}
.f-grid ul{list-style:none;padding:0;margin:0;display:grid;gap:7px}
.f-brand .brand{color:#fff}
.f-brand .brand-word span{color:#9AD4BA}
.f-brand p{margin-top:14px;line-height:1.75}
.f-bottom{margin-top:40px;border-top:1px solid #1C3A33;padding-block:20px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:.82rem;color:#8EA79D}
.disclosure{font-size:.82rem;color:#8EA79D;max-width:60rem}

.fab{position:fixed;right:calc(18px + env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:40;width:58px;height:58px;padding:0;border-radius:50%;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.fab::before{width:28px;height:28px}
.fab span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .tiers{grid-template-columns:repeat(2,minmax(0,1fr))}
  .loc-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .f-grid{grid-template-columns:1fr 1fr}
  .f-brand{grid-column:1/-1}
}
@media (max-width:960px){
  .menu-btn{display:inline-flex}
  .nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--surface);border-bottom:1px solid var(--rule);flex-direction:column;align-items:stretch;padding:10px max(16px,env(safe-area-inset-right,0px)) 18px max(16px,env(safe-area-inset-left,0px));gap:2px;max-height:calc(100vh - 68px);overflow:auto}
  .nav.open{display:flex}
  .dd-menu{position:static;display:grid;box-shadow:none;border:0;padding:0 0 0 12px;min-width:0}
  .dd>button::after{display:none}
  .header-cta{display:none}
  .hero-home .wrap{grid-template-columns:1fr}
  .ledger-card{max-width:440px;transform:none}
  .svc-grid,.deadlines{grid-template-columns:repeat(2,minmax(0,1fr))}
  .standards{grid-template-columns:1fr 1fr}
  .split{grid-template-columns:1fr}
}
@media (max-width:620px){
  body{font-size:16px}
  .svc-grid,.standards,.tiers,.deadlines{grid-template-columns:1fr}
  .hero::after{display:none}
  .answer{padding:18px 16px 16px 34px}
  .answer::before{left:14px}
  .ledger-card{padding:20px 16px 20px 46px}
  .ledger-card::before{left:28px}
  .ledger-card li{font-size:.86rem}
  .hero-home .wrap{padding-bottom:84px}
  .loc-grid{grid-template-columns:1fr 1fr}
  .loc{aspect-ratio:4/3}
  .lead-form{grid-template-columns:1fr;padding:18px}
  .f-grid{grid-template-columns:1fr 1fr}
  .seal{width:92px;height:92px;font-size:1rem;right:-6px}
  .hero::before{background:linear-gradient(90deg,var(--hero-scrim),rgba(7,29,25,.82)),linear-gradient(0deg,rgba(7,29,25,.55),transparent 40%)}
  .lang{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ================= 阿 Wise mascot + UX additions ================= */
.ledger-card{margin-bottom:24px}
.hero-owl{position:absolute;right:30px;top:-142px;width:140px;height:auto;filter:drop-shadow(0 14px 18px rgba(0,0,0,.35));pointer-events:none}
.hero-home .wrap{padding-bottom:clamp(80px,9vw,130px)}
/* signature sequence: rest state is the finished state; JS adds .play */
.play .ledger-card li{animation:bk-row .55s ease both;animation-delay:calc(.3s + var(--i) * .28s)}
.play .ledger-card li>span{animation:bk-tick .35s ease both;animation-delay:calc(.55s + var(--i) * .28s)}
.play .hero-owl{animation:bk-hit .7s cubic-bezier(.3,1.4,.5,1) both;animation-delay:1.95s}
.play .seal{animation:bk-stamp .45s cubic-bezier(.3,1.6,.5,1) both;animation-delay:2.3s}
@keyframes bk-row{0%{background:transparent}45%{background:rgba(233,207,138,.38)}100%{background:transparent}}
@keyframes bk-tick{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
@keyframes bk-hit{0%{transform:none}35%{transform:translateY(-22px) rotate(-4deg)}60%{transform:translateY(4px) rotate(3deg)}100%{transform:none}}
@keyframes bk-stamp{from{opacity:0;transform:rotate(-14deg) scale(1.9)}to{opacity:1;transform:rotate(-14deg) scale(1)}}

.step-owl{width:64px;height:auto;position:absolute;top:-22px;right:12px}
.steps li{padding-top:54px}
.remind{display:flex;align-items:center;gap:18px;max-width:46rem;background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:12px 20px 12px 12px;margin-bottom:30px;box-shadow:var(--shadow)}
.remind img{width:96px;height:auto;flex-shrink:0}
.remind p{margin:0}
.remind b{color:var(--ink)}

.final-cta .wrap{flex-wrap:wrap}
.cta-owl{width:130px;height:auto;flex-shrink:0;margin-bottom:-30px;align-self:flex-end}
.cta-copy{flex:1 1 380px;min-width:0}

/* about: meet the owl */
.meet{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:clamp(20px,4vw,48px);align-items:center}
.meet>img{width:100%;max-width:220px;height:auto}
.owl-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.owl-row figure{margin:0;text-align:center;background:var(--paper);border:1px solid var(--rule);border-radius:12px;padding:12px 8px 8px;min-width:0}
.owl-row img{width:100%;max-width:110px;height:auto;margin:0 auto}
.owl-row figcaption{font-size:.82rem;color:var(--muted)}
.kicker{font-size:.8rem;letter-spacing:.16em;font-weight:700;color:var(--brass);display:block;margin-bottom:8px}

/* price calculator */
.calc-sec{background:var(--mint)}
.calc{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:0;background:var(--surface);border:1px solid var(--rule);border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}
.calc-in{padding:clamp(20px,3vw,34px)}
.calc-lead{color:var(--muted)}
.calc-form{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px;margin-top:8px}
.calc-form .field{display:flex;flex-direction:column;gap:6px;min-width:0;border:0;padding:0;margin:0}
.calc-form .field:first-child,.calc-form .checks{grid-column:1/-1}
.calc-form label,.calc-form legend{font-weight:600;color:var(--ink);font-size:.95rem}
.calc-form small{color:var(--muted);font-size:.82rem}
.calc-form select,.calc-form input[type=number]{font:inherit;font-size:1rem;padding:11px 12px;border:1px solid var(--rule);border-radius:10px;background:var(--paper);color:var(--text);width:100%}
.calc-form .checks label{display:flex;align-items:center;gap:10px;font-weight:400;color:var(--text);padding:6px 0}
.calc-form input[type=checkbox]{width:20px;height:20px;accent-color:var(--forest)}
.calc-out{position:relative;background:var(--ink);color:var(--on-dark);padding:clamp(20px,3vw,34px);display:flex;flex-direction:column;gap:6px}
:root[data-theme="dark"] .calc-out{background:#0F3D33}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .calc-out{background:#0F3D33}}
.calc-owl{position:absolute;right:14px;top:-6px;width:96px;height:auto}
.out-label{font-size:.8rem;letter-spacing:.12em;font-weight:700;color:#E9CF8A;margin-top:8px}
.out-big{font-family:var(--f-latin);font-size:clamp(2.2rem,1.8rem + 1.5vw,3rem);font-weight:700;color:#fff;line-height:1.1}
.out-big small{font-family:var(--f-body);font-size:.9rem;font-weight:400;color:var(--on-dark-muted)}
.out-mid{font-family:var(--f-latin);font-size:1.4rem;font-weight:700;color:#fff}
.out-lines{list-style:none;padding:0;margin:4px 0;display:grid;gap:4px;font-size:.9rem;color:var(--on-dark-muted)}
.out-lines li{display:flex;justify-content:space-between;gap:10px;border-bottom:1px dashed rgba(255,255,255,.15);padding-bottom:4px}
.calc-out .btn{margin-top:14px;align-self:flex-start}
.out-note{font-size:.8rem;color:var(--on-dark-muted);margin:8px 0 0}
.flash{animation:bk-flash .45s ease}
@keyframes bk-flash{from{color:#F0D48E}to{color:#fff}}

/* contact success */
.form-success{max-width:var(--prose);display:flex;gap:18px;align-items:center;background:var(--surface);border:1.5px solid var(--leaf);border-radius:14px;padding:16px 20px;margin-top:16px}
.form-success img{width:100px;height:auto;flex-shrink:0}
.form-success p{margin:0;color:var(--muted)}

/* mobile bottom bar */
.m-bar{display:none}
@media (max-width:760px){
  .m-bar{display:grid;grid-template-columns:1.3fr 1fr;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:45;background:color-mix(in srgb,var(--surface) 96%,transparent);backdrop-filter:blur(8px);border-top:1px solid var(--rule);
    padding:10px max(14px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(14px,env(safe-area-inset-left,0px))}
  .m-bar .btn{padding:12px 10px;font-size:.95rem}
  .fab{display:none}
  body{padding-bottom:calc(70px + env(safe-area-inset-bottom,0px))}
}

/* gentle scroll reveal (only when JS + motion allowed) */
.rv{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
.rv.in{opacity:1;transform:none}


@media (max-width:960px){
  .ledger-card{margin-top:96px}
  .calc{grid-template-columns:1fr}
  .owl-row{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:620px){
  .calc-form{grid-template-columns:1fr}
  .meet{grid-template-columns:1fr;justify-items:center}
  .meet>img{max-width:170px}
  .remind{flex-direction:row;padding:10px 14px 10px 8px}
  .remind img{width:72px}
  .cta-owl{width:100px;margin-bottom:-20px}
  .hero-owl{width:104px;top:-108px;right:18px}
}
@media (prefers-reduced-motion:reduce){.play *{animation:none!important}.rv{opacity:1;transform:none;transition:none}}

.hero-home h1{max-width:none;font-size:clamp(1.75rem,1.1rem + 3.2vw,3.4rem)}

/* ================= 3D receipts hero ================= */
.hero3d{position:relative;overflow:hidden;background:var(--paper);--h3-rule:rgba(23,89,74,.17);--h3-margin:rgba(194,64,47,.5)}
:root[data-theme="dark"] .hero3d{--h3-rule:rgba(154,212,186,.13);--h3-margin:rgba(232,115,95,.45)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .hero3d{--h3-rule:rgba(154,212,186,.13);--h3-margin:rgba(232,115,95,.45)}}
.h3-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.h3-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(16px,3vw,40px);align-items:center;padding-block:clamp(36px,5vw,64px) 8px}
.h3-eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:.84rem;letter-spacing:.14em;font-weight:700;color:var(--forest)}
.h3-eyebrow::before{content:"";width:22px;height:5px;border-top:1.5px solid currentColor;border-bottom:1.5px solid currentColor}
.hero3d h1{font-size:clamp(2rem,1.2rem + 3.4vw,3.9rem);line-height:1.22;margin:.3em 0 .45em;color:var(--ink)}
.hero3d h1 .ln{display:block}
.hero3d h1 .em{color:var(--forest)}
.hero3d.live h1 .ln{animation:h3-rise .8s cubic-bezier(.2,.8,.2,1) both}
.hero3d.live h1 .ln+.ln{animation-delay:.12s}
@keyframes h3-rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.h3-sub{font-size:clamp(1rem,.95rem + .25vw,1.12rem);color:var(--muted);max-width:36rem;margin-bottom:1.5em}
.hero3d .trust-row{color:var(--muted)}
.hero3d .trust-row li::before{border-color:var(--brass)}
.h3-stage{position:relative;height:min(600px,72vh);min-height:420px;min-width:0}
.h3-stage canvas{display:block}
.h3-pile{position:absolute;transform:translate(-50%,-100%);font-size:.8rem;font-weight:700;color:var(--ink);background:var(--surface);border:1px solid var(--rule);padding:3px 10px;border-radius:999px;white-space:nowrap;opacity:0;transition:opacity .4s;pointer-events:none}
.h3-pile.show{opacity:1}
.h3-owl{position:absolute;right:2%;bottom:0;width:150px;transition:opacity .35s,transform .45s cubic-bezier(.3,1.5,.5,1)}
.h3-owl img{width:100%;height:auto;filter:drop-shadow(0 10px 14px rgba(0,0,0,.18))}
.h3-owl .seal{right:auto;left:-70px;bottom:46px;width:96px;height:96px;font-size:1rem}
.hero3d.live .h3-owl{opacity:0;transform:translateY(24px) scale(.8)}
.hero3d.live.reconciled .h3-owl{opacity:1;transform:none}
.hero3d.live.reconciled .h3-owl .seal{animation:bk-stamp .45s cubic-bezier(.3,1.6,.5,1) .25s both}
.h3-diff{position:relative;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;border-top:1.5px solid var(--ink);padding:14px 0 clamp(22px,3vw,34px);margin-top:8px}
.h3-diff-label{font-size:.95rem;color:var(--text)}
.h3-diff-label em{font-style:normal;color:var(--muted);font-size:.86rem;margin-left:6px}
.hero3d.reconciled .h3-diff-label em{visibility:hidden}
.h3-diff-num{font-family:var(--f-mono);font-variant-numeric:tabular-nums;font-weight:700;font-size:clamp(1.3rem,1rem + 1.2vw,1.9rem);color:var(--seal);padding-bottom:4px;border-bottom:4px double currentColor;white-space:nowrap;transition:color .3s}
.h3-diff.done .h3-diff-num{color:var(--forest)}
.h3-diff.done .h3-diff-num::after{content:" ✓"}

/* ================= reconciliation demo ================= */
.recon{background:var(--ink);color:var(--on-dark)}
:root[data-theme="dark"] .recon{background:#0F3D33}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .recon{background:#0F3D33}}
.recon h2{color:#fff}
.recon .kicker{color:#E9CF8A}
.recon-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 48px;align-items:end;margin-bottom:28px}
.recon-head p{color:var(--on-dark-muted);margin:0}
.recon-board{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,8vw,120px)}
.rc-links{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.rc-path{fill:none;stroke:#E9CF8A;stroke-width:1.6;transition:stroke-dashoffset .55s ease}
.rc-cap{display:flex;justify-content:space-between;font-size:.88rem;margin-bottom:10px;color:var(--on-dark-muted)}
.rc-cap b{color:#fff}
.rc-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.rc-list li{position:relative;display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:10px;align-items:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:11px 14px;font-size:.92rem;transition:background .3s,border-color .3s}
.rc-list .d{font-family:var(--f-mono);font-size:.8rem;color:var(--on-dark-muted)}
.rc-list .n{font-family:var(--f-mono);font-variant-numeric:tabular-nums;font-weight:700}
.rc-list .n.pos{color:#9AD4BA}
.rc-list li.match{border-color:rgba(233,207,138,.7);background:rgba(233,207,138,.1)}
.rc-list li[data-n]::before{content:attr(data-n);position:absolute;left:-11px;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:50%;background:#E9CF8A;color:#1B2B27;font-size:.75rem;font-weight:700;display:grid;place-items:center}
#rc-bank li[data-n]::before{left:auto;right:-11px}
.rc-list li.flag:not(.match){border-color:#E8735F;background:rgba(232,115,95,.15);animation:rc-shake .4s}
@keyframes rc-shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.rc-new{display:none!important}
.rc-new.in{display:grid!important;animation:rc-in .45s ease both}
@keyframes rc-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.rc-foot{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:26px;padding-top:18px;border-top:1px solid rgba(255,255,255,.15)}
.rc-diff{display:flex;align-items:baseline;gap:10px;position:relative}
.rc-diff span{color:var(--on-dark-muted);font-size:.9rem}
.rc-diff b{font-family:var(--f-mono);font-size:1.6rem;color:#F29A88;border-bottom:4px double currentColor;font-variant-numeric:tabular-nums}
.recon.done .rc-diff b{color:#9AD4BA}
.rc-owl{width:60px;height:auto;background:#F4EBD8;border-radius:50%;padding:4px;align-self:center;opacity:0;transform:scale(.6);transition:opacity .3s,transform .4s cubic-bezier(.3,1.5,.5,1)}
.recon.done .rc-owl{opacity:1;transform:none}
.rc-msg{flex:1 1 260px;margin:0;color:var(--on-dark-muted)}
#rc-run{margin-left:auto}
#rc-run:disabled{opacity:.6;cursor:progress}

/* ================= health check ================= */
.hc{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:24px;align-items:start}
.hc-q{display:grid;gap:12px}
.hc-q fieldset{border:1px solid var(--rule);border-radius:12px;background:var(--paper);padding:14px 16px;margin:0;display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}
.hc-q legend{float:left;width:100%;font-weight:600;color:var(--ink);margin-bottom:6px;padding:0}
.hc-q label{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border:1px solid var(--rule);border-radius:999px;cursor:pointer;background:var(--surface);font-size:.94rem}
.hc-q label:has(input:checked){border-color:var(--forest);background:var(--mint);color:var(--ink);font-weight:600}
.hc-q input{accent-color:var(--forest)}
.hc-out{position:sticky;top:96px;background:var(--surface);border:1px solid var(--rule);border-radius:16px;padding:22px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow)}
.hc-ring{position:relative;width:140px;height:140px;margin:0 auto}
.hc-ring svg{width:140px;height:140px;transform:rotate(-90deg)}
.hc-track{fill:none;stroke:var(--rule);stroke-width:10}
.hc-bar{fill:none;stroke:var(--forest);stroke-width:10;stroke-linecap:round;transition:stroke-dashoffset .6s cubic-bezier(.3,.9,.3,1)}
.hc-score{position:absolute;inset:0;display:grid;place-content:center;text-align:center;line-height:1}
.hc-score b{font-family:var(--f-latin);font-size:2.4rem;color:var(--ink)}
.hc-score small{color:var(--muted);font-size:.8rem;margin-top:4px}
.hc-level{text-align:center;font-weight:700;color:var(--ink);margin:0}
.hc-todo{margin:0;padding-left:1.1em;font-size:.9rem;color:var(--muted);display:grid;gap:6px}
.hc-owl{position:absolute;right:-14px;top:-30px;width:84px;height:auto}
.hc-out .btn{align-self:stretch}

@media (max-width:960px){
  .h3-grid{grid-template-columns:1fr}
  .h3-stage{height:400px;min-height:0}
  .recon-head,.hc{grid-template-columns:1fr}
  .hc-out{position:relative;top:auto}
}
@media (max-width:700px){
  .recon-board{grid-template-columns:1fr;gap:22px}
  .rc-links{display:none}
  #rc-bank li[data-n]::before{right:auto;left:-11px}
  .h3-stage{height:340px}
  .h3-owl{width:104px}
  .h3-owl .seal{left:-56px;width:76px;height:76px;font-size:.85rem;bottom:30px}
  .h3-diff{flex-direction:column;align-items:flex-start;gap:6px}
  .h3-pile{font-size:.72rem;padding:2px 8px}
}

/* ================= round-2 fixes ================= */
/* hero: fit the viewport so the pinned scene and the counter are always in view */
.hero3d .h3-grid{padding-block:clamp(20px,4vh,52px) clamp(24px,4vh,48px);align-items:center}
.hero3d h1{font-size:clamp(1.9rem,min(1.1rem + 3.2vw,6.4vh),3.7rem)}
.h3-visual{display:flex;flex-direction:column;gap:12px;min-width:0}
.h3-stage{height:clamp(320px,calc(100svh - 300px),560px);min-height:0}
.h3-diff{display:grid;gap:6px;border-top:0;margin:0;padding:14px 18px 12px;background:var(--surface);border:1px solid var(--rule);border-radius:14px;box-shadow:var(--shadow);position:relative;z-index:2}
.hero3d:not(.started):not(.reconciled) .h3-diff{animation:h3-glow 2.4s ease-in-out infinite}
@keyframes h3-glow{0%,100%{box-shadow:var(--shadow)}50%{box-shadow:0 0 0 4px rgba(194,64,47,.14),var(--shadow)}}
.h3-diff-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.h3-diff-label{font-weight:700;color:var(--ink);font-size:.95rem}
.h3-count{font-family:var(--f-mono);font-size:.78rem;color:var(--muted)}
.h3-count b{color:var(--ink)}
.h3-diff-num{font-size:clamp(2rem,1.4rem + 2vw,3rem);justify-self:start;line-height:1.15}
.h3-bar{display:block;height:6px;border-radius:999px;background:var(--rule-soft);overflow:hidden}
.h3-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--seal),var(--brass) 55%,var(--forest));transform-origin:left;transform:scaleX(1);transition:transform .15s linear}
.h3-hint{display:flex;align-items:center;gap:10px;font-size:.88rem;color:var(--seal);font-weight:600;transition:opacity .3s}
.h3-hint .arrow{width:22px;height:34px;border:2px solid currentColor;border-radius:12px;position:relative;flex-shrink:0}
.h3-hint .arrow::after{content:"";position:absolute;left:50%;top:6px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:currentColor;animation:h3-wheel 1.4s ease-in-out infinite}
@keyframes h3-wheel{0%{transform:translateY(0);opacity:1}70%{transform:translateY(12px);opacity:0}100%{opacity:0}}
.hero3d.started .h3-hint,.hero3d.reconciled .h3-hint,.hero3d:not(.live) .h3-hint{display:none}
.h3-say{position:absolute;right:88%;bottom:118%;background:var(--ink);color:#fff;font-size:.82rem;font-weight:600;line-height:1.45;padding:8px 12px;border-radius:12px;white-space:nowrap;opacity:0;transform:translateY(6px);transition:opacity .35s .5s,transform .35s .5s}
.h3-say::after{content:"";position:absolute;right:14px;bottom:-7px;border:7px solid transparent;border-top-color:var(--ink);border-bottom:0}
.hero3d.reconciled .h3-say{opacity:1;transform:none}
:root[data-theme="dark"] .h3-say{background:#0F3D33}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .h3-say{background:#0F3D33}}

/* full-width callouts instead of a narrow column with a gap on the right */
.answer,.cta-inline,.remind{max-width:none}
.answer p{max-width:62rem}
.remind{justify-content:flex-start}

/* FAQ centred */
#faq .sec-head{text-align:center;margin-left:auto;margin-right:auto}
.faq{margin-left:auto;margin-right:auto;max-width:52rem}

/* recon CTA */
.rc-actions{display:flex;flex-wrap:wrap;gap:10px;margin-left:auto}
.rc-run{background:#E9CF8A;color:#14302A;font-size:1.05rem;padding:15px 26px;border:0;cursor:pointer;position:relative}
.rc-run:hover{background:#F2DC9E;color:#14302A}
.rc-run .play{width:0;height:0;border-left:11px solid currentColor;border-top:7px solid transparent;border-bottom:7px solid transparent}
.rc-run.idle::after{content:"";position:absolute;inset:-6px;border-radius:999px;border:2px solid #E9CF8A;animation:rc-ring 1.8s ease-out infinite}
@keyframes rc-ring{0%{opacity:.9;transform:scale(.96)}100%{opacity:0;transform:scale(1.12)}}
.recon:not(.done) .rc-diff b{animation:rc-blink 1.6s ease-in-out infinite}
@keyframes rc-blink{50%{opacity:.55}}
#rc-run{margin-left:0}

/* menu button + accessible cursor */
.menu-btn,.dd>button,.lang .soon{cursor:pointer}
.lang .soon{cursor:not-allowed}
.menu-btn{align-items:center;gap:9px;background:var(--ink);color:#fff;border:0;border-radius:999px;padding:10px 16px;font-weight:700;font-size:.95rem}
.menu-btn:hover{background:var(--forest)}
.menu-btn .bars{display:grid;gap:4px;width:18px}
.menu-btn .bars i{display:block;height:2px;border-radius:2px;background:currentColor;transition:transform .25s,opacity .25s}
.menu-btn.open .bars i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-btn.open .bars i:nth-child(2){opacity:0}
.menu-btn.open .bars i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
:root[data-theme="dark"] .menu-btn{background:#1F6E5B}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .menu-btn{background:#1F6E5B}}
.nav-wa{display:none}
@media (min-width:961px){
  .dd:focus-within .dd-menu{display:grid}
}
@media (hover:none),(max-width:960px){
  .nav .dd:not(.open) .dd-menu{display:none}
}
@media (max-width:960px){
  .nav{display:none;grid-template-columns:1fr 1fr;gap:6px;padding-top:12px;padding-bottom:16px}
  .nav.open{display:grid}
  .nav>a{background:var(--paper);border:1px solid var(--rule);text-align:center;padding:11px 8px}
  .nav .dd{grid-column:1/-1;border:1px solid var(--rule);border-radius:10px;background:var(--paper)}
  .nav .dd>button{width:100%;text-align:left;display:flex;justify-content:space-between;align-items:center;font-weight:600;padding:12px 14px}
  .nav .dd>button::after{display:inline-block;transition:transform .2s}
  .nav .dd.open>button::after{transform:rotate(-135deg) translateY(-2px)}
  .nav .dd-menu{padding:0 8px 8px;grid-template-columns:1fr 1fr;gap:2px}
  .nav .dd-menu a small{display:none}
  .nav .lang{display:none}
  .nav-wa{display:inline-flex;grid-column:1/-1;margin-top:4px}
  .h3-say{right:60%}
}
@media (max-width:700px){
  .h3-stage{height:300px}
  .h3-diff{flex-direction:initial}
  .rc-actions{margin-left:0;width:100%}
  .rc-actions .btn{flex:1 1 auto}
}

/* ================= round-3 ================= */
/* compact counter card, more room for the receipts */
.h3-visual{gap:8px}
.h3-diff{grid-template-columns:auto 1fr;align-items:center;gap:2px 16px;padding:10px 14px 10px 16px;border-radius:12px}
.h3-diff-top{grid-column:1/-1}
.h3-diff-label{font-size:.85rem}
.h3-count{font-size:.72rem}
.h3-diff-num{font-size:clamp(1.35rem,1.1rem + .9vw,1.8rem);border-bottom-width:3px;padding-bottom:2px}
.h3-bar{align-self:center;height:5px}
.h3-hint{grid-column:1/-1;font-size:.8rem;gap:8px}
.h3-hint .arrow{width:16px;height:24px;border-radius:9px;border-width:1.6px}
.h3-hint .arrow::after{top:4px;height:6px;width:3px;margin-left:-1.5px}
.h3-stage{height:clamp(340px,calc(100svh - 230px),620px)}
@media (max-width:700px){.h3-stage{height:330px}}

/* full-width notice on the home page */
.wrap>.note{max-width:none}

/* calculator call-to-action */
.btn-calc{background:var(--brass);color:#1B1B14;font-size:1.02rem;padding:14px 24px;box-shadow:0 6px 18px rgba(184,145,47,.28)}
.btn-calc:hover{background:#C9A23E;color:#1B1B14}
.calc-ico{width:16px;height:18px;border:2px solid currentColor;border-radius:3px;position:relative;flex-shrink:0;
  background:linear-gradient(currentColor,currentColor) 2px 2px/8px 3px no-repeat,radial-gradient(circle,currentColor 1.2px,transparent 1.5px) 1px 8px/5px 4px}

/* menu: text only */
.menu-btn{padding:9px 18px;letter-spacing:.06em}
.menu-btn .bars{display:none}

/* testimonials */
.testi-wrap{display:grid;gap:12px}
.testi-flag{margin:0;font-size:.8rem;color:var(--muted);display:inline-flex;align-items:center;gap:8px}
.testi-flag::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--brass)}
.testi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.testi figure{margin:0;display:flex;flex-direction:column;justify-content:space-between;gap:16px;background:var(--paper);border:1px solid var(--rule);border-radius:14px;padding:22px 22px 18px;position:relative;min-width:0}
.testi figure::before{content:"“";position:absolute;top:-6px;right:18px;font-family:var(--f-display);font-size:4.2rem;line-height:1;color:var(--brass);opacity:.35}
.testi blockquote{margin:0;font-size:.98rem;line-height:1.8;color:var(--text)}
.testi figcaption{display:flex;flex-direction:column;border-top:1px dashed var(--rule);padding-top:10px}
.testi figcaption b{color:var(--ink)}
.testi figcaption span{font-size:.84rem;color:var(--muted)}
@media (max-width:960px){.testi{grid-template-columns:1fr}}

/* ================= round-4: AEO boxes, skip link, static hero ================= */
.kp{background:var(--surface);border:1px solid var(--rule);border-left:4px solid var(--brass);border-radius:12px;padding:16px 20px;margin-bottom:32px}
.sec.alt .kp{background:var(--paper)}
.kp-label{display:block;font-size:.78rem;font-weight:700;letter-spacing:.12em;color:var(--brass);margin-bottom:6px}
.keypoints{margin:0;padding-left:1.15em;display:grid;gap:4px}
.keypoints li{line-height:1.7}
.h3-skip{grid-column:1/-1;justify-self:end;font-size:.78rem;color:var(--muted);margin-top:-22px}
.hero3d.started .h3-skip,.hero3d.reconciled .h3-skip,.hero3d:not(.live) .h3-skip{display:none}
.hero3d.static .h3-stage{background:url(../img/hero-piles.png) center/contain no-repeat}
.hero3d.static .h3-pile{display:none}

/* ================= round-5: illustrated bookkeeper replaces the owl ================= */
.step-owl,.remind img,.calc-owl,.hc-owl,.rc-owl,.form-success img,.owl-row img{object-fit:cover;object-position:50% 0;border-radius:50%;background:var(--mint);aspect-ratio:1/1;height:auto}
.step-owl{width:64px;top:-26px;border:3px solid var(--surface);box-shadow:var(--shadow)}
.remind img{width:84px;border:3px solid var(--surface)}
.calc-owl{width:84px;top:-18px;right:16px;border:3px solid rgba(255,255,255,.85);background:#E7F0EA}
.hc-owl{width:76px;top:-26px;right:-8px;border:3px solid var(--surface)}
.rc-owl{width:56px;padding:0;background:#F4EBD8}
.form-success img{width:96px}
.owl-row img{width:100%;max-width:120px;border:3px solid var(--surface)}
.owl-row figure{background:transparent;border:0}
.meet>img{max-width:190px;justify-self:center;border-radius:0;background:none}
.h3-owl{width:140px;right:0;bottom:-6px}
.h3-owl img{filter:drop-shadow(0 12px 16px rgba(0,0,0,.18))}
.h3-owl .seal{left:-84px;bottom:120px}
.h3-say{right:70%;bottom:auto;top:-46px}
.cta-owl{width:150px;margin-bottom:calc(-1 * clamp(44px,6vw,72px));align-self:flex-end;filter:drop-shadow(0 10px 18px rgba(0,0,0,.3))}
@media (max-width:700px){
  .h3-owl{width:96px}
  .h3-owl .seal{left:-64px;bottom:80px}
  .h3-say{right:60%;top:-40px;font-size:.75rem}
  .cta-owl{width:110px}
}

/* steps: keep the rule clear of the avatar */
.steps li::after{right:92px}

/* round-6: less air above the counter card */
@media (min-width:961px){
  .hero3d .h3-grid{padding-top:14px;align-items:start}
  .hero3d .h3-copy{align-self:center}
}
@media (max-width:960px){.hero3d .h3-grid{padding-top:24px}}
.hero3d .h3-grid>*+*{margin-top:0}

/* round-7: image logo */
.brand-logo img{width:auto;height:52px}
.site-header .wrap{min-height:72px}
.f-brand .brand img{width:44px;height:44px;border-radius:10px}
.author-box img{border-radius:10px}
@media (max-width:620px){.brand-logo img{height:44px}}

/* ---- Location hero photo + back to top ---- */
.hero-has-photo{background-position:center 40%}
.hero-has-photo .wrap{position:relative}
.hero-photo{display:none;margin:0}
@media (min-width:1080px){
  .hero-has-photo .wrap{padding-right:340px;min-height:440px}
  .hero-photo{display:block;position:absolute;right:24px;top:50%;transform:translateY(-50%) rotate(1.5deg);width:272px;aspect-ratio:2/3;border-radius:18px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.45),0 0 0 6px rgba(255,255,255,.08)}
  .hero-photo img{width:100%;height:100%;object-fit:cover;display:block}
}
.loc{aspect-ratio:2/3;background-position:center top}
@media (max-width:760px){.loc{aspect-ratio:3/4}}
.to-top{position:fixed;right:calc(27px + env(safe-area-inset-right,0px));bottom:calc(90px + env(safe-area-inset-bottom,0px));z-index:40;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--surface,#fff);color:var(--forest);border:1px solid var(--rule,#D3DAD6);box-shadow:0 6px 20px rgba(0,0,0,.18);text-decoration:none;cursor:pointer;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .25s,transform .25s,background .2s}
.to-top.show{opacity:1;transform:none;pointer-events:auto}
.to-top:hover,.to-top:focus-visible{background:var(--forest);color:#fff}
.to-top[hidden]{display:none}
@media (max-width:760px){.to-top{right:calc(14px + env(safe-area-inset-right,0px));bottom:calc(82px + env(safe-area-inset-bottom,0px))}}
@media (prefers-reduced-motion:reduce){.to-top{transition:none}}
@media (max-width:760px){.loc-grid .loc:last-child:nth-child(odd){grid-column:1/-1;aspect-ratio:16/9;background-position:center 35%}}
.standards + .testi-wrap{margin-top:clamp(44px,5vw,72px)}
/* ---- hero with brand character (账务指南) ---- */
.hero.h1-oneline h1{max-width:none}
@media (min-width:900px){.hero.h1-oneline h1{white-space:nowrap}}
.hero-has-person .wrap{position:relative}
.hero-person{display:none;margin:0}
@media (min-width:1000px){
  .hero-has-person .wrap{padding-right:300px}
  .hero-person{display:block;position:absolute;right:24px;bottom:0;width:250px;pointer-events:none}
  .hero-person::before{content:"";position:absolute;left:50%;bottom:20%;width:340px;height:340px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,rgba(246,241,230,.28) 0%,rgba(246,241,230,.08) 45%,transparent 70%);z-index:-1}
  .hero-person img{display:block;width:100%;height:auto;filter:drop-shadow(0 18px 30px rgba(0,0,0,.35))}
}
@media (max-width:999px) and (min-width:600px){
  .hero-has-person .wrap{padding-right:170px}
  .hero-person{display:block;position:absolute;right:12px;bottom:0;width:150px;pointer-events:none}
  .hero-person img{display:block;width:100%;height:auto}
}
@media (max-width:899px){.hero.h1-oneline h1{font-size:min(2.6rem,6.4vw);white-space:nowrap}}
/* ---- two-column split with side card (关于页) ---- */
.aside-split{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(32px,4vw,64px);align-items:start}
.aside-split>.prose,.aside-split>.main-col{min-width:0}
.aside-split .prose{max-width:none}
.side-card{position:sticky;top:100px;background:var(--surface);border:1px solid var(--rule);border-radius:16px;padding:24px 24px 22px;box-shadow:0 10px 30px rgba(14,59,50,.06);margin-top:1.4em}
.sec.alt .side-card{background:var(--surface)}
.side-card h3{margin:.3em 0 .8em;font-size:1.15rem;color:var(--ink)}
.side-card .kicker{font-size:.78rem}
.tl{list-style:none;margin:0;padding:0 0 0 18px;border-left:2px solid var(--rule)}
.tl li{position:relative;padding:0 0 14px}
.tl li::before{content:"";position:absolute;left:-25px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--surface);border:3px solid var(--brass)}
.tl b{display:block;color:var(--ink);font-size:.95rem}
.tl span{font-size:.9rem;color:var(--muted);line-height:1.6}
.side-note{font-size:.8rem;color:var(--muted);margin:.4em 0 0}
.facts{display:grid;grid-template-columns:auto 1fr;gap:10px 14px;margin:0 0 18px;font-size:.92rem}
.facts dt{color:var(--muted);white-space:nowrap}
.facts dd{margin:0;color:var(--text);font-weight:600;min-width:0;overflow-wrap:anywhere}
.side-card .btn{width:100%;justify-content:center}
.src-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.src-list li{display:flex;flex-direction:column;padding-bottom:12px;border-bottom:1px dashed var(--rule)}
.src-list li:last-child{border-bottom:0;padding-bottom:0}
.src-list span{font-size:.85rem;color:var(--muted)}
@media (max-width:960px){.aside-split{grid-template-columns:1fr}.side-card{position:static;margin-top:8px}}
@media (max-width:760px){.hero-has-person{background-position:72% center}}
/* ---- FAQ page: categories + sticky side ---- */
.side-stack{position:sticky;top:96px;display:grid;gap:16px}
.side-stack .side-card{position:static;margin-top:0}
.faq-page .wrap.aside-split{align-items:start}
.faq-cat{scroll-margin-top:96px}
.faq-cat+.faq-cat{margin-top:clamp(40px,5vw,64px)}
.faq-cat h2{display:flex;align-items:baseline;gap:12px;margin:0 0 18px;padding-bottom:12px;border-bottom:2px solid var(--rule)}
.faq-cat h2 .cnt{font-family:var(--f-body,inherit);font-size:.8rem;font-weight:600;color:var(--brass);letter-spacing:.04em}
.qa-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.qa{background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:18px 20px;min-width:0;transition:border-color .2s,box-shadow .2s}
.qa:hover{border-color:color-mix(in srgb,var(--forest) 40%,var(--rule));box-shadow:0 8px 24px rgba(14,59,50,.06)}
.qa h3{margin:0 0 .5em;font-size:1.02rem;line-height:1.5;color:var(--ink);padding-left:30px;position:relative}
.qa h3::before{content:"Q";position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:6px;background:var(--mint);color:var(--forest);font-size:.78rem;font-weight:700;display:grid;place-items:center}
.qa p{margin:0;font-size:.94rem;line-height:1.75;color:var(--text)}
.faq-cat>.sources,.faq-cat>.note,.faq-cat>.cta-inline{margin-top:18px}
.faq-nav ol{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:4px}
.faq-nav a{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;border-radius:10px;text-decoration:none;color:var(--text);font-weight:600}
.faq-nav a span{font-size:.78rem;color:var(--muted);background:var(--paper);border-radius:99px;padding:2px 9px}
.faq-nav a:hover,.faq-nav a.on{background:var(--mint);color:var(--forest)}
.ask-card{text-align:center;padding-top:0;overflow:hidden}
.ask-card img{width:120px;height:auto;margin:14px auto 4px;display:block}
.ask-card h3{margin:.2em 0 .4em}
.ask-card p{font-size:.9rem;color:var(--muted);margin:0 0 14px}
@media (max-width:1100px){.qa-list{grid-template-columns:1fr}}
@media (max-width:960px){.side-stack{position:static;grid-template-columns:1fr 1fr;order:-1}.ask-card{display:none}.side-stack{grid-template-columns:1fr}}
@media (max-width:960px){.faq-nav{padding:16px}.faq-nav ol{grid-template-columns:1fr 1fr;gap:8px}.faq-nav a{background:var(--paper);padding:10px 12px;font-size:.92rem}}
/* ---- pricing page layout ---- */
.wrap>.aside-split+*{margin-top:28px}
.aside-split .table-wrap{margin-top:18px}
.cards.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.cards.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1000px){.cards.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}.cards.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.cards.cols-4,.cards.cols-3{grid-template-columns:1fr}}
.pick-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.pick-list li{display:flex;flex-direction:column;padding:10px 12px;border-radius:10px;background:var(--paper);border-left:3px solid var(--brass)}
.pick-list b{color:var(--ink);font-size:.95rem}
.pick-list span{font-size:.86rem;color:var(--muted)}
.side-card .note{margin-top:16px;padding:14px 16px;font-size:.9rem}
.side-card .note p{margin:.3em 0 0}
.count-card .sum{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:6px 0 14px}
.count-card .sum div{display:flex;flex-direction:column;align-items:center;text-align:center;flex:1;background:var(--paper);border-radius:10px;padding:10px 4px}
.count-card .sum b{font-size:1.5rem;color:var(--ink);font-family:var(--f-display);line-height:1.1}
.count-card .sum span{font-size:.74rem;color:var(--muted);margin-top:4px}
.count-card .sum i{font-style:normal;color:var(--brass);font-weight:700}
.count-card .sum .tot{background:var(--mint)}
.count-card .sum .tot b{color:var(--forest)}
.count-card .verdict{margin:0;font-size:.92rem}
.incl-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:24px}
.incl{background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:20px 22px;border-top:4px solid var(--forest);min-width:0}
.incl.plus{border-top-color:var(--brass)}
.incl.no{border-top-color:var(--seal)}
.incl h3{margin:0 0 12px;font-size:1.05rem}
.incl .checklist{margin:0}
.incl.no .checklist li::before{content:"–";background:var(--seal-soft);color:var(--seal)}
@media (max-width:900px){.incl-grid{grid-template-columns:1fr}}
.incl.no .checklist li::before{content:"×";border:0;transform:none;width:auto;height:auto;left:3px;top:-.05em;background:none;color:var(--seal);font-weight:700;font-size:1.1rem;line-height:1.5}
.aside-split .scenario,.aside-split .note{max-width:none}
/* ---- section head split: h2 left, intro right (fills wide screens) ---- */
.head-split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);align-items:start;margin-bottom:28px}
.head-split h2{margin:0}
.head-split .hs-body>p:first-child{margin-top:.2em}
.head-split .hs-body p{max-width:none}
@media (max-width:860px){.head-split{grid-template-columns:1fr;gap:12px}}
.compare-2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:6px}
.compare-2>div{background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:18px 22px}
.compare-2>div.hl{background:var(--mint);border-color:color-mix(in srgb,var(--forest) 25%,var(--rule))}
.compare-2 h3{margin:.2em 0 .3em;font-size:1.1rem}
.compare-2 p{margin:0;font-size:.95rem}
@media (max-width:640px){.compare-2{grid-template-columns:1fr}}
.checklist.cols-2{grid-template-columns:1fr 1fr;max-width:none;gap:10px 28px}
@media (max-width:640px){.checklist.cols-2{grid-template-columns:1fr}}
.quote-msg{background:var(--paper);border-radius:12px 12px 12px 4px;padding:14px 16px;font-size:.93rem;line-height:1.75;margin:0 0 16px;position:relative}
.aside-split .lead-form{max-width:none;grid-template-columns:1fr 1fr}
.lead-form .ff{display:flex;flex-direction:column;gap:6px;min-width:0}.lead-form .ff-wide,.aside-split .lead-form button{grid-column:1/-1}
@media (max-width:640px){.aside-split .lead-form{grid-template-columns:1fr}}
.mini-steps{list-style:none;counter-reset:ms;margin:6px 0 14px;padding:0;text-align:left;display:grid;gap:12px}
.mini-steps li{counter-increment:ms;position:relative;padding-left:38px;display:flex;flex-direction:column}
.mini-steps li::before{content:counter(ms);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;background:var(--forest);color:#fff;font-size:.82rem;font-weight:700;display:grid;place-items:center}
.mini-steps b{color:var(--ink);font-size:.95rem}
.mini-steps span{font-size:.86rem;color:var(--muted)}
.chips{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.chips li{background:var(--surface);border:1px solid var(--rule);border-radius:99px;padding:6px 14px;font-size:.88rem;color:var(--ink)}
.loc-grid-mini .loc{aspect-ratio:4/5}
@media (max-width:760px){.loc-grid-mini .loc{aspect-ratio:3/4}}
.form-success[hidden]{display:none}.aside-split .form-success{max-width:none}
/* ---- doc layout: content left + sticky side (services / locations / articles / legal) ---- */
.doc-layout{max-width:var(--wrap);margin:0 auto;padding-inline:max(20px,env(safe-area-inset-left,0px));display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(32px,4vw,56px);align-items:start}
.doc-main{min-width:0}
.doc-main>.sec{padding-block:clamp(36px,4.5vw,56px);background:none;border:0}
.doc-main>.sec+.sec{border-top:1px solid var(--rule)}
.doc-main>.sec>.wrap{max-width:none;padding-inline:0}
.doc-main .prose,.doc-main .answer,.doc-main .note,.doc-main .scenario,.doc-main .checklist,.doc-main .lead-form,.doc-main .form-success{max-width:none}
.doc-main .sec.alt .card,.doc-main .sec.alt .steps li,.doc-main .sec.alt .scenario,.doc-main .sec.alt .kp{background:var(--surface)}
.doc-side{padding-block:clamp(36px,4.5vw,56px);height:100%}
.doc-side-in{position:sticky;top:96px;display:grid;gap:16px}
.doc-side .side-card{position:static;margin-top:0}
.toc ol{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:2px;counter-reset:t}
.toc li{counter-increment:t}
.toc a{display:grid;grid-template-columns:22px 1fr;gap:6px;padding:7px 8px;border-radius:8px;text-decoration:none;color:var(--text);font-size:.9rem;line-height:1.45}
.toc a::before{content:counter(t,decimal-leading-zero);font-size:.72rem;color:var(--brass);font-weight:700;padding-top:2px}
.toc a:hover,.toc a.on{background:var(--mint);color:var(--forest)}
.side-link{display:block;margin-top:10px;font-size:.9rem;font-weight:600}
.doc-side .ask-card img{width:110px}
@media (max-width:1000px){.doc-layout{grid-template-columns:1fr}.doc-side{display:none}}
.doc-main h2[id]{scroll-margin-top:96px}
.faq-split{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,5vw,72px);align-items:start}
.faq-split .faq{max-width:none;margin:0}
.faq-head{position:sticky;top:100px}
.faq-head h2{margin:.3em 0 .4em}
.faq-head p{color:var(--muted);margin:0 0 18px}
@media (max-width:860px){.faq-split{grid-template-columns:1fr}.faq-head{position:static}}
.author-box{max-width:none}
.doc-main .cards:has(>:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
.doc-main .cards:has(>:nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:640px){.doc-main .cards:has(>:nth-child(3):last-child),.doc-main .cards:has(>:nth-child(4):last-child){grid-template-columns:1fr}}
.doc-main .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
.doc-main .steps li:last-child:nth-child(odd){grid-column:1/-1}
.doc-main .cards:not(:has(>:nth-child(3):last-child)):not(:has(>:nth-child(4):last-child))>:last-child:nth-child(odd){grid-column:1/-1}
@media (max-width:640px){.doc-main .steps{grid-template-columns:1fr}}
@media (min-width:900px){.hc-out{position:sticky;top:100px;align-self:start}}
@media (min-width:900px){
  .posts-feat{grid-template-columns:repeat(3,minmax(0,1fr))}
  .posts-feat>.post:first-child{grid-column:1/-1;flex-direction:row}
  .posts-feat>.post:first-child img{width:58%;aspect-ratio:auto;min-height:320px;height:100%}
  .posts-feat>.post:first-child div{padding:32px 36px;justify-content:center}
  .posts-feat>.post:first-child h3{font-size:1.5rem}
  .posts-feat>.post:first-child p{font-size:1rem}
  .posts-feat>.post:first-child .meta{margin-top:12px}
}
/* full-width section heads & source lines (no premature wrapping) */
.sec-head{max-width:none}
.sec-head p,.sources,.wrap>p{max-width:none}
/* dropdown: hover bridge + delayed close so the pointer can reach links */
@media (min-width:961px) and (hover:hover){
  .dd-menu{display:grid;visibility:hidden;opacity:0;transform:translateY(4px);transition:opacity .15s ease,transform .15s ease,visibility 0s linear .25s;z-index:60}
  .dd-menu::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
  .dd:hover .dd-menu,.dd:focus-within .dd-menu,.dd.open .dd-menu{visibility:visible;opacity:1;transform:none;transition-delay:0s}
}
/* ---- health check: question left, segmented answer right ---- */
.hc-q{gap:0;border-top:2px solid var(--ink)}
.hc-q fieldset{flex-wrap:nowrap;gap:16px;background:none;border:0;border-bottom:1px solid var(--rule);border-radius:0;padding:14px 2px}
.hc-q legend{float:left;width:auto;flex:1;min-width:0;margin:0;font-weight:500;line-height:1.55}
.hc-q label{position:relative;flex:0 0 auto;min-width:64px;justify-content:center;padding:8px 16px;border:1.5px solid var(--ink);border-radius:0;background:var(--surface);font-size:.9rem;font-weight:600;color:var(--ink);transition:background .15s,color .15s}
.hc-q legend+label{border-radius:999px 0 0 999px;border-right-width:.75px}
.hc-q label:last-child{border-radius:0 999px 999px 0;border-left-width:.75px;margin-left:-16px}
.hc-q input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.hc-q label:has(input:focus-visible){outline:2px solid var(--brass);outline-offset:2px}
.hc-q label:hover{background:var(--mint)}
.hc-q label:has(input[value="1"]:checked){background:var(--forest);border-color:var(--forest);color:#fff}
.hc-q label:has(input[value="0"]:checked){background:var(--seal);border-color:var(--seal);color:#fff}
@media (max-width:520px){.hc-q fieldset{gap:10px}.hc-q label{min-width:54px;padding:7px 10px;font-size:.86rem}.hc-q label:last-child{margin-left:-10px}}
.hc-q label{width:84px;min-width:0;padding-inline:6px}
@media (max-width:520px){.hc-q label{width:66px}}
/* ---- flow diagram (服务总览) ---- */
.flow{margin:8px 0 0;background:var(--surface);border:1px solid var(--rule);border-radius:18px;padding:clamp(16px,3vw,32px)}
.flow svg{display:block;width:100%;height:auto;font-family:var(--f-body)}
.flow-v{display:none!important;max-width:380px;margin:0 auto}
@media (max-width:640px){.flow-h{display:none!important}.flow-v{display:block!important}}
.flow-lines path{fill:none;stroke:#C9D6D0;stroke-width:2.5;stroke-dasharray:7 7;animation:flowdash 1.2s linear infinite}
@keyframes flowdash{to{stroke-dashoffset:-14}}
.flow .d-in{fill:var(--brass)}
.flow .d-out{fill:var(--forest)}
.flow .n-boss circle{fill:var(--paper);stroke:var(--ink);stroke-width:2.5}
.flow .n-hub .top{fill:var(--forest)}
.flow .n-hub .bot{fill:var(--ink)}
.flow .n-hub .ring{fill:none;stroke:#fff;stroke-width:3}
.flow .n-out rect{fill:var(--surface);stroke:var(--ink);stroke-width:2.2}
.flow text{text-anchor:middle}
.flow .t1{font-size:19px;font-weight:700;fill:var(--ink)}
.flow .t2{font-size:12.5px;fill:var(--muted)}
.flow .n-hub .t1{fill:#fff;font-size:21px;font-family:var(--f-latin,inherit)}
.flow .n-hub .t2{fill:#E7F0EA}
.flow-v .t1{font-size:16px}.flow-v .n-hub .t1{font-size:19px}.flow-v .t2{font-size:12px}
.flow-notes{list-style:none;padding:0;margin:18px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.flow-notes li{font-size:.92rem;color:var(--text);background:var(--paper);border-radius:12px;padding:14px 16px;line-height:1.7}
.flow-notes b{display:block;color:var(--ink);margin-bottom:4px}
@media (max-width:760px){.flow-notes{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.flow-lines path{animation:none}.flow-dots{display:none}}
.flow-sec .sec-head{margin-bottom:22px}
.flow .n-hub .top{fill:#2E8B62}
@media (min-width:900px){
  .posts-feat2{grid-template-columns:repeat(6,minmax(0,1fr))}
  .posts-feat2>.post{grid-column:span 2}
  .posts-feat2>.post:nth-child(-n+2){grid-column:span 3}
  .posts-feat2>.post:nth-child(-n+2) h3{font-size:1.25rem}
}
/* ---- English pages ---- */
html[lang^="en"]{--f-body:"Source Sans 3","Segoe UI",system-ui,-apple-system,sans-serif;--f-display:"Fraunces",Georgia,"Times New Roman",serif}
html[lang^="en"] body{line-height:1.7;letter-spacing:0;font-size:17.5px}
html[lang^="en"] h1,html[lang^="en"] h2,html[lang^="en"] h3{letter-spacing:-.005em;line-height:1.25}
html[lang^="en"] .kicker,html[lang^="en"] .eyebrow{letter-spacing:.08em}
@media (max-width:960px){.nav .lang{display:flex;grid-column:1/-1;justify-self:start;margin-top:6px;font-size:.9rem}}
html[lang^="en"] .hero3d h1{font-size:clamp(1.9rem,min(1rem + 2.5vw,5.2vh),3rem);line-height:1.15}
html[lang^="en"] .hero h1{font-size:clamp(1.8rem,1.2rem + 2.2vw,2.9rem);max-width:26ch}
html[lang^="en"] .hero.h1-oneline h1{max-width:none}
html[lang^="en"] .hero3d.static .h3-stage{background-image:url(../img/hero-piles-en.png)}
.flow-h .t1{font-size:18px}html[lang^="en"] .flow-h .n-boss .t1{font-size:16.5px}html[lang^="en"] .flow-h .n-out .t1{font-size:17px}

/* ---- Bahasa Melayu pages (same typography as English) ---- */
html[lang^="ms"]{--f-body:"Source Sans 3","Segoe UI",system-ui,-apple-system,sans-serif;--f-display:"Fraunces",Georgia,"Times New Roman",serif}
html[lang^="ms"] body{line-height:1.7;letter-spacing:0;font-size:17.5px}
html[lang^="ms"] h1,html[lang^="ms"] h2,html[lang^="ms"] h3{letter-spacing:-.005em;line-height:1.25}
html[lang^="ms"] .kicker,html[lang^="ms"] .eyebrow{letter-spacing:.08em}
html[lang^="ms"] .hero3d h1{font-size:clamp(1.9rem,min(1rem + 2.5vw,5.2vh),3rem);line-height:1.15}
html[lang^="ms"] .hero h1{font-size:clamp(1.8rem,1.2rem + 2.2vw,2.9rem);max-width:26ch}
html[lang^="ms"] .hero.h1-oneline h1{max-width:none}
html[lang^="ms"] .hero3d.static .h3-stage{background-image:url(../img/hero-piles-ms.png)}
.flow-h .t1{font-size:18px}html[lang^="ms"] .flow-h .n-boss .t1{font-size:16.5px}html[lang^="ms"] .flow-h .n-out .t1{font-size:17px}
@media (max-width:560px){.hero-actions{flex-wrap:wrap}.hero-actions .btn{white-space:normal;max-width:100%;text-align:center}}
.nav>a,.nav .dd>button,.lang a,.lang span{white-space:nowrap}
@media (min-width:961px){html[lang^="ms"] .nav>a,html[lang^="ms"] .nav .dd>button{padding-inline:9px;font-size:.92rem}}
.hero3d .h3-copy{min-width:0}@media (max-width:560px){.hero3d .hero-actions .btn{white-space:normal;max-width:100%;flex:1 1 100%;justify-content:center}}
@media (max-width:760px){.final-cta .hero-actions{flex-shrink:1;max-width:100%;min-width:0}.final-cta .wrap>*{min-width:0}}
html,body{overflow-x:clip}
/* ---- mobile language switcher next to the Menu button ---- */
.lang-m{display:none}
@media (max-width:960px){
  .site-header .lang-m{display:flex;margin-left:auto;margin-right:8px;font-size:.82rem;font-weight:600;padding:3px;flex-shrink:0}
  .site-header .lang-m a,.site-header .lang-m span{padding:6px 9px;line-height:1}
  .nav .lang{display:none!important}
}
@media (max-width:380px){.site-header .lang-m a,.site-header .lang-m span{padding:6px 7px}.site-header .lang-m{margin-right:6px}}
@media (max-width:960px){.site-header .lang-m+.menu-btn{margin-left:0}.site-header .wrap{gap:10px}}
@media (max-width:440px){
  .site-header .brand-logo img{height:38px;width:auto}
  .site-header .lang-m{margin-right:4px;font-size:.78rem}
  .site-header .lang-m a,.site-header .lang-m span{padding:6px 7px}
  .menu-btn{padding:9px 13px;font-size:.9rem}
  .site-header .wrap{gap:6px}
  .site-header .brand-logo{flex-shrink:1;min-width:0}
}
@media (max-width:350px){.site-header .brand-logo img{height:32px}.site-header .lang-m a,.site-header .lang-m span{padding:5px 5px}}
/* language switcher: desktop shows the one inside .nav, mobile shows .lang-m next to Menu */
.site-header .lang-m{display:none!important}
@media (max-width:960px){.site-header .lang-m{display:flex!important}}
/* ---- Bento menu icon (mobile) ---- */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.menu-btn{width:46px;height:46px;padding:0!important;border-radius:14px!important;justify-content:center}
.menu-btn svg{display:block}
.menu-btn .ic-close{display:none}
.menu-btn.open .ic-bento{display:none}
.menu-btn.open .ic-close{display:block}
.menu-btn .ic-bento rect{transition:transform .2s;transform-origin:12px 12px}
.menu-btn:hover .ic-bento,.menu-btn:focus-visible .ic-bento{transform:rotate(45deg);transition:transform .25s}
@media (max-width:440px){.menu-btn{width:42px;height:42px}}
/* ---- back to top with scroll progress ring ---- */
.to-top{width:50px;height:50px;position:fixed;overflow:visible}
.to-top .tt-ring{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px);transform:rotate(-90deg)}
.to-top .tt-track{fill:none;stroke:var(--rule);stroke-width:3}
.to-top .tt-bar{fill:none;stroke:var(--brass);stroke-width:3.2;stroke-linecap:round;transition:stroke-dashoffset .1s linear}
.to-top .tt-arrow{position:relative}
.to-top:hover .tt-track,.to-top:focus-visible .tt-track{stroke:rgba(255,255,255,.35)}
@media (max-width:760px){.to-top{width:46px;height:46px}}