@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Poppins:wght@400;500;600;700&display=swap");

:root {
  --font-heading: "Poppins", Arial, sans-serif;
  --font-body: "Inter", Arial, sans-serif;
  --letter-spacing: 0px;

  --h1-size: 65px;
  --h1-mobile-size: 48.75px;
  --h1-compact-mobile-size: 39px;
  --h1-weight: 700;
  --h1-letter-spacing: 0px;
  --heading-line-height: 1.1em;
  --large-heading-line-height: 0.95em;
  --h2-size: 55px;
  --h2-mobile-size: 41.25px;
  --h2-compact-mobile-size: 33px;
  --h2-weight: 700;
  --h2-letter-spacing: 0px;
  --h3-size: 35px;
  --h3-compact-mobile-size: 28px;
  --h3-weight: 600;
  --h3-letter-spacing: 0px;
  --h4-size: 28px;
  --h4-weight: 500;
  --h4-letter-spacing: 0px;
  --h5-size: 24px;
  --h5-weight: 500;
  --h5-letter-spacing: 0px;
  --h6-size: 13px;
  --h6-weight: 200;
  --h6-letter-spacing: 4px;
  --p-size: 18px;
  --p-weight: 300;
  --p-line-height: 1.4em;
  --p-letter-spacing: 0px;

  --container-default: 1500px;
  --container-large: 100%;
  --container-short: 1000px;
  --section-padding: 75px;
  --card-padding: 24px;
  --button-padding: 12px 24px;
  --button-size: 18px;
  --button-font-weight: 600;
  --button-text-transform: uppercase;
  --button-letter-spacing: 0px;
  --radius-tl: 6px;
  --radius-tr: 12px;
  --radius-br: 6px;
  --radius-bl: 12px;
  --button-radius-tl: 50px;
  --button-radius-tr: 50px;
  --button-radius-br: 50px;
  --button-radius-bl: 50px;
  --card-border-width: 0px;
  --card-border-color: transparent;
  --card-shadow: 0 7px 18px rgba(0, 0, 0, 0.11);
  --button-border-width: 0px;
  --button-border-color-main: currentColor;
  --button-border-hover-color-main: currentColor;
  --button-border-color-alt: currentColor;
  --button-border-hover-color-alt: currentColor;
  --button-border-color-footer: currentColor;
  --button-border-hover-color-footer: currentColor;
  --button-border-color-header: currentColor;
  --button-border-hover-color-header: currentColor;
  --button-shadow: 0 16px 38px rgba(0, 0, 0, 0.22);

  --header-bg: linear-gradient(135deg, #333333, #111111);
  --header-bg-glass: rgba(34, 34, 34, 0.9);
  --header-bg-grad-1: #333333;
  --header-bg-grad-2: #111111;
  --header-bg-grad-1-glass: rgba(51, 51, 51, 0.9);
  --header-bg-grad-2-glass: rgba(17, 17, 17, 0.9);
  --header-link: #ffffff;
  --header-link-hover: #f2b52b;
  --header-highlight: #f2b52b;
  --header-button-bg: #e53935;
  --header-button-hover: #c9211d;
  --header-button-text: #ffffff;
  --header-nav-font-weight: 500;
  --header-nav-font-size: 18px;
  --header-button-size: 18px;
  --header-button-font-weight: 500;
  --header-button-padding: 10px 24px;
  --header-button-letter-spacing: 0px;
  --header-height: 90px;

  --main-bg: linear-gradient(135deg, #ededed, #ffffff);
  --main-bg-solid: #ffffff;
  --main-bg-soft: rgba(255, 255, 255, 0.3);
  --main-bg-80: rgba(255, 255, 255, 0.8);
  --main-bg-lightbox: rgba(255, 255, 255, 0.88);
  --main-bg-grad-1: #ededed;
  --main-bg-grad-2: #ffffff;
  --main-heading-text: #111111;
  --main-paragraph-text: #545454;
  --main-link: #e84333;
  --main-link-hover: #e84333;
  --main-highlight: #f2b52b;
  --main-button-bg: #e84333;
  --main-button-hover: #c9211d;
  --main-button-text: #ffffff;

  --alt-bg: linear-gradient(135deg, #7c7c7c, #545454);
  --alt-bg-solid: #7c7c7c;
  --alt-bg-soft: rgba(124, 124, 124, 0.3);
  --alt-bg-80: rgba(124, 124, 124, 0.8);
  --alt-bg-lightbox: rgba(124, 124, 124, 0.88);
  --alt-bg-grad-1: #7c7c7c;
  --alt-bg-grad-2: #545454;
  --alt-heading-text: #ffffff;
  --alt-paragraph-text: #ffffff;
  --alt-link: #f2b52a;
  --alt-link-hover: #f1a82c;
  --alt-highlight: #e84133;
  --alt-button-bg: #f2b52b;
  --alt-button-hover: #f1a82c;
  --alt-button-text: #111111;

  --footer-bg: linear-gradient(135deg, #222222, #111111);
  --footer-bg-solid: #111111;
  --footer-bg-soft: rgba(17, 17, 17, 0.3);
  --footer-bg-80: rgba(17, 17, 17, 0.8);
  --footer-bg-lightbox: rgba(17, 17, 17, 0.88);
  --footer-bg-grad-1: #222222;
  --footer-bg-grad-2: #111111;
  --footer-heading-text: #ffffff;
  --footer-paragraph-text: #bbbbbb;
  --footer-link: #ffffff;
  --footer-link-hover: #dddddd;
  --footer-highlight: #f2b52b;
  --footer-button-bg: #e74133;
  --footer-button-hover: #c9211d;
  --footer-button-text: #ffffff;

  --input-bg: #ffffff;
  --input-text: #111111;
  --input-border: #dddddd;
  --input-focus-border: #fdc045;
  --input-radius: 6px;
  --label-colour: #111111;
  --placeholder-colour: #777777;
}

/* The JSON contains no image assignments. These restrained fills occupy the
   same card media area without pretending to be client-supplied photography. */
.mock-media-1 { background-image: linear-gradient(145deg, #2f2929, #9c6664); }
.mock-media-2 { background-image: linear-gradient(145deg, #4b403e, #77706b); }
.mock-media-3 { background-image: linear-gradient(145deg, #222, #6f4644); }
.mock-media-4 { background-image: linear-gradient(145deg, #4f4741, #a88978); }
.mock-media-5 { background-image: linear-gradient(145deg, #272727, #8a7470); }
.mock-media-6 { background-image: linear-gradient(145deg, #514846, #737373); }

.mock-form-status {
  min-height: 1.4em;
  margin: 14px 0 0;
  font-size: 0.9rem;
  font-weight: 600;
}

.mock-form-status.is-success { color: var(--footer-highlight); }
.mock-form-status.is-error { color: #b42318; }
.mock-static-form button:disabled { cursor: wait; opacity: 0.65; }

.mock-static-form .form-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.mock-static-form label {
  display: grid;
  gap: 8px;
  margin-bottom: 16px;
  font-size: 0.86rem;
  font-weight: 600;
}

.mock-static-form .mock-form-honeypot {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.mock-static-form textarea { min-height: 150px; resize: vertical; }
.mock-static-form .button { cursor: pointer; }

.about-layout:not(:has(.about-image-wrap)) {
  grid-template-columns: minmax(0, 760px);
}

.about-layout:not(:has(.about-image-wrap)) .about-content { order: initial; }

.static-media-note {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 22px;
  font-size: 0.75rem;
  opacity: 0.66;
}

.static-media-note i { margin: 0; }

.static-section-intro {
  max-width: 760px;
  margin-top: 18px;
}

.static-section-intro > *:first-child { margin-top: 0; }
.static-section-intro > *:last-child { margin-bottom: 0; }
.static-section-action { margin-top: 24px; }

/* Portal preview intro pattern, retained inside the WordPress section shells. */
.portal-section-heading {
  display: grid;
  gap: 18px;
  width: 100%;
}

.portal-section-heading-copy {
  display: grid;
  gap: 12px;
  max-width: 860px;
}

.portal-section-heading-copy > * { margin-top: 0; margin-bottom: 0; }
.portal-section-supporting { max-width: 720px; }
.portal-section-supporting > *:first-child { margin-top: 0; }
.portal-section-supporting > *:last-child { margin-bottom: 0; }
.portal-section-heading-action { display: flex; align-items: center; }

.section.dm-align-left .portal-section-heading {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.section.dm-align-left .portal-section-heading-copy { grid-column: 1; }
.section.dm-align-left .portal-section-heading-action {
  grid-column: 2;
  grid-row: 1;
  justify-content: flex-end;
}

.section.dm-align-centre .portal-section-heading {
  justify-items: center;
  text-align: center;
}

.section.dm-align-centre .portal-section-heading-copy { justify-items: center; }
.section.dm-align-centre .portal-section-supporting { margin-right: auto; margin-left: auto; }
.section.dm-align-centre .portal-section-heading-action { justify-content: center; }

.brand-story-section.dm-align-left .brand-story-header,
.brand-values-section.dm-align-left .brand-values-header { max-width: none; }

.service-grid-heading-centre .static-section-intro,
.service-grid-heading-centre .static-section-action,
.project-grid-section.dm-align-centre .static-section-intro,
.project-grid-section.dm-align-centre .static-section-action,
.sector-grid-heading-centre .static-section-action {
  margin-left: auto;
  margin-right: auto;
}

.static-placeholder-media {
  background-size: cover;
  background-position: center;
}

.static-site-page h1,
.archive-grid-page h1 { margin-bottom: 22px; }

.static-page-hero {
  min-height: min(620px, calc(100vh - var(--header-height)));
  display: flex;
  align-items: center;
}

.static-page-hero-copy {
  max-width: 900px;
  display: grid;
  justify-items: start;
  gap: 20px;
}

.static-page-hero-copy > * { margin: 0; }
.static-page-hero-copy p { max-width: 760px; }
.static-location { display: flex; align-items: center; gap: 10px; }

.static-section-heading {
  max-width: 860px;
  margin-bottom: clamp(32px, 5vw, 64px);
}

.static-section-heading > *:first-child { margin-top: 0; }
.static-section-heading > *:last-child { margin-bottom: 0; }

.static-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.static-copy-card {
  padding: clamp(24px, 3vw, 40px);
  border-radius: var(--radius-tl) var(--radius-tr) var(--radius-br) var(--radius-bl);
  border: var(--card-border-width) solid var(--card-border-color);
  background: color-mix(in srgb, currentColor 5%, transparent);
  box-shadow: var(--card-shadow);
}

.static-copy-card h3 { margin-top: 14px; }
.static-copy-card p:last-child { margin-bottom: 0; }

.archive-flat-grid .service-card,
.archive-flat-grid .project-marquee-item { min-height: 330px; }

.archive-grid-page .service-title,
.archive-grid-page .project-title,
.archive-grid-page .sector-grid-title { max-width: 900px; }

.archive-projects-page .project-grid-section.dm-align-centre .project-title {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}

.static-project-body {
  max-width: 850px;
  margin: 0 auto;
  font-size: 1.08em;
}

.static-project-body p + p { margin-top: 1.2em; }

.static-bottom-cta .static-cta-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 32px;
  padding: clamp(28px, 4vw, 54px);
  border-radius: var(--radius-tl) var(--radius-tr) var(--radius-br) var(--radius-bl);
  background: color-mix(in srgb, currentColor 7%, transparent);
}

.static-cta-box > div { max-width: 780px; }
.static-cta-box h2 { margin-top: 0; }
.static-cta-box p { margin-bottom: 0; }

.single-service-page .service-more-header,
.single-project-page .project-title { margin-bottom: 40px; }

.contact-page-section { min-height: calc(100vh - var(--header-height)); }
.contact-page-form .contact-form-panel-inner { width: 100%; }

.site-nav a[aria-current="page"] { color: var(--header-link-hover); }

@media (max-width: 900px) {
  .static-card-grid { grid-template-columns: 1fr 1fr; }
  .static-bottom-cta .static-cta-box { align-items: flex-start; flex-direction: column; }

  /* The theme's .has-no-image rule has greater specificity than its mobile
     stack rule. Keep JSON highlights usable when no media has been supplied. */
  .service-highlight-card.has-no-image,
  .service-highlight-card.has-no-image.is-reversed { grid-template-columns: 1fr; }
}

/* The theme's responsive project rules are less specific than items-N. */
@media (max-width: 1100px) {
  .project-static-grid[class*="items-"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .project-static-grid[class*="items-"] {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .section.dm-align-left .portal-section-heading { grid-template-columns: 1fr; }
  .section.dm-align-left .portal-section-heading-action {
    grid-column: 1;
    grid-row: auto;
    justify-content: flex-start;
  }

  .mock-static-form .form-row { grid-template-columns: 1fr; gap: 0; }
  .static-card-grid { grid-template-columns: 1fr; }
  .static-page-hero { min-height: 520px; }
  .archive-flat-grid .service-card,
  .archive-flat-grid .project-marquee-item { min-height: 280px; }
}