/* ============================================================
   Carthage Risk Consulting: faithful build of the supplied design
   ============================================================ */
:root {
  --text-xs: clamp(0.6875rem, 0.65rem + 0.15vw, 0.75rem);
  --text-sm: clamp(0.8125rem, 0.78rem + 0.15vw, 0.875rem);
  --text-base: clamp(0.9375rem, 0.9rem + 0.2vw, 1rem);
  --text-lg: clamp(1.0625rem, 0.95rem + 0.45vw, 1.3125rem);
  --text-xl: clamp(1.375rem, 1.1rem + 0.9vw, 1.875rem);
  --text-3xl: clamp(2.25rem, 1.1rem + 3.4vw, 4.25rem);

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;

  --radius-sm: 2px;

  --font-display: 'Cormorant Garamond', 'Iowan Old Style', Georgia, serif;
  --font-body: 'Switzer', 'Inter', system-ui, sans-serif;

  --shell: 1360px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);

  --color-bg: #0f1e33;
  --color-panel: #142842;
  --color-border: #1e2a42;
  --color-border-strong: #33456a;

  --color-text: #edf0f6;
  --color-text-muted: #9daabf;
  --color-text-faint: #6c7a91;

  --color-accent: #d5a53c;
  --color-accent-soft: #e6c479;

  --color-card: #f5f2ec;
  --color-card-text: #141c2c;
  --color-card-muted: #4b5464;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 130px;
  -webkit-text-size-adjust: 100%;
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

body {
  margin: 0;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

body,
body * {
  -webkit-user-select: none;
  user-select: none;
}

img {
  -webkit-user-drag: none;
  user-drag: none;
}

img {
  display: block;
  max-width: 100%;
}
a {
  color: inherit;
  text-decoration: none;
}
h1,
h2,
h3,
h4 {
  margin: 0;
  font-weight: 500;
  line-height: 1.15;
}
p {
  margin: 0;
}
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 3px;
}

section[id],
article[id] {
  scroll-margin-top: 130px;
}

.shell {
  width: 100%;
  max-width: var(--shell);
  margin-inline: auto;
  padding-inline: clamp(var(--space-4), 3vw, var(--space-10));
}

.skip-link {
  position: fixed;
  left: var(--space-4);
  top: -4rem;
  z-index: 200;
  padding: var(--space-2) var(--space-4);
  background: var(--color-accent);
  color: #0b1020;
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border: 1px solid var(--color-accent);
  box-shadow: 0 10px 30px rgba(4, 8, 17, 0.45);
  transition: top 0.2s var(--ease);
}
.skip-link:focus,
.skip-link:focus-visible {
  top: var(--space-4);
  outline: 2px solid #0b1020;
  outline-offset: 2px;
}

.display {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}

.rule {
  width: 58px;
  height: 2px;
  background: transparent;
  border: 0;
  margin: 0;
}
.rule--short {
  width: 42px;
  height: 1px;
}

/* ============================ HEADER ============================ */
.header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 60;
  border-bottom: 1px solid transparent;
  transition:
    background 0.4s var(--ease),
    border-color 0.4s var(--ease);
}

.header.is-stuck {
  background: rgba(15, 30, 51, 0.92);
  backdrop-filter: blur(14px);
  border-bottom-color: var(--color-border);
}

.header__inner {
  display: flex;
  align-items: center;
  gap: var(--space-6);
  min-height: 116px;
}

.brand {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  flex-shrink: 0;
}

.brand__mark {
  width: 38px;
  height: 44px;
  color: var(--color-accent);
  flex-shrink: 0;
}

.brand__name {
  font-family: var(--font-display);
  font-size: clamp(1.15rem, 0.95rem + 0.7vw, 1.6rem);
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  line-height: 1;
}

.brand__sub {
  display: block;
  margin-top: 5px;
  font-family: var(--font-body);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.nav {
  display: flex;
  gap: clamp(var(--space-4), 2vw, var(--space-8));
  margin-inline: auto;
}

.nav a {
  position: relative;
  padding-block: var(--space-2);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  transition: color 0.25s var(--ease);
}

.nav a::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: var(--color-accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s var(--ease);
}

.nav a:hover,
.nav a.is-active {
  color: var(--color-accent);
}
.nav a:hover::after,
.nav a.is-active::after {
  transform: scaleX(1);
}

.header__actions {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  flex-shrink: 0;
}

.icon-btn {
  display: none;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
}
.icon-btn:hover {
  color: var(--color-accent);
  border-color: var(--color-accent);
}
.icon-btn svg {
  width: 18px;
  height: 18px;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: 0.7rem var(--space-5);
  border: 1px solid var(--color-accent);
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  cursor: pointer;
  transition:
    background 0.3s var(--ease),
    color 0.3s var(--ease);
}

.btn svg {
  width: 13px;
  height: 13px;
}

.btn--ghost {
  color: var(--color-accent);
  background: transparent;
}
.btn--ghost:hover {
  background: var(--color-accent);
  color: #0b1020;
}

.btn--solid {
  background: linear-gradient(180deg, var(--color-accent-soft), var(--color-accent));
  color: #1a1403;
  border-color: var(--color-accent-soft);
}
.btn--solid:hover {
  background: var(--color-accent-soft);
}

/* ============================ HERO ============================ */
.hero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: min(78vh, 720px);
  padding-block: calc(116px + var(--space-10)) var(--space-10);
  overflow: hidden;
  isolation: isolate;
}

.hero__media {
  position: absolute;
  inset: 0;
  z-index: -2;
}

.hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 60%;
}

.hero__media::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    100deg,
    rgba(4, 8, 17, 0.95) 0%,
    rgba(4, 8, 17, 0.84) 34%,
    rgba(4, 8, 17, 0.58) 58%,
    rgba(4, 8, 17, 0.86) 100%
  );
}

.hero__grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.hero__copy {
  max-width: min(46ch, 100%);
}

.hero h1 {
  font-size: var(--text-3xl);
  margin-bottom: var(--space-5);
}
.hero h1 span {
  display: block;
}
.hero h1 .accent {
  color: var(--color-accent);
}

.hero__lede {
  font-size: var(--text-lg);
  line-height: 1.45;
  color: var(--color-text);
  margin-block: var(--space-5);
  font-weight: 300;
}

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

/* ============================ SERVICE CARDS ============================ */
.services-band {
  padding-block: var(--space-5) var(--space-5);
  background: var(--color-bg);
}

.services {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--space-4);
}

.card {
  display: flex;
  flex-direction: column;
  background: var(--color-card);
  color: var(--color-card-text);
  border-radius: var(--radius-sm);
  overflow: hidden;
  transition: transform 0.4s var(--ease);
}

.card:hover {
  transform: translateY(-4px);
}

.card__media {
  position: relative;
  aspect-ratio: 16 / 11;
  overflow: hidden;
  background: #142842;
}

.card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s var(--ease);
}

.card:hover .card__media img {
  transform: scale(1.04);
}

.card__body {
  padding: var(--space-5) var(--space-5) var(--space-6);
  flex: 1;
}

.card h3 {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-card-text);
  margin-bottom: var(--space-4);
}

.card ul {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.card li {
  position: relative;
  padding-left: var(--space-4);
  font-size: var(--text-xs);
  line-height: 1.5;
  color: var(--color-card-muted);
}

.card li::before {
  content: '';
  position: absolute;
  left: 2px;
  top: 0.55em;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--color-card-text);
}

.card p {
  font-size: var(--text-xs);
  line-height: 1.7;
  color: var(--color-card-muted);
}

/* ==================== FRAMEWORK + CONSULTATION PANEL ==================== */
.panel {
  padding-block: 0 var(--space-5);
}

.panel__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.42fr) minmax(0, 1.05fr) minmax(0, 0.82fr);
  align-items: center;
  gap: var(--space-8);
  background: var(--color-panel);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  overflow: hidden;
}

.panel__globe {
  padding: var(--space-6);
}

.panel__globe img {
  width: 100%;
  border-radius: 50%;
}

.pillars {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-8) var(--space-8);
  padding-block: var(--space-8);
  border-right: 1px solid var(--color-border);
  padding-right: var(--space-8);
}

.pillar {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: var(--space-4);
  align-items: start;
}

.pillar svg {
  width: 32px;
  height: 32px;
  color: var(--color-accent);
  margin-top: 2px;
}

.pillar h3 {
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: var(--space-2);
  line-height: 1.3;
}

.pillar p {
  font-size: var(--text-xs);
  line-height: 1.55;
  color: var(--color-text-muted);
}

.consult {
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: center;
  isolation: isolate;
  min-height: 100%;
}

.consult__bg {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.consult::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgba(7, 13, 26, 0.94) 0%, rgba(7, 13, 26, 0.6) 100%);
}

.consult__inner {
  width: 100%;
  padding: var(--space-8) var(--space-6);
}

.consult h2 {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-text);
  margin-bottom: var(--space-5);
}

form {
  display: grid;
  gap: var(--space-3);
}

.field-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3);
}

input {
  width: 100%;
  padding: 0.7rem var(--space-4);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  transition:
    border-color 0.25s var(--ease),
    background 0.25s var(--ease);
}

input::placeholder {
  color: var(--color-text-faint);
}

input:focus {
  border-color: var(--color-accent);
  outline: none;
  background: rgba(255, 255, 255, 0.08);
}

form .btn--solid {
  width: 100%;
  padding-block: 0.8rem;
  margin-top: var(--space-1);
}

.form-status {
  display: none;
  font-size: var(--text-xs);
  color: var(--color-accent-soft);
}
.form-status.is-visible {
  display: block;
}

/* ============================ FOOTER ============================ */
.footer {
  border-top: 1px solid var(--color-border);
  background: var(--color-panel);
  padding-top: var(--space-10);
}

.footer__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr) minmax(0, 1fr) minmax(0, 0.9fr);
  gap: var(--space-8);
  padding-bottom: var(--space-10);
}

.footer__brand p {
  margin-top: var(--space-4);
  font-size: var(--text-xs);
  line-height: 1.7;
  color: var(--color-text-muted);
}

.footer h4,
.footer h3 {
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: var(--space-4);
}

.footer__links-cols {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
}

.footer li + li {
  margin-top: var(--space-2);
}

.footer li,
.footer li a {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  transition: color 0.25s var(--ease);
}

.footer li a:hover {
  color: var(--color-accent);
}

.footer__contact li {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
}

.footer__contact svg {
  width: 14px;
  height: 14px;
  color: var(--color-accent);
  flex-shrink: 0;
  margin-top: 3px;
}

.compliance {
  display: flex;
  gap: var(--space-4);
  align-items: center;
  padding: var(--space-4) var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, 0.02);
  align-self: center;
}

.compliance svg {
  width: 26px;
  height: 26px;
  color: var(--color-accent);
  flex-shrink: 0;
}

.compliance p {
  font-size: var(--text-xs);
  line-height: 1.7;
  color: var(--color-text-muted);
}

