.contact-page { background: var(--mist); }
.contact-page .site-header.scrolled { background: #ffffffef; }
.contact-page a[aria-current="page"] { text-decoration: underline; text-underline-offset: 6px; }
.form-section::before, .opportunities-section::before { content: ""; position: absolute; inset: 0; opacity: .18; pointer-events: none; background-image: linear-gradient(#4bd4ee22 1px, transparent 1px), linear-gradient(90deg, #4bd4ee22 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(90deg, #000, transparent 90%); }
.contact-section { position: relative; padding: clamp(85px, 10vw, 140px) 0; }.intro-section, .categories-section, .direct-section, .next-section, .faq-section { background: #fff; }.intro-grid, .form-grid, .faq-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(45px, 8vw, 115px); align-items: start; }.intro-grid p, .form-intro p, .faq-list p { color: var(--muted); }.intro-grid .lead { color: var(--ink); }.context-points { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 62px; }.context-points article { padding: 25px; border-top: 2px solid var(--blue-500); background: var(--mist); }.context-points span, .category-grid span, .next-steps > article > span { color: var(--blue-500); font: .7rem Consolas, monospace; }.context-points h3 { margin: 25px 0 10px; font-size: 1.15rem; }.context-points p { margin: 0; color: var(--muted); font-size: .82rem; }
.contact-heading { display: block; margin-bottom: 50px; }.contact-heading h2 { max-width: 720px; }.category-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }.category-grid button { position: relative; min-height: 220px; padding: 25px; border: 0; text-align: left; background: #fff; color: var(--ink); cursor: pointer; transition: background .2s, transform .2s; }.category-grid button:hover, .category-grid button:focus-visible { z-index: 1; background: #eaf5f7; transform: translateY(-3px); }.category-grid strong { display: block; margin-top: 25px; padding-right: 20px; font-size: 1.05rem; }.category-grid small { display: block; margin-top: 11px; color: var(--muted); font-size: .78rem; line-height: 1.55; }.category-grid b { position: absolute; right: 22px; top: 24px; color: var(--blue-500); font-weight: 400; }
.form-section { color: #fff; overflow: hidden; background: var(--navy-950); }.form-section > * { position: relative; z-index: 1; }.form-intro h2 { max-width: 540px; }.form-intro > p:not(.eyebrow) { max-width: 530px; color: #ffffffa0; }.form-note { margin-top: 38px; padding: 20px; border-left: 2px solid var(--cyan-400); color: var(--cyan-200) !important; font-size: .82rem; }.contact-form-page { padding: 35px; border: 1px solid #ffffff20; background: #ffffff0b; backdrop-filter: blur(14px); }.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }.contact-form-page label, .contact-form-page legend { display: block; margin-bottom: 20px; color: #ffffffb3; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; }.contact-form-page label > span, .consent b { color: var(--cyan-400); }.contact-form-page input:not([type="radio"]):not([type="checkbox"]), .contact-form-page select, .contact-form-page textarea { width: 100%; margin-top: 8px; padding: 13px 0; border: 0; border-bottom: 1px solid #ffffff35; outline: 0; color: #fff; background: transparent; font-size: .92rem; letter-spacing: 0; text-transform: none; resize: vertical; }.contact-form-page select { color-scheme: dark; }.contact-form-page option { color: var(--ink); }.contact-form-page input::placeholder, .contact-form-page textarea::placeholder { color: #ffffff63; }.contact-form-page input:focus, .contact-form-page select:focus, .contact-form-page textarea:focus { border-color: var(--cyan-400); }.contact-form-page [aria-invalid="true"] { border-color: #ff9a9a !important; }.field-error { display: block; min-height: 17px; margin-top: 5px; color: #ffb1b1; font-size: .7rem; text-transform: none; letter-spacing: 0; }.contact-form-page fieldset { margin: 0 0 19px; padding: 0; border: 0; }.radio-group { display: flex; flex-wrap: wrap; gap: 12px 24px; }.radio-group label { display: flex; align-items: center; gap: 8px; margin: 0; text-transform: none; letter-spacing: 0; }.radio-group input, .consent input { width: 18px; height: 18px; accent-color: var(--cyan-400); }.consent { display: flex !important; align-items: flex-start; gap: 10px; text-transform: none !important; letter-spacing: 0 !important; }.consent input { flex: 0 0 auto; margin-top: 1px; }.form-submit { width: 100%; margin-top: 4px; }.form-submit .submit-loading { display: none; }.form-submit.is-loading .submit-loading { display: inline; }.form-submit.is-loading > span:first-child { display: none; }.form-submit:disabled { cursor: wait; opacity: .65; }.form-footnote { margin: 15px 0 0; color: #ffffff70; font-size: .7rem; text-align: center; }.form-alert { min-height: 25px; margin-bottom: 8px; color: var(--cyan-200); font-size: .82rem; }.form-alert.error { color: #ffb1b1; }.form-alert.success { color: var(--cyan-200); }.honeypot { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden; clip: rect(0,0,0,0); }
.direct-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }.configured-contact { padding: 27px; border-top: 2px solid var(--blue-500); background: var(--mist); }.direct-icon { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--blue-500); border-radius: 50%; color: var(--blue-500); }.configured-contact h3 { margin: 25px 0 9px; }.configured-contact p { min-height: 48px; margin: 0 0 15px; color: var(--muted); font-size: .8rem; }.configured-contact a, .configured-contact [data-location-value] { color: var(--navy-700); font-size: .78rem; font-weight: 700; word-break: break-word; }.direct-empty { margin: 24px 0 0; color: var(--muted); font-size: .8rem; }
.next-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 25px; }.next-steps article { border-top: 1px solid var(--blue-500); padding-top: 20px; }.next-steps h3 { margin: 23px 0 10px; font-size: 1.1rem; }.next-steps p { color: var(--muted); font-size: .82rem; }.legal-note { margin: 55px 0 0; padding-top: 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: .78rem; }
.opportunities-section { color: #fff; overflow: hidden; background: var(--navy-900); }.opportunities-section > .section-shell { position: relative; z-index: 1; }.opportunities-section h2 { max-width: 780px; }.opportunity-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 50px; margin-top: 47px; border-top: 1px solid #ffffff2d; }.opportunity-list span { padding: 15px 0; border-bottom: 1px solid #ffffff2d; color: var(--cyan-200); font-size: .82rem; }.opportunity-note { margin-top: 35px; color: #ffffff77; font-size: .78rem; }
.faq-grid { grid-template-columns: .75fr 1.25fr; }.faq-list details { border-top: 1px solid var(--line); }.faq-list details:last-child { border-bottom: 1px solid var(--line); }.faq-list summary { display: flex; justify-content: space-between; gap: 20px; padding: 22px 0; cursor: pointer; color: var(--ink); font-weight: 700; list-style: none; }.faq-list summary::-webkit-details-marker { display: none; }.faq-list summary span { color: var(--blue-500); font: 1.2rem Consolas, monospace; }.faq-list details[open] summary span { transform: rotate(45deg); }.faq-list details p { max-width: 760px; margin: 0 35px 23px 0; font-size: .86rem; }
.contact-cta { padding: 105px 0; color: #fff; background: radial-gradient(circle at 78% 35%, #0e4666, transparent 39%), var(--navy-950); }.contact-cta h2 { max-width: 750px; }.contact-cta > .section-shell > p:not(.eyebrow) { max-width: 620px; color: #ffffffa4; }
@media (max-width: 900px) { .contact-hero-grid, .intro-grid, .form-grid, .faq-grid { grid-template-columns: 1fr; gap: 45px; }.contact-hero-grid { min-height: auto; }.contact-hero-visual { min-height: 410px; }.context-points, .direct-grid, .next-steps { grid-template-columns: 1fr 1fr; }.category-grid { grid-template-columns: 1fr 1fr; }.category-grid button:last-child { grid-column: 1 / -1; }.opportunity-list { gap: 0 25px; } }
@media (max-width: 640px) { .contact-hero-grid { padding-top: 110px; padding-bottom: 65px; }.contact-hero h1 { font-size: clamp(2.65rem, 12vw, 4rem); }.contact-hero-visual { min-height: 330px; }.contact-core { width: 140px; height: 140px; }.contact-status { right: 0; bottom: 0; font-size: .62rem; }.contact-section { padding: 72px 0; }.context-points, .category-grid, .direct-grid, .next-steps, .opportunity-list { grid-template-columns: 1fr; }.category-grid button:last-child { grid-column: auto; }.contact-form-page { padding: 23px 18px; }.form-row { grid-template-columns: 1fr; gap: 0; }.radio-group { display: grid; gap: 13px; }.opportunity-list { gap: 0; }.contact-cta { padding: 78px 0; }.contact-cta .hero-actions { flex-direction: column; align-items: stretch; } }
@media (prefers-reduced-motion: reduce) { .contact-page .contact-orbit { animation: none; } }

/* Keep the enquiry form aligned with the compact homepage form. */
.contact-form-page { padding: 38px; border-radius: 0; }
.contact-form-page .form-row { gap: 17px; }
.contact-form-page label, .contact-form-page legend { margin-bottom: 17px; font-size: .69rem; font-weight: 700; }
.contact-form-page input:not([type="radio"]):not([type="checkbox"]), .contact-form-page select, .contact-form-page textarea { margin-top: 7px; padding: 14px 15px; border: 1px solid #ffffff2e; border-radius: 0; background: #ffffff0d; font-size: .92rem; }
.contact-form-page input:not([type="radio"]):not([type="checkbox"]), .contact-form-page select { height: 52px; }
.contact-form-page textarea { min-height: 130px; }
.contact-form-page input:focus, .contact-form-page select:focus, .contact-form-page textarea:focus { background: #ffffff14; }
@media (max-width: 640px) { .contact-form-page { padding: 24px 19px; } }

/* The Contact page uses the same compact enquiry form as the homepage. */
.contact-form { padding: clamp(27px, 4vw, 52px); border: 1px solid #ffffff26; background: #ffffff0e; box-shadow: 0 35px 90px #0004; backdrop-filter: blur(12px); }
.contact-form .form-heading { display: flex; justify-content: space-between; gap: 15px; padding-bottom: 25px; margin-bottom: 28px; border-bottom: 1px solid #ffffff26; }
.contact-form .form-heading span { font-size: 1.07rem; font-weight: 700; }
.contact-form .form-heading small { color: #ffffff80; }
.contact-form .form-row { gap: 17px; }
.contact-form label { display: block; margin-bottom: 17px; color: #ffffffbd; font-size: .78rem; font-weight: 700; }
.contact-form input, .contact-form select, .contact-form textarea { display: block; width: 100%; margin-top: 7px; padding: 14px 15px; border: 1px solid #ffffff2e; border-radius: 0; outline: 0; background: #ffffff0d; color: #fff; font-size: .94rem; font-weight: 400; transition: border-color .2s, background .2s; }
.contact-form input, .contact-form select { height: 52px; }
.contact-form select { color: #ffffffb3; color-scheme: dark; }
.contact-form option { color: var(--ink); background: #fff; }
.contact-form textarea { min-height: 130px; resize: vertical; }
.contact-form input::placeholder, .contact-form textarea::placeholder { color: #ffffff77; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { border-color: var(--cyan-400); background: #ffffff14; }
.contact-form [aria-invalid="true"] { border-color: #ff9a91; }
.contact-form .field-error { display: none; min-height: 0; margin-top: 4px; color: #ffaaa3; font-size: .72rem; font-weight: 500; }
.contact-form [aria-invalid="true"] + .field-error { display: block; }
.contact-form .form-footer { display: flex; align-items: center; gap: 22px; margin-top: 8px; }
.contact-form .form-footer p { max-width: 260px; margin: 0; color: #ffffff94; font-size: .72rem; line-height: 1.55; }
.contact-form .form-status { display: none; margin-top: 19px; padding: 13px 15px; border: 1px solid #ffffff26; font-size: .78rem; line-height: 1.65; }
.contact-form .form-status.visible { display: block; }
.contact-form .form-status.error { border-color: #ff9a917a; color: #ffc0bb; }
.contact-form .form-status.info { border-color: #4bd4ee66; color: var(--cyan-200); }
.contact-form .form-status.success { border-color: #7edca273; color: #92e6b3; }
@media (max-width: 640px) {
  .contact-form { padding: 24px 19px; }
  .contact-form .form-heading, .contact-form .form-footer { display: block; }
  .contact-form .form-heading small { display: block; margin-top: 4px; }
  .contact-form .form-footer p { margin-top: 13px; }
}


/* =========================================================
   CONTACT INTRO SPACING REFINEMENT V17
   Only the red-marked gaps from the first intro section
   ========================================================= */

/* Reduce eyebrow -> heading gap */
.contact-page .intro-section .intro-grid > div:first-child .eyebrow{
  margin-bottom:10px;
}
.contact-page .intro-section .intro-grid > div:first-child h2{
  margin-top:0;
}

/* Reduce vertical gaps between the right-column paragraphs */
.contact-page .intro-section .intro-grid > div:last-child p{
  margin-top:0;
  margin-bottom:12px;
}
.contact-page .intro-section .intro-grid > div:last-child p:last-child{
  margin-bottom:0;
}

/* Reduce number -> title gap inside the three cards */
.contact-page .intro-section .context-points article > span{
  margin-bottom:10px;
}
.contact-page .intro-section .context-points article h3{
  margin-top:0;
}


/* Direct email shown to visitors - outside the contact form */
.contact-page .contact-direct-email{
  margin-top:16px!important;
  margin-bottom:0!important;
  color:var(--ink)!important;
}
.contact-page .contact-direct-email strong{
  font-weight:700;
}
.contact-page .contact-direct-email a{
  color:var(--blue-500);
  font-weight:600;
  text-decoration:none;
}
.contact-page .contact-direct-email a:hover{
  text-decoration:underline;
  text-underline-offset:4px;
}