:root {
  --ink: #10253c;
  --body: #405569;
  --muted: #516b81;
  --blue: #14668f;
  --ice: #eef5fb;
  --line: #d7e3ed;
  --navy: #0c2239;
  --green: #08664a;
  --green-hover: #074e3b;
  --white: #fff;
  --radius: 18px;
  --shadow: 0 12px 36px #10253c0d;
  color-scheme: light;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink);
  background: var(--white);
}
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; }
img { display: block; max-width: 100%; height: auto; }
figure, p { margin: 0; }
h1, h2, h3 { margin: 0; line-height: 1.12; text-wrap: balance; }
h1 { font-size: clamp(2.35rem, 5vw, 4.9rem); font-weight: 760; letter-spacing: -.065em; }
h2 { font-size: clamp(1.8rem, 3.5vw, 3.1rem); font-weight: 750; letter-spacing: -.052em; }
h3 { font-size: clamp(1.08rem, 2vw, 1.34rem); font-weight: 740; letter-spacing: -.026em; }
a { color: var(--blue); }
a:hover { color: #0d3a85; }
button, input, select, textarea { font: inherit; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid #3e8af3; outline-offset: 4px; }
[hidden] { display: none !important; }
[id] { scroll-margin-top: 95px; }
.shell { width: min(100% - 64px, 1200px); margin-inline: auto; }
.section { padding-block: clamp(45px, 6vw, 84px); }
.tinted { background: #f3f7fb; border-block: 1px solid #e8eff6; }
.eyebrow { display: flex; align-items: center; gap: 9px; font-size: .73rem; font-weight: 790; letter-spacing: .12em; line-height: 1.45; text-transform: uppercase; color: var(--blue); }
.eyebrow::before { content: ""; width: 15px; height: 2px; flex: 0 0 15px; border-radius: 1px; background: currentColor; }
.lead { color: var(--body); font-size: clamp(1rem, 1.7vw, 1.18rem); line-height: 1.68; max-width: 58ch; }
.section-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 12px 24px; margin-bottom: clamp(20px, 3vw, 34px); }
.section-head > div { display: grid; justify-items: start; gap: 9px; }
.section-head p:not(.eyebrow), .body-copy { color: var(--body); max-width: 66ch; }
.text-link { display: inline-flex; align-items: center; gap: 8px; width: fit-content; color: var(--blue); font-weight: 750; font-size: .92rem; text-underline-offset: 3px; }
.text-link span { text-decoration: none; }
.icon { width: 19px; height: 19px; flex: 0 0 19px; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 11px 16px; border: 1px solid transparent; border-radius: 8px; color: var(--ink); font: 740 .88rem/1.35 system-ui, sans-serif; text-decoration: none; cursor: pointer; transition: background-color .16s, border-color .16s, color .16s; }
.button--green { background: var(--green); color: var(--white); }
.button--green:hover { background: var(--green-hover); color: var(--white); }
.button--white { background: var(--white); border-color: #cbdce9; }
.button--white:hover { border-color: var(--blue); color: var(--blue); }
.button--soft { background: #e4f4ed; border-color: #cde7dc; color: #125744; }
.button--soft:hover { background: #d4eee3; color: #0b4838; }
.button--small { min-height: 39px; padding: 8px 11px; font-size: .79rem; }
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 100; padding: 10px 14px; border-radius: 6px; background: var(--navy); color: var(--white); transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); color: var(--white); }
.site-header { position: sticky; top: 0; z-index: 20; background: var(--white); border-bottom: 1px solid var(--line); }
.header-inner { min-height: 78px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: clamp(16px, 3vw, 36px); }
.brand { display: inline-flex; align-items: center; gap: 10px; width: fit-content; color: var(--ink); text-decoration: none; }
.brand img { width: clamp(158px, 18vw, 215px); height: auto; }
.desktop-nav { display: flex; justify-content: center; gap: clamp(12px, 2.2vw, 27px); align-items: center; }
.desktop-nav a, .mobile-links a { color: var(--body); font-size: .9rem; font-weight: 710; text-decoration: none; }
.desktop-nav a { padding: 10px 0 9px; border-bottom: 2px solid transparent; white-space: nowrap; }
.desktop-nav a:hover, .desktop-nav a[aria-current], .desktop-nav a.is-parent { color: var(--blue); border-color: var(--blue); }
.mobile-nav { display: none; }
.breadcrumb { display: flex; align-items: center; flex-wrap: wrap; gap: 5px 9px; font-size: .82rem; line-height: 1.35; color: var(--muted); }
.breadcrumb a { font-weight: 650; text-underline-offset: 3px; }
.hero { background: linear-gradient(110deg, #f4f9fd 5%, #e9f3fc 100%); border-bottom: 1px solid #dfeaf3; }
.hero--home { background: radial-gradient(ellipse at 85% 10%, #dceafa 0, transparent 58%), linear-gradient(110deg, #f7fbff, #e9f3fb); }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr); align-items: center; gap: clamp(24px, 5vw, 66px); padding-block: clamp(37px, 6vw, 78px); }
.hero-copy { display: grid; gap: clamp(12px, 1.6vw, 20px); min-width: 0; }
.hero-copy h1 { max-width: 17ch; }
.hero--home h1 { font-size: clamp(2.55rem, 5.35vw, 5.15rem); max-width: 14ch; }
.hero-location { display: block; color: var(--blue); font-size: .64em; letter-spacing: -.05em; line-height: 1.19; margin-top: 5px; }
.hero-note { color: var(--muted); font-size: .86rem; }
.hero-figure { position: relative; min-width: 0; overflow: hidden; border-radius: var(--radius); background: #d9e7f1; box-shadow: 0 18px 42px #153c5e26; }
.hero-figure img { width: 100%; aspect-ratio: 1.22; object-fit: cover; object-position: 55% center; }
.hero-figure--repair img { aspect-ratio: 1.5; object-position: center; }
.hero-figure--about img { object-position: 59% center; }
.photo-label { position: absolute; right: 13px; bottom: 13px; background: #10253cee; color: var(--white); font-size: .75rem; font-weight: 670; padding: 6px 10px; border-radius: 6px; }
.hero-photo-note { position: absolute; bottom: 16px; left: 16px; display: flex; align-items: center; gap: 9px; padding: 9px 12px; border-radius: 7px; background: #fff; color: var(--ink); font-size: .78rem; font-weight: 760; box-shadow: var(--shadow); }
.hero-photo-note .icon { color: var(--blue); }
.hero-compact { padding-block: clamp(39px, 6vw, 75px); }
.hero-compact .hero-copy { max-width: 880px; }
.hero-compact h1 { max-width: 19ch; }
.context-bar { background: var(--white); border-bottom: 1px solid var(--line); }
.context-inner { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.context-item { display: flex; align-items: center; gap: 11px; min-height: 66px; padding: 10px 18px; color: var(--body); font-size: .83rem; font-weight: 675; }
.context-item:first-child { padding-left: 0; }
.context-item + .context-item { border-left: 1px solid var(--line); }
.context-item .icon { color: var(--blue); }
.service-grid, .photo-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(11px, 1.5vw, 19px); }
.service-card, .gallery-card { min-width: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: var(--white); box-shadow: var(--shadow); }
.service-card-image { display: block; background: var(--ice); }
.service-card-image:focus-visible, .gallery-image:focus-visible { outline-offset: -4px; }
.service-card-image img, .gallery-image img { width: 100%; aspect-ratio: 1.45; object-fit: cover; }
.service-card-body { display: flex; flex-direction: column; gap: 8px; flex: 1; padding: clamp(12px, 1.6vw, 18px); }
.card-tag { color: var(--blue); font-size: .69rem; font-weight: 790; letter-spacing: .075em; line-height: 1.4; text-transform: uppercase; }
.service-card h3 a { color: var(--ink); text-decoration: none; }
.service-card h3 a:hover { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
.service-card p:not(.card-tag), .gallery-card p { color: var(--body); font-size: .9rem; }
.service-actions { display: flex; flex-wrap: wrap; gap: 8px 11px; align-items: center; padding-top: 7px; margin-top: auto; }
.split { display: grid; grid-template-columns: minmax(0, .87fr) minmax(0, 1.13fr); gap: clamp(20px, 5vw, 64px); align-items: start; }
.split > div { min-width: 0; }
.prose { display: grid; align-content: start; gap: 12px; }
.prose > p:not(.eyebrow) { color: var(--body); }
.panels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.panel { display: grid; align-content: start; gap: 9px; padding: clamp(15px, 2.3vw, 24px); background: var(--white); border: 1px solid var(--line); border-radius: 12px; }
.panel p:not(.eyebrow):not(.card-tag) { color: var(--body); font-size: .94rem; }
.panel--accent { background: var(--navy); color: var(--white); border-color: transparent; box-shadow: var(--shadow); }
.panel--accent .eyebrow, .panel--accent .card-tag { color: #a1cbff; }
.panel--accent p:not(.eyebrow):not(.card-tag) { color: #dce9f6; }
.panel--accent .button { justify-self: start; margin-top: 5px; }
.gallery-image { display: block; position: relative; background: var(--ice); }
.gallery-image img { object-position: center 46%; }
.gallery-image--frost img { object-position: center 25%; }
.gallery-image .photo-label { right: 8px; bottom: 8px; font-size: .7rem; }
.gallery-card figcaption { display: grid; gap: 6px; padding: clamp(12px, 1.6vw, 17px); }
.gallery-card h3 { font-size: 1.02rem; }
.photo-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.photo-grid--three img { aspect-ratio: 1.18; }
.steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; counter-reset: step; }
.step { display: grid; align-content: start; gap: 10px; padding: clamp(15px, 2vw, 23px); border: 1px solid var(--line); border-radius: 12px; background: var(--white); counter-increment: step; }
.step::before { content: "0" counter(step); display: grid; place-items: center; width: 33px; height: 33px; border-radius: 7px; color: var(--blue); background: var(--ice); font-size: .74rem; font-weight: 810; }
.step p { color: var(--body); font-size: .93rem; }
.accordion { display: grid; gap: 8px; }
.accordion details { min-width: 0; border: 1px solid var(--line); border-radius: 9px; background: var(--white); }
.accordion details[open] { border-color: #b8cde4; }
.accordion summary { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 50px; list-style: none; padding: 12px 15px; border-radius: 9px; font-size: .96rem; font-weight: 740; cursor: pointer; }
.accordion summary::-webkit-details-marker { display: none; }
.accordion summary:hover { color: var(--blue); }
.accordion summary::after { content: ""; width: 9px; height: 9px; flex: 0 0 9px; margin: -4px 4px 0; border-right: 2px solid var(--blue); border-bottom: 2px solid var(--blue); transform: rotate(45deg); }
.accordion details[open] summary::after { transform: rotate(225deg); margin-top: 4px; }
.accordion details p { padding: 0 15px 14px; color: var(--body); font-size: .92rem; }
.faq-index { display: grid; gap: 9px; }
.faq-index a, .related a { display: flex; justify-content: space-between; align-items: center; gap: 7px; min-height: 45px; border: 1px solid var(--line); background: var(--white); border-radius: 8px; padding: 10px 13px; color: var(--ink); font-size: .9rem; font-weight: 740; text-decoration: none; }
.faq-index a:hover, .related a:hover { color: var(--blue); border-color: #9dbbdb; }
.faq-index a span, .related a span { color: var(--blue); }
.faq-block + .faq-block { padding-top: 30px; margin-top: 30px; border-top: 1px solid var(--line); }
.related { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }
.related--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.equipment-list { display: grid; gap: 13px; }
.equipment-list .panel { gap: 5px; }
.visit-note { padding-top: 12px; margin-top: 3px; border-top: 1px solid #ffffff32; }
.inspection-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr);
  grid-template-areas: "intro figure" "checks figure";
  align-items: start;
  gap: 18px clamp(22px, 5vw, 64px);
}
.inspection-intro { grid-area: intro; }
.inspection-figure { grid-area: figure; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); box-shadow: var(--shadow); }
.inspection-figure img { width: 100%; }
.inspection-figure figcaption { display: grid; gap: 5px; padding: 13px 16px; color: var(--body); font-size: .86rem; }
.inspection-details { grid-area: checks; display: grid; gap: 16px; }
.inspection-checks { margin: 0; padding-inline-start: 21px; color: var(--body); }
.inspection-checks li::marker { color: var(--blue); }
.inspection-checks li + li { margin-top: 14px; }
.inspection-checks h3 { color: var(--ink); font-size: 1.13rem; }
.inspection-checks p { margin-top: 4px; }
.enquiry-card { display: grid; gap: 12px; min-width: 0; padding: clamp(16px, 3vw, 27px); border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); box-shadow: var(--shadow); }
.enquiry-card h2 { font-size: clamp(1.5rem, 3vw, 2.2rem); }
.enquiry, .enquiry-fields { display: grid; gap: 12px; margin: 0; }
.enquiry-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0; border: 0; min-width: 0; }
.enquiry-wide { grid-column: 1 / -1; }
.enquiry label { display: grid; gap: 4px; min-width: 0; font-size: .87rem; font-weight: 720; }
.enquiry label small { font-weight: 530; color: var(--muted); }
.enquiry input, .enquiry select, .enquiry textarea { display: block; width: 100%; min-height: 44px; padding: 8px 10px; border: 1px solid #afc3d5; border-radius: 7px; background: var(--white); color: var(--ink); font-weight: 460; font-size: 1rem; }
.enquiry textarea { min-height: 87px; resize: vertical; }
.enquiry button { justify-self: start; }
.enquiry-note { color: var(--muted); font-size: .8rem; }
.contact-methods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.contact-methods a { overflow-wrap: anywhere; }
.cta-band { padding-block: clamp(29px, 4vw, 49px); background: #0d2c49; color: var(--white); }
.cta-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 18px 28px; }
.cta-inner h2 { font-size: clamp(1.6rem, 3.6vw, 2.7rem); }
.cta-inner p { margin-top: 6px; color: #d8e7f7; }
.cta-band .button--green, .panel--accent .button--green { background: #0b7455; }
.cta-band .button--green:hover, .panel--accent .button--green:hover { background: #08664a; }
.site-footer { background: var(--navy); color: var(--white); }
.footer-grid { display: grid; grid-template-columns: 1.35fr 1fr .8fr 1fr; gap: 22px 30px; padding-block: 42px 30px; }
.footer-group { min-width: 0; display: grid; align-content: start; gap: 7px; }
.footer-group h2 { font-size: .99rem; letter-spacing: -.02em; }
.footer-group p, .footer-group a:not(.button), .footer-bottom { color: #d2dfeb; font-size: .88rem; }
.footer-group a:not(.button) { width: fit-content; text-decoration: none; overflow-wrap: anywhere; }
.footer-group a:hover:not(.button) { color: var(--white); text-decoration: underline; }
.footer-group .brand img { width: min(100%, 191px); height: auto; }
.footer-group .button { justify-self: start; margin-top: 4px; }
.footer-bottom { padding-block: 12px 18px; border-top: 1px solid #ffffff2d; font-size: .77rem; }
.floating-whatsapp {
  position: fixed;
  right: calc(16px + env(safe-area-inset-right, 0px));
  bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  z-index: 30;
}
.floating-whatsapp .button { width: 52px; height: 52px; padding: 0; border-radius: 50%; box-shadow: 0 8px 24px #0c223940; }
.floating-whatsapp .icon { width: 25px; height: 25px; flex-basis: 25px; }
.mobile-actions { display: none; }
@media (max-width: 1030px) {
  .desktop-nav { gap: 13px; }
  .header-inner { gap: 16px; }
  .brand img { width: 173px; }
  .service-actions { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 890px) {
  .header-inner { min-height: 67px; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; }
  .desktop-nav { display: none; }
  .mobile-nav { display: block; }
  .mobile-nav summary { display: grid; place-items: center; width: 43px; height: 43px; border: 1px solid var(--line); border-radius: 8px; list-style: none; cursor: pointer; }
  .mobile-nav summary::-webkit-details-marker { display: none; }
  .mobile-nav summary:hover { background: var(--ice); }
  .mobile-links { position: absolute; inset: 100% 0 auto; display: grid; gap: 2px; padding: 10px max(16px, calc((100% - 1200px) / 2)) 13px; background: var(--white); border-bottom: 1px solid var(--line); box-shadow: var(--shadow); }
  .mobile-links a { min-height: 44px; display: flex; align-items: center; padding: 8px 12px; border-radius: 6px; }
  .mobile-links a[aria-current], .mobile-links a.is-parent, .mobile-links a:hover { color: var(--blue); background: var(--ice); }
  .service-grid, .photo-grid, .related--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-actions { flex-direction: row; align-items: center; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .shell { width: calc(100% - 36px); }
  body { padding-bottom: calc(61px + env(safe-area-inset-bottom, 0px)); }
  .hero-grid, .split, .cta-inner { grid-template-columns: minmax(0, 1fr); }
  .hero-grid { padding-block: 31px 35px; }
  .hero--home h1 { font-size: clamp(2.65rem, 8vw, 4rem); }
  .hero-figure img { aspect-ratio: 1.44; }
  .inspection-layout { grid-template-columns: minmax(0, 1fr); grid-template-areas: "intro" "figure" "checks"; }
  .context-item { min-height: 58px; padding: 8px; gap: 5px; font-size: .72rem; line-height: 1.32; }
  .context-item .icon { width: 15px; height: 15px; flex-basis: 15px; }
  .steps, .contact-methods { grid-template-columns: minmax(0, 1fr); }
  .step { grid-template-columns: auto minmax(0, 1fr); gap: 4px 10px; }
  .step::before { grid-row: span 2; }
  .related { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .floating-whatsapp { display: none; }
  .mobile-actions {
    display: grid;
    position: fixed;
    z-index: 30;
    inset: auto 0 0;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
    gap: 8px;
    padding: 7px calc(12px + env(safe-area-inset-right, 0px)) calc(7px + env(safe-area-inset-bottom, 0px)) calc(12px + env(safe-area-inset-left, 0px));
    background: var(--white);
    border-top: 1px solid var(--line);
    box-shadow: 0 -6px 20px #10253c15;
  }
  .mobile-actions a { min-height: 44px; }
}
@media (max-width: 435px) {
  .header-whatsapp { display: none; }
  .header-inner { grid-template-columns: minmax(0, 1fr) auto; }
  .service-card-body { padding: 11px; }
  .service-card h3 { font-size: 1rem; }
  .service-card p:not(.card-tag), .gallery-card p { font-size: .82rem; }
  .service-actions .button--small { padding: 7px 8px; font-size: .73rem; }
  .service-actions .text-link { font-size: .79rem; }
  .service-actions .icon { width: 15px; height: 15px; flex-basis: 15px; }
  .mobile-actions a { padding-inline: 10px; white-space: nowrap; }
  .enquiry-fields, .panels { grid-template-columns: minmax(0, 1fr); }
  .footer-grid { gap: 20px 14px; }
  .footer-group .brand img { width: min(100%, 161px); }
}
@media (max-width: 350px) {
  .service-grid, .photo-grid, .related { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}
.icon--wa, .icon--phone { display: inline-block; background: currentColor; mask: var(--icon-mask) center / contain no-repeat; }
.icon--wa { --icon-mask: url("whatsapp-icon.webp"); }
.icon--phone { --icon-mask: url("phone-icon.webp"); }
.aside-title { font-size: clamp(1.35rem, 2.6vw, 1.85rem); }
.process-link { margin-top: 18px; }
@media (min-width: 721px) {
  .hero--home .hero-grid { padding-block: clamp(40px, 4.7vw, 62px); }
  .hero--home + .context-bar + .section { padding-top: clamp(43px, 4.5vw, 62px); }
}

.case-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(14px, 2vw, 24px); }
.case-card { display: grid; align-content: start; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); box-shadow: var(--shadow); }
.case-card .gallery-image img { aspect-ratio: 1.85; }
.case-body { display: grid; gap: 11px; padding: clamp(15px, 2.7vw, 27px); color: var(--body); }
.case-body h3 { color: var(--ink); }
.case-note { display: grid; gap: 3px; padding: 11px 13px; border-left: 3px solid #74bace; border-radius: 0 6px 6px 0; background: var(--ice); font-size: .91rem; }
.case-note strong { color: var(--ink); }
.case-card:target, .enquiry-card:target { border-color: #6ea8bf; box-shadow: 0 0 0 3px #52a7c22f, var(--shadow); }
@media (max-width: 640px) {
  .case-grid { grid-template-columns: minmax(0, 1fr); }
  body[data-page-path="/contact-us/"] .hero-grid { padding-top: 22px; gap: 18px; }
}