.footer__bar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
  justify-content: space-between;
  align-items: center;
  padding-block: var(--space-4);
  border-top: 1px solid var(--color-border);
}

.footer__bar p,
.footer__bar a,
.footer__bar span {
  font-size: var(--text-xs);
  color: var(--color-text-faint);
}

.footer__bar nav {
  display: flex;
  gap: var(--space-4);
  align-items: center;
}

.footer__bar a:hover {
  color: var(--color-accent);
}

/* ============================ RESPONSIVE ============================ */
@media (max-width: 1240px) {
  .panel__grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.85fr);
  }
  .panel__globe {
    display: none;
  }
  .pillars {
    padding-left: var(--space-8);
  }
  .services {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Eight menu items are kept on one line down to 1101px by tightening the
   type and the spacing in two steps, measured at 1340, 1280, 1200 and 1150.
   The compact menu button appears only below 1101px. */
@media (min-width: 1367px) and (max-width: 1600px) {
  .nav {
    gap: 16px;
  }
  .nav__link,
  .nav a {
    font-size: 11px;
    letter-spacing: 0.08em;
  }
}

@media (min-width: 1201px) and (max-width: 1366px) {
  .nav {
    gap: 12px;
  }
  .nav__link,
  .nav a {
    font-size: 10.5px;
    letter-spacing: 0.05em;
  }
}

@media (min-width: 1101px) and (max-width: 1200px) {
  .nav {
    gap: 10px;
  }
  .nav__link,
  .nav a {
    font-size: 10px;
    letter-spacing: 0.03em;
  }
}

@media (max-width: 1100px) {
  .nav {
    display: none;
  }
  .lang {
    margin-left: var(--space-4);
    padding-left: var(--space-4);
  }
  .icon-btn {
    display: grid;
  }
  .header__inner {
    justify-content: space-between;
  }
  .nav.is-open {
    display: flex;
    position: fixed;
    inset: 116px 0 auto 0;
    flex-direction: column;
    gap: 0;
    margin: 0;
    padding: var(--space-3) clamp(var(--space-4), 3vw, var(--space-10)) var(--space-6);
    background: rgba(15, 30, 51, 0.97);
    backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--color-border);
  }
  .nav.is-open a {
    padding-block: var(--space-4);
    border-bottom: 1px solid var(--color-border);
    font-size: var(--text-sm);
  }
}

@media (max-width: 900px) {
  .hero__grid {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }
  .panel__grid {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .pillars {
    border-right: 0;
    border-bottom: 1px solid var(--color-border);
    padding-inline: var(--space-6);
  }
  .footer__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .services {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .pillars {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }
  .hero {
    min-height: auto;
    padding-block: calc(116px + var(--space-10)) var(--space-10);
  }
}

@media (max-width: 560px) {
  .card__media {
    aspect-ratio: 16 / 9;
  }
  .services,
  .footer__grid,
  .field-row {
    grid-template-columns: 1fr;
  }
  .brand__name {
    font-size: 1.05rem;
  }
  .header__actions .btn--ghost {
    display: none;
  }
}

/* ============================================================
   Multi-page extension: same tokens, same visual voice
   ============================================================ */

/* --- Navigation with services dropdown --- */
.nav__item {
  position: relative;
  display: flex;
  align-items: center;
}
.nav__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding-block: var(--space-2);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  background: none;
  border: 0;
  font-family: var(--font-body);
  cursor: pointer;
  transition: color 0.25s var(--ease);
}
.nav__link::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: var(--color-accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s var(--ease);
}
.nav__link:hover,
.nav__link.is-active,
.nav__item:hover > .nav__link {
  color: var(--color-accent);
}
.nav__link:hover::after,
.nav__link.is-active::after,
.nav__item:hover > .nav__link::after {
  transform: scaleX(1);
}
.nav__link svg {
  width: 9px;
  height: 9px;
  flex-shrink: 0;
}
.nav__menu {
  position: absolute;
  top: calc(100% + var(--space-4));
  left: -var(--space-4);
  min-width: 288px;
  padding: var(--space-3) 0;
  background: rgba(15, 30, 51, 0.97);
  backdrop-filter: blur(16px);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition:
    opacity 0.25s var(--ease),
    transform 0.25s var(--ease),
    visibility 0.25s;
}
.nav__item:hover .nav__menu,
.nav__item:focus-within .nav__menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.nav__menu a {
  display: block;
  padding: var(--space-3) var(--space-5);
  font-size: var(--text-xs);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.nav__menu a:hover {
  color: var(--color-accent);
  background: rgba(213, 165, 60, 0.06);
}
.nav__menu li + li a {
  border-top: 1px solid rgba(30, 42, 66, 0.7);
}

/* --- Page header (interior pages) --- */
.page-head {
  position: relative;
  padding-block: calc(116px + var(--space-16)) var(--space-12);
  border-bottom: 1px solid var(--color-border);
  overflow: hidden;
  isolation: isolate;
}
.page-head::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(120% 140% at 88% 0%, rgba(213, 165, 60, 0.09), transparent 60%),
    var(--color-bg);
}
.page-head .eyebrow {
  display: block;
  margin-bottom: var(--space-5);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--color-accent);
}
.page-head h1 {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(2rem, 1.3rem + 2.4vw, 3.4rem);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  max-width: 24ch;
}
.page-head .standfirst {
  max-width: 62ch;
  margin-top: var(--space-6);
  font-size: var(--text-lg);
  font-weight: 300;
  line-height: 1.5;
  color: var(--color-text);
}
.page-head .standfirst--gold-line {
  max-width: none;
  font-size: var(--text-sm);
  font-weight: 400;
  color: var(--color-accent);
  white-space: nowrap;
}
.page-head .rule {
  margin-top: var(--space-8);
}

/* --- Contact page architectural threshold --- */
.page-head--contact {
  padding-bottom: var(--space-16);
}
.contact-visual {
  position: relative;
  height: clamp(300px, 46vw, 620px);
  margin: var(--space-8) 0 0;
  overflow: hidden;
  background: var(--color-panel);
  border: 1px solid var(--color-border);
}
.contact-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 50%;
  filter: brightness(0.72) saturate(0.94);
}
.page-head--contact .standfirst {
  margin-top: var(--space-6);
  max-width: none;
  font-size: clamp(1rem, 0.82rem + 0.45vw, 1.25rem);
  line-height: 1.45;
  white-space: nowrap;
}
.contact-actions {
  margin-top: var(--space-5);
}
@media (max-width: 760px) {
  .page-head--contact {
    padding-bottom: var(--space-12);
  }
  .contact-visual {
    height: 360px;
    margin-top: var(--space-6);
  }
  .contact-visual img {
    object-position: 52% center;
  }
  .page-head--contact .standfirst {
    white-space: normal;
  }
}

/* --- Services editorial visual --- */
.services-visual {
  height: clamp(300px, 46vw, 620px);
  margin: 0;
  overflow: hidden;
  border-bottom: 1px solid var(--color-border);
  background: var(--color-panel);
}
.services-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 52%;
}

/* --- Generic content sections --- */
.section {
  padding-block: var(--space-16);
  border-bottom: 1px solid var(--color-border);
}
.section--flush {
  border-bottom: 0;
}
.section--panel {
  background: var(--color-panel);
}
.section__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.34fr) minmax(0, 1fr);
  gap: clamp(var(--space-8), 5vw, var(--space-16));
  align-items: start;
}
.section h2 {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 1.15rem + 1.1vw, 2.25rem);
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.section h2,
.section h2.section-title--gold {
  color: var(--color-accent);
}

.section h2 + .rule {
  margin-top: var(--space-5);
}
.prose > * + * {
  margin-top: var(--space-5);
}
.prose p,
.prose li {
  font-size: var(--text-base);
  line-height: 1.75;
  color: var(--color-text-muted);
  max-width: 74ch;
}
.prose strong {
  color: var(--color-text);
  font-weight: 600;
}
.prose h3 {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-top: var(--space-10);
}
.prose h3 + * {
  margin-top: var(--space-4);
}
.prose ol,
.prose ul.list {
  display: grid;
  gap: var(--space-4);
  padding-left: 0;
  counter-reset: item;
  list-style: none;
}
.prose ol li {
  position: relative;
  padding-left: var(--space-10);
  counter-increment: item;
}
.prose ol li::before {
  content: counter(item, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 0.1em;
  font-family: var(--font-display);
  font-size: var(--text-base);
  color: var(--color-accent);
}
.prose ul.list li {
  position: relative;
  padding-left: var(--space-6);
}
.prose ul.list li::before {
  content: '';
  position: absolute;
  left: 2px;
  top: 0.75em;
  width: 10px;
  height: 1px;
  background: var(--color-accent);
}

/* --- Independence / confidentiality notes --- */
.note {
  padding: var(--space-6) var(--space-8);
  border: 1px solid var(--color-border);
  border-left: 2px solid var(--color-accent);
  background: rgba(255, 255, 255, 0.02);
  border-radius: var(--radius-sm);
}
.note p {
  font-size: var(--text-sm);
  line-height: 1.7;
  color: var(--color-text);
  max-width: 82ch;
}
.note--confidentiality p {
  color: var(--color-accent-soft);
}

/* --- Inline actions --- */
.actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4) var(--space-8);
  align-items: center;
}
.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-accent);
  transition: gap 0.25s var(--ease);
}
.link-arrow::after {
  content: '→';
  font-size: 1em;
}
.link-arrow:hover {
  gap: var(--space-4);
}

/* --- Service / client cards --- */
.tiles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-6);
}
.tile {
  display: flex;
  flex-direction: column;
  background: var(--color-card);
  color: var(--color-card-text);
  border-radius: var(--radius-sm);
  overflow: hidden;
  transition: transform 0.4s var(--ease);
}
.tile:hover {
  transform: translateY(-4px);
}
.tile__media {
  aspect-ratio: 16 / 7;
  overflow: hidden;
  background: #142842;
}
.tile__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s var(--ease);
}
.tile:hover .tile__media img {
  transform: scale(1.04);
}
.tile__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-8);
  flex: 1;
}
.tile h3 {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.tile p {
  font-size: var(--text-sm);
  line-height: 1.7;
  color: var(--color-card-muted);
}
.tile .question {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-style: italic;
  line-height: 1.4;
  color: var(--color-card-text);
}
.tile .link-arrow {
  margin-top: auto;
  color: #8a6a1c;
}

/* --- Eight-domain grid and strip --- */
.domain-strip {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3) var(--space-5);
  padding-block: var(--space-6);
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}
.domain-strip li {
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.domain-strip li + li::before {
  content: '·';
  margin-right: var(--space-5);
  color: var(--color-accent);
}
.domain-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  background: var(--color-border);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}
.domain {
  padding: var(--space-6);
  background: var(--color-bg);
}
.domain__index {
  display: block;
  font-family: var(--font-display);
  font-size: var(--text-sm);
  color: var(--color-accent);
  margin-bottom: var(--space-4);
}
.domain h3 {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-text);
  margin-bottom: var(--space-3);
}
.domain p {
  font-size: var(--text-xs);
  line-height: 1.65;
  color: var(--color-text-muted);
}

