.head{flex-wrap:wrap}.head .brand{flex:1 1 300px}.contacts{flex:1 1 340px;max-width:520px}.contact{overflow-wrap:anywhere;font-size:14px;display:block}.contact.wa,.btn.wa{background:#075e54}.btn.mail{background:#086756}.btn.sms{background:#174c43}
.footer-email{display:inline-block;margin-top:12px;color:#fff;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.total.quote-pending{font-size:clamp(1.8rem,5vw,3rem);line-height:1.2}.breakdown:empty{display:none}
#businessDetails .fine{margin-top:14px}.actions .btn:last-child:nth-child(3){grid-column:1/-1}
@media(max-width:760px){.contacts{max-width:none;flex:auto}.head .brand{flex:auto}}

/* Labels occupy a shared row; required markers stay inline with their text. */
#booking .grid,#enquiry .grid{align-items:start}
#booking .grid .field-label,#enquiry .grid .field-label{display:block;min-height:2.8em;line-height:1.4}
#booking label.required::after,#enquiry label.required::after{content:none}
#booking label.required>.field-label::after,#enquiry label.required>.field-label::after{content:' *';display:inline;color:var(--red);font-weight:800}
#booking .grid input,#enquiry .grid input{height:50px;min-height:50px}
#booking .phone-field,#enquiry .phone-field{gap:7px}
@media(max-width:520px){#booking .grid .field-label,#enquiry .grid .field-label{min-height:1.4em}}
/* Shared contact palette and readable estimate note. */
.contacts .contact[href^="tel:"]{background:#fff;color:#075e54;border-color:#fff}
.contacts .contact[href^="sms:"]{background:#fef3c7;color:#713f12;border-color:#fde68a}
.contacts .contact[href^="https://wa.me/"],.btn.wa{background:#25d366;color:#073b21;border-color:#1fb958}
.contacts .contact[href^="mailto:"],.btn.mail{background:#334155;color:#fff;border-color:#475569}
.btn.sms{background:#fef3c7;color:#713f12}
.panel.estimate>p{color:#fff}

.contacts .contact{display:flex;align-items:center;justify-content:center;gap:10px}.contact-icon{flex:0 0 22px}.contact-copy{min-width:0}.contact-copy span{display:inline}

/* Tablet and mobile contact alignment. Keep every label inside its own tile. */
.head{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-items:start}
.head .brand{min-width:0;width:100%}
.head .brand h1{overflow-wrap:anywhere;line-height:1.18}
.head .contacts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%;min-width:0}
.contacts .contact{display:grid;grid-template-columns:26px minmax(0,1fr);align-items:center;justify-content:initial;gap:12px;padding:16px 18px;min-height:86px;min-width:0;text-align:start;line-height:1.45}
.contacts .contact-icon{display:block;width:26px;height:26px;min-width:26px;max-width:26px;align-self:center;justify-self:center;overflow:visible}
.contacts .contact-copy{display:block;min-width:0;overflow-wrap:anywhere;font-size:1rem;font-weight:600}
.contacts .contact-copy span{font-weight:800;display:inline}
.contacts .contact-copy br{display:block}
.language-picker{flex-wrap:wrap;min-width:0}
.language-picker select{min-width:0;max-width:100%}
@media(min-width:1280px){.head{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:28px;align-items:center}}
@media(max-width:560px){.head .contacts{grid-template-columns:minmax(0,1fr)}.contacts .contact{min-height:76px;padding:14px 16px}.language-picker{justify-content:flex-start}.language-picker select{flex:1 1 160px}}