@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;800&family=Public+Sans:wght@400;500;600;700&display=swap");
/* Marshall Plumbing components. Every value reads a token; the fallback after the comma is the same token value for use outside this system. */
.mps, .mps * { box-sizing: border-box; }
.mps { font-family: var(--font-body, "Public Sans", Arial, sans-serif); color: var(--ink, #404041); font-size: 16px; line-height: 26px; -webkit-font-smoothing: antialiased; }
.mps h1, .mps h2, .mps h3, .mps .mps-display { font-family: var(--font-display, Montserrat, Arial, sans-serif); color: var(--navy, #13213b); margin: 0; text-wrap: balance; }
.mps p { margin: 0; }
.mps a { color: var(--blue-deep, #0073ab); }
.mps :focus-visible { outline: 3px solid var(--blue-deep, #0073ab); outline-offset: 2px; }
.mps-dark :focus-visible { outline-color: var(--sky, #9dcef6); }
.mps-eyebrow { font-family: var(--font-display, Montserrat, sans-serif); font-size: 13px; line-height: 16px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--blue-deep, #0073ab); }
.mps-dark .mps-eyebrow { color: var(--sky, #9dcef6); }
.mps-dark { background: var(--navy, #13213b); color: var(--on-dark, #fff); }
.mps-dark h1, .mps-dark h2, .mps-dark h3 { color: var(--on-dark, #fff); }

/* Button */
.mps-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 12px 24px; border-radius: var(--radius-pill, 999px); border: 2px solid transparent; font-family: var(--font-display, Montserrat, sans-serif); font-size: 15px; line-height: 20px; font-weight: 700; letter-spacing: .02em; text-decoration: none; cursor: pointer; transition: background-color .15s, border-color .15s, color .15s; }
.mps-btn svg { width: 18px; height: 18px; flex: none; }
.mps-btn-primary { background: var(--blue-deep, #0073ab); color: var(--on-dark, #fff); }
.mps-btn-primary:hover { background: var(--blue-press, #005f8e); }
.mps-btn-secondary { background: transparent; color: var(--navy, #13213b); border-color: var(--navy, #13213b); }
.mps-btn-secondary:hover { background: var(--mist, #eaf5fa); }
.mps-btn-light { background: var(--surface, #fff); color: var(--navy, #13213b); }
.mps-btn-light:hover { background: var(--mist, #eaf5fa); }
.mps-btn-alert { background: var(--alert, #c62828); color: var(--on-dark, #fff); }
.mps-btn-alert:hover { filter: brightness(.92); }
.mps-btn-sm { min-height: 40px; padding: 8px 16px; font-size: 14px; }
.mps a.mps-btn-primary, .mps a.mps-btn-alert { color: var(--on-dark, #fff); }
.mps a.mps-btn-secondary, .mps a.mps-btn-light { color: var(--navy, #13213b); }

/* Call pill */
.mps-call { display: inline-flex; align-items: center; gap: 12px; padding: 8px 20px 8px 8px; border-radius: var(--radius-pill, 999px); background: var(--blue-deep, #0073ab); color: var(--on-dark, #fff); text-decoration: none; }
.mps-call:hover { background: var(--blue-press, #005f8e); }
.mps-call-icon { width: 36px; height: 36px; border-radius: 50%; background: var(--surface, #fff); color: var(--blue-deep, #0073ab); display: grid; place-items: center; flex: none; }
.mps-call-icon svg { width: 18px; height: 18px; }
.mps-call-text { display: grid; line-height: 1.1; }
.mps-call-label { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; font-family: var(--font-display, Montserrat, sans-serif); opacity: .9; }
.mps-call-number { font-family: var(--font-display, Montserrat, sans-serif); font-size: 18px; font-weight: 800; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
.mps a.mps-call { color: var(--on-dark, #fff); }

/* Emergency bar */
.mps-ebar { background: var(--navy, #13213b); color: var(--on-dark, #fff); font-size: 14px; line-height: 20px; }
.mps-ebar-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 16px; padding: 10px 16px; text-align: center; }
.mps-ebar-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--alert, #c62828); box-shadow: 0 0 0 3px rgba(198,40,40,.35); flex: none; }
.mps-ebar strong { font-weight: 700; }
.mps-ebar a { color: var(--on-dark, #fff); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; font-variant-numeric: tabular-nums; }

/* Header */
.mps-header { background: var(--surface, #fff); border-bottom: 1px solid var(--line, #d3e3ee); }
.mps-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 12px 24px; max-width: 1200px; margin: 0 auto; }
.mps-header-logo img { height: 76px; width: auto; display: block; }
.mps-nav { display: flex; gap: 28px; }
.mps-nav a { font-size: 14px; font-weight: 600; color: var(--navy, #13213b); text-decoration: none; padding: 6px 0; border-bottom: 2px solid transparent; }
.mps-nav a:hover, .mps-nav a[aria-current="page"] { border-bottom-color: var(--blue, #008ccf); }
@media (max-width: 860px) { .mps-nav { display: none; } .mps-header-logo img { height: 56px; } }

/* Drop frame: the logo's water drop as an image mask */
.mps-drop { position: relative; aspect-ratio: 100 / 130; width: 100%; max-width: 100%; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 130'%3E%3Cpath d='M50 0C50 0 100 56 100 80A50 50 0 0 1 0 80C0 56 50 0 50 0Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 130'%3E%3Cpath d='M50 0C50 0 100 56 100 80A50 50 0 0 1 0 80C0 56 50 0 50 0Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat; background: var(--mist, #eaf5fa); }
.mps-drop img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mps-drop-outline { position: absolute; inset: 0; pointer-events: none; }
.mps-drop-outline path { fill: none; stroke: var(--mist, #eaf5fa); stroke-width: 6; }

/* Rating badge */
.mps-rating { display: inline-flex; align-items: center; gap: 14px; padding: 10px 18px 10px 14px; background: var(--surface, #fff); border: 1px solid var(--line, #d3e3ee); border-radius: var(--radius-md, 12px); box-shadow: var(--shadow-card, 0 1px 2px rgba(19,33,59,.06), 0 8px 24px rgba(19,33,59,.08)); }
.mps-rating-score { font-family: var(--font-display, Montserrat, sans-serif); font-size: 40px; line-height: 44px; font-weight: 800; color: var(--navy, #13213b); }
.mps-rating-meta { display: grid; gap: 2px; }
.mps-stars { display: inline-flex; gap: 2px; color: var(--star, #f2b705); }
.mps-stars svg { width: 18px; height: 18px; fill: currentColor; }
.mps-rating-source { font-size: 13px; line-height: 18px; color: var(--muted, #5c6670); }
.mps-rating-source strong { color: var(--ink, #404041); font-weight: 600; }

/* Service card */
.mps-services { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 24px; }
.mps-service { display: grid; align-content: start; gap: 12px; padding: 24px; background: var(--surface, #fff); border: 1px solid var(--line, #d3e3ee); border-radius: var(--radius-md, 12px); text-decoration: none; color: inherit; transition: box-shadow .2s, transform .2s, border-color .2s; }
.mps-service:hover { box-shadow: var(--shadow-raised, 0 16px 40px rgba(19,33,59,.14)); border-color: var(--blue, #008ccf); transform: translateY(-2px); }
.mps-service-icon { width: 56px; height: 56px; border-radius: 50%; background: var(--surface, #fff); box-shadow: inset 0 0 0 1px var(--line, #d3e3ee); display: grid; place-items: center; }
.mps-service-icon img { width: 48px; height: 48px; }
.mps-service h3 { font-size: 20px; line-height: 26px; }
.mps-service p { font-size: 15px; line-height: 24px; color: var(--muted, #5c6670); }
.mps-service-link { font-size: 14px; font-weight: 700; color: var(--blue-deep, #0073ab); font-family: var(--font-display, Montserrat, sans-serif); display: inline-flex; align-items: center; gap: 6px; }
.mps-service-link svg { width: 16px; height: 16px; transition: transform .2s; }
.mps-service:hover .mps-service-link svg { transform: translateX(3px); }

/* Review card */
.mps-review { display: grid; gap: 14px; align-content: start; padding: 24px; background: var(--surface, #fff); border-radius: var(--radius-md, 12px); border: 1px solid var(--line, #d3e3ee); }
.mps-review blockquote { margin: 0; font-size: 16px; line-height: 26px; color: var(--ink, #404041); }
.mps-review-by { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; font-size: 14px; }
.mps-review-name { font-weight: 700; color: var(--navy, #13213b); }
.mps-review-src { color: var(--muted, #5c6670); font-size: 13px; }

/* Trust strip */
.mps-trust { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px 40px; padding: 20px 16px; }
.mps-trust-item { display: flex; align-items: center; gap: 10px; font-size: 14px; line-height: 18px; color: var(--ink, #404041); }
.mps-trust-item strong { display: block; color: var(--navy, #13213b); font-family: var(--font-display, Montserrat, sans-serif); font-size: 13px; letter-spacing: .06em; text-transform: uppercase; }
.mps-trust-item svg { width: 28px; height: 28px; color: var(--blue, #008ccf); flex: none; }
.mps-trust-item img { height: 44px; width: auto; }

/* Form */
.mps-form { display: grid; gap: 16px; padding: 28px; background: var(--surface, #fff); border-radius: var(--radius-md, 12px); box-shadow: var(--shadow-card, 0 8px 24px rgba(19,33,59,.08)); }
.mps-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 560px) { .mps-form-row { grid-template-columns: 1fr; } }
.mps-field { display: grid; gap: 6px; min-width: 0; }
.mps-field label { font-size: 14px; line-height: 20px; font-weight: 600; color: var(--navy, #13213b); }
.mps-field label .req { color: var(--alert, #c62828); }
.mps-input, .mps-select, .mps-textarea { width: 100%; font: inherit; font-size: 16px; color: var(--ink, #404041); background: var(--surface, #fff); border: 1px solid var(--control-border, #7c8a96); border-radius: var(--radius-sm, 6px); padding: 12px 14px; }
.mps-textarea { min-height: 112px; resize: vertical; }
.mps-input:focus, .mps-select:focus, .mps-textarea:focus { outline: 3px solid var(--blue-deep, #0073ab); outline-offset: 1px; border-color: var(--blue-deep, #0073ab); }
.mps-field-help { font-size: 13px; line-height: 18px; color: var(--muted, #5c6670); }
.mps-field-error .mps-input { border-color: var(--alert, #c62828); }
.mps-field-error .mps-field-help { color: var(--alert, #c62828); font-weight: 600; }
.mps-upload { display: flex; align-items: center; gap: 12px; padding: 14px; border: 1px dashed var(--control-border, #7c8a96); border-radius: var(--radius-sm, 6px); background: var(--mist, #eaf5fa); font-size: 14px; color: var(--ink, #404041); }
.mps-upload svg { width: 22px; height: 22px; color: var(--blue-deep, #0073ab); flex: none; }
.mps-form-note { font-size: 13px; line-height: 20px; color: var(--muted, #5c6670); }
.mps-form-note strong { color: var(--alert, #c62828); }

/* FAQ */
.mps-faq { display: grid; gap: 12px; }
.mps-faq details { background: var(--surface, #fff); border: 1px solid var(--line, #d3e3ee); border-radius: var(--radius-md, 12px); }
.mps-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 20px; font-family: var(--font-display, Montserrat, sans-serif); font-weight: 700; font-size: 17px; line-height: 24px; color: var(--navy, #13213b); }
.mps-faq summary::-webkit-details-marker { display: none; }
.mps-faq summary::after { content: ""; width: 12px; height: 12px; flex: none; border-right: 2.5px solid var(--blue-deep, #0073ab); border-bottom: 2.5px solid var(--blue-deep, #0073ab); transform: rotate(45deg) translateY(-3px); transition: transform .2s; }
.mps-faq details[open] summary::after { transform: rotate(-135deg) translateY(-3px); }
.mps-faq-a { padding: 0 20px 20px; color: var(--ink, #404041); max-width: 68ch; }

/* Suburb chips */
.mps-areas { display: flex; flex-wrap: wrap; gap: 8px; }
.mps-chip { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: var(--radius-pill, 999px); background: var(--mist, #eaf5fa); color: var(--navy, #13213b); font-size: 14px; font-weight: 600; text-decoration: none; border: 1px solid transparent; }
.mps-chip:hover { border-color: var(--blue, #008ccf); }
.mps-chip svg { width: 14px; height: 14px; color: var(--blue-deep, #0073ab); }

/* Expect list */
.mps-expect { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px 24px; }
.mps-expect li { display: flex; gap: 10px; align-items: flex-start; font-weight: 600; color: var(--navy, #13213b); }
.mps-expect svg { width: 22px; height: 22px; flex: none; color: var(--blue, #008ccf); margin-top: 2px; }

/* Koala note */
.mps-koala { display: grid; grid-template-columns: 120px 1fr; gap: 20px; align-items: center; }
.mps-koala img { width: 120px; height: auto; }
.mps-koala-bubble { position: relative; padding: 20px 24px; background: var(--mist, #eaf5fa); border-radius: var(--radius-lg, 24px); }
.mps-koala-bubble::before { content: ""; position: absolute; left: -10px; top: 50%; width: 20px; height: 20px; background: var(--mist, #eaf5fa); transform: translateY(-50%) rotate(45deg); border-radius: 3px; }
.mps-koala-bubble h3 { font-size: 22px; line-height: 28px; margin-bottom: 6px; }
@media (max-width: 520px) { .mps-koala { grid-template-columns: 1fr; } .mps-koala-bubble::before { display: none; } }

/* Footer */
.mps-footer { background: var(--navy, #13213b); color: var(--on-dark-muted, #a6b4c2); font-size: 14px; line-height: 22px; }
.mps-footer-inner { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 32px; padding: 56px 24px 32px; max-width: 1200px; margin: 0 auto; }
@media (max-width: 860px) { .mps-footer-inner { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .mps-footer-inner { grid-template-columns: 1fr; } }
.mps-footer h4 { margin: 0 0 12px; font-family: var(--font-display, Montserrat, sans-serif); font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--sky, #9dcef6); }
.mps-footer a { color: var(--on-dark, #fff); text-decoration: none; }
.mps-footer a:hover { text-decoration: underline; }
.mps-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.mps-footer-logo { display: inline-block; background: var(--surface, #fff); border-radius: var(--radius-md, 12px); padding: 10px 14px; margin-bottom: 14px; }
.mps-footer-logo img { height: 64px; width: auto; display: block; }
.mps-footer-legal { border-top: 1px solid rgba(166,180,194,.25); padding: 16px 24px; max-width: 1200px; margin: 0 auto; font-size: 12px; line-height: 18px; display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: space-between; }

@media (prefers-reduced-motion: reduce) { .mps * { transition: none !important; } }