/* --- Tables --- */
.table-wrap {
  overflow-x: auto;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  -webkit-overflow-scrolling: touch;
}
table {
  width: 100%;
  min-width: 520px;
  border-collapse: collapse;
}
th,
td {
  padding: var(--space-4) var(--space-5);
  text-align: left;
  vertical-align: top;
  font-size: var(--text-sm);
  line-height: 1.7;
  border-bottom: 1px solid var(--color-border);
}
thead th {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-accent);
  white-space: nowrap;
}
tbody th {
  font-weight: 600;
  color: var(--color-text);
  white-space: nowrap;
}
tbody td {
  color: var(--color-text-muted);
}
tbody tr:last-child th,
tbody tr:last-child td {
  border-bottom: 0;
}
.table-hint {
  margin-top: var(--space-3);
  font-size: var(--text-xs);
  color: var(--color-text-faint);
}

/* --- Exclusion blocks --- */
.exclusions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--color-border);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}
.exclusion {
  padding: var(--space-8);
  background: var(--color-bg);
}
.exclusion h3 {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: var(--space-4);
}
.exclusion p {
  font-size: var(--text-sm);
  line-height: 1.75;
  color: var(--color-text-muted);
}

/* --- Steps (process) --- */
.steps {
  display: grid;
  gap: 1px;
  background: var(--color-border);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}
.step {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: var(--space-6);
  padding: var(--space-8);
  background: var(--color-bg);
}
.step__num {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  color: var(--color-accent);
  line-height: 1;
}
.step h3 {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: var(--space-4);
}
.step p + p {
  margin-top: var(--space-4);
}
.step p {
  font-size: var(--text-sm);
  line-height: 1.75;
  color: var(--color-text-muted);
  max-width: 74ch;
}

/* --- Article index --- */
.articles {
  display: grid;
  gap: 1px;
  background: var(--color-border);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}
.article-row {
  display: grid;
  grid-template-columns: 64px minmax(0, 1.2fr) minmax(0, 1fr);
  gap: var(--space-6);
  padding: var(--space-6) var(--space-8);
  background: var(--color-bg);
  align-items: baseline;
}
.article-row__num {
  font-family: var(--font-display);
  color: var(--color-accent);
}
.article-row h3 {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-weight: 500;
  line-height: 1.35;
  color: var(--color-text);
}
.article-row p {
  font-size: var(--text-xs);
  line-height: 1.7;
  color: var(--color-text-muted);
}

/* --- Enquiry form block --- */
.enquiry {
  position: relative;
  isolation: isolate;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.enquiry__bg {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.enquiry::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(100deg, rgba(5, 10, 20, 0.96) 0%, rgba(5, 10, 20, 0.82) 100%);
}
.enquiry__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr);
  gap: clamp(var(--space-8), 4vw, var(--space-16));
  padding: clamp(var(--space-8), 4vw, var(--space-12));
}
.form-grid {
  display: grid;
  gap: var(--space-4);
}
.field {
  display: grid;
  gap: var(--space-2);
}
.field label {
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-text-faint);
}
textarea,
select {
  width: 100%;
  padding: 0.7rem var(--space-4);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: var(--text-sm);
}
textarea {
  min-height: 120px;
  resize: vertical;
}
select option {
  background: var(--color-panel);
}
textarea:focus,
select:focus {
  border-color: var(--color-accent);
  outline: none;
}
.radio-row {
  display: flex;
  gap: var(--space-6);
  align-items: center;
}
.radio-row label {
  display: inline-flex;
  gap: var(--space-2);
  align-items: center;
  font-size: var(--text-sm);
  letter-spacing: normal;
  text-transform: none;
  color: var(--color-text-muted);
}
.radio-row input {
  width: auto;
  accent-color: var(--color-accent);
}

/* --- Footer --- */
.footer__cols {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) repeat(2, minmax(0, 1fr));
  gap: clamp(var(--space-8), 3vw, var(--space-12));
  padding-bottom: var(--space-12);
}
.footer__cols p.footer__line {
  margin-top: var(--space-5);
  font-size: var(--text-xs);
  line-height: 1.7;
  color: var(--color-text-muted);
  max-width: 34ch;
}
.footer__note {
  margin-top: var(--space-5);
  font-size: var(--text-xs);
  line-height: 1.7;
  color: var(--color-accent-soft);
  max-width: 40ch;
}
.footer__mail {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  word-break: break-word;
}
.footer__mail a {
  color: var(--color-accent);
}
.footer__legal {
  margin-top: var(--space-5);
  font-size: var(--text-xs);
}
.footer__legal a {
  color: var(--color-accent);
}

/* --- Logo files --- */
.brand__logo {
  height: 92px;
  width: auto;
  flex-shrink: 0;
}
.brand__shield {
  width: 38px;
  height: 44px;
  flex-shrink: 0;
}

/* --- Home hero: warm, bright image needs a strong navy scrim --- */
.hero--home h1 {
  font-size: clamp(2.5rem, 1.65rem + 3vw, 4.6rem);
  line-height: 1.08;
}
.hero--home .hero__lede {
  max-width: 43ch;
  font-size: var(--text-base);
  line-height: 1.55;
}
.hero--home .hero__media img {
  object-position: center 55%;
}
.hero--home .hero__media::after {
  background:
    linear-gradient(
      90deg,
      rgba(6, 14, 24, 0.92) 0%,
      rgba(6, 14, 24, 0.9) 30%,
      rgba(6, 14, 24, 0.7) 52%,
      rgba(6, 14, 24, 0.4) 76%,
      rgba(6, 14, 24, 0.15) 100%
    ),
    linear-gradient(to top, rgba(5, 10, 20, 0.75) 0%, rgba(5, 10, 20, 0) 45%);
}

/* --- Aegis hero: copy sits in the dark left third only --- */
.hero--aegis {
  min-height: min(62vh, 560px);
}
.hero--aegis .hero__media img {
  object-position: 65% center;
}
.hero--aegis .hero__media::after {
  background:
    linear-gradient(
      90deg,
      rgba(6, 14, 24, 0.94) 0%,
      rgba(6, 14, 24, 0.9) 26%,
      rgba(6, 14, 24, 0.62) 42%,
      rgba(6, 14, 24, 0.22) 62%,
      rgba(6, 14, 24, 0.1) 100%
    );
}
.hero--aegis .hero__copy {
  max-width: min(380px, 100%);
}
.hero--aegis h1 {
  font-size: clamp(1.9rem, 1.25rem + 1.5vw, 2.9rem);
  margin-bottom: var(--space-5);
}
.hero--aegis-standard .hero__copy {
  max-width: min(440px, 100%);
}
.hero--aegis-standard h1 {
  font-size: clamp(4rem, 2.5rem + 5vw, 7.5rem);
  line-height: 0.9;
  letter-spacing: 0.04em;
  margin-bottom: var(--space-6);
}
.hero--aegis-standard .aegis-principle {
  max-width: 34ch;
  font-family: var(--font-display);
  font-size: clamp(1.1rem, 0.96rem + 0.55vw, 1.45rem);
  line-height: 1.35;
  color: var(--color-text);
  margin-bottom: var(--space-6);
}
.hero--aegis-standard .hero__lede {
  max-width: 42ch;
  font-size: var(--text-sm);
  line-height: 1.65;
}
.hero--founder h1 .accent {
  display: inline;
}
.hero--aegis .eyebrow {
  display: block;
  margin-bottom: var(--space-5);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--color-accent);
}
.hero--aegis .hero__lede {
  font-size: var(--text-base);
  line-height: 1.7;
}

@media (max-width: 900px) {
  .hero--aegis .hero__copy {
    max-width: min(52ch, 100%);
  }
  .hero--aegis .hero__media::after {
    background: linear-gradient(
      90deg,
      rgba(6, 14, 24, 0.95) 0%,
      rgba(6, 14, 24, 0.9) 55%,
      rgba(6, 14, 24, 0.72) 100%
    );
  }
}

/* --- Four practice-area cards --- */
.tiles--four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: var(--space-10);
}
.tiles--four .tile__body {
  padding: var(--space-6);
  gap: var(--space-4);
}
.tiles--four .tile p {
  font-size: var(--text-xs);
  line-height: 1.65;
}
.tiles--four .tile h3 {
  min-height: 2.4em;
}
@media (max-width: 900px) {
  .tiles--four .tile h3 {
    min-height: 0;
  }
}
.tile__points {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.tile__points li {
  position: relative;
  padding-left: var(--space-4);
  font-size: var(--text-xs);
  line-height: 1.5;
  color: var(--color-card-muted);
}
.tile__points li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.62em;
  width: 8px;
  height: 1px;
  background: #8a6a1c;
}
@media (max-width: 1180px) {
  .tiles--four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 620px) {
  .tiles--four {
    grid-template-columns: 1fr;
  }
}

/* --- Narrow textural band, one line only --- */
.band {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-block: var(--space-12);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-bg);
}
.band__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.1;
}
.band__line {
  max-width: 58ch;
  margin-inline: auto;
  text-align: center;
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 1rem + 1vw, 1.9rem);
  font-weight: 500;
  line-height: 1.35;
  color: var(--color-text);
}
.band--home-statement .band__line {
  max-width: none;
  white-space: nowrap;
}
@media (max-width: 760px) {
  .band--home-statement .band__line {
    max-width: 32ch;
    white-space: normal;
  }
}

/* --- Placeholder page --- */
.placeholder {
  padding-block: calc(116px + var(--space-20)) var(--space-20);
}
.placeholder p {
  max-width: 60ch;
  margin-top: var(--space-6);
  font-size: var(--text-lg);
  font-weight: 300;
  line-height: 1.7;
  color: var(--color-text-muted);
}

