@font-face { font-family:"Montserrat"; font-style:normal; font-display:swap; font-weight:400; src:url("assets/fonts/montserrat-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family:"Montserrat"; font-style:normal; font-display:swap; font-weight:700; src:url("assets/fonts/montserrat-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family:"Montserrat"; font-style:normal; font-display:swap; font-weight:800; src:url("assets/fonts/montserrat-latin-800-normal.woff2") format("woff2"); }
@font-face { font-family:"Noto Sans TC"; font-style:normal; font-display:swap; font-weight:400; src:url("assets/fonts/noto-sans-tc-chinese-traditional-400-normal.woff2") format("woff2"); }
@font-face { font-family:"Noto Sans TC"; font-style:normal; font-display:swap; font-weight:700; src:url("assets/fonts/noto-sans-tc-chinese-traditional-700-normal.woff2") format("woff2"); }
@font-face { font-family:"Noto Sans TC"; font-style:normal; font-display:swap; font-weight:800; src:url("assets/fonts/noto-sans-tc-chinese-traditional-800-normal.woff2") format("woff2"); }

:root {
  --green:#009d87;
  --green-dark:#007967;
  --mint:#56cbb9;
  --ink:#211917;
  --gray:#6e6e6e;
  --bg:#efefef;
  --paper:#f3e8e2;
  --white:#fff;
  --line:#d5d2cf;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:92px; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:"Montserrat","Noto Sans TC",Helvetica,Arial,sans-serif; line-height:1.75; }
a { color:inherit; }
.proposal-nav { position:sticky; z-index:50; top:0; height:82px; display:flex; align-items:center; gap:32px; padding:0 4vw; border-bottom:1px solid #cfcfcd; background:rgba(239,239,239,.94); backdrop-filter:blur(16px); }
.proposal-brand { display:flex; align-items:center; gap:18px; margin-right:auto; text-decoration:none; }
.proposal-brand img { width:116px; height:auto; }
.proposal-brand > span { padding-left:18px; border-left:1px solid #aaa5a2; font-size:10px; font-weight:800; letter-spacing:.16em; }
.proposal-brand small { display:block; color:var(--green-dark); font-family:"Noto Sans TC"; font-size:10px; letter-spacing:.08em; }
.proposal-nav nav { display:flex; gap:28px; }
.proposal-nav nav a { color:#655d59; font-size:10px; font-weight:700; letter-spacing:.08em; text-decoration:none; }
.proposal-nav nav a:hover { color:var(--green); }
button,.hero-actions a { min-height:40px; display:inline-flex; align-items:center; justify-content:center; padding:9px 16px; border:1px solid var(--green); border-radius:0; background:transparent; color:var(--green-dark); font:700 10px "Montserrat","Noto Sans TC"; letter-spacing:.08em; text-decoration:none; cursor:pointer; }
button:hover,.hero-actions a:hover,.hero-actions .primary { background:var(--green); color:#fff; }

main { overflow:hidden; }
.proposal-hero { min-height:calc(100vh - 82px); display:grid; grid-template-columns:minmax(0,1.1fr) minmax(440px,.9fr); background:var(--paper); }
.hero-copy { display:flex; flex-direction:column; justify-content:center; padding:7vw 6vw; }
.kicker,.chapter-no { margin:0 0 20px; color:var(--green); font-size:10px; font-weight:800; letter-spacing:.2em; }
.hero-copy h1 { max-width:850px; margin:0; font-size:clamp(48px,6.6vw,104px); font-weight:700; letter-spacing:-.055em; line-height:1.04; }
.lead { max-width:760px; margin:32px 0 0; color:#5f5652; font-family:"Noto Sans TC"; font-size:16px; line-height:2; }
.hero-actions { display:flex; gap:10px; margin-top:32px; }
.hero-meta { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; margin-top:54px; border:1px solid rgba(33,25,23,.16); background:rgba(33,25,23,.14); }
.hero-meta span { padding:16px; background:var(--paper); color:#766b66; font-size:9px; }
.hero-meta b { display:block; color:var(--green-dark); font-size:25px; line-height:1.2; }
.hero-graphic { position:relative; isolation:isolate; overflow:hidden; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr 1.2fr; background:var(--green); }
.hero-graphic::before,.hero-graphic::after { position:absolute; z-index:-1; content:""; }
.hero-graphic::before { inset:-20% 15%; border:110px solid var(--paper); transform:rotate(30deg); }
.hero-graphic::after { right:-150px; bottom:-100px; width:460px; height:460px; border:90px solid var(--ink); border-radius:50%; }
.hero-graphic span { display:flex; align-items:center; justify-content:center; padding:24px; background:var(--paper); font-size:clamp(15px,1.7vw,25px); font-weight:700; line-height:1.3; text-align:center; }
.hero-graphic span:nth-child(2) { background:transparent; color:#fff; }
.hero-graphic span:nth-child(3) { grid-column:2; }
.hero-graphic strong { grid-column:1/-1; align-self:end; margin:0 0 -5vw -1vw; color:var(--ink); font-size:clamp(120px,19vw,320px); font-weight:400; letter-spacing:-.12em; line-height:.7; }
.hero-graphic small { position:absolute; right:26px; bottom:26px; color:#fff; font-family:"Noto Sans TC"; font-size:12px; font-weight:700; letter-spacing:.12em; writing-mode:vertical-rl; }

.proposal-notice { display:grid; grid-template-columns:180px 1fr; gap:32px; max-width:1440px; margin:0 auto; padding:24px 5vw; border-right:1px solid var(--line); border-bottom:1px solid var(--line); border-left:1px solid var(--line); background:#fff; }
.proposal-notice strong { color:var(--green-dark); font-size:11px; letter-spacing:.1em; }
.proposal-notice p { margin:0; color:#6d625e; font-family:"Noto Sans TC"; font-size:12px; }

.chapter { max-width:1440px; margin:0 auto; padding:110px 5vw; }
.chapter-heading { max-width:960px; margin-bottom:52px; }
.chapter-heading h2 { margin:0; font-size:clamp(36px,5vw,70px); font-weight:700; letter-spacing:-.045em; line-height:1.18; }
.chapter-heading > p:last-child,.split-heading > p { margin:24px 0 0; color:#6b615d; font-family:"Noto Sans TC"; font-size:14px; line-height:2; }
.split-heading { max-width:none; display:grid; grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr); gap:80px; align-items:end; }
.split-heading > p { margin:0; padding-bottom:10px; }
.value-flow { display:grid; grid-template-columns:repeat(9,auto); align-items:center; gap:10px; }
.value-flow article { min-height:160px; padding:22px; border-top:4px solid var(--green); background:#fff; }
.value-flow article span { color:var(--green); font-size:10px; font-weight:800; }
.value-flow strong,.value-flow small { display:block; }
.value-flow strong { margin-top:24px; font-family:"Noto Sans TC"; font-size:16px; }
.value-flow small { margin-top:4px; color:var(--gray); font-family:"Noto Sans TC"; font-size:10px; }
.value-flow i { color:var(--green); font-style:normal; }
.value-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:40px; background:var(--line); }
.value-cards article { padding:34px; background:var(--paper); }
.value-cards b { color:var(--green); font-size:9px; letter-spacing:.18em; }
.value-cards h3 { margin:14px 0 8px; font-family:"Noto Sans TC"; font-size:19px; }
.value-cards p { margin:0; color:#706560; font-family:"Noto Sans TC"; font-size:12px; }

.problem-chapter { max-width:none; padding-right:max(5vw,calc((100vw - 1440px)/2 + 5vw)); padding-left:max(5vw,calc((100vw - 1440px)/2 + 5vw)); background:#e5f2ef; }
.problem-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(0,121,103,.2); }
.problem-grid article { min-height:390px; display:flex; flex-direction:column; padding:30px; background:#fff; }
.problem-grid article > span { color:var(--green); font-size:9px; font-weight:800; letter-spacing:.14em; }
.problem-grid h3 { min-height:60px; margin:26px 0 10px; font-family:"Noto Sans TC"; font-size:21px; line-height:1.45; }
.problem-grid p { margin:0; color:var(--gray); font-family:"Noto Sans TC"; font-size:11px; }
.problem-grid .problem-now { min-height:76px; padding-bottom:20px; border-bottom:1px solid var(--line); }
.problem-grid article > div { margin-top:20px; }
.problem-grid article > div b { display:block; margin-bottom:5px; color:var(--green-dark); font-family:"Noto Sans TC"; font-size:11px; }
.problem-grid article > strong { display:block; margin-top:auto; padding-top:22px; color:var(--ink); font-family:"Noto Sans TC"; font-size:12px; line-height:1.8; }
.outcome-strip { display:grid; grid-template-columns:1.4fr repeat(5,1fr); margin-top:24px; border:1px solid rgba(0,121,103,.22); background:#fff; }
.outcome-strip span,.outcome-strip strong { display:flex; min-height:76px; align-items:center; padding:16px 20px; font-family:"Noto Sans TC"; font-size:11px; }
.outcome-strip span { background:var(--green); color:#fff; font-weight:700; }
.outcome-strip strong { justify-content:center; border-left:1px solid var(--line); color:var(--green-dark); text-align:center; }

.dark-chapter { max-width:none; padding-right:max(5vw,calc((100vw - 1440px)/2 + 5vw)); padding-left:max(5vw,calc((100vw - 1440px)/2 + 5vw)); background:var(--ink); color:#fff; }
.dark-chapter .chapter-heading p:last-child { color:#bdb5b1; }
.scope-grid { display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid rgba(255,255,255,.18); }
.scope-grid article { display:grid; grid-template-columns:64px 1fr; gap:20px; padding:28px 0; border-bottom:1px solid rgba(255,255,255,.16); }
.scope-grid article:nth-child(odd) { padding-right:40px; border-right:1px solid rgba(255,255,255,.16); }
.scope-grid article:nth-child(even) { padding-left:40px; }
.scope-grid span { color:var(--mint); font-size:11px; font-weight:800; }
.scope-grid h3 { margin:0; font-family:"Noto Sans TC"; font-size:20px; }
.scope-grid p { margin:6px 0 0; color:#bdb5b1; font-family:"Noto Sans TC"; font-size:12px; }

.accounting-story { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.scenario-card { padding:34px; border-top:6px solid var(--green); background:#fff; }
.scenario-card > span { color:var(--green); font-size:10px; font-weight:800; letter-spacing:.12em; }
.scenario-card h3 { margin:8px 0 28px; font-family:"Noto Sans TC"; font-size:24px; }
.scenario-card ol { list-style:none; margin:0; padding:0; counter-reset:step; }
.scenario-card li { position:relative; min-height:62px; padding:0 0 20px 54px; border-left:1px solid #c7dcd7; counter-increment:step; }
.scenario-card li:last-child { border-left-color:transparent; }
.scenario-card li::before { position:absolute; top:0; left:-17px; width:32px; height:32px; display:grid; place-items:center; border-radius:50%; background:var(--green); color:#fff; content:counter(step); font-size:10px; font-weight:800; }
.scenario-card b,.scenario-card small { display:block; font-family:"Noto Sans TC"; }
.scenario-card b { font-size:14px; }
.scenario-card small { margin-top:3px; color:var(--gray); font-size:10px; }
.input-matrix { margin-top:24px; padding:34px; background:var(--paper); }
.matrix-title { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:26px; }
.matrix-title span { color:var(--green); font-size:10px; font-weight:800; letter-spacing:.12em; }
.matrix-title h3 { margin:0; font-family:"Noto Sans TC"; font-size:22px; }
.matrix-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:#cfc7c2; }
.matrix-grid span { padding:18px; background:#fff; font-family:"Noto Sans TC"; font-size:12px; }

.service-mix { max-width:none; padding-right:max(5vw,calc((100vw - 1440px)/2 + 5vw)); padding-left:max(5vw,calc((100vw - 1440px)/2 + 5vw)); background:#e7f4f0; }
.mix-example { display:grid; grid-template-columns:300px 1fr; gap:30px; align-items:stretch; }
.mix-total { display:flex; flex-direction:column; justify-content:center; padding:34px; background:var(--green); color:#fff; }
.mix-total small,.mix-total strong,.mix-total span { display:block; }
.mix-total small { font-family:"Noto Sans TC"; }
.mix-total strong { margin:12px 0; font-size:28px; }
.mix-total span { font-family:"Noto Sans TC"; font-size:11px; }
.mix-bars { display:flex; min-height:220px; }
.mix-bars div { width:var(--size); display:flex; flex-direction:column; justify-content:flex-end; padding:24px; background:var(--color); color:#fff; }
.mix-bars span,.mix-bars b,.mix-bars small { display:block; }
.mix-bars span { font-family:"Noto Sans TC"; font-size:12px; }
.mix-bars b { margin-top:auto; font-size:42px; }
.mix-bars small { font-size:10px; }
.mix-benefits { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin-top:24px; background:rgba(0,121,103,.2); }
.mix-benefits article { padding:26px; background:#fff; }
.mix-benefits b { font-family:"Noto Sans TC"; font-size:15px; }
.mix-benefits p { margin:8px 0 0; color:var(--gray); font-family:"Noto Sans TC"; font-size:11px; }

.role-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); }
.role-grid article { min-height:225px; padding:28px; background:#fff; }
.role-grid span { color:var(--green); font-family:"Noto Sans TC"; font-size:11px; font-weight:700; }
.role-grid h3 { margin:34px 0 8px; font-family:"Noto Sans TC"; font-size:18px; }
.role-grid p { margin:0; color:var(--gray); font-family:"Noto Sans TC"; font-size:11px; }

.safeguards { max-width:none; padding-right:max(5vw,calc((100vw - 1440px)/2 + 5vw)); padding-left:max(5vw,calc((100vw - 1440px)/2 + 5vw)); background:var(--paper); }
.guard-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.guard-grid article { padding:28px; border-top:4px solid var(--green); background:#fff; }
.guard-grid span { color:var(--green-dark); font-family:"Noto Sans TC"; font-weight:700; }
.guard-grid p { margin:12px 0 0; color:var(--gray); font-family:"Noto Sans TC"; font-size:11px; }

.comparison-chapter { max-width:none; padding-right:max(5vw,calc((100vw - 1440px)/2 + 5vw)); padding-left:max(5vw,calc((100vw - 1440px)/2 + 5vw)); background:#fff; }
.comparison-wrap { overflow-x:auto; border:1px solid var(--line); background:#fff; }
.solution-comparison { width:100%; min-width:980px; border-collapse:collapse; font-family:"Noto Sans TC"; }
.solution-comparison th,.solution-comparison td { padding:18px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); font-size:11px; line-height:1.7; text-align:left; vertical-align:top; }
.solution-comparison thead th { background:var(--ink); color:#fff; font-size:10px; }
.solution-comparison thead th:last-child { background:var(--green); }
.solution-comparison tbody th { width:20%; background:var(--paper); font-weight:700; }
.solution-comparison tbody td { color:#766b66; }
.solution-comparison tbody td:last-child { background:#eef8f5; color:var(--green-dark); }
.solution-comparison b { font-weight:700; }
.investment-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:24px; background:var(--line); }
.investment-grid article { min-height:230px; padding:30px; background:var(--paper); }
.investment-grid span { color:var(--green); font-size:9px; font-weight:800; letter-spacing:.12em; }
.investment-grid h3 { margin:28px 0 10px; font-family:"Noto Sans TC"; font-size:19px; }
.investment-grid p { margin:0; color:var(--gray); font-family:"Noto Sans TC"; font-size:11px; }
.paid-validation { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:50px; margin-top:24px; padding:42px; background:var(--ink); color:#fff; }
.paid-validation > div > span { color:var(--mint); font-size:9px; font-weight:800; letter-spacing:.14em; }
.paid-validation h3 { margin:14px 0 12px; font-family:"Noto Sans TC"; font-size:26px; line-height:1.4; }
.paid-validation p { margin:0; color:#bdb5b1; font-family:"Noto Sans TC"; font-size:12px; }
.paid-validation ol { list-style:none; margin:0; padding:0; }
.paid-validation li { display:grid; grid-template-columns:38px 1fr; gap:12px; padding:12px 0; border-bottom:1px solid rgba(255,255,255,.16); }
.paid-validation li b { color:var(--mint); font-size:10px; }
.paid-validation li span { font-family:"Noto Sans TC"; font-size:11px; }
.paid-validation > strong { grid-column:1/-1; padding:18px 20px; border-left:4px solid var(--mint); background:rgba(255,255,255,.08); font-family:"Noto Sans TC"; font-size:12px; }

.delivery-timeline { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); }
.delivery-timeline article { min-height:250px; padding:28px; background:#fff; }
.delivery-timeline article.available { background:#eef8f5; }
.delivery-timeline span { color:var(--green); font-size:9px; font-weight:800; letter-spacing:.14em; }
.delivery-timeline h3 { margin:30px 0 8px; font-family:"Noto Sans TC"; font-size:18px; }
.delivery-timeline p { margin:0; color:var(--gray); font-family:"Noto Sans TC"; font-size:11px; }
.delivery-timeline b { display:inline-block; margin-top:24px; padding:5px 8px; background:var(--paper); color:#746761; font-family:"Noto Sans TC"; font-size:9px; }
.available b { background:var(--green); color:#fff; }
.document-boundary { display:grid; grid-template-columns:1fr 1fr; margin-top:24px; border:1px solid var(--line); }
.document-boundary div { padding:28px; background:#fff; }
.document-boundary div + div { border-left:1px solid var(--line); background:var(--paper); }
.document-boundary span { color:var(--green-dark); font-family:"Noto Sans TC"; font-weight:700; }
.document-boundary p { margin:8px 0 0; color:var(--gray); font-family:"Noto Sans TC"; font-size:11px; }

.readiness { border-top:1px solid var(--line); }
.readiness-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); }
.readiness-grid article { padding:30px; background:#fff; }
.readiness-grid b { color:var(--green-dark); font-family:"Noto Sans TC"; }
.readiness-grid p { margin:10px 0 0; color:var(--gray); font-family:"Noto Sans TC"; font-size:11px; }

.proposal-cta { max-width:none; display:grid; grid-template-columns:1fr 1fr; padding:70px max(5vw,calc((100vw - 1440px)/2 + 5vw)); background:var(--green); color:#fff; }
.proposal-cta img { width:185px; }
.proposal-cta p { margin:22px 0 0; font-family:"Noto Sans TC"; font-size:18px; font-weight:700; }
.cta-contact { display:flex; flex-direction:column; align-items:flex-end; text-align:right; }
.cta-contact span { font-size:9px; font-weight:800; letter-spacing:.2em; }
.cta-contact strong { margin-top:14px; font-size:36px; }
.cta-contact a { font-size:16px; text-decoration:none; }
.cta-contact small { margin-top:18px; font-family:"Noto Sans TC"; font-size:11px; }
footer { display:flex; justify-content:space-between; gap:30px; padding:24px 4vw; background:var(--ink); color:#bbb1ad; font-size:9px; letter-spacing:.05em; }

@media (max-width:1100px) {
  .proposal-nav nav { display:none; }
  .proposal-hero { grid-template-columns:1fr; }
  .hero-graphic { min-height:650px; }
  .value-flow { grid-template-columns:1fr; }
  .value-flow i { display:none; }
  .value-flow article { min-height:120px; }
  .role-grid,.mix-benefits,.guard-grid { grid-template-columns:repeat(2,1fr); }
  .problem-grid { grid-template-columns:repeat(2,1fr); }
  .outcome-strip { grid-template-columns:repeat(3,1fr); }
  .outcome-strip span { grid-column:1/-1; }
  .matrix-grid { grid-template-columns:repeat(3,1fr); }
}

@media (max-width:760px) {
  .proposal-nav { height:70px; padding:0 20px; }
  .proposal-brand img { width:92px; }
  .proposal-brand > span,.proposal-nav button { display:none; }
  .proposal-hero { min-height:auto; }
  .hero-copy { padding:70px 24px; }
  .hero-copy h1 { font-size:48px; }
  .lead { font-size:14px; }
  .hero-meta { grid-template-columns:1fr 1fr; }
  .hero-graphic { min-height:520px; }
  .proposal-notice { grid-template-columns:1fr; gap:8px; margin:0; }
  .chapter { padding:74px 24px; }
  .chapter-heading h2 { font-size:40px; }
  .split-heading,.accounting-story,.mix-example,.proposal-cta,.paid-validation { grid-template-columns:1fr; }
  .split-heading { gap:16px; }
  .value-cards,.scope-grid,.delivery-timeline,.readiness-grid,.problem-grid,.investment-grid { grid-template-columns:1fr; }
  .scope-grid article:nth-child(odd),.scope-grid article:nth-child(even) { padding:24px 0; border-right:0; }
  .matrix-title { align-items:flex-start; flex-direction:column; gap:8px; }
  .matrix-grid { grid-template-columns:1fr 1fr; }
  .mix-example { gap:10px; }
  .mix-bars { min-height:300px; flex-direction:column; }
  .mix-bars div { width:100%; min-height:100px; flex-direction:row; align-items:end; gap:14px; }
  .mix-bars b { margin:0 0 0 auto; font-size:30px; }
  .role-grid,.mix-benefits,.guard-grid { grid-template-columns:1fr; }
  .outcome-strip { grid-template-columns:1fr; }
  .outcome-strip span { grid-column:auto; }
  .outcome-strip strong { justify-content:flex-start; border-top:1px solid var(--line); border-left:0; }
  .paid-validation { gap:28px; padding:28px; }
  .paid-validation > strong { grid-column:auto; }
  .document-boundary { grid-template-columns:1fr; }
  .document-boundary div + div { border-top:1px solid var(--line); border-left:0; }
  .cta-contact { align-items:flex-start; margin-top:48px; text-align:left; }
  .cta-contact strong { font-size:30px; }
  footer { flex-direction:column; }
}

@media print {
  @page { margin:12mm; size:A4; }
  .proposal-nav { position:static; }
  .proposal-nav nav,.proposal-nav button,.hero-actions { display:none; }
  .proposal-hero { min-height:auto; grid-template-columns:1fr; }
  .hero-copy { padding:40px; }
  .hero-copy h1 { font-size:54px; }
  .hero-graphic { display:none; }
  .chapter { break-before:page; padding:35px 0; }
  .dark-chapter,.service-mix,.safeguards,.proposal-cta { max-width:none; margin-right:-12mm; margin-left:-12mm; padding-right:12mm; padding-left:12mm; }
  .delivery-timeline article,.scenario-card,.role-grid article { break-inside:avoid; }
  .proposal-cta { break-before:page; }
}
