:root {
  color-scheme: dark;
  --ink: #07151f;
  --surface: #102633;
  --surface-soft: #173544;
  --paper: #f4f1e8;
  --muted: #b4c4ca;
  --accent: #f2b84b;
  --accent-deep: #d79a2c;
  --line: #31505e;
  --max: 74rem;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ink); color: var(--paper); font-family: Inter, ui-sans-serif, system-ui, sans-serif; line-height: 1.6; }
h1, h2, h3, p, a { overflow-wrap: break-word; }
a { color: inherit; }
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 var(--accent); outline-offset: 3px; }
.skip-link { position: fixed; top: .5rem; left: .5rem; z-index: 20; transform: translateY(-150%); background: var(--accent); color: #071018; padding: .7rem 1rem; font-weight: 800; }
.skip-link:focus { transform: translateY(0); }
.site-header, footer, .hero, .service-area, .content-section, .page-heading, .legal-section, .contact-options, .enquiry-section, .prose, .faq-list, .callout { width: min(100%, var(--max)); margin-inline: auto; padding-inline: 2rem; }
.site-header { min-height: 5rem; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; border-bottom: 1px solid var(--line); }
.brand { font: 400 1.3rem Georgia, serif; letter-spacing: .02em; text-decoration: none; }
nav { display: flex; align-items: center; gap: 1.4rem; }
nav a, .footer-links a, .text-link { color: var(--muted); text-underline-offset: .25rem; }
.header-action, .button { min-height: 2.9rem; display: inline-flex; align-items: center; justify-content: center; border: 0; background: var(--accent); color: #071018; padding: .7rem 1rem; text-decoration: none; font-weight: 800; cursor: pointer; }
.header-action:hover, .button:hover { background: var(--accent-deep); }
.hero { min-height: 39rem; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(17rem, .6fr); align-items: center; gap: 4rem; background: radial-gradient(circle at 78% 25%, #1a4b5e 0, transparent 30%); }
.eyebrow { margin: 0 0 .8rem; color: var(--accent); font-size: .76rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.hero h1, .page-heading h1 { max-width: 54rem; margin: 0 0 1.5rem; font: 400 clamp(3rem, 7vw, 6.5rem)/.94 Georgia, serif; letter-spacing: -.04em; }
.hero > div > p:not(.eyebrow), .page-heading > p:not(.eyebrow) { max-width: 43rem; color: var(--muted); font-size: 1.14rem; }
.hero-actions { margin-top: 2rem; display: flex; align-items: center; flex-wrap: wrap; gap: 1.25rem; }
.contact-card { padding: 2rem; border: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 88%, transparent); }
.contact-card p:last-child { color: var(--muted); }
.contact-number { display: inline-block; font: 400 clamp(1.8rem, 4vw, 2.7rem) Georgia, serif; color: var(--paper); text-decoration-color: var(--accent); text-underline-offset: .35rem; }
.service-area { padding-top: 1.2rem; padding-bottom: 1.2rem; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--muted); }
.content-section { padding-top: 6rem; padding-bottom: 6rem; }
.section-heading { max-width: 48rem; margin-bottom: 2.5rem; }
.section-heading h2, .callout h2 { margin: 0; font: 400 clamp(2.2rem, 5vw, 4.2rem)/1 Georgia, serif; letter-spacing: -.025em; }
.section-heading > p:last-child { color: var(--muted); }
.steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.steps li { min-width: 0; display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; padding: 1.5rem; background: var(--surface); border-top: 2px solid var(--accent); }
.steps li > span { color: var(--accent); font: 400 1.4rem Georgia, serif; }
.steps h2, .steps h3 { margin: 0 0 .5rem; font: 400 1.5rem Georgia, serif; }
.steps p { margin: 0; color: var(--muted); }
.steps.expanded { grid-template-columns: 1fr; }
.steps.expanded li { grid-template-columns: 4rem 1fr; padding: 2rem; }
.callout { margin-top: 2rem; margin-bottom: 6rem; padding-top: 3rem; padding-bottom: 3rem; display: flex; align-items: end; justify-content: space-between; gap: 2rem; background: var(--surface-soft); border-left: 4px solid var(--accent); }
.callout h2 { max-width: 45rem; }
.callout .button { flex: 0 0 auto; }
.page-heading { padding-top: 6rem; padding-bottom: 4rem; }
.page-heading h1 { font-size: clamp(3rem, 7vw, 5.7rem); }
.legal-section { padding-top: 4rem; padding-bottom: 4rem; background: var(--surface); }
.legal-statement { max-width: 62rem; margin: 0; font: 400 clamp(1.55rem, 3vw, 2.5rem)/1.35 Georgia, serif; }
.two-column { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; }
.two-column h2, .prose h2 { font: 400 1.75rem Georgia, serif; }
.two-column p, .prose p { color: var(--muted); }
.contact-options { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; padding-bottom: 5rem; }
.contact-options article { padding: 2rem; background: var(--surface); border-top: 2px solid var(--accent); overflow-wrap: anywhere; }
.contact-email { color: var(--paper); font: 400 clamp(1.15rem, 2.5vw, 1.8rem) Georgia, serif; text-underline-offset: .35rem; }
.enquiry-section { padding-top: 5rem; padding-bottom: 6rem; border-top: 1px solid var(--line); }
.enquiry-form { max-width: 56rem; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.form-grid label { display: grid; gap: .4rem; }
.form-grid input, .form-grid select, .form-grid textarea { width: 100%; min-width: 0; padding: .8rem; border: 1px solid var(--line); border-radius: 0; background: var(--surface); color: var(--paper); }
.form-grid textarea { min-height: 9rem; resize: vertical; }
.form-grid .full-width { grid-column: 1 / -1; }
.form-grid .consent { display: flex; align-items: flex-start; gap: .8rem; color: var(--muted); }
.form-grid .consent input { flex: 0 0 auto; width: 1.25rem; height: 1.25rem; margin-top: .15rem; accent-color: var(--accent); }
.trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.form-note { color: var(--muted); }
.faq-list { padding-bottom: 6rem; }
.faq-list details { border-top: 1px solid var(--line); padding: 1.25rem 0; }
.faq-list summary { cursor: pointer; font: 400 1.35rem Georgia, serif; }
.faq-list p { max-width: 48rem; color: var(--muted); }
.prose { max-width: 58rem; padding-bottom: 6rem; }
.prose h2 { margin-top: 2.5rem; color: var(--paper); }
.prose a { color: var(--accent); overflow-wrap: anywhere; }
footer { min-height: 11rem; display: flex; align-items: start; justify-content: space-between; gap: 2rem; padding-top: 2rem; padding-bottom: 2rem; border-top: 1px solid var(--line); color: var(--muted); }
footer p { max-width: 40rem; }
.footer-links { display: grid; justify-items: end; gap: .65rem; }

@media (max-width: 760px) {
  .site-header, footer, .hero, .service-area, .content-section, .page-heading, .legal-section, .contact-options, .enquiry-section, .prose, .faq-list, .callout { padding-inline: 1rem; }
  .site-header { display: grid; grid-template-columns: minmax(0, 1fr); padding-top: 1rem; padding-bottom: 1rem; }
  .site-header .brand { max-width: none; }
  .header-action { width: 100%; font-size: .9rem; }
  nav { width: 100%; overflow-x: auto; gap: 1.1rem; border-top: 1px solid var(--line); }
  nav a { min-height: 2.8rem; display: inline-flex; flex: 0 0 auto; align-items: center; }
  .hero { min-height: auto; grid-template-columns: 1fr; gap: 2.5rem; padding-top: 4rem; padding-bottom: 4rem; }
  .hero h1, .page-heading h1 { font-size: clamp(2.35rem, 12vw, 3.4rem); overflow-wrap: anywhere; }
  .steps, .two-column, .contact-options, .form-grid { grid-template-columns: 1fr; }
  .contact-options article { min-width: 0; padding: 1.4rem; }
  .contact-number { max-width: 100%; font-size: clamp(1.35rem, 7.5vw, 2.05rem); overflow-wrap: anywhere; }
  .contact-email { font-size: clamp(1rem, 5vw, 1.5rem); overflow-wrap: anywhere; }
  .form-grid .full-width { grid-column: auto; }
  .callout { align-items: start; flex-direction: column; }
  .callout .button { width: 100%; }
  footer { flex-direction: column; }
  .footer-links { justify-items: start; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}