/* --- Responsive additions --- */
@media (max-width: 1240px) {
  .domain-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1024px) {
  .nav__menu {
    position: static;
    opacity: 1;
    visibility: visible;
    transform: none;
    min-width: 0;
    border: 0;
    background: none;
    backdrop-filter: none;
    padding: 0 0 var(--space-4);
  }
  .nav__item {
    display: block;
  }
  .nav.is-open .nav__link {
    display: flex;
    width: 100%;
    padding-block: var(--space-4);
    border-bottom: 1px solid var(--color-border);
    font-size: var(--text-sm);
  }
  .nav__menu a {
    padding: var(--space-3) 0 var(--space-3) var(--space-5);
    border-top: 0;
  }
  .nav__menu li + li a {
    border-top: 0;
  }
  .section__grid {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }
  .enquiry__inner {
    grid-template-columns: 1fr;
  }
  .article-row {
    grid-template-columns: 40px minmax(0, 1fr);
  }
  .article-row p {
    grid-column: 2;
  }
  .footer__cols {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .page-head .standfirst--gold-line {
    white-space: normal;
  }
  .services-visual {
    height: 340px;
  }
  .services-visual img {
    object-position: 48% center;
  }
  .tiles,
  .exclusions {
    grid-template-columns: 1fr;
  }
  .section {
    padding-block: var(--space-12);
  }
}

@media (max-width: 560px) {
  .domain-grid,
  .footer__cols {
    grid-template-columns: 1fr;
  }
  .step {
    grid-template-columns: 1fr;
    gap: var(--space-3);
  }
  .tile__body,
  .exclusion,
  .step,
  .article-row {
    padding: var(--space-6);
  }
  .note {
    padding: var(--space-5) var(--space-6);
  }
  table {
    min-width: 440px;
  }
}

/* --- Keep scrollable tables inside their grid column on narrow screens --- */
.section__grid > * {
  min-width: 0;
}
.prose,
.prose > * {
  min-width: 0;
}
.table-wrap {
  max-width: 100%;
}

/* --- Odd-count exclusions grid: final entry spans the row --- */
@media (min-width: 761px) {
  .exclusion:last-child {
    grid-column: 1 / -1;
  }
}

/* --- Table scroll hint only where tables actually scroll --- */
.table-hint {
  display: none;
}
@media (max-width: 760px) {
  .table-hint {
    display: block;
  }
}

/* Internal working marker. Removed before the site goes public. */
.note--pending {
  border-style: dashed;
  border-left-style: solid;
  background: rgba(213, 165, 60, 0.05);
}
.note--pending p strong {
  color: var(--color-accent);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 0.85em;
}
.prose .lede {
  font-size: var(--text-lg);
  line-height: 1.55;
  color: var(--color-text-strong, #e8eaf0);
  margin-bottom: var(--space-6);
}

.prose .summary {
  font-style: italic;
  font-size: 1.02em;
  line-height: 1.7;
  color: var(--color-text);
  border-left: 2px solid var(--color-accent);
  padding-left: var(--space-5);
  margin: var(--space-4) 0 var(--space-6);
}
.prose ul.record {
  list-style: none;
  margin: var(--space-5) 0 var(--space-6);
  padding: 0;
}
.prose ul.record li {
  position: relative;
  padding: 0 0 var(--space-4) var(--space-6);
  margin: 0 0 var(--space-4);
  border-bottom: 1px solid var(--color-border);
  line-height: 1.5;
}
.prose ul.record li:last-child {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}
.prose ul.record li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.62em;
  width: 12px;
  height: 1px;
  background: var(--color-accent);
}

/* offset anchor targets so the fixed header does not cover the heading */
[id] {
  scroll-margin-top: 130px;
}

.prose h3.name {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: none;
  color: var(--color-text);
  line-height: 1.15;
  margin-top: 0;
  margin-bottom: var(--space-2);
}
.prose h3.name + .summary {
  margin-top: var(--space-4);
}

.tiles .tile--wide {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  align-items: stretch;
}
.tiles .tile--wide .tile__media {
  height: 100%;
  min-height: 260px;
}
.tiles .tile--wide .tile__media img {
  height: 100%;
  object-fit: cover;
}
@media (max-width: 900px) {
  .tiles .tile--wide {
    grid-template-columns: minmax(0, 1fr);
  }
}

.hero--site {
  min-height: min(58vh, 520px);
}
.hero--site .hero__media img {
  object-position: 30% center;
}
.hero--site .hero__media::after {
  background: linear-gradient(
    90deg,
    rgba(6, 14, 24, 0.95) 0%,
    rgba(6, 14, 24, 0.9) 34%,
    rgba(6, 14, 24, 0.6) 52%,
    rgba(6, 14, 24, 0.24) 74%,
    rgba(6, 14, 24, 0.12) 100%
  );
}
.hero--site .hero__copy {
  max-width: min(560px, 100%);
}
.hero--site h1 {
  font-size: clamp(1.9rem, 1.25rem + 1.5vw, 2.9rem);
  margin-bottom: var(--space-5);
}
.hero--site .eyebrow {
  display: block;
  margin-bottom: var(--space-5);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--color-accent);
}
.hero--site .hero__lede {
  font-size: var(--text-base);
  line-height: 1.7;
}

.band {
  position: relative;
  margin: 0;
  border-bottom: 1px solid var(--color-border);
  overflow: hidden;
}
.band img {
  display: block;
  width: 100%;
  height: clamp(220px, 34vh, 380px);
  object-fit: cover;
  object-position: center 78%;
}
.band figcaption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: var(--space-6);
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-style: italic;
  color: var(--color-text);
  text-shadow: 0 2px 18px rgba(6, 14, 24, 0.9);
}
@media (max-width: 900px) {
  .band figcaption {
    font-size: var(--text-base);
  }
}

.hero--intel .hero__media img { object-position: 62% center; }
.hero--resilience .hero__media img { object-position: 66% center; }
.hero--privacy .hero__media img { object-position: 70% center; }
.hero--watch .hero__media img {
  width: 128%;
  max-width: none;
  object-position: left 76%;
}
.hero--watch .hero__copy {
  max-width: none;
}
.hero--watch .hero__lede {
  width: max-content;
  max-width: none;
  white-space: nowrap;
  font-size: 0.9rem;
  letter-spacing: -0.01em;
}
@media (max-width: 900px) {
  .hero--watch .hero__media img {
    width: 100%;
    object-position: 50% 76%;
  }
  .hero--watch .hero__copy {
    max-width: min(560px, 100%);
  }
  .hero--watch .hero__lede {
    width: auto;
    max-width: 100%;
    white-space: normal;
    font-size: var(--text-sm);
    letter-spacing: normal;
  }
}
.band--tower {
  min-height: clamp(240px, 30vw, 360px);
  display: flex;
  align-items: flex-end;
  padding-top: clamp(var(--space-20), 16vw, 13rem);
  padding-bottom: var(--space-8);
}
.band--tower .shell {
  width: 100%;
}
.band--tower .band__bg {
  opacity: 0.72;
  filter: brightness(1.24) saturate(1.08);
  object-position: center 58%;
}
.band--tower::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(
    0deg,
    rgba(5, 10, 20, 0.55) 0%,
    rgba(5, 10, 20, 0.12) 58%,
    rgba(5, 10, 20, 0.04) 100%
  );
}
.band--tower .band__line {
  color: #f5f0e3;
  text-shadow: 0 2px 22px rgba(5, 10, 20, 0.96);
}
.band--site-location {
  min-height: clamp(280px, 38vw, 460px);
  display: flex;
  align-items: flex-end;
  padding: var(--space-20) 0 var(--space-10);
  background: #0b1a2d;
}
.band--site-location .band__bg {
  height: 100%;
  opacity: 1;
  filter: brightness(1.38) saturate(1.08) contrast(1.02);
  object-position: center 58%;
}
.band--site-location::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(
    0deg,
    rgba(5, 12, 22, 0.28) 0%,
    rgba(5, 12, 22, 0.04) 48%,
    rgba(5, 12, 22, 0.02) 100%
  );
}
.band--site-location .shell {
  width: 100%;
}
.band--site-location .band__line {
  margin-inline: 0;
  max-width: 38ch;
  text-align: left;
  color: #fffaf0;
  text-shadow: 0 2px 14px rgba(3, 8, 16, 0.98);
}
.band--stars img { object-position: center 46%; }
.band--private-event {
  min-height: clamp(300px, 42vw, 520px);
  display: flex;
  align-items: flex-end;
  padding: var(--space-20) 0 var(--space-10);
  background: #050a14;
}
.band--private-event::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(5, 10, 20, 0.46) 0%, rgba(5, 10, 20, 0.18) 48%, rgba(5, 10, 20, 0.04) 100%),
    linear-gradient(0deg, rgba(5, 10, 20, 0.62) 0%, transparent 50%);
}
.band--private-event .band__bg {
  opacity: 0.98;
  filter: brightness(1.22) saturate(1.08);
  object-position: center 55%;
}
.band--private-event .shell {
  width: 100%;
}
.band--private-event .band__line {
  margin-inline: 0;
  max-width: 35ch;
  text-align: left;
  color: #f5f0e3;
  text-shadow: 0 2px 22px rgba(5, 10, 20, 0.95);
}
.hero--crisis .hero__media img { object-position: 64% center; }

@media (max-width: 760px) {
  .band--private-event {
    min-height: 360px;
    padding-bottom: var(--space-8);
  }
  .band--private-event::after {
    background: linear-gradient(0deg, rgba(5, 10, 20, 0.76) 0%, rgba(5, 10, 20, 0.2) 68%, rgba(5, 10, 20, 0.03) 100%);
  }
  .band--private-event .band__bg {
    opacity: 0.98;
    filter: brightness(1.2) saturate(1.08);
    object-position: 38% center;
  }
}

/* --- Dark card variant (services index) --- */
.tiles--dark .tile {
  background: var(--color-panel);
  color: var(--color-text);
  border: 1px solid var(--color-border);
}
.tiles--dark .tile:hover {
  border-color: var(--color-border-strong);
}
.tiles--dark .tile__media {
  border-bottom: 1px solid var(--color-border);
}
.tiles--dark .tile h3 {
  color: var(--color-text);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid rgba(213, 165, 60, 0.42);
}
.tiles--dark .tile p {
  color: var(--color-text-muted);
}
.tiles--dark .tile .question {
  color: var(--color-accent-soft);
}
.tiles--dark .tile .link-arrow {
  color: var(--color-accent);
}
.section--panel .tiles--dark .tile {
  background: #16294a;
}

/* Top scrim so the navigation stays crisp over the crisis header */
.hero--crisis .hero__media::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 150px;
  background: linear-gradient(180deg, rgba(5, 10, 20, 0.88) 0%, rgba(5, 10, 20, 0.5) 55%, rgba(5, 10, 20, 0) 100%);
  z-index: 1;
}


@media (max-width: 760px) {
  .brand__logo {
    height: 62px;
  }
  .header__inner {
    min-height: 84px;
  }
}

/* --- Inline prose links: visible and accessible --- */
.prose a:not(.btn):not(.link-arrow):not(.principal-link):not(.social__link),
.placeholder a:not(.btn):not(.link-arrow):not(.social__link) {
  color: var(--color-accent);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
  transition: color 0.25s var(--ease);
}
.prose a:not(.btn):not(.link-arrow):not(.principal-link):not(.social__link):hover,
.placeholder a:not(.btn):not(.link-arrow):not(.social__link):hover {
  color: var(--color-text);
}
.prose .principal-link {
  color: var(--color-accent);
  font-weight: 600;
  text-decoration: none;
}
.prose .principal-link:hover {
  color: var(--color-accent-soft);
  text-decoration: none;
}

