/* V10: a calm, focused enquiry flow. Earlier decorative quote styles are
   deliberately overridden here so each screen has one clear task. */

/* First interaction, including on the homepage: one postcode field. */
.quick-form .form-heading .eyebrow { margin-bottom: 12px; }
.quick-form .form-heading h2 {
  font-size: clamp(1.45rem, 2.3vw, 1.85rem);
  line-height: 1.18;
  margin-bottom: 20px;
}
.quick-form label { color: #27463f; font-size: .81rem; margin-bottom: 8px; }
.quick-form input {
  min-height: 51px;
  background: #fff;
  border: 1.5px solid #bdcfc8;
  box-shadow: none;
}
.quick-form input::placeholder { color: #687f78; opacity: 1; }
.quick-form .button {
  min-height: 47px;
  padding: 12px 18px;
  margin-top: 16px;
  font-size: .83rem;
  border-radius: 13px;
  box-shadow: none;
}
.quick-form .fine-print { font-size: .72rem; margin-top: 12px; }

/* A single, uncluttered quote app replaces the previous split landing page. */
body:has(.quote-page-interactive) .announcement,
body:has(.quote-page-interactive) .desktop-nav,
body:has(.quote-page-interactive) .mobile-nav,
body:has(.quote-page-interactive) .nav-cta,
body:has(.quote-page-interactive) .site-footer {
  display: none;
}
body:has(.quote-page-interactive) .site-header {
  position: relative;
  background: #f4f8f7;
  border-bottom: 0;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
body:has(.quote-page-interactive) .nav { height: 70px; }
.quote-page-interactive {
  background: #f4f8f7;
  padding: 28px 0 90px;
  min-height: 75vh;
}
.quote-page-interactive .quote-shell {
  width: min(100% - 44px, 760px);
  margin-inline: auto;
}
.quote-app-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  margin: 0 0 17px;
  scroll-margin-top: 104px;
  color: #6a8179;
  font-size: .79rem;
  font-weight: 650;
}
.quote-app-top .quote-exit {
  color: #285f52;
  font-weight: 730;
}
.quote-app-top .quote-exit:hover { text-decoration: underline; }
.quote-page-interactive .full-form-interactive {
  width: 100%;
  background: #fff;
  border: 1px solid #dfeae5;
  border-radius: 20px;
  box-shadow: 0 18px 42px #16463a0b;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  overflow: hidden;
}
.quote-page-interactive .quote-step-status {
  padding: 22px 32px 14px;
  color: #28564b;
  font-size: .78rem;
  font-weight: 700;
}
.quote-page-interactive .quote-step-status span:last-child {
  background: none;
  color: #667f75;
  padding: 0;
  font-size: .61rem;
  letter-spacing: .06em;
}
.quote-page-interactive .quote-progress {
  height: 4px;
  margin: 0 32px;
  background: #e3ebe7;
}
.quote-page-interactive .quote-progress span {
  background: #167b69;
}
.quote-page-interactive .full-form-interactive #quote-form {
  padding: 28px 32px 29px;
}
.quote-page-interactive .wizard-stage > .eyebrow {
  font-size: .64rem;
  margin-bottom: 8px;
  letter-spacing: .13em;
  color: #4a8677;
}
.quote-page-interactive .wizard-stage h1,
.quote-page-interactive .wizard-stage h2 {
  font-size: clamp(1.85rem, 3.4vw, 2.38rem);
  line-height: 1.17;
  font-weight: 740;
  margin: 0 0 8px;
}
.quote-page-interactive .wizard-stage > p {
  color: #647a73;
  font-size: .89rem;
  line-height: 1.5;
  margin-bottom: 21px;
}
.quote-page-interactive .service-choice-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.quote-page-interactive .full-form-interactive .service-choice {
  display: flex;
  position: relative;
  gap: 10px;
  align-items: center;
  min-height: 78px;
  padding: 14px 42px 14px 17px;
  margin: 0;
  background: #fff;
  border: 1.5px solid #dce6e1;
  border-radius: 12px;
  box-shadow: none;
  transform: none;
  transition: background .16s, border-color .16s, box-shadow .16s;
}
.quote-page-interactive .full-form-interactive .service-choice:hover {
  background: #f6faf8;
  border-color: #85b5a5;
  box-shadow: none;
  transform: none;
}
.quote-page-interactive .full-form-interactive .service-choice.is-selected,
.quote-page-interactive .full-form-interactive .service-choice:has(input:checked) {
  background: #e7f6f0;
  border: 2px solid #157f69;
  padding: 13.5px 41.5px 13.5px 16.5px;
  box-shadow: none;
}
.quote-page-interactive .choice-symbol { display: none; }
.quote-page-interactive .choice-copy {
  gap: 2px;
  padding: 0;
}
.quote-page-interactive .choice-copy strong {
  color: #1f443b;
  font-size: .86rem;
  line-height: 1.3;
}
.quote-page-interactive .choice-copy small {
  color: #5f7a70;
  font-size: .71rem;
  line-height: 1.35;
}
.quote-page-interactive .choice-check {
  width: 22px;
  height: 22px;
  top: 50%;
  right: 13px;
  transform: translateY(-50%);
  line-height: 20px;
  font-size: .79rem;
  color: transparent;
  border: 1.5px solid #adc3b9;
  border-radius: 50%;
}
.quote-page-interactive .full-form-interactive .service-choice.is-selected .choice-check,
.quote-page-interactive .full-form-interactive .service-choice:has(input:checked) .choice-check {
  color: #fff;
  border-color: #147762;
  background: #147762;
}
.quote-page-interactive .choice-count {
  font-size: .76rem !important;
  color: #467467 !important;
  margin: 14px 0 0 !important;
}
.quote-page-interactive .wizard-buttons {
  border-top: 1px solid #e8eeea;
  padding-top: 19px;
  margin-top: 24px;
}
.quote-page-interactive .wizard-buttons .button {
  min-height: 46px;
  padding: 11px 20px;
  border-radius: 12px;
  box-shadow: none;
  font-size: .84rem;
  white-space: normal;
}
.quote-page-interactive .wizard-buttons .button-outline {
  background: #fff;
  border: 1px solid #becfc5;
  color: #275f52;
}
.quote-page-interactive .wizard-buttons .button-primary {
  background: #127c6b;
  color: #fff;
}
.quote-page-interactive .wizard-buttons .button-primary:hover { background: #0c6759; }
.quote-page-interactive .full-form-interactive .fine-print {
  margin-top: 13px;
  color: #748a80;
  font-size: .68rem;
}
.quote-page-interactive .service-question {
  background: #fff;
  border: 0;
  border-top: 1px solid #e2ebe6;
  border-radius: 0;
  box-shadow: none;
  margin: 12px 0 0;
  padding: 18px 0 0;
}
.quote-page-interactive .service-question legend {
  font-size: 1rem;
  color: #205448;
  padding: 0;
}
.quote-page-interactive .question-number {
  background: #e4f4ed;
  color: #196b5a;
}
.quote-page-interactive .service-question label:not(.quote-tick) {
  font-size: .83rem;
  color: #315b4f;
  margin-top: 14px;
}
.quote-page-interactive .service-question select,
.quote-page-interactive .wizard-stage input,
.quote-page-interactive .wizard-stage textarea {
  background-color: #fff;
  border: 1.5px solid #cbdad2;
  border-radius: 12px;
  box-shadow: none;
  min-height: 48px;
  font-size: .88rem;
}
.quote-page-interactive .question-help {
  font-size: .73rem !important;
  line-height: 1.5 !important;
  margin: 7px 0 0 !important;
}
.quote-page-interactive .full-form-interactive .quote-tick {
  background: #f5faf7;
  border: 1px solid #e1ede5;
  border-radius: 12px;
  padding: 12px;
  margin-top: 18px;
  font-size: .82rem;
}
.quote-page-interactive .quote-review-amount {
  font-size: clamp(2.3rem, 5vw, 3.4rem);
  margin: 20px 0;
}
.quote-page-interactive .quote-review-list { margin-top: 10px; }
.quote-page-interactive .review-disclaimer {
  background: #f4f8f5;
  border-radius: 11px;
}
.quote-page-interactive .postcode-confirm {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  padding: 11px 14px;
  border: 1px solid #e0eae4;
  border-radius: 10px;
  background: #f7faf8;
  color: #516d61;
  font-size: .81rem;
  margin: 16px 0 0;
}
.quote-page-interactive .postcode-confirm strong { color: #21493d; }
.quote-page-interactive .postcode-confirm button {
  border: 0;
  background: none;
  color: #0e7868;
  text-decoration: underline;
  font-weight: 730;
  padding: 0 3px;
  font-size: inherit;
}

@media (max-width: 640px) {
  .quote-page-interactive { padding: 20px 0 65px; }
  .quote-page-interactive .quote-shell { width: min(100% - 26px, 760px); }
  .quote-app-top { font-size: .73rem; }
  .quote-app-top > span { display: none; }
  .quote-page-interactive .full-form-interactive { border-radius: 17px; }
  .quote-page-interactive .quote-step-status { padding: 18px 19px 12px; font-size: .72rem; }
  .quote-page-interactive .quote-step-status span:last-child { font-size: .54rem; }
  .quote-page-interactive .quote-progress { margin-inline: 19px; }
  .quote-page-interactive .full-form-interactive #quote-form { padding: 23px 19px; }
  .quote-page-interactive .service-choice-grid { grid-template-columns: 1fr; gap: 8px; }
  .quote-page-interactive .full-form-interactive .service-choice { min-height: 63px; padding-block: 10px; }
  .quote-page-interactive .full-form-interactive .service-choice.is-selected,
  .quote-page-interactive .full-form-interactive .service-choice:has(input:checked) { padding-block: 9.5px; }
  .quote-page-interactive .wizard-stage h1,
  .quote-page-interactive .wizard-stage h2 { font-size: 1.9rem; }
  .quote-page-interactive .wizard-buttons .button { font-size: .78rem; padding-inline: 14px; }
  .quick-form .button { font-size: .79rem; }
}

/* V11 controls: the browser never paints the real checkbox/radio box.
   A dedicated adjacent span carries the visible checked state instead. */
.quote-page-interactive .full-form-interactive .quote-tick > input.visually-hidden-check[type="checkbox"],
.quote-page-interactive .full-form-interactive .checkbox-label > input.visually-hidden-check[type="checkbox"],
.quote-page-interactive .contact-method-choice > input[type="radio"] {
  position: absolute !important;
  display: block !important;
  width: 1px !important;
  min-width: 1px !important;
  max-width: 1px !important;
  height: 1px !important;
  min-height: 1px !important;
  max-height: 1px !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
.quote-page-interactive .full-form-interactive .quote-tick,
.quote-page-interactive .full-form-interactive .checkbox-label {
  position: relative;
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  width: 100%;
  min-height: 52px;
  padding: 13px 15px !important;
  border-radius: 12px !important;
  background: #f8faf8 !important;
  border: 1px solid #dceae2 !important;
  margin: 20px 0 0 !important;
  color: #284a42 !important;
  cursor: pointer;
  box-sizing: border-box;
}
.quote-page-interactive .full-form-interactive .checkbox-label { align-items: flex-start !important; }
.quote-page-interactive .checkbox-ui {
  display: inline-block !important;
  position: relative;
  flex: 0 0 22px !important;
  width: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  padding: 0 !important;
  margin: 0 !important;
  background: white !important;
  border: 2px solid #567b6b !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}
.quote-page-interactive .checkbox-ui::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 6px;
  width: 6px;
  height: 11px;
  border: solid #fff;
  border-width: 0 2.5px 2.5px 0;
  transform: rotate(45deg);
  opacity: 0;
}
.quote-page-interactive .quote-tick:has(input:checked) .checkbox-ui,
.quote-page-interactive .checkbox-label:has(input:checked) .checkbox-ui,
.quote-page-interactive .quote-tick.is-checked .checkbox-ui,
.quote-page-interactive .checkbox-label.is-checked .checkbox-ui {
  border-color: #147665 !important;
  background: #147665 !important;
}
.quote-page-interactive .quote-tick:has(input:checked) .checkbox-ui::after,
.quote-page-interactive .checkbox-label:has(input:checked) .checkbox-ui::after,
.quote-page-interactive .quote-tick.is-checked .checkbox-ui::after,
.quote-page-interactive .checkbox-label.is-checked .checkbox-ui::after { opacity: 1; }
.quote-page-interactive .full-form-interactive .check-copy {
  color: #31584d !important;
  font-size: .83rem;
  font-weight: 590 !important;
  line-height: 1.55;
  flex: 1;
}
.quote-page-interactive .check-copy a { color: #116d5b; text-decoration: underline; }
.quote-page-interactive .quote-tick:has(input:focus-visible),
.quote-page-interactive .checkbox-label:has(input:focus-visible) {
  outline: 3px solid #71baaa !important;
  outline-offset: 3px;
}
.quote-page-interactive .quote-tick.is-checked,
.quote-page-interactive .checkbox-label.is-checked,
.quote-page-interactive .quote-tick:has(input:checked),
.quote-page-interactive .checkbox-label:has(input:checked) {
  border-color: #a3d7c5 !important;
  background: #eaf7f0 !important;
}
.quote-page-interactive .contact-method-group { margin: 20px 0 17px; }
.quote-page-interactive .contact-method-group > p {
  color: #3c6255;
  font-size: .83rem;
  font-weight: 730;
  margin: 0 0 10px;
}
.quote-page-interactive .contact-method-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}
.quote-page-interactive .contact-method-choice {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  min-height: 66px;
  padding: 11px 12px;
  margin: 0;
  border: 1.5px solid #cfded5;
  border-radius: 12px;
  background: white;
  cursor: pointer;
  transition: background .16s, border-color .16s;
}
.quote-page-interactive .contact-method-choice > span {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.quote-page-interactive .contact-method-choice strong {
  font-size: .84rem;
  line-height: 1.25;
  color: #24564a;
  font-weight: 740;
}
.quote-page-interactive .contact-method-choice small {
  font-size: .68rem;
  line-height: 1.35;
  color: #648175;
}
.quote-page-interactive .contact-method-choice i {
  display: block;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1.5px solid #94b2a4;
  background: #fff;
}
.quote-page-interactive .contact-method-choice.is-selected,
.quote-page-interactive .contact-method-choice:has(input:checked) {
  border-color: #137967;
  background: #e7f7ee;
}
.quote-page-interactive .contact-method-choice.is-selected i,
.quote-page-interactive .contact-method-choice:has(input:checked) i {
  border: 5px solid #127c6a;
}
.quote-page-interactive .contact-method-choice:has(input:focus-visible) {
  outline: 3px solid #71baaa;
  outline-offset: 3px;
}
.quote-page-interactive #contact-phone-group,
.quote-page-interactive #contact-email-group { margin-top: 0; }
@media (max-width: 540px) {
  .quote-page-interactive .contact-method-options { grid-template-columns: 1fr; }
  .quote-page-interactive .contact-method-choice { min-height: 52px; }
}