:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#171917;background:#fff;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #488468;outline-offset:3px}[hidden]{display:none!important}.calculator{max-width:1120px;margin:0 auto;padding:34px 26px}header{max-width:790px;padding:16px 0 26px}.eyebrow{font-size:11px;letter-spacing:.15em;font-weight:750;color:#676b64;margin:0 0 14px}h1{font-size:clamp(29px,4vw,44px);letter-spacing:-.04em;line-height:1.15;font-weight:650;margin:0 0 16px}h2{font-size:25px;letter-spacing:-.025em;margin:0 0 24px;font-weight:650}h3{font-size:18px;margin:20px 0 16px}.intro{font-size:17px;line-height:1.5;color:#50564f;margin:0 0 12px}.small{font-size:12px;line-height:1.65;color:#636962}.steps{display:flex;gap:10px;flex-wrap:wrap;list-style:none;padding:0;margin:0 0 36px;border-top:1px solid #ddd;border-bottom:1px solid #ddd;padding-block:17px}.steps li{padding:9px 15px;border-radius:30px;border:1px solid #e0e2df;color:#6a6c68;font-size:13px}.steps [aria-current]{background:#171917;color:white;border-color:#171917}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.choice{border:1px solid #d5d8d2;background:#fff;border-radius:14px;padding:26px;text-align:left;min-height:220px;display:flex;flex-direction:column;gap:16px;transition:background .15s,border-color .15s}.choice:hover{background:#f5f6f3;border-color:#1c241e}.choice .number{font-size:12px;color:#697066;margin-bottom:16px}.choice strong{font-size:21px;font-weight:600}.choice span:last-child{font-size:14px;line-height:1.6;color:#5e655b}.button{padding:14px 20px;border:1px solid #202620;border-radius:10px;background:#fff;font-size:14px;font-weight:650;min-height:48px}.primary{background:#171917;color:#fff}.primary:hover{background:#354037}.text-button{background:none;border:0;padding:15px 0;color:#282f29;font-size:13px;text-align:left;text-decoration:underline;text-underline-offset:4px}.section-heading{display:flex;justify-content:space-between;gap:24px;align-items:flex-start}.layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px}.fields{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr))}label{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:600}input,select,textarea{border:1px solid #cbd0c7;border-radius:9px;background:#fff;color:#151815;padding:13px;width:100%;font-size:14px;min-width:0}textarea{resize:vertical}select{padding-right:22px}input[type=checkbox]{width:18px;height:18px;margin:2px 0;flex:0 0 auto;accent-color:#1c2920}.check{display:flex;flex-direction:row;align-items:flex-start;gap:12px;line-height:1.55;font-weight:400}.illustration{margin-top:26px;border-radius:14px;background:#ece9e3;min-height:230px;display:flex;justify-content:center;align-items:center;overflow:hidden}.illustration img{width:100%;height:280px;object-fit:contain}.accessory-icon{font-size:64px;font-weight:300;color:#676b64}.price-card{background:#f5f6f3;border-radius:14px;padding:25px;align-self:start;position:sticky;top:20px}.price-card h3{margin-top:0;font-weight:600}.price-row{display:flex;justify-content:space-between;gap:16px;padding:12px 0;font-size:13px;line-height:1.5}.price-row strong{white-space:nowrap}.component{border-bottom:1px solid #dfe2db}.component small{display:block;color:#687062}.price-card .check{margin-top:20px}.quantity{flex-direction:row;align-items:center;justify-content:space-between;margin:14px 0}.quantity input{width:80px}.total{border-top:1px solid #bbc1b7;margin-top:20px;padding-top:20px;display:flex;flex-direction:column;gap:7px;font-size:13px}.total strong{font-size:32px;letter-spacing:-.04em;font-weight:600}.price-card .button{width:100%;margin-top:12px}.error{font-size:13px;color:#a22216;line-height:1.5}.basket-row{border:1px solid #d8ddd3;border-radius:12px;padding:22px;margin-bottom:14px;display:flex;justify-content:space-between;gap:20px}.basket-row h3{margin:0 0 8px}.basket-row p{margin:5px 0}.basket-row .actions{display:flex;gap:15px;align-items:center;flex-wrap:wrap}.basket-row .actions strong{font-size:20px}#totals{max-width:420px;margin:20px 0 35px auto}#totals .grand{border-top:1px solid #aaa;font-size:20px;padding-top:18px}#contactForm{border-top:1px solid #dce0d7;padding-top:28px}#contactForm>label{margin-bottom:23px}#contactForm .fields{margin-bottom:20px}.booking{border:1px solid #d8ddd3;border-radius:12px;margin:25px 0;padding:24px}.booking h3{margin-top:0}.booking p{font-size:14px;color:#626a5e;line-height:1.5}#bookingPicker{margin-top:20px}a{color:inherit}footer{margin-top:50px;padding:23px 0 0;border-top:1px solid #e4e7df;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:11px;line-height:1.6;color:#71786d}@media(max-width:760px){.calculator{padding:20px 16px}.cards{grid-template-columns:1fr}.choice{min-height:155px;padding:22px}.choice .number{margin-bottom:0}.layout{grid-template-columns:1fr;gap:24px}.price-card{position:static}.fields{grid-template-columns:1fr 1fr}.section-heading{flex-direction:column;gap:0}.steps{gap:5px}.steps li{font-size:11px;padding:8px 10px}h2{font-size:23px}.basket-row{flex-direction:column}#totals{max-width:none}.illustration img{height:230px}}@media(max-width:390px){.fields{grid-template-columns:1fr}.steps li{font-size:10px}}
.illustration{flex-direction:column}.illustration>p{padding:0 16px;text-align:center}.price-row small{display:block;margin-top:5px;font-size:12px;font-weight:400;color:#687068}

.roof-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:22px 0}.roof-choice{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:10px;border:1px solid #d8ddd3;border-radius:16px;background:#fff;color:#181c17;padding:28px;cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s;font:inherit}.roof-choice:hover{border-color:#788373;background:#fafbf8}.roof-choice[aria-pressed="true"]{border:2px solid #1a241b;padding:27px;background:#f2f5ee;box-shadow:0 2px 12px #1724160b}.roof-choice:focus-visible,.pitch-options button:focus-visible{outline:3px solid #617951;outline-offset:4px}.roof-choice-top{display:flex;align-items:flex-start;justify-content:space-between;width:100%;margin-bottom:14px}.roof-choice svg{width:64px;height:64px}.roof-check{display:flex;align-items:center;justify-content:center;width:25px;height:25px;border:1px solid #b9c2b3;border-radius:50%;font-size:15px}.roof-choice[aria-pressed="true"] .roof-check{background:#1a241b;color:#fff;border-color:#1a241b}.roof-choice strong{font-size:26px;letter-spacing:-.5px}.roof-range{font-size:15px;color:#53604d}.roof-description{font-size:14px;line-height:1.5;color:#667060}.roof-help{margin-bottom:38px}.roof-label{font-size:14px;font-weight:600;margin:0}.roof-cards.compact{gap:12px;margin:10px 0 22px}.compact .roof-choice{padding:16px;gap:5px}.compact .roof-choice[aria-pressed="true"]{padding:15px}.compact .roof-choice-top{margin-bottom:4px}.compact .roof-choice svg{width:42px;height:42px}.compact .roof-choice strong{font-size:19px}.compact .roof-range{font-size:13px}.pitch-options{display:flex;gap:10px;margin:-8px 0 24px;flex-wrap:wrap}.pitch-options button{font:inherit;font-size:13px;border:1px solid #d8ddd3;border-radius:9px;background:#fff;padding:12px 16px;cursor:pointer}.pitch-options button[aria-pressed="true"]{background:#1a241b;color:white;border-color:#1a241b}@media(max-width:520px){.roof-cards{gap:12px}.roof-choice{padding:20px 16px}.roof-choice[aria-pressed="true"]{padding:19px 15px}.roof-choice strong{font-size:22px}.roof-choice svg{width:48px;height:48px}.roof-description{font-size:13px}.roof-choice-top{margin-bottom:8px}}@media(prefers-reduced-motion:reduce){.roof-choice{transition:none}}

.roof-choice-top{justify-content:flex-end;margin-bottom:12px}.roof-choice{gap:12px}.roof-choice strong{font-size:30px}.roof-cards.compact .roof-choice strong{font-size:20px}.roof-cards.compact .roof-choice-top{margin-bottom:2px}@media(max-width:520px){.roof-choice strong{font-size:23px}}