/* ============================ FOOTER: LIGHT ============================ */
.footer {
  background: #ffffff;
  border-top: 1px solid rgba(20, 28, 44, 0.14);
}
.footer .footer__brand p,
.footer__cols p.footer__line,
.footer__mail,
.footer li,
.footer li a,
.compliance p {
  color: #3d4a5e;
}
.footer h3,
.footer h4 {
  color: #141c2c;
}
.footer__note {
  color: #6b5320;
}
.footer li a:hover,
.footer__bar a:hover {
  color: #8a6414;
}
.footer__mail a,
.footer__legal a {
  color: #8a6414;
}
.footer__contact svg,
.compliance svg {
  color: #8a6414;
}
.compliance {
  border-color: rgba(20, 28, 44, 0.16);
  background: rgba(20, 28, 44, 0.03);
}
.footer__bar {
  border-top: 1px solid rgba(20, 28, 44, 0.14);
}
.footer__bar p,
.footer__bar a,
.footer__bar span {
  color: #5b687c;
}
.footer .brand__name {
  color: #141c2c;
}
.footer .brand__sub {
  color: #8a6414;
}

/* ============ FOOTER: LARGER TEXT AND LARGER MARK ============ */
.footer .footer__brand p,
.footer__cols p.footer__line,
.footer__mail,
.footer li,
.footer li a,
.footer__note,
.footer__legal,
.footer__legal a,
.compliance p {
  font-size: 0.875rem;
  line-height: 1.75;
}
.footer h3,
.footer h4 {
  font-size: 0.8125rem;
  letter-spacing: 0.2em;
}
.footer__bar p,
.footer__bar a,
.footer__bar span {
  font-size: 0.8125rem;
}
.footer .brand__shield {
  width: 54px;
}
.footer .brand__name {
  font-size: clamp(1.4rem, 1.15rem + 0.8vw, 1.95rem);
}
.footer .brand__sub {
  font-size: 0.75rem;
  letter-spacing: 0.3em;
}

/* ============ HOME HERO: 20% BRIGHTER ============ */
.hero--home .hero__media img {
  filter: brightness(1.2) saturate(1.06);
}

/* ============ HOME HERO: BRIGHTER, LIGHTER OVERLAY ============ */
.hero--home .hero__media img {
  filter: brightness(1.22) saturate(1.08) contrast(1.02);
}
.hero--home .hero__media::after {
  background:
    linear-gradient(
      90deg,
      rgba(6, 14, 24, 0.84) 0%,
      rgba(6, 14, 24, 0.76) 30%,
      rgba(6, 14, 24, 0.48) 52%,
      rgba(6, 14, 24, 0.2) 76%,
      rgba(6, 14, 24, 0.04) 100%
    ),
    linear-gradient(to top, rgba(5, 10, 20, 0.55) 0%, rgba(5, 10, 20, 0) 45%);
}

/* ============ READABILITY: WHITE BODY TEXT, 10% LARGER ============ */
:root {
  --text-xs: clamp(0.756rem, 0.715rem + 0.165vw, 0.825rem);
  --text-sm: clamp(0.894rem, 0.858rem + 0.165vw, 0.963rem);
  --text-base: clamp(1.031rem, 0.99rem + 0.22vw, 1.1rem);
  --text-lg: clamp(1.169rem, 1.045rem + 0.495vw, 1.444rem);
  --text-xl: clamp(1.513rem, 1.21rem + 0.99vw, 2.063rem);

  --color-text-muted: #ffffff;
  --color-text-faint: #ffffff;
}

/* ============ CARTHAGE WATCH HERO: 25% BRIGHTER ============ */
.hero--watch .hero__media img {
  filter: brightness(1.25) saturate(1.08) contrast(1.02);
}
.hero--watch .hero__media::after {
  background: linear-gradient(
    90deg,
    rgba(6, 14, 24, 0.82) 0%,
    rgba(6, 14, 24, 0.72) 34%,
    rgba(6, 14, 24, 0.42) 52%,
    rgba(6, 14, 24, 0.12) 74%,
    rgba(6, 14, 24, 0.04) 100%
  );
}

/* The Aegis Standard hero: photograph lifted 19 August 2026 */
.hero--aegis .hero__media img {
  filter: brightness(1.24) saturate(1.06) contrast(1.02);
}
.hero--aegis .hero__media::after {
  background:
    linear-gradient(
      90deg,
      rgba(6, 14, 24, 0.82) 0%,
      rgba(6, 14, 24, 0.72) 26%,
      rgba(6, 14, 24, 0.44) 42%,
      rgba(6, 14, 24, 0.14) 62%,
      rgba(6, 14, 24, 0.04) 100%
    );
}

/* Five service page heroes: photographs lifted 19 August 2026.
   Carthage Watch is deliberately excluded, it was settled earlier. */
.hero--intel .hero__media img,
.hero--privacy .hero__media img,
.hero--resilience .hero__media img,
.hero--crisis .hero__media img,
.hero--siteselect .hero__media img {
  filter: brightness(1.24) saturate(1.06) contrast(1.02);
}
.hero--intel .hero__media::after,
.hero--privacy .hero__media::after,
.hero--resilience .hero__media::after,
.hero--crisis .hero__media::after,
.hero--siteselect .hero__media::after {
  background: linear-gradient(
    90deg,
    rgba(6, 14, 24, 0.82) 0%,
    rgba(6, 14, 24, 0.72) 34%,
    rgba(6, 14, 24, 0.42) 52%,
    rgba(6, 14, 24, 0.12) 74%,
    rgba(6, 14, 24, 0.04) 100%
  );
}

/* Intelligence and Advisory and Privacy heroes: the lift put pale, lit areas
   directly behind the navigation and the Email the firm button, so a short
   scrim is laid across the top strip only. The photographs below it are
   untouched. */
.hero--intel .hero__media::after,
.hero--privacy .hero__media::after {
  background:
    linear-gradient(
      to bottom,
      rgba(5, 10, 20, 0.82) 0px,
      rgba(5, 10, 20, 0.52) 74px,
      rgba(5, 10, 20, 0) 154px
    ),
    linear-gradient(
      90deg,
      rgba(6, 14, 24, 0.82) 0%,
      rgba(6, 14, 24, 0.72) 34%,
      rgba(6, 14, 24, 0.42) 52%,
      rgba(6, 14, 24, 0.12) 74%,
      rgba(6, 14, 24, 0.04) 100%
    );
}

/* ==================== FOOTER: COMPACT SPACING ==================== */
.footer {
  padding-top: 0.8rem;
}
.footer__cols,
.footer__grid {
  padding-bottom: 0.6rem;
  gap: clamp(1.2rem, 1.8vw, 1.75rem);
}
.footer h3,
.footer h4 {
  margin-bottom: 0.4rem;
}
.footer li,
.footer li a,
.footer__mail,
.footer__note,
.footer__cols p.footer__line {
  line-height: 1.45;
}
.footer li + li {
  margin-top: 0.15rem;
}
.footer__cols p.footer__line,
.footer__note,
.footer__legal {
  margin-top: 0.45rem;
}
.footer__cols ul {
  columns: 2;
  column-gap: 1.5rem;
}
.footer__cols ul li {
  break-inside: avoid;
}
.footer__cols ul li:first-child {
  margin-top: 0;
}
.footer__mail + .footer__mail {
  margin-top: 0.35rem;
}
.footer__brand .brand__shield {
  width: 30px;
}
.footer__brand .brand {
  margin-bottom: 0;
}
.footer__bar {
  padding-block: 0.55rem;
}
.footer__cols {
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.5fr) minmax(0, 1fr);
}

/* ==================== SERVICES: HORIZONTAL ROWS ==================== */
.srows {
  display: flex;
  flex-direction: column;
  gap: clamp(1.25rem, 2.5vw, 2rem);
}
.srow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(1.5rem, 3vw, 3rem);
  padding: clamp(1rem, 1.6vw, 1.5rem);
  border: 1px solid var(--color-border);
  background: rgba(255, 255, 255, 0.015);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.35s ease, background 0.35s ease, transform 0.35s ease;
}
.srow:hover,
.srow:focus-visible {
  border-color: var(--color-accent);
  background: rgba(255, 255, 255, 0.04);
  transform: translateY(-2px);
}
.srow--flip .srow__media {
  order: 2;
}
.srow__media {
  overflow: hidden;
}
.srow__media img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  transition: transform 0.6s ease;
}
.srow:hover .srow__media img {
  transform: scale(1.03);
}
.srow__title {
  font-size: clamp(1.3rem, 2vw, 1.75rem);
  letter-spacing: 0.01em;
  margin: 0;
}
.srow__body p {
  margin: 0.75rem 0 1rem;
  color: var(--color-text-muted);
  max-width: 52ch;
}
.srow__body .rule {
  margin: 0.65rem 0 0;
}
.srow .link-arrow {
  display: inline-block;
}
@media (max-width: 720px) {
  .srow {
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
  }
  .srow--flip .srow__media {
    order: 0;
  }
}
.nowrap {
  white-space: nowrap;
}
.srow__title {
  hyphens: none;
}

/* ============== BAND WITH PANEL: IMAGE AND JUDGEMENT AS ONE PART ============== */
.band--feature {
  display: flex;
  align-items: center;
  min-height: clamp(440px, 62vh, 640px);
  padding-block: clamp(2.75rem, 6vh, 4.5rem);
}
.band--feature .band__bg {
  opacity: 0.4;
}
.band--feature::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(5, 10, 20, 0.55) 0%, rgba(5, 10, 20, 0.35) 45%, rgba(5, 10, 20, 0.75) 100%);
}
.band__inner {
  display: grid;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  width: 100%;
}
.band__panel {
  max-width: 66ch;
  margin-inline: auto;
  padding: clamp(1.25rem, 2vw, 2rem);
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(5, 10, 20, 0.55);
}
.band__panel h2 {
  margin: 0;
}
.band__panel .rule {
  margin: 0.65rem 0 0.9rem;
}
.band__panel p {
  margin: 0 0 0.75rem;
  color: var(--color-text);
}
.band__panel p:last-child {
  margin-bottom: 0;
}

/* band panel: match section heading treatment and full-height image */
.band--feature .band__bg {
  height: 100%;
  min-height: 100%;
}
.band__panel h2 {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 1.15rem + 1.1vw, 2.25rem);
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--color-accent);
}
.band__panel p {
  font-size: var(--text-base);
  line-height: 1.75;
}

/* band panel: brighter image, more air around the line */
.band--feature {
  min-height: clamp(560px, 74vh, 760px);
  padding-block: clamp(3.5rem, 8vh, 6rem);
}
.band--feature .band__bg {
  opacity: 0.56;
}
.band--feature::before {
  background: linear-gradient(180deg, rgba(5, 10, 20, 0.42) 0%, rgba(5, 10, 20, 0.2) 40%, rgba(5, 10, 20, 0.6) 100%);
}
.band--feature .band__inner {
  gap: clamp(3rem, 7vw, 5.5rem);
}
.band--feature .band__line {
  text-shadow: 0 2px 22px rgba(5, 10, 20, 0.85);
}
.band--feature .band__panel {
  background: rgba(5, 10, 20, 0.62);
}

