/* Castle Bank Electrical: the Budget Calculator.
   Loaded after style.css on /budget-calculator/ only, and built from the same
   parts: a grey tile for the questions, a charcoal tile that keeps the
   project in view, white cards inside, orange for the answer and the current
   step. Sizes, colours, radii, easing and buttons all come from style.css, so
   nothing here restates the site; it only arranges the calculator. */

.calc{--calc-error:#B42318;--calc-error-soft:rgba(180,35,24,.28);--calc-hairline:inset 0 0 0 1px rgba(18,27,32,.06);margin-bottom:var(--frame);-webkit-user-select:text;user-select:text}
/* Until the script has drawn the first step there is nothing to use, so the
   no-script note stands in for the whole calculator. */
html:not(.js) .calc-app{display:none}
.calc-noscript{padding:30px var(--pad);border-radius:var(--r-tile);background:var(--tile) var(--tile-image)}
.calc [tabindex="-1"]:focus{outline:none}
:where(.calc) fieldset{min-width:0;margin:0;padding:0;border:0}
:where(.calc) legend{float:left;width:100%;padding:0}
:where(.calc) legend+*{clear:both}

/* ------------------------------------------------------------------ opening */
.calc-hero{padding-bottom:44px}
.calc-hero-points{display:flex;flex-wrap:wrap;gap:6px;margin-top:26px}
.calc-hero-points li{display:flex;align-items:center;gap:8px;padding:7px 14px 7px 12px;border-radius:999px;background:var(--tile);font-size:14px;line-height:1.35;color:var(--ink-2)}
.calc-hero-points li::before{content:'';flex:none;width:7px;height:7px;border-radius:50%;background:var(--orange)}

/* ------------------------------------------------------------------ steps
   Four numbered points on a dotted run, like the planning steps elsewhere. */
.calc-bar{display:flex;align-items:center;justify-content:space-between;gap:16px 30px;padding:0 var(--inset) 18px}
.calc-progress{flex:1;min-width:0}
.calc-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.calc-steps li{position:relative;min-width:0}
.calc-steps li:not(:last-child)::after{content:'';position:absolute;top:50%;left:42px;right:12px;height:1px;background:repeating-linear-gradient(90deg,rgba(18,27,32,.2) 0 3px,transparent 3px 7px);pointer-events:none}
.calc-steps li:has(.is-done):not(:last-child)::after{background:repeating-linear-gradient(90deg,var(--orange) 0 3px,transparent 3px 7px)}
.calc-step{position:relative;z-index:1;display:inline-flex;align-items:center;gap:12px;min-height:44px;padding-right:14px;background:#fff;font-size:14px;font-weight:400;line-height:1.3;color:var(--ink-3);white-space:nowrap}
.calc-step-number{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(18,27,32,.2);font-size:12.5px;font-weight:500;transition:background-color .35s var(--ease),color .35s var(--ease),box-shadow .35s var(--ease)}
.calc-step-number svg{width:15px;height:15px}
.calc-step.is-current{color:var(--ink)}
.calc-step.is-current .calc-step-number{background:var(--orange);color:var(--ink);box-shadow:none}
.calc-step.is-done{color:var(--ink);cursor:pointer}
.calc-step.is-done .calc-step-number{background:var(--ink);color:#fff;box-shadow:none}
.calc-step.is-done:is(:hover,:focus-visible) .calc-step-number{background:var(--orange);color:var(--ink)}
.calc-step-label{overflow:hidden;text-overflow:ellipsis}
.calc-bar .calc-save{flex:none}

/* ------------------------------------------------------------------ layout */
.calc-layout{display:grid;grid-template-columns:minmax(0,1fr) clamp(300px,25vw,380px);gap:var(--frame);align-items:start}
.calc-panel{margin:0;padding:clamp(26px,3vw,46px) var(--pad) clamp(24px,2.6vw,36px);background:var(--tile) var(--tile-image)}
.calc-panel-body>*:not(.calc-rooms){max-width:920px}
.calc-panel-body.is-entering{animation:rise .5s var(--ease) both}
.calc-summary{position:sticky;top:100px;margin:0;padding:24px clamp(22px,2vw,30px) 26px}

/* ------------------------------------------------------------------ the questions */
.calc-kicker{font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--orange-ink)}
.calc-head h2{margin-top:10px;font-size:clamp(1.8rem,1.2rem + 1.6vw,2.6rem);line-height:1.1;letter-spacing:-.025em}
.calc-intro{max-width:40em;margin-top:14px;font-size:15.5px;line-height:1.75;color:var(--ink-2)}
.calc-block{margin-top:30px;padding-top:26px;border-top:1px solid var(--line)}
.calc-block-title{margin-bottom:16px;font-size:clamp(1.15rem,1rem + .45vw,1.45rem);font-weight:400;line-height:1.3;letter-spacing:-.012em}
.calc-field{min-width:0}
.calc-field+.calc-field{margin-top:18px}
.calc-label{display:block;margin-bottom:8px;font-size:15px;font-weight:400;line-height:1.4}
.calc-optional{color:var(--ink-3);font-weight:300}
.calc-help{margin-top:8px;font-size:13.5px;line-height:1.6;color:var(--ink-3)}
/* Fewer one-word last lines, and short headings that break evenly, where browsers support it. */
.calc :is(.calc-intro,.calc-help,.calc-room-meta,.calc-item-help,.calc-option-help,.calc-also-help,.calc-card-note,.calc-budget-note,.calc-share-note,.calc-excluded,.calc-summary-note){text-wrap:pretty}
.calc :is(.calc-head h2,.calc-block-title,.calc-card-head h3,.calc-room-type-name,.calc-quote-title){text-wrap:balance}
.calc-help-lead{margin:-6px 0 16px}
legend.calc-block-title:has(+.calc-help-lead){margin-bottom:10px}
.calc-help-block{margin-top:18px;max-width:46em}
.calc-help a,.calc-note a,.calc-alert a,.calc-foot a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:3px}
.calc-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px;align-items:start}
.calc-pair>.calc-field+.calc-field{margin-top:0}
.calc-where{display:grid;grid-template-columns:minmax(150px,.55fr) minmax(0,1.45fr);gap:18px 20px;align-items:start}
.calc-where>.calc-field+.calc-field{margin-top:0}

