:root { --ink:#17231f; --muted:#52625c; --paper:#fbfcf8; --surface:#fff; --green:#0b654d; --green-dark:#064b39; --mint:#dff3e9; --line:#cad6d0; --amber:#885b00; --red:#9a302e; --shadow:0 18px 50px rgba(23,35,31,.1); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:1rem; line-height:1.6; }
a { color:var(--green-dark); text-underline-offset:.18em; }
a:hover { text-decoration-thickness:2px; }
button,input { font:inherit; }
.skip-link { position:fixed; left:1rem; top:-5rem; z-index:20; padding:.7rem 1rem; color:#fff; background:var(--ink); }
.skip-link:focus { top:1rem; }
.site-header,footer { display:flex; align-items:center; justify-content:space-between; gap:1rem; max-width:1180px; margin:auto; padding:1.25rem 2rem; }
.site-header p,footer p { margin:0; color:var(--muted); font-size:.9rem; }
.brand { color:var(--ink); font-weight:800; font-size:1.2rem; text-decoration:none; letter-spacing:-.02em; }
.brand span,.eyebrow { color:var(--green); }
main { overflow:hidden; }
.hero,.calculator-section,.offer-section { max-width:1180px; margin:auto; padding:5.5rem 2rem; }
.hero { display:grid; grid-template-columns:1.5fr .75fr; align-items:center; gap:5rem; min-height:650px; }
.eyebrow { margin:0 0 .6rem; font-size:.78rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
h1,h2,h3,h4 { margin-top:0; line-height:1.12; letter-spacing:-.035em; }
h1 { max-width:760px; margin-bottom:1.3rem; font-size:clamp(2.8rem,7vw,5.6rem); }
h2 { margin-bottom:1rem; font-size:clamp(2rem,4vw,3.5rem); }
h3 { font-size:1.55rem; }
.lede { max-width:690px; margin-bottom:2rem; color:var(--muted); font-size:1.2rem; }
.principle { padding:2rem; background:var(--mint); border:1px solid #b9dfce; border-radius:1rem; transform:rotate(1deg); }
.principle p { margin:0; }
.principle p+p { margin-top:.8rem; }
.button { display:inline-block; min-height:46px; padding:.72rem 1.15rem; border:2px solid transparent; border-radius:.45rem; font-weight:750; text-align:center; text-decoration:none; cursor:pointer; }
.button-primary { color:#fff; background:var(--green); }
.button-primary:hover { background:var(--green-dark); }
.button-secondary { color:var(--green-dark); background:#fff; border-color:var(--green); }
.button:focus-visible,.text-button:focus-visible,input:focus-visible,a:focus-visible { outline:3px solid #e1a900; outline-offset:3px; }
.calculator-section { max-width:none; padding-inline:max(2rem,calc((100vw - 1116px)/2)); background:#eff5f0; }
.section-heading { max-width:700px; margin-bottom:2.5rem; }
.section-heading p:last-child { color:var(--muted); }
.score-layout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(300px,.75fr); align-items:start; gap:2rem; }
.factors { display:grid; grid-template-columns:1fr 1fr; gap:1rem; min-width:0; padding:0; border:0; }
.factor,.result-card,.interest-card { padding:1.5rem; background:var(--surface); border:1px solid var(--line); border-radius:.8rem; }
.factor-heading { display:flex; justify-content:space-between; gap:1rem; }
.factor label { font-weight:800; }
.factor p { min-height:3.2em; margin:.4rem 0 1rem; color:var(--muted); font-size:.92rem; }
.weight { padding:.1rem .5rem; color:var(--green-dark); background:var(--mint); border-radius:99px; font-size:.78rem; font-weight:800; }
.range-row { display:grid; grid-template-columns:auto 1fr auto 2.3rem; align-items:center; gap:.65rem; color:var(--muted); font-size:.8rem; }
input[type="range"] { width:100%; accent-color:var(--green); cursor:pointer; }
output { display:grid; width:2.3rem; height:2.3rem; place-items:center; color:#fff; background:var(--ink); border-radius:50%; font-size:1rem; font-weight:800; }
.result-card { position:sticky; top:1.5rem; box-shadow:var(--shadow); }
.result-card h3 { margin-bottom:.4rem; font-size:4.5rem; }
.score-total { color:var(--muted); font-size:1.25rem; }
.guidance { display:inline-block; margin:0 0 .8rem; padding:.25rem .7rem; border-radius:99px; font-weight:800; }
.guidance-bid { color:var(--green-dark); background:var(--mint); }
.guidance-investigate { color:var(--amber); background:#fff0c7; }
.guidance-no { color:var(--red); background:#fbe5e3; }
.formula { margin:1.3rem 0; padding:1rem; background:#f5f7f4; border-left:4px solid var(--green); }
.formula h4,.formula p { margin-bottom:.4rem; }
.formula p { margin-top:.3rem; font-size:.9rem; }
.caution,.disclaimer { color:var(--muted); font-size:.88rem; }
.result-actions { display:flex; align-items:center; gap:1rem; margin-top:1.3rem; }
.text-button { color:var(--green-dark); background:none; border:0; text-decoration:underline; cursor:pointer; }
.disclaimer { margin:1.5rem 0 0; }
.offer-section { display:grid; grid-template-columns:1fr 1fr; align-items:start; gap:5rem; }
.check-list { padding:0; list-style:none; }
.check-list li { margin:.6rem 0; }
.check-list li::before { content:"✓"; margin-right:.7rem; color:var(--green); font-weight:900; }
.interest-card { box-shadow:var(--shadow); }
.confirmation { display:grid; grid-template-columns:auto 1fr; align-items:start; gap:.7rem; margin:1.3rem 0 0; }
.confirmation input { width:1.25rem; height:1.25rem; margin-top:.18rem; accent-color:var(--green); }
.field-error { min-height:1.5em; margin:.25rem 0; color:var(--red); font-size:.9rem; font-weight:700; }
.form-status { min-height:1.6em; margin-bottom:0; font-weight:700; }
.form-status.error { color:var(--red); }
.form-status.success { color:var(--green-dark); }
.privacy-note { color:var(--muted); font-size:.85rem; }
.honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
footer { border-top:1px solid var(--line); }
.privacy-page { max-width:850px; min-height:75vh; margin:auto; padding:5rem 2rem; }
.privacy-page article { padding:clamp(1.5rem,5vw,4rem); background:#fff; border:1px solid var(--line); border-radius:1rem; }
.privacy-page h1 { font-size:clamp(2.8rem,7vw,5rem); }
.privacy-page h2 { margin-top:2.3rem; font-size:1.5rem; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:800px) { .hero,.score-layout,.offer-section { grid-template-columns:1fr; } .hero { gap:2.5rem; min-height:auto; } .offer-section { gap:2rem; } .result-card { position:static; } }
@media (max-width:560px) { .site-header,footer,.hero,.calculator-section,.offer-section,.privacy-page { padding-left:1.1rem; padding-right:1.1rem; } .site-header p { display:none; } .hero,.calculator-section,.offer-section { padding-top:3.5rem; padding-bottom:3.5rem; } .factors { grid-template-columns:1fr; } .factor { padding:1.2rem; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
@media print { .site-header,.hero,.section-heading,.factors,.offer-section,footer,.result-actions,.disclaimer { display:none!important; } body,.calculator-section { background:#fff; } .calculator-section { padding:0; } .score-layout { display:block; } .result-card { position:static; border:0; box-shadow:none; } .result-card::before { content:"TenderFit Lite — tender-fit result"; display:block; margin-bottom:2rem; font-size:1.2rem; font-weight:800; } }