/* band panel: brighter still, line and panel set to the left */
.band--feature .band__bg {
  opacity: 0.78;
}
.band--feature::before {
  background: linear-gradient(100deg, rgba(5, 10, 20, 0.62) 0%, rgba(5, 10, 20, 0.3) 55%, rgba(5, 10, 20, 0.18) 100%);
}
.band--feature .band__inner {
  justify-items: start;
}
.band--feature .band__line {
  max-width: 44ch;
  margin-inline: 0;
  text-align: left;
}
.band--feature .band__panel {
  max-width: 54ch;
  margin-inline: 0;
  background: rgba(5, 10, 20, 0.68);
}

/* ==================== SERVICES PAGE ON WHITE ==================== */
.page-white main,
.page-white .page-head,
.page-white .section,
.page-white .section--panel {
  background: #ffffff;
}
.page-white .page-head h1,
.page-white .section h2 {
  color: #16233a;
}
.page-white .page-head .standfirst,
.page-white .prose p,
.page-white .prose li {
  color: #44506a;
}
.page-white .eyebrow {
  color: #8a6a1f;
}
.page-white .rule {
  border-color: #d9dde6;
  background: #d9dde6;
}
.page-white .prose .link-arrow {
  color: #8a6a1f;
}
/* rows keep the original dark treatment */
.page-white .srow {
  background: var(--color-panel);
  border-color: #21304c;
  color: var(--color-text);
}
.page-white .srow:hover,
.page-white .srow:focus-visible {
  border-color: var(--color-accent);
  background: #17304f;
}
.page-white .srow__title {
  color: var(--color-accent);
}
.page-white .srow__body p {
  color: var(--color-text-muted);
}
.page-white .srow .rule {
  border-color: #2b3a56;
  background: #2b3a56;
}

/* white services page: fixes */
.page-white .page-head::before {
  background: #ffffff;
}
.page-white .section h2.srow__title {
  color: var(--color-accent);
}
.page-white .srow__body p,
.page-white .srow .prose p {
  color: var(--color-text-muted);
}
.page-white .page-head {
  border-bottom-color: #e3e6ec;
}

/* white services page: keep the header bar dark so the nav stays legible */
.page-white .header {
  background: rgba(15, 30, 51, 0.98);
  border-bottom-color: var(--color-border);
}

/* band panel: line stays at the top, panel pushed to the bottom */
.band--feature {
  align-items: stretch;
  padding-bottom: clamp(1.25rem, 3vh, 2.25rem);
}
.band--feature .band__inner {
  align-content: space-between;
}
/* quieter closing line */
.band--stars .band__line {
  font-size: clamp(1.05rem, 0.9rem + 0.45vw, 1.4rem);
}

/* ====== SERVICES PAGE HEAD: READ IT WITHOUT THINKING (white page only) ====== */
.page-white .page-head .standfirst {
  max-width: 46ch;
  font-size: clamp(1.25rem, 1rem + 0.95vw, 1.85rem);
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.005em;
  color: #2b3750;
}
.page-white .page-head .eyebrow {
  font-size: 0.84rem;
  letter-spacing: 0.3em;
}
.page-white .page-head h1 {
  font-size: clamp(2.4rem, 1.5rem + 3.1vw, 4.2rem);
}

/* ============ SINGLE SECTION ON WHITE (Join Our Network) ============ */
.section--white {
  background: #ffffff;
}
.section--white h2,
.section--white h3 {
  color: #16233a;
}
.section--white h2.section-title--gold {
  color: #8a6a1f;
}
.section--white .prose p {
  color: #44506a;
}
.section--white .rule {
  background: #d9dde6;
  border-color: #d9dde6;
}
.section--white .btn--solid {
  background: var(--color-accent);
  border-color: var(--color-accent);
  color: #16233a;
}
.section--white .btn--solid:hover {
  background: #c2932f;
  border-color: #c2932f;
  color: #16233a;
}

/* Join Our Network: larger, easier to catch */
.section--white h2.section-title--gold {
  font-size: clamp(1.9rem, 1.3rem + 1.7vw, 2.9rem);
}
.section--white .prose h3 {
  font-size: 0.98rem;
  letter-spacing: 0.22em;
}
.section--white .prose p {
  font-size: clamp(1.1rem, 0.95rem + 0.6vw, 1.45rem);
  line-height: 1.5;
  color: #2b3750;
}
.section--white .btn--solid {
  font-size: 0.9rem;
  padding: 1rem 1.9rem;
}

/* Work With Us hero: lighter veil so the picture stays alive */
.hero--wwu .hero__media::after {
  background: linear-gradient(
    100deg,
    rgba(4, 8, 17, 0.72) 0%,
    rgba(4, 8, 17, 0.5) 34%,
    rgba(4, 8, 17, 0.22) 62%,
    rgba(4, 8, 17, 0.42) 100%
  );
}
.hero--wwu .hero__copy h1,
.hero--wwu .hero__lede {
  text-shadow: 0 2px 22px rgba(4, 8, 17, 0.85);
}

/* ==================== SERVICE ROWS ON WHITE ==================== */
.page-white .srow {
  background: #ffffff;
  border-color: #e1e5ec;
  color: #16233a;
  box-shadow: 0 1px 2px rgba(20, 35, 60, 0.04);
}
.page-white .srow:hover,
.page-white .srow:focus-visible {
  background: #fbfaf7;
  border-color: #c8a04a;
  box-shadow: 0 6px 20px rgba(20, 35, 60, 0.08);
}
.page-white .srow__title,
.page-white .section h2.srow__title {
  color: #8a6a1f;
}
.page-white .srow__body p,
.page-white .srow .prose p {
  color: #44506a;
}
.page-white .srow .rule {
  border-color: #e1e5ec;
  background: #e1e5ec;
}
.page-white .srow .link-arrow {
  color: #8a6a1f;
}
.page-white .section-title--gold {
  color: #8a6a1f;
}
.page-white .btn--solid {
  background: var(--color-accent);
  border-color: var(--color-accent);
  color: #16233a;
}
.page-white .btn--solid:hover {
  background: #c2932f;
  border-color: #c2932f;
}

/* ==================== SITE ON WHITE ==================== */
.page-white .section--panel,
.page-white .section--flush {
  background: #ffffff;
}
.page-white .section h3,
.page-white .prose h3,
.page-white .prose h4,
.page-white .prose strong {
  color: #16233a;
}
.page-white .prose a {
  color: #8a6a1f;
}
.page-white .note,
.page-white .note--confidentiality {
  background: #f7f6f2;
  border-color: #e1e5ec;
  color: #44506a;
}
.page-white .note h3,
.page-white .note h4 {
  color: #16233a;
}
.page-white .tile {
  background: #ffffff;
  border-color: #e1e5ec;
  box-shadow: 0 1px 2px rgba(20, 35, 60, 0.04);
}
.page-white .tile:hover,
.page-white .tile:focus-within {
  background: #fbfaf7;
  border-color: #c8a04a;
  box-shadow: 0 6px 20px rgba(20, 35, 60, 0.08);
}
.page-white .tile h3,
.page-white .tile__body h3 {
  color: #8a6a1f;
}
.page-white .tile__body p,
.page-white .tile__points li {
  color: #44506a;
}
.page-white .tile .rule,
.page-white .tile__body .rule {
  border-color: #e1e5ec;
  background: #e1e5ec;
}
.page-white .tile .link-arrow,
.page-white .section .link-arrow {
  color: #8a6a1f;
}
.page-white .btn--ghost {
  color: #16233a;
  border-color: #c2b184;
}
.page-white .btn--ghost:hover {
  color: #16233a;
  border-color: var(--color-accent);
  background: #faf7ef;
}
/* header, hero, bands and footer keep the dark register */
.page-white .header,
.page-white .hero,
.page-white .band {
  background: rgba(15, 30, 51, 0.98);
}
.page-white .hero,
.page-white .band {
  background: var(--color-bg);
}
.page-white .hero h1,
.page-white .hero .hero__lede,
.page-white .band,
.page-white .band h2,
.page-white .band p {
  color: var(--color-text);
}
.page-white .hero .rule,
.page-white .band .rule {
  border-color: rgba(213, 165, 60, 0.5);
  background: rgba(213, 165, 60, 0.5);
}

/* white pages: card grid and header button corrections */
.page-white .tiles--dark .tile {
  background: #ffffff;
  border-color: #e1e5ec;
  box-shadow: 0 1px 2px rgba(20, 35, 60, 0.04);
}
.page-white .tiles--dark .tile:hover,
.page-white .tiles--dark .tile:focus-within {
  background: #fbfaf7;
  border-color: #c8a04a;
  box-shadow: 0 6px 20px rgba(20, 35, 60, 0.08);
}
.page-white .tiles--dark .tile h3,
.page-white .tiles--dark .tile__body h3 {
  color: #8a6a1f;
}
.page-white .tiles--dark .tile__body p,
.page-white .tiles--dark .tile__points li {
  color: #44506a;
}
.page-white .tiles--dark .tile .rule {
  border-color: #e1e5ec;
  background: #e1e5ec;
}
.page-white .tiles--dark .tile .link-arrow {
  color: #8a6a1f;
}
.page-white .header .btn--ghost {
  color: var(--color-accent);
  border-color: rgba(213, 165, 60, 0.55);
}
.page-white .header .btn--ghost:hover {
  color: #0f1e33;
  background: var(--color-accent);
  border-color: var(--color-accent);
}

/* white pages: darker, larger reading text */
.page-white .prose p,
.page-white .prose li,
.page-white .page-head .standfirst,
.page-white .srow__body p,
.page-white .tiles--dark .tile__body p,
.page-white .tiles--dark .tile__points li {
  color: #16294a;
}
.page-white .prose p,
.page-white .prose li {
  font-size: clamp(1.05rem, 0.95rem + 0.35vw, 1.22rem);
  line-height: 1.62;
}
.page-white .section h2,
.page-white .section h3,
.page-white .prose h3,
.page-white .prose h4 {
  color: #10203c;
}
.page-white .section-title--gold,
.page-white .srow__title,
.page-white .tiles--dark .tile h3 {
  color: #7a5c14;
}

/* ==================== TEXT SECTION ON WHITE ==================== */
.section--paper {
  background: #ffffff;
}
.section--paper h2,
.section--paper h3,
.section--paper .prose h3,
.section--paper .prose h4 {
  color: #10203c;
}
.section--paper h2.section-title--gold {
  color: #7a5c14;
}
.section--paper .prose p,
.section--paper .prose li {
  color: #16294a;
  font-size: clamp(1.05rem, 0.95rem + 0.35vw, 1.22rem);
  line-height: 1.62;
}
.section--paper .rule {
  border-color: #d9dde6;
  background: #d9dde6;
}
.section--paper .prose a,
.section--paper .link-arrow {
  color: #7a5c14;
}
.section--paper .btn--solid {
  background: var(--color-accent);
  border-color: var(--color-accent);
  color: #16233a;
}