.calc-input{display:block;width:100%;height:52px;margin:0;padding:0 18px;border:0;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px rgba(18,27,32,.2);font:inherit;font-size:16px;font-weight:400;color:var(--ink);transition:box-shadow .3s var(--ease)}
.calc-input:hover{box-shadow:inset 0 0 0 1px rgba(18,27,32,.38)}
.calc-input:focus{box-shadow:inset 0 0 0 1.5px var(--ink)}
.calc-input:focus-visible{outline:2px solid var(--orange-text);outline-offset:2px;border-radius:14px}
.calc-input::placeholder{color:#8A9298;opacity:1}
.calc-input[aria-invalid=true]{box-shadow:inset 0 0 0 2px var(--calc-error)}
.calc-postcode{text-transform:uppercase}
.calc-postcode::placeholder{text-transform:none}
.calc-textarea{height:auto;min-height:124px;padding:14px 18px;line-height:1.6;resize:vertical}
.calc-unit{position:relative}
.calc-unit .calc-input{padding-right:54px}
.calc-unit span{position:absolute;top:50%;right:18px;transform:translateY(-50%);color:var(--ink-3);pointer-events:none}
.calc-unit input::-webkit-inner-spin-button,.calc-unit input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.calc-unit input{-moz-appearance:textfield;appearance:textfield}

/* Two choices as one control; the radios stay real for keys and screen readers. */
.calc-segmented{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;height:52px;padding:4px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px rgba(18,27,32,.2)}
.calc-segment{position:relative;display:block;cursor:pointer}
.calc-segment input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.calc-segment span{display:grid;place-items:center;height:100%;border-radius:10px;font-size:15px;font-weight:400;transition:background-color .35s var(--ease),color .35s var(--ease)}
.calc-segment:hover input:not(:checked)+span{background:var(--tile)}
.calc-segment input:checked+span{background:var(--ink);color:#fff}
.calc-segment input:focus-visible+span{outline:2px solid var(--orange-text);outline-offset:2px}

/* ------------------------------------------------------------------ the address finder */
.calc-combo-box{position:relative}
.calc-combo-icon{position:absolute;top:50%;left:16px;z-index:1;width:20px;height:20px;transform:translateY(-50%);color:var(--orange-ink);pointer-events:none}
.calc-combo-icon svg{width:20px;height:20px}
.calc-combo-input{padding-left:46px}
.calc-combo-popup{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:20;overflow:hidden;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px rgba(18,27,32,.1),0 24px 48px -20px rgba(18,27,32,.45)}
.calc-combo-list{max-height:min(330px,50vh);overflow-y:auto;overscroll-behavior:contain;padding:6px}
.calc-combo-option{display:flex;flex-direction:column;gap:1px;padding:11px 14px;border-radius:11px;cursor:pointer;transition:background-color .2s var(--ease)}
.calc-combo-option:hover,.calc-combo-option[aria-selected=true]{background:var(--orange-soft)}
.calc-combo-main{font-size:15px;font-weight:400;line-height:1.35;color:var(--ink)}
.calc-combo-secondary{font-size:13px;line-height:1.4;color:var(--ink-3)}
.calc-combo-option.is-typed{margin-top:4px;border-top:1px solid var(--line);border-radius:0 0 11px 11px}
.calc-combo-option.is-typed .calc-combo-main{color:var(--orange-ink)}
/* Google's attribution rules: its name in Roboto or a plain sans-serif,
   12–16px, weight 400, #5E5E5E, on one line and never translated. */
.calc-combo-credit{display:flex;justify-content:flex-end;padding:7px 16px 9px;border-top:1px solid var(--line);font-family:Roboto,Arial,sans-serif;font-size:12px;font-weight:400;line-height:1.2;color:#5E5E5E;white-space:nowrap}

/* ------------------------------------------------------------------ pictograms
   The Services menu's icon style: a round behind a 48-unit drawing. */
.calc-dot{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--tile);box-shadow:inset 0 0 0 1px rgba(18,27,32,.04);transition:transform .55s var(--ease)}
.calc-dot .calc-pictogram{width:26px;height:26px}
.calc-dot-small{width:38px;height:38px}
.calc-dot-small .calc-pictogram{width:23px;height:23px}

/* ------------------------------------------------------------------ rooms
   Room types are small tiles: the room's mark, its name, and a plus that turns. */
.calc-room-types{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.calc-room-type{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:16px;min-height:120px;padding:12px 12px 14px 14px;border-radius:14px;background:#fff;box-shadow:var(--calc-hairline);font-size:15px;font-weight:400;line-height:1.3;text-align:left;transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.calc-room-plus{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--ink);color:#fff;transition:transform .55s var(--ease),background-color .35s var(--ease),color .35s var(--ease)}
.calc-room-plus svg{width:16px;height:16px}
.calc-room-type:is(:hover,:focus-visible):not([aria-disabled=true]) .calc-dot{transform:scale(1.06)}
.calc-room-type:is(:hover,:focus-visible):not([aria-disabled=true]){transform:translateY(-2px);box-shadow:inset 0 0 0 1px rgba(18,27,32,.14),0 16px 32px -20px rgba(18,27,32,.4)}
.calc-room-type:is(:hover,:focus-visible):not([aria-disabled=true]) .calc-room-plus{transform:rotate(90deg);background:var(--orange);color:var(--ink)}
.calc-room-type:active:not([aria-disabled=true]){transform:scale(.98);transition-duration:.12s}
.calc-room-type[aria-disabled=true]{opacity:.5;cursor:not-allowed}
.calc-empty,.calc-list-title{margin-top:18px;font-size:13.5px;color:var(--ink-3)}
.calc-room-list{display:grid;gap:8px;margin-top:10px}
.calc-room-chip{display:flex;align-items:center;gap:12px;padding:8px 10px 8px 12px;border-radius:14px;background:#fff;box-shadow:inset 3px 0 0 var(--orange),var(--calc-hairline)}
.calc-room-text{flex:1;display:flex;flex-direction:column;min-width:0}
.calc-room-name{font-size:15px;font-weight:400;line-height:1.35}
.calc-room-meta{font-size:13px;line-height:1.5;color:var(--ink-3)}
.calc-icon-button{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;color:var(--ink-2);box-shadow:inset 0 0 0 1px rgba(18,27,32,.14);transition:background-color .3s var(--ease),color .3s var(--ease),box-shadow .3s var(--ease)}
.calc-icon-button svg{width:16px;height:16px}
.calc-icon-button:is(:hover,:focus-visible){background:var(--ink);color:#fff;box-shadow:inset 0 0 0 1px var(--ink)}

/* ------------------------------------------------------------------ fittings */
.calc-rooms{margin-top:28px;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,440px),1fr));gap:var(--frame);align-items:start}
.calc-card{padding:2px 20px 6px;border-radius:var(--r-card);background:#fff;box-shadow:var(--calc-hairline)}
.calc-card-head{display:flex;align-items:center;gap:12px;padding:14px 0 12px;border-bottom:1px solid var(--line)}
.calc-card-head h3{flex:1;min-width:0;font-size:18px;font-weight:400;line-height:1.3;letter-spacing:-.01em}
.calc-card-count{flex:none;font-size:13px;color:var(--ink-3)}
.calc-card-note{margin-top:12px;font-size:13.5px;line-height:1.6;color:var(--ink-2)}
.calc-item{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--line)}
.calc-item:last-child{border-bottom:0}
.calc-item-text{flex:1;display:flex;flex-direction:column;min-width:0}
.calc-item-name{font-size:15px;font-weight:400;line-height:1.35}
.calc-item-help{max-width:30em;margin-top:2px;font-size:13px;line-height:1.5;color:var(--ink-3)}
.calc-stepper{flex:none;display:flex;align-items:center;gap:2px}
.calc-stepper-button{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;color:var(--ink);box-shadow:inset 0 0 0 1px rgba(18,27,32,.18);transition:background-color .3s var(--ease),color .3s var(--ease),box-shadow .3s var(--ease)}
.calc-stepper-button svg{width:16px;height:16px}
.calc-stepper-button:is(:hover,:focus-visible):not([aria-disabled=true]){background:var(--ink);color:#fff;box-shadow:inset 0 0 0 1px var(--ink)}
.calc-stepper-button[aria-disabled=true]{opacity:.35;cursor:not-allowed}
.calc-stepper-input{width:46px;height:36px;padding:0;border:0;border-radius:8px;background:none;font:inherit;font-size:16px;font-weight:400;text-align:center;color:var(--ink);-moz-appearance:textfield;appearance:textfield}
.calc-stepper-input::-webkit-inner-spin-button,.calc-stepper-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.calc-stepper-input:focus-visible{outline:2px solid var(--orange-text);outline-offset:0}

/* ------------------------------------------------------------------ choices
   Native radios, drawn as white cards; the chosen one is outlined in orange. */
.calc-options{display:grid;gap:8px}
.calc-option{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;border-radius:14px;background:#fff;box-shadow:var(--calc-hairline);cursor:pointer;transition:box-shadow .35s var(--ease),background-color .35s var(--ease)}
.calc-option:hover{box-shadow:inset 0 0 0 1px rgba(18,27,32,.2)}
.calc-option input{flex:none;width:20px;height:20px;margin:2px 0 0;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1.5px rgba(18,27,32,.36);cursor:pointer;-webkit-appearance:none;appearance:none;transition:box-shadow .3s var(--ease)}
.calc-option input:checked{box-shadow:inset 0 0 0 6px var(--orange)}
.calc-option input:focus-visible{outline:2px solid var(--orange-text);outline-offset:3px;border-radius:50%}
.calc-option:has(input:checked){background:#FFF6EE;box-shadow:inset 0 0 0 1.5px var(--orange)}
.calc-option-text{display:flex;flex-direction:column;min-width:0}
.calc-option-title{font-size:15px;font-weight:400;line-height:1.4}
.calc-option-help{margin-top:2px;font-size:13.5px;line-height:1.55;color:var(--ink-2)}

/* ------------------------------------------------------------------ notes and errors */
.calc-note{margin:18px 0;padding:16px 20px;border-radius:14px;background:#fff;box-shadow:inset 3px 0 0 var(--orange),var(--calc-hairline);font-size:14.5px;line-height:1.65;color:var(--ink-2)}
.calc-note-title{margin-bottom:6px;font-weight:500;color:var(--ink)}
.calc-alert{margin:24px 0 0;padding:18px 20px;border-radius:14px;background:#fff;box-shadow:inset 3px 0 0 var(--calc-error),inset 0 0 0 1px var(--calc-error-soft)}
.calc-alert-title{font-size:15.5px;font-weight:500;color:var(--calc-error)}
.calc-alert .calc-list{margin-top:6px}
.calc-field-error{margin-top:8px;font-size:13.5px;line-height:1.55;color:var(--calc-error)}
.calc-loading-line{margin-top:14px;font-size:14px;color:var(--ink-3)}
.calc-list li{position:relative;margin:7px 0;padding-left:20px;font-size:14.5px;line-height:1.65;color:var(--ink-2)}
.calc-list li::before{content:'';position:absolute;left:2px;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--orange)}
.calc-alert .calc-list li::before{background:var(--calc-error)}

/* ------------------------------------------------------------------ the budget */
.calc-print-title{display:none}
.calc-budget{position:relative;isolation:isolate;overflow:hidden;margin:26px 0 16px;padding:clamp(24px,3vw,38px);border-radius:var(--r-tile);background:var(--orange);color:var(--ink)}
/* The dotted field the site draws its circuits with, faint in one corner. */
.calc-budget::after{content:'';position:absolute;right:0;bottom:0;z-index:-1;width:70%;height:100%;background-image:radial-gradient(circle,rgba(18,27,32,.2) 1.2px,transparent 1.6px);background-size:9px 9px;-webkit-mask-image:radial-gradient(110% 90% at 100% 100%,#000 10%,transparent 65%);mask-image:radial-gradient(110% 90% at 100% 100%,#000 10%,transparent 65%);pointer-events:none}
.calc-budget .calc-kicker{color:var(--ink)}
.calc-budget-figure{margin-top:10px;font-size:clamp(2.5rem,1.3rem + 3.6vw,4.6rem);font-weight:400;line-height:1.02;letter-spacing:-.036em}
.calc-budget-vat{margin-top:12px;font-size:15px;color:rgba(18,27,32,.82)}
.calc-budget-actions{margin-top:24px}
.calc-budget .arrow-button::before{background:#fff}
.calc-budget .arrow-button:is(:hover,:focus-visible){color:var(--ink)}
.calc-budget .arrow-button:is(:hover,:focus-visible) .arrow-circle{background:var(--ink);color:#fff}
.calc-budget .arrow-button:focus-visible{outline-color:var(--ink)}
.calc-budget-note{max-width:40em;margin-top:22px;padding-top:16px;border-top:1px solid rgba(18,27,32,.2);font-size:14px;line-height:1.65}
/* Where the money goes: one orange bar per part, labelled, on a soft track. */
.calc-share{margin:0 0 16px;padding:20px 22px 18px;border-radius:var(--r-card);background:#fff;box-shadow:var(--calc-hairline)}
.calc-share-title{font-size:clamp(1.05rem,.98rem + .3vw,1.25rem);font-weight:400;letter-spacing:-.01em}
.calc-share-list{display:grid;gap:14px;margin-top:16px}
.calc-share-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:6px 12px}
.calc-share-name{font-size:14.5px;line-height:1.4}
.calc-share-value{font-size:14.5px;font-weight:500;font-variant-numeric:tabular-nums}
.calc-share-bar{grid-column:1 / -1;display:block;height:8px;border-radius:4px;background:var(--tile);overflow:hidden}
.calc-share-bar span{display:block;height:100%;border-radius:4px;background:var(--orange);transition:background-color .3s var(--ease)}
.calc-share-list li:hover .calc-share-bar span{background:var(--orange-ink)}
.calc-share-note{margin-top:14px;font-size:12.5px;line-height:1.55;color:var(--ink-3)}
.calc-project-line{margin:0 0 18px;font-size:14px;line-height:1.6;color:var(--ink-2)}
.calc-details{margin-top:8px;border-radius:var(--r-card);background:#fff;box-shadow:var(--calc-hairline)}
.calc-details>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 14px 14px 20px;border-radius:var(--r-card);font-size:clamp(1.02rem,.95rem + .3vw,1.2rem);font-weight:400;line-height:1.4;list-style:none;cursor:pointer}
.calc-details>summary::-webkit-details-marker{display:none}
.calc-details-icon{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--ink);color:#fff;transition:transform .55s var(--ease),background-color .35s var(--ease),color .35s var(--ease)}
.calc-details-icon svg{width:18px;height:18px}
.calc-details[open] .calc-details-icon{transform:rotate(45deg);background:var(--orange);color:var(--ink)}
.calc-details-body{padding:0 20px 16px}
.calc-breakdown{width:100%;border-collapse:collapse;font-size:14.5px;line-height:1.5}
.calc-breakdown th,.calc-breakdown td{padding:9px 0;border-bottom:1px solid var(--line);font-weight:300;text-align:left;vertical-align:top}
.calc-breakdown thead th{padding-top:4px;font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.calc-breakdown .calc-num{padding-left:16px;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.calc-breakdown tbody th[scope=row]{color:var(--ink-2)}
.calc-group th,.calc-group td{padding-top:16px;font-weight:400;color:var(--ink)}
.calc-row-note{display:block;font-size:12.5px;line-height:1.5;color:var(--ink-3)}
.calc-breakdown tfoot th,.calc-breakdown tfoot td{font-weight:400;color:var(--ink)}
.calc-breakdown tfoot tr:first-child>*{padding-top:16px}
.calc-total>*{border-bottom:0;font-size:16px;font-weight:500!important}
.calc-excluded{max-width:46em;margin-top:16px;font-size:14px;line-height:1.65;color:var(--ink-2)}
.calc-excluded strong{color:var(--ink)}
.calc-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:26px}
.calc-foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:30px;font-size:13.5px;color:var(--ink-3)}
.calc-text-button{text-decoration:underline;text-underline-offset:3px;color:var(--ink-2)}
.calc-text-button:hover{color:var(--ink)}

/* ------------------------------------------------------------------ the enquiry */
.calc-quote{margin-top:28px;padding:clamp(22px,2.6vw,34px);border-radius:var(--r-tile);background:#fff;box-shadow:var(--calc-hairline);scroll-margin-top:100px}
.calc-quote-title{font-size:clamp(1.55rem,1.15rem + 1vw,2.1rem);line-height:1.3;letter-spacing:-.02em}
.calc-quote .calc-intro{margin-top:8px}
.calc-form{margin-top:22px}
.calc-form .calc-pair+.calc-pair,.calc-form .calc-pair+.calc-field{margin-top:18px}
.calc-form .calc-input{background:#fff;box-shadow:inset 0 0 0 1px rgba(18,27,32,.22)}
.calc-honey{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
/* While we're there: other work to quote for on the same visit, priced separately */
.calc-form .calc-also{margin-top:24px}
.calc-form .calc-also+.calc-field,.calc-form .calc-honey+.calc-field{margin-top:24px}
.calc-also-intro{margin:0 0 14px}
.calc-also-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.calc-also-item{display:flex;align-items:center;gap:12px;min-height:72px;padding:12px 14px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px rgba(18,27,32,.16);cursor:pointer;transition:box-shadow .35s var(--ease),background-color .35s var(--ease)}
.calc-also-item:hover{box-shadow:inset 0 0 0 1px rgba(18,27,32,.3)}
.calc-also-item input{flex:none;width:20px;height:20px;margin:0;border-radius:6px;background:#fff;box-shadow:inset 0 0 0 1.5px rgba(18,27,32,.36);cursor:pointer;-webkit-appearance:none;appearance:none;transition:background-color .3s var(--ease),box-shadow .3s var(--ease)}
.calc-also-item input:checked{background:var(--orange) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23121B20' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center/14px no-repeat;box-shadow:none}
.calc-also-item input:focus-visible{outline:2px solid var(--orange-text);outline-offset:3px;border-radius:6px}
.calc-also-item:has(input:checked){background:#FFF6EE;box-shadow:inset 0 0 0 1.5px var(--orange)}
.calc-also-text{display:flex;flex-direction:column;min-width:0}
.calc-also-name{font-size:15px;font-weight:400;line-height:1.35}
.calc-also-help{margin-top:2px;font-size:13px;line-height:1.5;color:var(--ink-3)}
.calc-drop{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:16px 18px;border:1.5px dashed rgba(18,27,32,.25);border-radius:14px;background:var(--tile);transition:border-color .3s var(--ease),background-color .3s var(--ease)}
.calc-drop.is-dragging{border-color:var(--orange);background:var(--orange-soft)}
.calc-drop>span:first-child{font-size:14.5px}
.calc-drop .calc-help{flex-basis:100%;margin-top:0}
.calc-file input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.calc-file:focus-within{outline:2px solid var(--orange-text);outline-offset:3px}
.calc-file-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px;overflow-wrap:anywhere}
.calc-file-row small{color:var(--ink-3)}
.calc-more{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.calc-more>summary{display:flex;align-items:center;gap:10px;width:max-content;max-width:100%;font-size:14.5px;list-style:none;cursor:pointer}
.calc-more>summary::-webkit-details-marker{display:none}
.calc-more>summary>span:first-child{text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:3px}
.calc-more .calc-details-icon{width:26px;height:26px}
.calc-more .calc-details-icon svg{width:14px;height:14px}
.calc-more[open] .calc-details-icon{transform:rotate(45deg);background:var(--orange);color:var(--ink)}
.calc-more[open]>summary{margin-bottom:16px}
.calc-more>.pill{margin-top:14px}
.calc-status-line{min-height:1.6em;margin-top:14px;font-size:14px;line-height:1.6;color:var(--ink-2)}

/* ------------------------------------------------------------------ moving on */
.calc-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:clamp(28px,3vw,40px);padding-top:22px;border-top:1px solid var(--line)}
.calc-nav:empty{display:none}
.calc .arrow-button[aria-disabled=true],.calc .pill[aria-disabled=true]{opacity:.6;cursor:progress}

/* ------------------------------------------------------------------ your project */
.calc-summary .calc-kicker{color:var(--orange)}
.calc-summary-total{margin:12px 0 2px;font-size:clamp(1.6rem,1.2rem + 1vw,2.1rem);line-height:1.15;letter-spacing:-.025em}
.calc-summary-label,.calc-summary-vat{display:block;font-size:13px;letter-spacing:0;color:rgba(255,255,255,.7)}
.calc-summary-label{margin-bottom:4px}
.calc-summary-vat{margin-top:4px}
.calc-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:16px 0 18px}
.calc-stat{display:flex;flex-direction:column;padding:12px 14px 13px;border-radius:14px;background:rgba(255,255,255,.07)}
.calc-stat-figure{font-size:2rem;font-weight:400;line-height:1.1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.calc-stat-label{margin-top:2px;font-size:13px;color:rgba(255,255,255,.7)}
.calc-facts{margin:0;border-top:1px solid rgba(255,255,255,.12)}
.calc-facts>div{padding:10px 0 11px;border-bottom:1px solid rgba(255,255,255,.12)}
.calc-facts dt{font-size:12.5px;line-height:1.5;color:rgba(255,255,255,.62)}
.calc-facts dd{margin:2px 0 0;font-size:14.5px;font-weight:400;line-height:1.5;overflow-wrap:anywhere}
.calc-summary-rooms{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.calc-summary-rooms li{padding:3px 10px 4px;border-radius:999px;background:rgba(255,255,255,.1);font-size:13px;line-height:1.45;white-space:nowrap}
.calc-summary .arrow-button{width:100%;justify-content:space-between;margin-top:20px}
.calc-summary-note{margin-top:18px;font-size:12.5px;line-height:1.65;color:rgba(255,255,255,.6)}

/* ------------------------------------------------------------------ saving */
.calc-dialog{width:min(640px,calc(100% - 32px));max-height:min(90vh,720px);margin:auto;padding:clamp(22px,3vw,34px);border:0;border-radius:var(--r-tile);background:#fff;color:var(--ink);box-shadow:0 30px 80px -30px rgba(18,27,32,.45)}
.calc-dialog::backdrop{background:rgba(18,27,32,.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.calc-dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.calc-dialog-head h2{font-size:clamp(1.4rem,1.1rem + .8vw,1.9rem);line-height:1.25;letter-spacing:-.02em}
.calc-dialog .calc-field{margin-top:20px}
.calc-dialog .calc-textarea{min-height:0;font-size:13.5px;word-break:break-all;resize:none}
.calc-dialog .calc-actions{margin-top:16px}

/* ------------------------------------------------------------------ responsive */
@media (min-width:1500px){
  .calc-panel-body>*:not(.calc-rooms){max-width:1180px}
  .calc-split{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:0 clamp(32px,3vw,56px);align-items:start}
  .calc-split .calc-pair{grid-template-columns:minmax(0,1fr)}
  .calc-options{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
  .calc-room-types{grid-template-columns:repeat(7,minmax(0,1fr))}
  .calc-result-top{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:var(--frame);align-items:stretch;margin:26px 0 16px}
  .calc-result-top .calc-budget,.calc-result-top .calc-share{margin:0}
}
@media (max-width:1100px){
  .calc-layout{grid-template-columns:minmax(0,1fr) 300px}
}
@media (max-width:900px){
  .calc-layout{grid-template-columns:minmax(0,1fr)}
  .calc-summary{position:static}
  .calc-bar{flex-wrap:wrap}
  .calc-step:not(.is-current) .calc-step-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .calc-steps{grid-template-columns:auto auto auto auto;justify-content:start;gap:0}
  .calc-steps li:not(:last-child){padding-right:34px}
  .calc-steps li:not(:last-child)::after{left:36px;right:4px}
  .calc-steps li:has(.is-current):not(:last-child)::after{display:none}
}
@media (max-width:640px){
  .calc-hero{padding-bottom:30px}
  .calc-hero-points li{font-size:13px}
  .calc-bar{padding:0 12px 14px}
  .calc-steps{grid-template-columns:repeat(3,minmax(0,1fr)) auto}
  .calc-steps li:not(:last-child){padding-right:0}
  .calc-steps li:not(:last-child)::after,.calc-steps li:has(.is-current):not(:last-child)::after{display:block;left:40px;right:8px}
  .calc-step{min-width:44px;padding-right:0}
  .calc-step.is-current .calc-step-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .calc-bar .calc-save{width:100%}
  .calc-panel{padding:24px 16px 22px}
  .calc-pair,.calc-where{grid-template-columns:minmax(0,1fr)}
  .calc-where .calc-postcode{max-width:220px}
  .calc-room-types{grid-template-columns:repeat(2,minmax(0,1fr))}
  .calc-room-type:last-child:nth-child(odd){grid-column:1 / -1;flex-direction:row;align-items:center;justify-content:flex-start;min-height:0;padding:10px 54px 10px 12px}
  .calc-room-type:last-child:nth-child(odd) .calc-room-plus{top:50%;margin-top:-15px}
  .calc-room-type{min-height:104px;gap:12px;padding:10px 10px 12px 12px;font-size:14px}
  .calc-room-type .calc-dot{width:38px;height:38px}
  .calc-room-type .calc-dot .calc-pictogram{width:23px;height:23px}
  .calc-room-plus{top:10px;right:10px;width:30px;height:30px}
  .calc-card{padding:2px 14px 4px}
  .calc-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"dot name stepper" ". help help";align-items:center;gap:0 10px}
  .calc-item .calc-dot-small{grid-area:dot;width:32px;height:32px}
  .calc-item-text{display:contents}
  .calc-item-name{grid-area:name}
  .calc-stepper{grid-area:stepper}
  .calc-item .calc-dot-small .calc-pictogram{width:20px;height:20px}
  .calc-share{padding:18px 16px 16px}
  .calc-item-help{grid-area:help;max-width:none;margin-top:-2px;font-size:12.5px}
  .calc-option{padding:14px}
  .calc-also-grid{grid-template-columns:minmax(0,1fr)}
  .calc-also-item{min-height:0}
  .calc-also-item .calc-dot,.calc-also-help{display:none}
  .calc-details>summary{padding-left:16px}
  .calc-details-body{padding:0 14px 14px}
  .calc-breakdown{font-size:13.5px}
  .calc-breakdown .calc-num{padding-left:10px}
  .calc-nav .arrow-button{padding-left:22px}
  .calc-actions>*{flex:1 1 auto}
  .calc-actions .arrow-button{justify-content:space-between}
  .calc-summary{padding:22px 18px 24px}
}
@media (max-width:360px){
  .calc-room-type{min-height:96px;font-size:13.5px}
}
@media (max-width:340px){
  .calc-item{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name stepper" "help help"}
  .calc-item .calc-dot-small{display:none}
}
@media (pointer:coarse){
  .calc-stepper-button,.calc-icon-button{width:44px;height:44px}
  .calc-stepper-input{width:40px;height:44px}
}
@media (forced-colors:active){
  .calc-option input,.calc-segment input,.calc-also-item input{position:static;width:20px;height:20px;opacity:1;-webkit-appearance:auto;appearance:auto}
  .calc-segment{display:flex;align-items:center;gap:8px;padding:0 12px}
  .calc-segment span{height:auto;background:none!important}
  .calc-combo-option[aria-selected=true]{outline:2px solid Highlight}
  .calc-share-bar{outline:1px solid CanvasText}
  .calc-share-bar span{background:CanvasText}
}

@media (prefers-reduced-motion:reduce){
  .calc-room-type:is(:hover,:focus-visible,:active):not([aria-disabled=true]),.calc-room-type:is(:hover,:focus-visible):not([aria-disabled=true]) .calc-dot{transform:none}
}

/* ------------------------------------------------------------------ print
   A printed or saved budget carries the result, not the questions around it. */
@media print{
  .calc-hero,.calc-bar,.calc-summary,.calc-nav,.calc-actions,.calc-budget-actions,.calc-quote,.calc-foot,.calc-dialog,.calc-head .calc-kicker{display:none!important}
  .calc-share-bar,.calc-share-bar span{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .calc-share{box-shadow:inset 0 0 0 1px var(--line);break-inside:avoid}
  .calc-dot{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .calc-layout{display:block}
  .calc-panel{padding:0;background:none}
  .calc-print-title{display:block;margin-bottom:12px;font-size:10pt;color:var(--ink-2)}
  .calc-budget{background:none;box-shadow:inset 0 0 0 2px var(--ink);break-inside:avoid}
  .calc-budget::after{display:none}
  .calc-details,.calc-note{box-shadow:inset 0 0 0 1px var(--line);break-inside:avoid}
  .calc-details-icon{display:none}
  .calc-breakdown tr{break-inside:avoid}
}
