:root {
  color-scheme: light;
  --blue: #669ab2;
  --pale-blue: #ccdde5;
  --ink: #404040;
  --section-space: clamp(4.5rem, 4.58891vw + 3.582218rem, 7.5rem);
  --gutter: clamp(1.25rem, 1.529637vw + .944073rem, 2.25rem);
  --content-gap: clamp(1.5rem, .573614vw + 1.385277rem, 1.875rem);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: white; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: clamp(1rem, .191205vw + .96176rem, 1.125rem); line-height: 1.4; }
h1, h2, p { margin: 0; }
h1, h2 { color: var(--blue); font-family: Georgia, "Times New Roman", serif; font-weight: 400; line-height: 1.2; }
h1 { font-size: clamp(1.728rem, 3.809943vw + .966011rem, 4.21875rem); }
h2 { font-size: clamp(1.44rem, 2.099426vw + 1.020115rem, 2.8125rem); overflow-wrap: anywhere; }
a { color: #38647a; text-underline-offset: .2em; }
a:hover { color: #234354; }
a:focus-visible, iframe:focus-visible { outline: 3px solid #234354; outline-offset: 5px; }
.hero { background: var(--pale-blue); padding: var(--section-space) var(--gutter); display: flex; flex-direction: column; align-items: center; gap: clamp(2.6653335rem, 2.376163vw + 2.190101rem, 4.21875rem); }
.intro { display: flex; flex-direction: column; align-items: center; gap: var(--content-gap); text-align: center; width: 100%; }
.eyebrow { color: rgb(43 71 85 / 60%); font-size: clamp(.6875rem, .095603vw + .668379rem, .75rem); font-weight: 700; letter-spacing: .2em; text-transform: uppercase; line-height: 1.1; }
.lede { max-width: 60ch; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: .8em; padding: .75em 1.8em; background: var(--blue); border: 1px solid transparent; border-radius: 4px; color: white; font-size: .75em; text-decoration: none; }
.button:hover { background: #477a93; color: white; }
.button svg { width: 1em; height: 1em; fill: currentColor; }
.laptop { display: block; width: 800px; max-width: 100%; height: auto; }
.contact { padding: var(--section-space) var(--gutter); display: flex; flex-direction: column; align-items: center; gap: clamp(1.9995rem, 1.243595vw + 1.750781rem, 2.8125rem); }
.contact-intro { width: 100%; max-width: 850px; text-align: center; display: grid; gap: .833333rem; }
.enquiry-form { display: block; width: 100%; max-width: 600px; height: 600px; border: 0; background: white; }
footer { padding: 1.25rem var(--gutter); display: flex; justify-content: center; flex-wrap: wrap; gap: .65rem var(--content-gap); font-size: clamp(.75rem, .095603vw + .730879rem, .8125rem); }
.skip-link { position: fixed; left: 1rem; top: 1rem; z-index: 10; padding: .8rem 1rem; background: white; transform: translateY(-200%); }
.skip-link:focus { transform: translateY(0); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.error-page { min-height: 100svh; display: flex; flex-direction: column; background: var(--pale-blue); }
.error-page main { flex: 1; display: grid; place-items: center; padding: var(--section-space) var(--gutter); }
.error-page .intro { max-width: 650px; }
@media (max-width: 767px) {
  .hero .intro { text-align: left; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}