/* ==================== CONTACT: SOCIAL LINKS ==================== */
.social {
  list-style: none;
  display: flex;
  gap: 0.9rem;
  padding: 0;
  margin: 0.6rem 0 0;
}
.social__link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.9rem;
  border: 1px solid rgba(213, 165, 60, 0.42);
  border-radius: 2px;
  font-size: var(--text-xs);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-accent);
  text-decoration: none;
  transition: background 0.25s var(--ease), border-color 0.25s var(--ease);
}
.social__link,
.social__link:hover,
.social__link span {
  text-decoration: none;
}
.social__link svg {
  width: 16px;
  height: 16px;
}
.social__link:hover {
  background: rgba(213, 165, 60, 0.12);
  border-color: var(--color-accent);
}
.section--paper .social__link {
  color: #7a5c14;
  border-color: rgba(122, 92, 20, 0.4);
}

.prose .social__link,
.prose .social__link:hover,
.prose .social__link span {
  text-decoration: none;
  border-bottom: 0;
}
.social__link {
  min-width: 8.4rem;
  justify-content: center;
}

/* ==================== LANGUAGE SWITCH ==================== */
.lang {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  margin-left: var(--space-5);
  padding-left: var(--space-5);
  border-left: 1px solid var(--color-border);
  margin: 0;
  font-size: var(--text-xs);
  letter-spacing: 0.16em;
}
.lang__item {
  color: var(--color-text-muted);
  text-decoration: none;
  transition: color 0.25s var(--ease);
}
.lang__item + .lang__item::before {
  content: "";
}
.lang__item:hover {
  color: var(--color-accent);
}
.lang__item.is-active {
  color: var(--color-accent);
}
.lang::after {
  content: none;
}

/* Quiet qualifying line under an invitation */
.prose .fineprint {
  font-size: var(--text-xs);
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
  margin-top: var(--space-4);
}
.section--white .prose .fineprint,
.section--paper .prose .fineprint {
  color: #5d677a;
}

