:root{--ink:#122a25;--muted:#5f716d;--paper:#f4f7f5;--white:#fff;--line:#d9e2de;--lime:#d6f35a;--lime-dark:#a5c618;--teal:#1d6f61;--soft:#e8f1ed;--sand:#f2ede3}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.55 'DM Sans',sans-serif}
button,input,select{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a{color:inherit}
.tool-header{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,5vw,76px);border-bottom:1px solid var(--line);background:#f8faf9}
.tool-name{display:flex;align-items:center;gap:12px;text-decoration:none;font:700 .92rem/1 Manrope,sans-serif;letter-spacing:-.01em}
.sun-mark{width:22px;height:22px;border-radius:50%;background:var(--lime);box-shadow:inset 0 0 0 6px var(--ink)}
.header-right{display:flex;align-items:center;gap:20px}
.trust-note{display:flex;align-items:center;gap:11px;color:var(--muted);font-size:.78rem}
.trust-note i{width:3px;height:3px;border-radius:50%;background:#90a09c}
.language-switcher{display:flex;border:1px solid var(--line)}
.language-switcher button{border:0;border-right:1px solid var(--line);background:#f8faf9;color:#6b7c77;min-width:38px;padding:8px 7px;font-size:.68rem;font-weight:700;cursor:pointer}
.language-switcher button:last-child{border-right:0}.language-switcher button.active{background:var(--ink);color:#fff}
.calculator-shell{min-height:calc(100vh - 72px);display:grid;grid-template-columns:minmax(0,1fr) minmax(430px,.78fr);gap:8vw;align-items:center;padding:70px clamp(20px,7vw,110px)}
.intro-copy{max-width:670px}
.kicker,.eyebrow{margin:0 0 18px;text-transform:uppercase;letter-spacing:.16em;font-weight:700;font-size:.72rem;color:var(--teal)}
h1,h2,h3{font-family:Manrope,sans-serif;line-height:1.04;margin:0;letter-spacing:-.045em}
h1{font-size:clamp(3.4rem,6.5vw,7.2rem)}
.intro-copy>p:not(.kicker){max-width:570px;color:var(--muted);font-size:clamp(1rem,1.4vw,1.2rem);margin:28px 0}
.promise-row{display:flex;flex-wrap:wrap;gap:10px}
.promise-row span{padding:9px 12px;border:1px solid #c9d7d1;border-radius:100px;color:#3e5650;font-size:.78rem;background:#f8faf9}
.calculator-card{background:var(--white);padding:clamp(24px,3.2vw,48px);border:1px solid #dce5e1;box-shadow:0 28px 80px rgba(26,55,49,.09)}
.step-head{display:flex;gap:13px;align-items:center;margin-bottom:28px}
.step-head span{display:grid;place-items:center;width:31px;height:31px;border-radius:50%;background:var(--ink);color:#fff;font-size:.72rem;font-weight:700}
.step-head p{margin:0;font-size:.72rem;letter-spacing:.16em;font-weight:700}
label,legend{font-weight:600;font-size:.87rem}
.money-input{display:flex;align-items:center;border-bottom:2px solid var(--ink);margin:10px 0 28px}
.money-input span{font:700 1.1rem Manrope;color:var(--muted)}
.money-input input{width:100%;border:0;outline:0;padding:5px 12px 8px;background:transparent;color:var(--ink);font:800 clamp(2.5rem,5vw,4.4rem)/1 Manrope,sans-serif}
fieldset{border:0;padding:0;margin:0 0 25px}
legend{margin-bottom:10px}
.choice-grid{display:grid;gap:8px}
.choice-grid.two{grid-template-columns:1fr 1fr}.choice-grid.three{grid-template-columns:repeat(3,1fr)}.choice-grid.four{grid-template-columns:repeat(4,1fr)}
.choice-grid label,.check-grid label{position:relative;cursor:pointer}
.choice-grid input,.check-grid input{position:absolute;opacity:0;pointer-events:none}
.choice-grid label span,.check-grid label span{display:flex;align-items:center;justify-content:center;min-height:48px;padding:10px;border:1px solid var(--line);background:#fafcfb;color:#566b65;text-align:center;transition:.18s}
.choice-grid input:checked+span,.check-grid input:checked+span{background:var(--soft);border-color:var(--teal);color:var(--ink);box-shadow:inset 0 0 0 1px var(--teal)}
.choice-grid input:focus-visible+span,.check-grid input:focus-visible+span{outline:3px solid #99bfff;outline-offset:2px}
select{width:100%;height:51px;padding:0 14px;margin:10px 0 25px;border:1px solid var(--line);border-radius:0;background:#fafcfb;color:var(--ink)}
.primary-action,.secondary-action{display:flex;width:100%;align-items:center;justify-content:space-between;border:0;padding:17px 19px;background:var(--lime);color:var(--ink);font-weight:700;cursor:pointer;text-decoration:none;transition:.2s}
.primary-action:hover,.secondary-action:hover{background:#c6e945;transform:translateY(-1px)}
.microcopy{margin:11px 0 0;text-align:center;color:#7a8985;font-size:.74rem}
.results,.roof-check,.recommendation{padding:100px clamp(20px,7vw,110px)}
.results{background:var(--ink);color:#fff}
.result-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:50px}
.result-heading>div{max-width:850px}.result-heading .kicker{color:var(--lime)}
.result-heading h2,.section-intro h2,.recommendation h2{font-size:clamp(2.6rem,5vw,5.6rem)}
.edit-button{background:transparent;color:#dfe9e5;border:1px solid #ffffff42;padding:11px 15px;cursor:pointer}
.result-grid{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid #ffffff30;border-left:1px solid #ffffff30}
.result-grid article{padding:27px 22px;border-right:1px solid #ffffff30;border-bottom:1px solid #ffffff30;min-height:190px;display:flex;flex-direction:column}
.result-grid span{font-size:.8rem;color:#aebfba}.result-grid strong{font:800 clamp(1.5rem,2.5vw,2.7rem)/1.1 Manrope;margin:auto 0 8px;letter-spacing:-.04em}.result-grid small{color:#7f9690}
.result-note{display:flex;gap:18px;color:#aebfba;margin:18px 0 58px;font-size:.78rem}.result-note strong{color:#fff}
.policy-strip{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:18px 20px;margin:-35px 0 48px;border:1px solid #ffffff30;color:#fff;text-decoration:none;transition:.2s}
.policy-strip:hover{background:#ffffff08}.policy-strip span{display:flex;flex-direction:column;gap:3px}.policy-strip b{font-size:.9rem}.policy-strip small{color:#9fb2ac}.policy-strip>strong{color:var(--lime);white-space:nowrap;font-size:.82rem}
.bridge-card{background:var(--lime);color:var(--ink);padding:clamp(26px,4vw,55px);display:grid;grid-template-columns:1fr 280px;gap:60px;align-items:end}
.bridge-card h3{font-size:clamp(2rem,3.4vw,4rem);max-width:700px}.bridge-card p:not(.kicker){max-width:700px;color:#40504c}
.bridge-card .kicker{color:#42520b}.secondary-action{background:var(--ink);color:#fff}.secondary-action:hover{background:#27463f}
.roof-check{background:#eef3f0;display:grid;grid-template-columns:.7fr 1.3fr;gap:8vw}
.section-intro{position:sticky;top:40px;align-self:start}.section-intro>p{color:var(--muted);font-size:1.05rem;max-width:440px}.section-intro .step-head{margin-bottom:50px}
.roof-form fieldset{margin-bottom:38px}.roof-form legend{font:700 1.1rem Manrope;margin-bottom:14px}
.roof-types{grid-template-columns:repeat(5,1fr)}
.check-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.primary-action.dark{background:var(--ink);color:#fff}.primary-action.dark:hover{background:#29483f}
.recommendation{background:var(--sand);display:grid;grid-template-columns:1.2fr .8fr;gap:8vw;align-items:start}
.recommendation-main>p:not(.kicker):not(.boundary){color:var(--muted);font-size:1.1rem;max-width:720px}
.recommendation-points{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#cfc9bd;margin:38px 0}.recommendation-points div{background:var(--sand);padding:22px}.recommendation-points strong{display:block;font:700 1rem Manrope;margin-bottom:6px}.recommendation-points span{color:#6f6b63;font-size:.84rem}
.learn-link{display:inline-block;color:var(--teal);font-weight:700;text-decoration:none;border-bottom:1px solid #9db7af;padding-bottom:3px;margin-bottom:28px}
.boundary{font-size:.76rem;color:#77736b;border-top:1px solid #d2ccc0;padding-top:15px}
.expert-bridge{background:var(--ink);color:#fff;padding:clamp(26px,4vw,50px);box-shadow:0 28px 70px rgba(26,42,37,.16)}
.expert-bridge .eyebrow{color:var(--lime)}.expert-bridge h3{font-size:clamp(2rem,3vw,3.4rem)}.expert-bridge p:not(.eyebrow){color:#afbfba}.brand-action{margin-top:30px}.plain-link{display:block;margin-top:20px;color:#dce9e5;text-decoration:none;font-weight:600}
footer{padding:30px clamp(20px,7vw,110px);display:flex;justify-content:space-between;gap:30px;color:#71817d;font-size:.75rem;background:#f8faf9;border-top:1px solid var(--line)}
footer p{margin:0}footer a{color:var(--ink)}
.footer-links{display:flex;flex-wrap:wrap;gap:18px}.footer-links a{text-decoration:none;border-bottom:1px solid #bec9c5}
[lang="zh-CN"] body{font-family:'DM Sans','PingFang SC','Microsoft YaHei',sans-serif}
[hidden]{display:none!important}
@media(max-width:1050px){.calculator-shell{grid-template-columns:1fr;gap:55px}.intro-copy{max-width:760px}.result-grid{grid-template-columns:repeat(2,1fr)}.result-grid article:last-child{grid-column:1/-1}.roof-check,.recommendation{grid-template-columns:1fr}.section-intro{position:static}.roof-types{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){.tool-header{height:auto;min-height:64px;padding-top:12px;padding-bottom:12px}.trust-note{display:none}.header-right{gap:8px}.tool-name span:last-child{font-size:.78rem}.language-switcher button{min-width:34px;padding:7px 5px}.calculator-shell{min-height:auto;padding-top:48px;padding-bottom:55px}.calculator-card{margin:0 -6px}.choice-grid.three,.choice-grid.four,.roof-types,.check-grid{grid-template-columns:1fr 1fr}.results,.roof-check,.recommendation{padding-top:70px;padding-bottom:70px}.result-heading{align-items:start;flex-direction:column}.result-grid{grid-template-columns:1fr}.result-grid article:last-child{grid-column:auto}.result-grid article{min-height:140px}.result-note{flex-direction:column}.policy-strip{align-items:flex-start;flex-direction:column;gap:10px}.bridge-card{grid-template-columns:1fr;gap:30px}.recommendation-points{grid-template-columns:1fr}footer{flex-direction:column}}
.pricing-controls{margin-bottom:24px;max-width:760px}.pricing-controls select{max-width:420px;display:block;margin:8px 0 12px}.pricing-controls p{font-size:14px;color:#bdd0c9}.pricing-controls summary{font-size:14px;cursor:pointer}.result-grid strong{overflow-wrap:anywhere}.result-grid article{min-width:0}