/* FR label in the French colours */
.lang__item--fr .fr-b { color: #6a9fe6; }
.lang__item--fr .fr-r { color: #e2554b; }
.lang__item--fr:hover .fr-b { color: #8db9f0; }
.lang__item--fr:hover .fr-r { color: #ef6b61; }
.section--white .lang__item--fr .fr-b,
.page-white .lang__item--fr .fr-b { color: #0b4ea2; }
.section--white .lang__item--fr .fr-r,
.page-white .lang__item--fr .fr-r { color: #c8322a; }

/* Keep the full desktop header on narrow laptops and split windows */
@media (max-width: 1240px) and (min-width: 901px) {
  .nav {
    gap: var(--space-4);
  }
  .nav a {
    letter-spacing: 0.1em;
  }
  .lang {
    margin-left: var(--space-4);
    padding-left: var(--space-4);
  }
  .brand__logo {
    max-width: 242px;
  }
}
@media (max-width: 1060px) and (min-width: 901px) {
  .nav {
    gap: var(--space-3);
  }
  .nav a {
    letter-spacing: 0.06em;
  }
  .brand__logo {
    max-width: 209px;
  }
}

/* ==================== ABOUT HERO ==================== */
.hero--about .hero__media img {
  filter: brightness(1.0);
  object-position: 70% center;
}
.hero--about .hero__media::after {
  background:
    linear-gradient(
      90deg,
      rgba(6, 14, 24, 0.96) 0%,
      rgba(6, 14, 24, 0.92) 30%,
      rgba(6, 14, 24, 0.86) 52%,
      rgba(6, 14, 24, 0.62) 74%,
      rgba(6, 14, 24, 0.45) 100%
    ),
    linear-gradient(180deg, rgba(6, 14, 24, 0.72) 0%, rgba(6, 14, 24, 0) 26%);
}
.hero--about .hero__copy {
  max-width: min(880px, 100%);
}
.hero--about h1 {
  max-width: 22ch;
}
.hero--about h1 {
  font-family: var(--font-display);
  font-size: clamp(2rem, 1.3rem + 1.8vw, 3.1rem);
  font-weight: 500;
  letter-spacing: 0.01em;
}
.hero--about .standfirst {
  margin-top: var(--space-5);
  max-width: 78ch;
  font-size: var(--text-base);
  font-weight: 300;
  line-height: 1.55;
  color: var(--color-text);
}

/* ==================== BUSINESS RESILIENCE HERO ==================== */
.hero--brr .hero__copy {
  max-width: min(820px, 100%);
}
.hero--brr h1 {
  margin-bottom: var(--space-4);
}
.hero--brr .eyebrow {
  margin-bottom: var(--space-4);
}
@media (min-width: 901px) {
  .hero--brr .hero__lede {
    white-space: nowrap;
    max-width: none;
  }
  .hero--brr .eyebrow {
    white-space: nowrap;
    margin-top: var(--space-4);
    margin-bottom: 0;
    letter-spacing: 0.2em;
    font-size: 0.72rem;
  }
}

/* ========================================================
   Copy protection — disable text selection and right-click
   Added 2026-08-29
   ======================================================== */
body * {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Allow selection in form fields (contact form) */
input,
textarea,
select {
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}
/* ==========================================================
   SERVICE HERO LIFT, 14 September 2026
   Level D overlay as the base, brightness tuned per
   photograph from measured luminance. The area behind the
   headline sets the left scrim tier. A top scrim is added
   only where the area behind the navigation is pale.
   Delete this whole block to return to the previous look.
   ========================================================== */

/* Resilience and continuity. Measured: whole 14.8, headline area 5.6, navigation area 9.2. */
.hero--resilience .hero__media img { filter: brightness(1.6) saturate(1.2) contrast(0.96); }
.hero--resilience .hero__media::after {
  background:
    linear-gradient(90deg,rgba(6,14,24,.50) 0%,rgba(6,14,24,.34) 32%,rgba(6,14,24,.10) 54%,rgba(6,14,24,0) 74%,rgba(6,14,24,0) 100%);
}

/* Intelligence and advisory. Measured: whole 23.7, headline area 3.2, navigation area 13.5. */
.hero--intel .hero__media img { filter: brightness(1.55) saturate(1.2) contrast(0.96); }
.hero--intel .hero__media::after {
  background:
    linear-gradient(90deg,rgba(6,14,24,.50) 0%,rgba(6,14,24,.34) 32%,rgba(6,14,24,.10) 54%,rgba(6,14,24,0) 74%,rgba(6,14,24,0) 100%);
}

/* Privacy protective oversight. Measured: whole 26.5, headline area 15.5, navigation area 21.6. */
.hero--privacy .hero__media img { filter: brightness(1.5) saturate(1.18) contrast(0.97); }
.hero--privacy .hero__media::after {
  background:
    linear-gradient(to bottom,rgba(5,10,20,.82) 0px,rgba(5,10,20,.52) 74px,rgba(5,10,20,0) 154px),
    linear-gradient(90deg,rgba(6,14,24,.50) 0%,rgba(6,14,24,.34) 32%,rgba(6,14,24,.10) 54%,rgba(6,14,24,0) 74%,rgba(6,14,24,0) 100%);
}

/* Crisis preparedness. Measured: whole 32.4, headline area 33.2, navigation area 19.4. */
.hero--crisis .hero__media img { filter: brightness(1.45) saturate(1.16) contrast(0.98); }
.hero--crisis .hero__media::after {
  background:
    linear-gradient(90deg,rgba(6,14,24,.62) 0%,rgba(6,14,24,.44) 32%,rgba(6,14,24,.16) 54%,rgba(6,14,24,0) 74%,rgba(6,14,24,0) 100%);
}

/* Site selection. Measured: whole 35.1, headline area 20.0, navigation area 35.4. */
.hero--siteselect .hero__media img { filter: brightness(1.42) saturate(1.16) contrast(0.98); }
.hero--siteselect .hero__media::after {
  background:
    linear-gradient(90deg,rgba(6,14,24,.50) 0%,rgba(6,14,24,.34) 32%,rgba(6,14,24,.10) 54%,rgba(6,14,24,0) 74%,rgba(6,14,24,0) 100%);
}

/* Strategic advisory. Measured: whole 64.2, headline area 71.2, navigation area 57.4. */
.hero--sads .hero__media img { filter: brightness(1.2) saturate(1.1) contrast(1.02); }
.hero--sads .hero__media::after {
  background:
    linear-gradient(90deg,rgba(6,14,24,.82) 0%,rgba(6,14,24,.66) 32%,rgba(6,14,24,.36) 54%,rgba(6,14,24,.10) 76%,rgba(6,14,24,0) 100%);
}

/* Business resilience re-planning. Measured: whole 64.4, headline area 46.4, navigation area 95.2. */
.hero--brr .hero__media img { filter: brightness(1.2) saturate(1.1) contrast(1.02); }
.hero--brr .hero__media::after {
  background:
    linear-gradient(to bottom,rgba(5,10,20,.82) 0px,rgba(5,10,20,.52) 74px,rgba(5,10,20,0) 154px),
    linear-gradient(90deg,rgba(6,14,24,.62) 0%,rgba(6,14,24,.44) 32%,rgba(6,14,24,.16) 54%,rgba(6,14,24,0) 74%,rgba(6,14,24,0) 100%);
}

/* Tunisia relocation check. Measured: whole 70.6, headline area 50.6, navigation area 67.0. */
.hero--relocation .hero__media img { filter: brightness(1.15) saturate(1.08) contrast(1.02); }
.hero--relocation .hero__media::after {
  background:
    linear-gradient(90deg,rgba(6,14,24,.62) 0%,rgba(6,14,24,.44) 32%,rgba(6,14,24,.16) 54%,rgba(6,14,24,0) 74%,rgba(6,14,24,0) 100%);
}

/* Carthage Watch. Measured: whole 93.0, headline area 70.5, navigation area 129.1. */
.hero--watch .hero__media img { filter: brightness(1.12) saturate(1.06) contrast(1.03); }
.hero--watch .hero__media::after {
  background:
    linear-gradient(to bottom,rgba(5,10,20,.82) 0px,rgba(5,10,20,.52) 74px,rgba(5,10,20,0) 154px),
    linear-gradient(90deg,rgba(6,14,24,.62) 0%,rgba(6,14,24,.44) 32%,rgba(6,14,24,.16) 54%,rgba(6,14,24,0) 74%,rgba(6,14,24,0) 100%);
}

/* Workforce risk and compliance. Measured: whole 94.3, headline area 38.6, navigation area 151.4. */
.hero--workforce .hero__media img { filter: brightness(1.05) saturate(1.06) contrast(1.03); }
.hero--workforce .hero__media::after {
  background:
    linear-gradient(to bottom,rgba(5,10,20,.82) 0px,rgba(5,10,20,.52) 74px,rgba(5,10,20,0) 154px),
    linear-gradient(90deg,rgba(6,14,24,.62) 0%,rgba(6,14,24,.44) 32%,rgba(6,14,24,.16) 54%,rgba(6,14,24,0) 74%,rgba(6,14,24,0) 100%);
}

/* International delivery support. Measured: whole 136.2, headline area 71.7, navigation area 152.4. */
.hero--ids .hero__media img { filter: brightness(0.98) saturate(1.04) contrast(1.04); }
.hero--ids .hero__media::after {
  background:
    linear-gradient(to bottom,rgba(5,10,20,.82) 0px,rgba(5,10,20,.52) 74px,rgba(5,10,20,0) 154px),
    linear-gradient(90deg,rgba(6,14,24,.74) 0%,rgba(6,14,24,.58) 32%,rgba(6,14,24,.28) 54%,rgba(6,14,24,.06) 76%,rgba(6,14,24,0) 100%);
}

/* Insurance for the lifted photographs, at the same strength as the
   text shadows already used elsewhere in this stylesheet. */
.hero--resilience .hero__copy h1, .hero--resilience .hero__lede, .hero--intel .hero__copy h1, .hero--intel .hero__lede, .hero--privacy .hero__copy h1, .hero--privacy .hero__lede, .hero--crisis .hero__copy h1, .hero--crisis .hero__lede, .hero--siteselect .hero__copy h1, .hero--siteselect .hero__lede, .hero--sads .hero__copy h1, .hero--sads .hero__lede, .hero--brr .hero__copy h1, .hero--brr .hero__lede, .hero--relocation .hero__copy h1, .hero--relocation .hero__lede, .hero--watch .hero__copy h1, .hero--watch .hero__lede, .hero--workforce .hero__copy h1, .hero--workforce .hero__lede, .hero--ids .hero__copy h1, .hero--ids .hero__lede, .hero--maritime .hero__copy h1, .hero--maritime .hero__lede {
  text-shadow: 0 2px 22px rgba(5,10,20,.85);
}

/* Industries sector cards. Mirrors the original Focus Sectors design: a light
   card, a gold rule across the top, the sector name, the description, then the
   typical mandates under a divider. */
.sector-head {
  display: flex;
  align-items: baseline;
  gap: 16px;
  margin-bottom: 8px;
}
.sector-head h2 {
  margin: 0;
}
.sector-num {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.2em;
  color: var(--color-accent);
}
.sector-note {
  max-width: 62ch;
  margin: 0 0 30px;
  font-size: 15.5px;
  line-height: 1.6;
  color: #c3cddd;
}
.sector-grid {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.sector-card {
  display: flex;
  flex-direction: column;
  background: var(--color-card);
  border: 1px solid #ded7c9;
  border-top: 3px solid var(--color-accent);
  padding: 30px 28px 28px;
}
.sector-card h3 {
  margin: 0 0 14px;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1.36rem;
  line-height: 1.24;
  color: var(--color-card-text);
}
.sector-card p {
  margin: 0 0 22px;
  font-size: 15px;
  line-height: 1.62;
  color: #3f4858;
}
.sector-mandates {
  margin: auto 0 0;
  padding-top: 18px;
  border-top: 1px solid #ded7c9;
}
.sector-mandates dt {
  margin-bottom: 9px;
  font-family: var(--font-body);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #8a6a1c;
}
.sector-mandates dd {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.6;
  color: #4b5464;
}
@media (max-width: 1100px) {
  .sector-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .sector-grid {
    grid-template-columns: 1fr;
  }
  .sector-card {
    padding: 26px 22px 24px;
  }
}

/* Industries hero, own image */

.sector-card__media {
  margin: 0 0 var(--space-5);
  overflow: hidden;
  border-radius: 2px;
  background: #0f1e33;
  aspect-ratio: 4 / 3;
}

.sector-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero--industries .hero__media img {
  object-position: center center;
}

/* Industries, index of the six sectors linking down to each card */
.sector-index {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}

.sector-index a {
  display: flex;
  flex-direction: column;
  gap: 7px;
  height: 100%;
  padding: 17px 20px 18px;
  background: var(--color-panel);
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--color-accent);
  text-decoration: none;
  transition: background 0.2s ease, border-color 0.2s ease;
}

.sector-index a:hover,
.sector-index a:focus-visible {
  background: #17304e;
  border-color: #2c405f;
  border-left-color: var(--color-accent);
}

.sector-index__group {
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.sector-index__name {
  font-family: var(--font-display);
  font-size: 1.1rem;
  line-height: 1.26;
  color: #ffffff;
}

.sector-card {
  scroll-margin-top: 132px;
}

@media (max-width: 900px) {
  .sector-index {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .sector-index {
    grid-template-columns: 1fr;
  }
  .sector-card {
    scroll-margin-top: 96px;
  }
}

/* Maritime and ports sector page hero */
.hero--maritime .hero__media img {
  object-position: center center;
}

/* Header band so the navigation stays legible over the bright terminal */
.hero--maritime .hero__media::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 178px;
  background: linear-gradient(180deg, rgba(6, 14, 24, 0.96) 0%, rgba(6, 14, 24, 0.88) 40%, rgba(6, 14, 24, 0.5) 72%, rgba(6, 14, 24, 0) 100%);
  z-index: 3;
  pointer-events: none;
}

.sector-card__link {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid rgba(213, 165, 60, 0.55);
  transition: border-color 0.2s ease, color 0.2s ease;
}

.sector-card__link:hover,
.sector-card__link:focus-visible {
  color: #8a6a1c;
  border-bottom-color: var(--color-accent);
}

/* Industries hero, brighter photo with the copy kept legible */
.hero--industries .hero__media img {
  filter: brightness(1.34) saturate(1.1) contrast(1);
}

.hero--industries .hero__media::after {
  background: linear-gradient(
    90deg,
    rgba(6, 14, 24, 0.62) 0%,
    rgba(6, 14, 24, 0.44) 32%,
    rgba(6, 14, 24, 0.16) 54%,
    rgba(6, 14, 24, 0) 74%,
    rgba(6, 14, 24, 0) 100%
  );
}

.hero--industries .hero__media::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 178px;
  background: linear-gradient(180deg, rgba(6, 14, 24, 0.94) 0%, rgba(6, 14, 24, 0.84) 42%, rgba(6, 14, 24, 0.46) 72%, rgba(6, 14, 24, 0) 100%);
  z-index: 3;
  pointer-events: none;
}

.hero--industries .hero__copy h1,
.hero--industries .hero__lede {
  text-shadow: 0 1px 2px rgba(4, 8, 17, 0.6), 0 2px 16px rgba(4, 8, 17, 0.66);
}

.hero--industries .hero__copy .eyebrow {
  text-shadow: 0 1px 2px rgba(4, 8, 17, 0.85), 0 0 12px rgba(4, 8, 17, 0.85);
}

/* The five remaining sector pages, same hero treatment as Maritime and ports */
.hero--agriculture-food-security-and-water .hero__media img,
.hero--construction-and-real-estate .hero__media img,
.hero--transport-and-logistics .hero__media img,
.hero--tourism-and-hospitality .hero__media img,
.hero--sport-media-and-entertainment .hero__media img {
  object-position: center center;
}

.hero--agriculture-food-security-and-water .hero__media::before,
.hero--construction-and-real-estate .hero__media::before,
.hero--transport-and-logistics .hero__media::before,
.hero--tourism-and-hospitality .hero__media::before,
.hero--sport-media-and-entertainment .hero__media::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 178px;
  background: linear-gradient(180deg, rgba(6, 14, 24, 0.96) 0%, rgba(6, 14, 24, 0.88) 40%, rgba(6, 14, 24, 0.5) 72%, rgba(6, 14, 24, 0) 100%);
  z-index: 3;
  pointer-events: none;
}

.hero--agriculture-food-security-and-water .hero__copy h1,
.hero--agriculture-food-security-and-water .hero__lede,
.hero--construction-and-real-estate .hero__copy h1,
.hero--construction-and-real-estate .hero__lede,
.hero--transport-and-logistics .hero__copy h1,
.hero--transport-and-logistics .hero__lede,
.hero--tourism-and-hospitality .hero__copy h1,
.hero--tourism-and-hospitality .hero__lede,
.hero--sport-media-and-entertainment .hero__copy h1,
.hero--sport-media-and-entertainment .hero__lede {
  text-shadow: 0 2px 18px rgba(4, 8, 17, 0.72), 0 1px 3px rgba(4, 8, 17, 0.55);
}

/* Transport and logistics, Beja Tabarka hero. Framed so the road sign stays whole at every width */
.hero--transport-and-logistics .hero__media img {
  object-position: center 78%;
}

@media (max-width: 760px) {
  .hero--transport-and-logistics .hero__media img {
    object-position: 76% 58%;
  }

  .hero--transport-and-logistics .hero__media::after {
    background: linear-gradient(
      180deg,
      rgba(6, 14, 24, 0.88) 0%,
      rgba(6, 14, 24, 0.86) 46%,
      rgba(6, 14, 24, 0.7) 70%,
      rgba(6, 14, 24, 0.52) 100%
    );
  }
}

.hero--transport-and-logistics .hero__media::after {
  background: linear-gradient(
    90deg,
    rgba(6, 14, 24, 0.97) 0%,
    rgba(6, 14, 24, 0.93) 38%,
    rgba(6, 14, 24, 0.72) 56%,
    rgba(6, 14, 24, 0.38) 76%,
    rgba(6, 14, 24, 0.2) 100%
  );
}

.hero--transport-and-logistics .hero__copy h1,
.hero--transport-and-logistics .hero__lede,
.hero--transport-and-logistics .eyebrow {
  text-shadow: 0 2px 20px rgba(4, 8, 17, 0.85), 0 1px 3px rgba(4, 8, 17, 0.7);
}

/* Sport, media and entertainment hero. The file is cut to the hero ratio so the whole
   stadium shows with no crop. The left of the file is site navy, blended into the photo,
   which is where the heading sits */
.hero--sport-media-and-entertainment .hero__media img {
  object-position: center center;
}

.hero--sport-media-and-entertainment .hero__media::before {
  content: none;
}

.hero--sport-media-and-entertainment .hero__media::after {
  background: linear-gradient(
    90deg,
    rgba(6, 14, 24, 0.5) 0%,
    rgba(6, 14, 24, 0.42) 40%,
    rgba(6, 14, 24, 0.3) 62%,
    rgba(6, 14, 24, 0.24) 100%
  );
}

@media (max-width: 760px) {
  .hero--sport-media-and-entertainment .hero__media img {
    object-position: 84% center;
  }

  .hero--sport-media-and-entertainment .hero__media::after {
    background: linear-gradient(
      180deg,
      rgba(6, 14, 24, 0.82) 0%,
      rgba(6, 14, 24, 0.78) 48%,
      rgba(6, 14, 24, 0.6) 76%,
      rgba(6, 14, 24, 0.44) 100%
    );
  }
}