:root {
  /* v21: the site is designed for light backgrounds only. Without this, phone browsers in dark
     mode (e.g. Chrome on Android) darken the page themselves and turn the blue text on yellow
     areas almost white. Together with <meta name="color-scheme" content="only light">. */
  color-scheme: only light;
  --navy: #003399;
  --blue: #003299;
  --blue-bright: #2d5fbd;
  --red: #cc0000;
  --gold: #ffcc00;
  --gold-dark: #cc9900;
  --ink: #10234d;
  --muted: #566684;
  --slate: #5b6b86;
  --line: #d7e1f2;
  --paper: #ffffff;
  --mist: #f2f6ff;
  /* v18: large full-width pale-blue sections (.section-mist, the evidence strip on the home
     page, the error page) – slightly darker than --mist so they stay distinct from white on
     washed-out screens. Cards, tabs, table headers and image frames inside keep --mist. */
  --section-mist: #e7eef9;
  /* v15: blue information panels ("Auf einen Blick", "Direkter Kontakt", form notes).
     Section backgrounds and image placeholders keep --mist. */
  --panel-blue: #d3e0f3;
  --panel-blue-line: #afc3e3;
  --cream: #fff8d6;
  /* v21: colours of the large closing band (.cta-band) – brand yellow with blue text (contrast 7.2 : 1). */
  --band-bg: var(--gold);
  --band-text: var(--navy);
  --shadow: 0 18px 50px rgba(0, 51, 153, 0.12);
  --radius: 18px;
  --container: 1180px;
}

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

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
}

body.nav-open {
  overflow: hidden;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
}

a:hover {
  color: var(--blue);
}

button,
input,
textarea,
select {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

:focus-visible {
  outline: 3px solid rgba(0, 50, 153, 0.35);
  outline-offset: 3px;
}

h1,
h2,
h3,
h4,
p {
  margin-top: 0;
}

h1,
h2,
h3,
h4 {
  color: var(--navy);
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 700;
  line-height: 1.12;
}

h1 {
  font-size: clamp(2.75rem, 6vw, 5.5rem);
  letter-spacing: -0.045em;
}

h2 {
  font-size: clamp(2rem, 4vw, 3.7rem);
  letter-spacing: -0.035em;
}

h3 {
  font-size: 1.35rem;
}

.container {
  width: min(100% - 40px, var(--container));
  margin-inline: auto;
}

.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 999;
  padding: 10px 16px;
  color: var(--paper);
  background: var(--navy);
  border-radius: 8px;
  transform: translateY(-150%);
}

.skip-link:focus {
  transform: translateY(0);
}

.topbar {
  color: rgba(255, 255, 255, 0.88);
  background: var(--navy);
  font-size: 0.82rem;
}

.topbar-inner {
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.topbar-meta {
  display: flex;
  align-items: center;
  gap: 22px;
}

.topbar a:hover {
  color: var(--gold);
}

.language-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.language-link::before {
  content: "";
  width: 7px;
  height: 7px;
  background: var(--gold);
  border-radius: 50%;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255, 255, 255, 0.96);
  border-bottom: 1px solid rgba(0, 51, 153, 0.08);
  backdrop-filter: blur(12px);
}

.nav-row {
  min-height: 86px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.brand {
  flex: 0 0 auto;
}

.brand img {
  width: 156px;
  height: auto;
}

.site-nav {
  display: flex;
  align-items: center;
  gap: 4px;
}

.nav-blog-group {
  position: relative;
  display: flex;
  align-items: center;
}

.nav-submenu-toggle {
  width: 30px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  margin-left: -10px;
  padding: 0;
  color: var(--blue);
  background: transparent;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
}

.nav-submenu-toggle span {
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  transition: transform 180ms ease;
}

.nav-submenu-toggle[aria-expanded="true"] span {
  transform: translateY(2px) rotate(225deg);
}

.nav-submenu {
  position: absolute;
  top: calc(100% + 8px);
  left: 4px;
  z-index: 80;
  min-width: 238px;
  padding: 10px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 3px solid var(--red);
  border-radius: 12px;
  box-shadow: var(--shadow);
}

.nav-submenu[hidden] {
  display: none;
}

.site-nav .nav-submenu a {
  display: block;
  padding: 10px 12px;
  white-space: nowrap;
  border-radius: 8px;
}

.site-nav .nav-submenu a:hover,
.site-nav .nav-submenu a[aria-current="page"] {
  color: var(--paper);
  background: var(--blue);
}

.site-nav .nav-submenu a::after {
  display: none;
}

.nav-cta-group {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-left: 10px;
}

.site-nav a {
  position: relative;
  padding: 13px 14px;
  color: #2f4771;
  font-size: 0.92rem;
  font-weight: 750;
}

.site-nav a:not(.nav-cta)::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 7px;
  height: 2px;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 180ms ease;
}

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

.site-nav a:hover::after,
.site-nav a[aria-current="page"]::after {
  transform: scaleX(1);
}

.nav-cta {
  color: var(--navy) !important;
  background: var(--gold);
  border-radius: 999px;
  padding-inline: 19px !important;
}

.nav-cta:hover {
  color: var(--paper) !important;
  background: var(--blue);
}

.nav-cta-opportunity {
  color: var(--paper) !important;
  background: var(--blue);
  box-shadow: inset 0 -3px 0 var(--red);
}

.nav-cta-opportunity:hover {
  color: var(--paper) !important;
  background: var(--red);
}

.menu-toggle {
  width: 46px;
  height: 46px;
  display: none;
  align-items: center;
  justify-content: center;
  color: var(--navy);
  background: var(--mist);
  border: 0;
  border-radius: 10px;
  cursor: pointer;
}

.menu-toggle-lines,
.menu-toggle-lines::before,
.menu-toggle-lines::after {
  width: 22px;
  height: 2px;
  display: block;
  background: currentColor;
  border-radius: 2px;
  transition: transform 180ms ease, opacity 180ms ease;
}

.menu-toggle-lines {
  position: relative;
}

.menu-toggle-lines::before,
.menu-toggle-lines::after {
  content: "";
  position: absolute;
  left: 0;
}

.menu-toggle-lines::before {
  top: -7px;
}

.menu-toggle-lines::after {
  top: 7px;
}

.menu-toggle[aria-expanded="true"] .menu-toggle-lines {
  background: transparent;
}

.menu-toggle[aria-expanded="true"] .menu-toggle-lines::before {
  top: 0;
  transform: rotate(45deg);
}

.menu-toggle[aria-expanded="true"] .menu-toggle-lines::after {
  top: 0;
  transform: rotate(-45deg);
}

.hero {
  position: relative;
  min-height: min(760px, calc(100vh - 124px));
  display: grid;
  align-items: end;
  isolation: isolate;
  color: var(--paper);
  background-color: var(--navy);
  background-position: center;
  background-size: cover;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background: linear-gradient(90deg, rgba(0, 27, 82, 0.96) 0%, rgba(0, 39, 115, 0.84) 45%, rgba(0, 39, 115, 0.26) 76%, rgba(0, 39, 115, 0.12) 100%);
}

.hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 7px;
  z-index: -1;
  background: linear-gradient(90deg, var(--blue) 0 33.33%, var(--red) 33.33% 66.66%, var(--gold) 66.66%);
}

.hero-content {
  width: min(760px, 100%);
  padding: clamp(90px, 13vh, 150px) 0 clamp(70px, 10vh, 112px);
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 20px;
  color: var(--gold);
  font-size: 0.82rem;
  font-weight: 850;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.eyebrow::before {
  content: "";
  width: 36px;
  height: 2px;
  background: currentColor;
}

.hero h1 {
  margin-bottom: 24px;
  color: var(--paper);
  max-width: 760px;
}

.hero h1 span {
  color: var(--gold);
}

.hero-lead {
  max-width: 680px;
  margin-bottom: 18px;
  color: rgba(255, 255, 255, 0.84);
  font-size: clamp(1.05rem, 2vw, 1.28rem);
}

.hero .eyebrow-bottom {
  margin-bottom: 30px;
  color: rgba(255, 255, 255, 0.82);
}

.button-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.button {
  min-height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 13px 22px;
  color: var(--navy);
  background: var(--gold);
  border: 2px solid var(--gold);
  border-radius: 999px;
  font-size: 0.92rem;
  font-weight: 850;
  line-height: 1.2;
  transition: color 180ms ease, background 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.button:hover {
  color: var(--paper);
  background: var(--blue);
  border-color: var(--blue);
  transform: translateY(-2px);
}

.button:disabled {
  cursor: wait;
  opacity: 0.58;
}

.button-secondary {
  color: var(--paper);
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.5);
}

.button-secondary:hover {
  color: var(--navy);
  background: var(--paper);
  border-color: var(--paper);
}

.button-dark {
  color: var(--paper);
  background: var(--navy);
  border-color: var(--navy);
}

.button-dark:hover {
  color: var(--navy);
  background: var(--gold);
  border-color: var(--gold);
}

.button-outline-dark {
  color: var(--navy);
  background: transparent;
  border-color: var(--navy);
  box-shadow: inset 0 -3px 0 var(--red);
}

.button-outline-dark:hover {
  color: var(--paper);
  background: var(--blue);
  border-color: var(--blue);
}

.metrics-strip {
  position: relative;
  z-index: 3;
  margin-top: -1px;
  color: var(--paper);
  background: var(--navy);
}

.metrics-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.metric {
  min-height: 132px;
  padding: 29px 24px;
  border-right: 1px solid rgba(255, 255, 255, 0.12);
}

.metric:last-child {
  border-right: 0;
}

.metric-value {
  margin-bottom: 3px;
  color: var(--gold);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2.25rem;
  font-weight: 700;
  line-height: 1;
}

.metric-label {
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.86rem;
}

.section {
  padding: clamp(72px, 10vw, 126px) 0;
}

.section-tight {
  padding: clamp(56px, 8vw, 92px) 0;
}

.section-mist {
  background: var(--section-mist);
}

.section-dark {
  color: var(--paper);
  background: var(--navy);
}

.section-dark h2,
.section-dark h3 {
  color: var(--paper);
}

.section-head {
  max-width: 780px;
  margin-bottom: 48px;
}

.section-head.center {
  margin-inline: auto;
  text-align: center;
}

.section-kicker {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 14px;
  color: var(--blue);
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.section-kicker::before {
  content: "";
  width: 18px;
  height: 2px;
  flex: 0 0 auto;
  background: var(--red);
}

.section-dark .section-kicker {
  color: var(--gold);
}

.section-head h2 {
  margin-bottom: 18px;
}

.section-head p {
  margin-bottom: 0;
  color: var(--muted);
  font-size: 1.08rem;
}

.section-dark .section-head p {
  color: rgba(255, 255, 255, 0.72);
}

.intro-grid,
.content-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(44px, 7vw, 92px);
  align-items: center;
}

.intro-grid h2,
.content-grid h2 {
  margin-bottom: 0;
}

.intro-copy p:last-child,
.prose > *:last-child {
  margin-bottom: 0;
}

.intro-copy strong {
  color: var(--navy);
}

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

.service-card {
  position: relative;
  min-height: 430px;
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 2px 0 rgba(0, 51, 153, 0.02);
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.service-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  z-index: 2;
  background: linear-gradient(90deg, var(--blue) 0 48%, var(--red) 48% 54%, var(--gold) 54%);
}

.service-card:hover {
  color: inherit;
  border-color: rgba(0, 50, 153, 0.3);
  box-shadow: var(--shadow);
  transform: translateY(-6px);
}

.service-card-media {
  display: block;
  overflow: hidden;
  background: var(--navy);
  aspect-ratio: 5 / 3;
}

.service-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 300ms ease;
}

.service-card:hover .service-card-media img {
  transform: scale(1.035);
}

.service-card-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 26px 28px 29px;
}

.service-number {
  display: block;
  margin-bottom: 18px;
  color: var(--blue);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 0.95rem;
  font-weight: 700;
}

.service-card h3 {
  margin-bottom: 12px;
  font-size: 1.4rem;
}

.service-card p {
  margin-bottom: 22px;
  color: var(--muted);
  font-size: 0.94rem;
}

.service-link {
  margin-top: auto;
  color: var(--blue);
  font-size: 0.87rem;
  font-weight: 850;
}

.service-link::after {
  content: "\00a0\2192";   /* v15: the arrow never stands alone on a new line */
}

.check-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.home-check-offer {
  margin-top: clamp(34px, 4.5vw, 54px);
}

.home-check-offer .check-choice-grid {
  gap: 12px;
}

.home-check-offer .check-choice-card:first-child {
  border-top: 4px solid var(--blue);
  box-shadow: 0 14px 36px rgba(7, 29, 73, 0.14), inset 0 0 0 1px rgba(65, 137, 209, 0.14);
}

.home-check-offer .check-choice-card:nth-child(2) {
  border-top: 4px solid var(--red);
  box-shadow: 0 14px 36px rgba(7, 29, 73, 0.12), inset 0 0 0 1px rgba(160, 36, 45, 0.12);
}

.home-services-section {
  margin-top: clamp(58px, 7vw, 88px);
}

.check-choice-card {
  min-height: 410px;
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  color: var(--paper);
  background: linear-gradient(145deg, var(--navy), #0b3775);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  transition: transform 180ms ease, background 180ms ease;
}

.check-choice-card:nth-child(2) {
  color: var(--navy);
  background: linear-gradient(145deg, var(--gold), #f8d86c);
}

.check-choice-card:hover {
  color: var(--paper);
  background: var(--blue);
  transform: translateY(-5px);
}

.check-choice-card-media {
  display: block;
  width: 100%;
  height: clamp(145px, 16vw, 190px);
  flex: 0 0 auto;
  overflow: hidden;
  background: var(--paper);
}

.check-choice-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 300ms ease;
}

.check-choice-card:hover .check-choice-card-media img {
  transform: scale(1.025);
}

.check-choice-card-body {
  min-height: 245px;
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: clamp(26px, 4vw, 38px);
}

.check-choice-number {
  margin-bottom: 12px;
  color: var(--gold);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2rem;
  font-weight: 700;
}

.check-choice-card:nth-child(2) .check-choice-number {
  color: var(--red);
}

.check-choice-card:hover .check-choice-number {
  color: var(--gold);
}

.check-choice-card h3 {
  margin-top: 0;
  color: inherit;
  font-size: clamp(1.45rem, 2.5vw, 2rem);
}

.check-choice-card p {
  color: inherit;
  opacity: 0.78;
}

.check-choice-card strong {
  margin-top: auto;
  color: inherit;
  font-size: 0.9rem;
}

.process-intro-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(360px, 1.1fr);
  gap: clamp(34px, 6vw, 78px);
  align-items: center;
}

.process-intro-grid .section-head {
  margin-bottom: 0;
}

.process-feature-media {
  height: clamp(210px, 24vw, 290px);
  margin: 0;
  overflow: hidden;
  background: var(--paper);
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: var(--radius);
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.2);
}

.process-feature-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.process-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 30px;
  margin: 48px 0;
}

.process-step {
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.process-step span {
  display: block;
  margin-bottom: 18px;
  color: var(--gold);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2.3rem;
  font-weight: 700;
}

.process-step h3 {
  margin-bottom: 12px;
}

.process-step p {
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.68);
}

.section-dark-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.section-dark-secondary {
  color: var(--paper);
  background: transparent;
  border-color: rgba(255, 255, 255, 0.52);
  box-shadow: inset 0 -3px 0 var(--red);
}

.section-dark-secondary:hover {
  color: var(--navy);
  background: var(--paper);
  border-color: var(--paper);
}

.page-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(78px, 11vw, 130px) 0;
  color: var(--paper);
  background: var(--navy);
}

.page-hero-image {
  min-height: 440px;
  display: flex;
  align-items: center;
  background-color: var(--navy);
}

.page-hero-media {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.page-hero-image::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(0, 27, 82, 0.95) 0%, rgba(0, 39, 115, 0.78) 52%, rgba(0, 39, 115, 0.35) 100%);
}

.page-hero::after {
  content: "";
  position: absolute;
  top: -180px;
  right: -140px;
  width: 520px;
  height: 520px;
  z-index: 1;
  opacity: 0.16;
  background: radial-gradient(circle, var(--blue-bright) 0 35%, transparent 36%), radial-gradient(circle, var(--gold) 0 2%, transparent 3%);
  background-size: auto, 28px 28px;
  border-radius: 50%;
}

.page-hero .container {
  position: relative;
  z-index: 2;
}

.page-hero h1 {
  max-width: 900px;
  margin-bottom: 20px;
  color: var(--paper);
  font-size: clamp(2.7rem, 6vw, 5.2rem);
}

.page-hero p {
  max-width: 760px;
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: clamp(1.05rem, 2vw, 1.25rem);
}

.page-hero .eyebrow-bottom {
  margin-top: 20px;
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.82);
}

.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-bottom: 25px;
  color: var(--gold);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.breadcrumbs a:hover {
  color: var(--paper);
}

.detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.65fr);
  gap: clamp(42px, 7vw, 92px);
  align-items: start;
}

.detail-grid > *,
.article-layout > * {
  min-width: 0;
}

.prose h2 {
  margin: 0 0 24px;
}

.prose h3 {
  margin: 38px 0 16px;
}

.prose p,
.prose li {
  color: #4c5f80;
}

.lead-paragraph {
  color: var(--navy) !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.2rem, 2vw, 1.5rem);
  line-height: 1.55;
}

.content-figure {
  margin: 34px 0;
  overflow: hidden;
  background: var(--mist);
  border: 1px solid var(--line);
  border-radius: 14px;
}

.content-figure img {
  width: 100%;
  aspect-ratio: 5 / 3;
  object-fit: cover;
}

.content-figure figcaption {
  padding: 11px 15px;
  color: var(--muted);
  font-size: 0.78rem;
}

.callout {
  margin: 34px 0;
  padding: 24px 26px;
  background: var(--cream);
  border-left: 5px solid var(--gold);
  border-radius: 0 12px 12px 0;
}

.callout strong {
  display: block;
  margin-bottom: 6px;
  color: var(--navy);
}

.callout p {
  margin-bottom: 0;
}

.rich-content blockquote {
  position: relative;
  margin: 38px 0;
  padding: 10px 0 10px 52px;
  border: 0;
}

.rich-content blockquote::before {
  content: "“";
  position: absolute;
  top: -18px;
  left: 0;
  color: var(--gold-dark);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 5.5rem;
  line-height: 1;
}

.rich-content blockquote p {
  margin: 0;
  color: var(--navy);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.2rem, 2vw, 1.55rem);
  font-style: italic;
}

.table-scroll {
  max-width: 100%;
  margin: 24px 0 38px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  /* v15: no scrollbar-gutter here. Tables scroll only sideways; reserving a vertical
     scrollbar gutter left a white notch beside the table header with visible scrollbars. */
  border: 1px solid var(--line);
  border-radius: 12px;
}

.blog-table {
  margin-block: 30px 38px;
}

.blog-table:focus-visible {
  outline: 3px solid rgba(0, 51, 153, 0.22);
  outline-offset: 3px;
}

.blog-table caption,
.pricing-table caption,
.content-table caption {
  padding: 14px 17px;
  color: var(--navy);
  background: var(--mist);
  border-bottom: 1px solid var(--line);
  font-weight: 800;
  text-align: left;
}

.pricing-section {
  margin-top: 42px;
  padding-top: 4px;
}

.pricing-section > p {
  max-width: 720px;
}

.pricing-summary {
  width: min(100%, 420px);
  display: grid;
  gap: 4px;
  margin: 22px 0 30px;
  border-left: 5px solid var(--gold);
}

.pricing-label,
.pricing-suffix {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}

.pricing-label {
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.pricing-value {
  display: block;
  color: var(--navy);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.55rem, 3vw, 2.2rem);
  line-height: 1.2;
}

.pricing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 16px;
  margin: 24px 0 34px;
}

.pricing-tier h4 {
  margin: 0 0 9px;
  color: var(--blue);
  font-family: inherit;
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pricing-tier p {
  margin: 12px 0 0;
  font-size: 0.9rem;
}

.pricing-tier .check-list {
  margin-top: 14px;
  font-size: 0.86rem;
}

.pricing-note {
  margin-top: -18px;
}

.table-scroll table {
  width: 100%;
  min-width: 640px;
  border-collapse: collapse;
  background: var(--paper);
}

.table-scroll th,
.table-scroll td {
  padding: 15px 17px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--line);
}

.table-scroll thead th {
  color: var(--paper);
  background: var(--navy);
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.table-scroll tbody th {
  width: 34%;
  color: var(--navy);
  background: var(--mist);
}

.table-scroll tr:last-child th,
.table-scroll tr:last-child td {
  border-bottom: 0;
}

.tabs {
  margin: 24px 0 42px;
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}

.tab-list {
  display: flex;
  gap: 0;
  overflow-x: auto;
  background: var(--mist);
  border-bottom: 1px solid var(--line);
}

.tab-list button {
  flex: 1 0 auto;
  padding: 15px 20px;
  color: var(--muted);
  background: transparent;
  border: 0;
  border-bottom: 3px solid transparent;
  cursor: pointer;
  font-size: 0.88rem;
  font-weight: 800;
}

.tab-list button:hover,
.tab-list button[aria-selected="true"] {
  color: var(--blue);
  background: var(--paper);
  border-bottom-color: var(--gold);
}

.tab-panel {
  padding: 26px;
}

.tab-panel > *:last-child {
  margin-bottom: 0;
}

.accordion {
  display: grid;
  gap: 10px;
  margin: 22px 0 38px;
}

.accordion details {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 11px;
}

.accordion summary {
  position: relative;
  padding: 18px 52px 18px 20px;
  color: var(--navy);
  cursor: pointer;
  list-style: none;
  font-weight: 800;
}

.accordion summary::-webkit-details-marker {
  display: none;
}

.accordion summary::after {
  content: "+";
  position: absolute;
  top: 50%;
  right: 19px;
  color: var(--blue);
  font-size: 1.35rem;
  transform: translateY(-50%);
}

.accordion details[open] summary::after {
  content: "−";
}

.accordion details > div {
  padding: 0 20px 18px;
}

.accordion details > div p:last-child {
  margin-bottom: 0;
}

.check-list {
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.check-list li {
  position: relative;
  padding: 11px 0 11px 31px;
  border-bottom: 1px solid var(--line);
}

.check-list li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  top: 10px;
  color: var(--blue);
  font-weight: 900;
}

.aside-card {
  position: sticky;
  top: 118px;
  padding: 30px;
  color: var(--paper);
  background: var(--navy);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.aside-card h3 {
  color: var(--paper);
}

.aside-card p {
  color: rgba(255, 255, 255, 0.72);
}

.aside-actions {
  display: grid;
  gap: 10px;
}

.aside-actions .button {
  width: 100%;
}

.aside-button-secondary {
  color: var(--paper);
  background: transparent;
  border-color: rgba(255, 255, 255, 0.52);
  box-shadow: inset 0 -3px 0 var(--red);
}

.aside-button-secondary:hover {
  color: var(--navy);
  background: var(--paper);
  border-color: var(--paper);
}

.aside-downloads {
  margin-top: 28px;
  padding-top: 26px;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.aside-downloads h4 {
  margin: 0 0 5px;
  color: var(--paper);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.05rem;
}

.aside-downloads > p {
  margin-bottom: 16px;
  font-size: 0.82rem;
}

.download-list {
  display: grid;
  gap: 9px;
}

.download-link {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
  padding: 12px;
  color: var(--paper);
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 10px;
  transition: background 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.download-link:hover {
  color: var(--paper);
  background: rgba(255, 255, 255, 0.13);
  border-color: var(--gold);
  transform: translateY(-2px);
}

.download-icon {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  color: var(--paper);
  background: var(--red);
  border-radius: 50%;
  font-size: 1.15rem;
  font-weight: 900;
}

.download-link strong,
.download-link small {
  display: block;
}

.download-link strong {
  color: var(--paper);
  font-size: 0.82rem;
  line-height: 1.35;
}

.download-link small {
  margin-top: 2px;
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.7rem;
}

.manual-downloads {
  padding-block: clamp(54px, 7vw, 82px);
  background: var(--mist);
}

.manual-downloads .section-head {
  margin-bottom: 28px;
}

.manual-downloads .download-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px;
}

.manual-downloads .download-link {
  min-height: 76px;
  padding: 17px 19px;
  color: var(--ink);
  background: var(--paper);
  border-color: var(--line);
  border-left: 4px solid var(--blue);
  box-shadow: 0 8px 22px rgba(7, 29, 73, 0.05);
}

.manual-downloads .download-link:hover {
  color: var(--ink);
  background: var(--paper);
  border-color: var(--blue);
}

.manual-downloads .download-link strong {
  color: var(--navy);
  font-size: 0.94rem;
  line-height: 1.4;
}

.manual-downloads .download-link small {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.45;
}

.manual-downloads .download-icon {
  color: var(--paper);
  background: var(--blue);
}

.manual-downloads .download-link:focus-visible {
  outline: 3px solid rgba(0, 51, 153, 0.22);
  outline-offset: 3px;
}

.image-frame {
  position: relative;
  padding: 22px;
  background: var(--mist);
  border-radius: 28px;
}

.image-frame img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: contain;
}

.portrait-frame img {
  aspect-ratio: 8 / 9;
}

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

.team-card {
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.team-card:hover {
  color: inherit;
  box-shadow: var(--shadow);
  transform: translateY(-5px);
}

.team-card-media {
  display: block;
  overflow: hidden;
  background: var(--navy);
  aspect-ratio: 8 / 9;
}

.team-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 300ms ease;
}

.team-card:hover img {
  transform: scale(1.035);
}

.team-card-body {
  display: block;
  padding: 25px 27px 29px;
}

.team-card h3 {
  margin-bottom: 5px;
}

.team-card small {
  display: block;
  margin-bottom: 15px;
  color: var(--blue);
  font-weight: 800;
}

.team-card p {
  color: var(--muted);
  font-size: 0.92rem;
}

.team-card strong {
  color: var(--blue);
  font-size: 0.86rem;
}

.team-placeholder-label {
  width: fit-content;
  display: block;
  margin-bottom: 13px;
  padding: 5px 9px;
  color: var(--paper);
  background: var(--blue);
  border-radius: 999px;
  font-size: 0.64rem;
  font-weight: 900;
  letter-spacing: 0.11em;
}

.faq-layout {
  max-width: 900px;
}

.faq-group + .faq-group {
  margin-top: 58px;
}

.faq-group h2 {
  font-size: clamp(1.8rem, 3vw, 2.6rem);
}

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

.value-card {
  padding: 29px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.value-card h3 {
  margin-bottom: 10px;
}

.value-card p {
  margin-bottom: 0;
  color: var(--muted);
}

.values-grid.has-value-images {
  align-items: stretch;
}

.value-card-visual {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
}

.value-card-media {
  display: block;
  overflow: hidden;
  aspect-ratio: 5 / 3;
  background: var(--mist);
  border-bottom: 1px solid var(--line);
}

.value-card-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.value-card-copy {
  padding: 25px 27px 28px;
}

.value-card-without-image .value-card-copy {
  margin-block: auto;
}

.about-appointment-action {
  margin-top: 30px;
}

.appointment-request {
  scroll-margin-top: 112px;
}

.page-content-blocks {
  max-width: 980px;
}

.page-content-blocks > .content-block + .content-block,
.blog-article > .content-block + .content-block,
.prose > .content-block + .content-block {
  margin-top: 34px;
}

.content-block-heading {
  margin-top: 42px;
}

.content-block-list .numbered-list,
.numbered-list {
  margin: 22px 0 0;
  padding-left: 1.45rem;
}

.numbered-list li {
  padding: 7px 0 7px 6px;
}

.content-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 18px;
  margin: 24px 0 38px;
}

.content-card {
  min-width: 0;
  height: 100%;
  padding: 0;
  overflow: hidden;
}

.content-card-media {
  display: block;
  overflow: hidden;
  aspect-ratio: 5 / 3;
  background: var(--mist);
  border-bottom: 1px solid var(--line);
}

.content-card-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.content-card-copy {
  min-width: 0;
  height: 100%;
  padding: 24px 25px 27px;
}

.content-card-copy .service-link {
  display: inline-block;
  margin-top: 17px;
}

.content-image-text {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(28px, 5vw, 58px);
  align-items: center;
  margin: 34px 0 46px;
}

.content-image-text.is-reversed figure {
  order: 2;
}

.content-image-text figure {
  margin: 0;
  overflow: hidden;
  background: var(--mist);
  border: 1px solid var(--line);
  border-radius: 14px;
}

.content-image-text img {
  width: 100%;
  aspect-ratio: 5 / 3;
  display: block;
  object-fit: cover;
}

.inline-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
  padding: 28px 30px;
  color: var(--paper);
  background: var(--navy);
  border-radius: var(--radius);
}

.inline-cta h3,
.inline-cta p {
  color: var(--paper);
}

.inline-cta h3 {
  margin: 0 0 6px;
}

.inline-cta p {
  margin: 0;
  opacity: 0.76;
}

.inline-cta-actions {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.contact-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(42px, 7vw, 86px);
}

.contact-card {
  padding: 32px;
  background: var(--mist);
  border-radius: var(--radius);
}

.contact-card h3 {
  margin-bottom: 18px;
}

.contact-list {
  display: grid;
  gap: 20px;
  margin: 0;
}

.contact-list div {
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.contact-list div:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.contact-list dt {
  margin-bottom: 3px;
  color: var(--blue);
  font-size: 0.76rem;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.contact-list dd {
  margin: 0;
  color: var(--navy);
  font-weight: 700;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: end;
  gap: 18px;
}

.form-field {
  display: grid;
  gap: 7px;
}

.form-field.full {
  grid-column: 1 / -1;
}

.form-field label {
  color: var(--navy);
  font-size: 0.84rem;
  font-weight: 800;
}

.form-field input,
.form-field select,
.form-field textarea {
  width: 100%;
  min-height: 52px;
  padding: 12px 14px;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid #c8d6ee;
  border-radius: 10px;
}

.choice-field {
  min-width: 0;
  padding: 0;
  margin: 0;
  border: 0;
}

.choice-field legend {
  margin-bottom: 7px;
  color: var(--navy);
  font-size: 0.84rem;
  font-weight: 800;
}

.choice-options {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.choice-option {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 10px 13px;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid #c8d6ee;
  border-radius: 10px;
  cursor: pointer;
  font-size: 0.86rem;
  font-weight: 700;
}

.form-field .choice-option input {
  width: 18px;
  min-height: 18px;
  margin: 0;
  padding: 0;
  accent-color: var(--blue);
  box-shadow: none;
}

.choice-option:has(input:checked) {
  background: var(--mist);
  border-color: var(--blue);
}

.field-help {
  margin: 0;
  color: var(--muted);
  font-size: 0.78rem;
}

.form-field textarea {
  min-height: 150px;
  resize: vertical;
}

.honeypot {
  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;
}

.form-challenge {
  margin-top: 2px;
  padding: 17px 18px;
  background: var(--mist);
  border: 1px solid var(--line);
  border-left: 4px solid var(--gold);
  border-radius: 10px;
}

.challenge-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(92px, 120px);
  gap: 14px;
  align-items: center;
}

.challenge-question {
  color: var(--navy);
  font-weight: 800;
}

.challenge-row input {
  min-height: 46px;
  text-align: center;
  font-weight: 800;
}

.challenge-status,
.challenge-error {
  margin: 0;
  color: var(--muted);
  font-size: 0.78rem;
}

.challenge-error {
  color: var(--red);
  font-weight: 700;
}

.form-challenge.is-error {
  border-left-color: var(--red);
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 4px rgba(0, 50, 153, 0.1);
  outline: 0;
}

.form-note {
  margin: 14px 0 22px;
  color: var(--muted);
  font-size: 0.82rem;
}

.placeholder-note {
  padding: 18px 20px;
  color: #614c00;
  background: var(--cream);
  border: 1px solid #f0d568;
  border-radius: 10px;
}

.legal-copy {
  max-width: 820px;
}

.legal-copy h2 {
  margin-top: 44px;
  font-size: 1.8rem;
}

.cta-band {
  position: relative;
  overflow: hidden;
  padding: clamp(54px, 8vw, 86px) 0;
  color: var(--band-text);
  background: var(--band-bg);
}

.cta-band::after {
  content: "";
  position: absolute;
  right: -90px;
  bottom: -130px;
  width: 360px;
  height: 360px;
  border: 80px solid rgba(204, 0, 0, 0.12);
  border-radius: 50%;
}

.cta-band-inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.cta-band h2 {
  max-width: 760px;
  margin-bottom: 8px;
  color: var(--band-text);
  font-size: clamp(2rem, 4vw, 3.2rem);
}

.cta-band p {
  max-width: 680px;
  margin-bottom: 0;
  color: var(--band-text);
}

.cta-band-actions {
  min-width: min(100%, 320px);
  display: grid;
  gap: 10px;
}

.cta-band-actions .button {
  width: 100%;
}

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

.home-insights-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
  gap: clamp(34px, 6vw, 72px);
  align-items: start;
}

.home-insights-grid-no-video {
  grid-template-columns: minmax(0, 850px);
}

.home-article-list {
  display: grid;
  gap: 24px;
}

.home-article-list article {
  padding-bottom: 24px;
  border-bottom: 1px solid var(--line);
}

.home-article-list h3 {
  margin: 10px 0;
  font-size: clamp(1.3rem, 2.5vw, 1.7rem);
}

.home-article-list p {
  margin-bottom: 0;
  color: var(--muted);
}

.home-article-list .button {
  width: fit-content;
}

.home-video-feature {
  display: grid;
  gap: 14px;
}

.home-video-feature .media-embed {
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.blog-card {
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 2px 0 rgba(0, 51, 153, 0.03);
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.blog-card:hover {
  box-shadow: var(--shadow);
  transform: translateY(-5px);
}

.blog-card-media {
  display: block;
  overflow: hidden;
  aspect-ratio: 5 / 3;
  background: var(--navy);
}

.blog-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 300ms ease;
}

.blog-card:hover .blog-card-media img {
  transform: scale(1.035);
}

.blog-card-body {
  padding: 25px 27px 29px;
}

.blog-card h2 {
  margin: 12px 0;
  font-size: 1.42rem;
}

.blog-card p {
  color: var(--muted);
  font-size: 0.92rem;
}

.article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  color: var(--blue);
  font-size: 0.76rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.article-meta span::before {
  content: "";
  width: 5px;
  height: 5px;
  display: inline-block;
  margin: 0 11px 1px 0;
  background: var(--red);
  border-radius: 50%;
}

.topic-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-bottom: clamp(30px, 5vw, 54px);
  padding-bottom: 24px;
  border-bottom: 1px solid var(--line);
}

.topic-nav a,
.topic-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--blue);
  background: var(--mist);
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
}

.topic-nav a {
  padding: 9px 13px;
}

.topic-nav a span {
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 700;
}

.topic-nav a:hover,
.topic-nav a[aria-current="page"] {
  color: var(--paper);
  background: var(--blue);
  border-color: var(--blue);
}

.topic-nav a:hover span,
.topic-nav a[aria-current="page"] span {
  color: rgba(255, 255, 255, 0.78);
}

.topic-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 15px;
}

.topic-chip {
  padding: 6px 10px;
}

.topic-chip:hover {
  color: var(--paper);
  background: var(--red);
  border-color: var(--red);
}

.archive-summary {
  margin: -26px 0 30px;
  color: var(--muted);
}

.pagination {
  display: grid;
  grid-template-columns: minmax(110px, 1fr) auto minmax(110px, 1fr);
  align-items: center;
  gap: 18px;
  margin-top: clamp(40px, 7vw, 72px);
  padding-top: 26px;
  border-top: 1px solid var(--line);
}

.pagination a,
.pagination .is-disabled {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-weight: 800;
}

.pagination-direction:first-child {
  justify-self: start;
}

.pagination-direction:last-child {
  justify-self: end;
}

.pagination .is-disabled {
  color: #8b94a7;
  background: var(--mist);
}

.pagination-pages {
  display: flex;
  gap: 7px;
}

.pagination-pages a {
  width: 44px;
  padding-inline: 0;
}

.pagination a:hover,
.pagination a[aria-current="page"] {
  color: var(--paper);
  background: var(--blue);
  border-color: var(--blue);
}

.article-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.65fr);
  gap: clamp(42px, 7vw, 92px);
  align-items: start;
}

.blog-article > section + section {
  margin-top: 48px;
  padding-top: 38px;
  border-top: 1px solid var(--line);
}

.blog-article > section h2 {
  font-size: clamp(1.65rem, 3vw, 2.35rem);
}

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

.video-card {
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.video-card-copy {
  padding: 23px 25px 27px;
}

.video-card-copy h2 {
  margin-bottom: 8px;
  font-size: 1.45rem;
}

.video-card-copy p {
  margin-bottom: 0;
  color: var(--muted);
}

.media-embed {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  color: var(--paper);
  background: var(--navy);
}

.media-embed iframe {
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
}

.media-placeholder {
  position: absolute;
  inset: 0;
  display: grid;
}

.media-placeholder[hidden] {
  display: none !important;
}

.media-placeholder::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 27, 82, 0.12), rgba(0, 27, 82, 0.9));
}

.media-placeholder img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.media-placeholder-copy {
  position: absolute;
  inset: auto 20px 18px;
  z-index: 1;
}

.media-placeholder-copy strong,
.media-placeholder-copy p {
  display: block;
}

.media-placeholder-copy p {
  margin: 5px 0 9px;
  color: rgba(255, 255, 255, 0.76);
  font-size: 0.78rem;
}

.media-placeholder-copy a,
.media-enable,
.media-pending {
  color: var(--gold);
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 850;
}

.media-placeholder-copy a:hover,
.media-enable:hover {
  color: var(--paper);
}

.media-embed-compact {
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 12px;
}

.media-embed-compact .media-placeholder-copy {
  inset: auto 13px 11px;
}

.media-embed-compact .media-placeholder-copy strong {
  font-size: 0.78rem;
}

.media-embed-compact .media-placeholder-copy p {
  display: none;
}

.site-footer {
  padding: 70px 0 28px;
  color: rgba(255, 255, 255, 0.68);
  background: #001b52;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.62fr 0.68fr 0.95fr;
  gap: 42px;
  padding-bottom: 54px;
}

.footer-grid-no-video {
  grid-template-columns: 1.25fr 0.62fr 0.75fr;
}

.footer-brand {
  color: var(--paper);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.45rem;
  font-weight: 700;
}

.footer-brand-mark {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  margin-bottom: 18px;
  color: var(--paper);
  background: linear-gradient(135deg, var(--blue) 0 45%, var(--red) 45% 68%, var(--gold) 68%);
  border-radius: 12px;
  font-family: ui-sans-serif, system-ui, sans-serif;
  font-size: 0.92rem;
  font-weight: 900;
}

.footer-copy {
  max-width: 420px;
}

.footer-title {
  margin-bottom: 17px;
  color: var(--paper);
  font-family: ui-sans-serif, system-ui, sans-serif;
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.footer-links {
  display: grid;
  gap: 9px;
}

.footer-links a:hover {
  color: var(--gold);
}

.footer-link-button {
  width: fit-content;
  padding: 0;
  color: inherit;
  background: transparent;
  border: 0;
  cursor: pointer;
  text-align: left;
}

.footer-link-button:hover {
  color: var(--gold);
}

.consent-banner {
  position: fixed;
  left: 18px;
  right: 18px;
  bottom: 18px;
  z-index: 100;
  color: var(--paper);
  background: rgba(4, 19, 49, 0.98);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 14px;
  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.32);
}

.consent-banner[hidden] {
  display: none;
}

.consent-banner-inner {
  width: min(100% - 32px, var(--container));
  min-height: 94px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  margin-inline: auto;
  padding: 17px 0;
}

.consent-copy {
  max-width: 760px;
}

.consent-copy strong {
  display: block;
  margin-bottom: 3px;
  color: var(--paper);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.05rem;
}

.consent-copy p {
  margin: 0;
  color: rgba(255, 255, 255, 0.74);
  font-size: 0.82rem;
}

.consent-copy a {
  color: var(--gold);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.consent-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(140px, 1fr));
  gap: 9px;
}

.consent-actions button {
  min-height: 44px;
  padding: 9px 15px;
  border: 2px solid var(--gold);
  border-radius: 999px;
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 850;
}

.consent-actions button:first-child {
  color: var(--navy);
  background: var(--paper);
  border-color: var(--paper);
}

.consent-actions button:last-child {
  color: var(--navy);
  background: var(--gold);
}

.consent-actions button:hover {
  color: var(--paper);
  background: var(--red);
  border-color: var(--red);
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding-top: 26px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 0.8rem;
}

/* Desktop navigation (v15): top-level labels and the CTA never wrap. The mobile menu
   (880 px and below, see site.js) keeps normal wrapping for long submenu items. */
@media (min-width: 881px) {
  .site-nav > a,
  .nav-blog-group > a,
  .nav-cta {
    white-space: nowrap;
  }
}

/* Compact desktop navigation from 881 to 1160 px (v15; up to v14 it ended at 1020 px).
   The full-size German navigation needs about 1144 px with the widest fallback font;
   above 1160 px the header looks exactly as in v14. */
@media (min-width: 881px) and (max-width: 1160px) {
  .site-nav > a,
  .nav-blog-group > a {
    padding-inline: 8px;
    font-size: 0.81rem;
  }

  .nav-cta-group {
    gap: 5px;
    margin-left: 4px;
  }

  .nav-cta {
    padding-inline: 12px !important;
  }

  .site-nav .nav-cta {
    font-size: 0.81rem;
  }

  .site-nav > a::after,
  .nav-blog-group > a::after {
    left: 9px !important;
    right: 9px !important;
  }
}

/* Narrow desktop, 881 to 1000 px: slightly tighter, same font size, so that the German
   labels still fit on one line (logo at its mobile size). */
@media (min-width: 881px) and (max-width: 1000px) {
  .nav-row {
    gap: 16px;
  }

  .brand img {
    width: 136px;
  }

  .site-nav {
    gap: 0;
  }

  .site-nav > a,
  .nav-blog-group > a {
    padding-inline: 6px;
  }

  .site-nav > a::after,
  .nav-blog-group > a::after {
    left: 6px !important;
    right: 6px !important;
  }

  .nav-cta-group {
    margin-left: 2px;
  }

  .nav-cta {
    padding-inline: 10px !important;
  }

  /* Submenus in the compact size, so that the widest one stays inside the window. */
  .site-nav .nav-submenu a {
    font-size: 0.81rem;
  }
}

@media (max-width: 1020px) {
  .services-grid,
  .blog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 880px) {
  .nav-row {
    min-height: 76px;
  }

  .brand img {
    width: 136px;
  }

  .menu-toggle {
    display: inline-flex;
  }

  .site-nav {
    position: fixed;
    inset: 114px 0 auto;
    max-height: calc(100vh - 114px);
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 18px 20px 30px;
    overflow: auto;
    background: var(--paper);
    border-top: 1px solid var(--line);
    box-shadow: var(--shadow);
  }

  .nav-cta-group {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 18px 0 0;
  }

  .site-nav.is-open {
    display: flex;
  }

  .site-nav a {
    padding: 14px 8px;
    font-size: 1rem;
    border-bottom: 1px solid var(--line);
  }

  .site-nav a::after {
    display: none;
  }

  .nav-blog-group {
    display: grid;
    grid-template-columns: 1fr 48px;
    align-items: stretch;
  }

  .nav-blog-group > a {
    min-width: 0;
  }

  .nav-submenu-toggle {
    width: 48px;
    height: auto;
    margin: 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
  }

  .nav-submenu {
    position: static;
    grid-column: 1 / -1;
    min-width: 0;
    padding: 4px 8px 9px 20px;
    background: var(--mist);
    border: 0;
    border-left: 3px solid var(--red);
    border-radius: 0;
    box-shadow: none;
  }

  .site-nav .nav-submenu a {
    padding: 11px 10px;
    white-space: normal;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
  }

  .site-nav .nav-cta {
    margin: 0;
    padding: 13px 12px !important;
    text-align: center;
    border-bottom: 0;
  }

  .hero {
    min-height: 680px;
    background-position: 60% center;
  }

  .metrics-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .metric:nth-child(2) {
    border-right: 0;
  }

  .metric:nth-child(-n + 2) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }

  .intro-grid,
  .content-grid,
  .detail-grid,
  .contact-grid,
  .article-layout,
  .home-insights-grid,
  .process-intro-grid {
    grid-template-columns: 1fr;
  }

  .content-image-text {
    grid-template-columns: 1fr;
  }

  .content-image-text.is-reversed figure {
    order: 0;
  }

  .inline-cta {
    align-items: flex-start;
    flex-direction: column;
  }

  .check-choice-grid {
    grid-template-columns: 1fr;
  }

  .home-check-offer .check-choice-grid {
    gap: 14px;
  }

  .aside-card {
    position: static;
  }

  .values-grid {
    grid-template-columns: 1fr;
  }

  .team-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 42px;
  }

  .footer-grid > :first-child {
    grid-column: 1 / -1;
  }

  .consent-banner-inner {
    align-items: stretch;
    flex-direction: column;
    gap: 13px;
  }

  .consent-actions {
    align-self: start;
  }
}

@media (max-width: 640px) {
  .container {
    width: min(100% - 28px, var(--container));
  }

  .topbar-location {
    display: none;
  }

  .hero {
    min-height: 640px;
  }

  .hero::before {
    background: linear-gradient(90deg, rgba(0, 27, 82, 0.97), rgba(0, 39, 115, 0.74));
  }

  .button-row {
    align-items: stretch;
    flex-direction: column;
  }

  .button-row .button,
  .section-dark-actions .button {
    width: 100%;
  }

  .section-dark-actions {
    flex-direction: column;
  }

  .metric {
    min-height: 116px;
    padding: 24px 16px;
  }

  .metric-value {
    font-size: 1.8rem;
  }

  .services-grid,
  .blog-grid,
  .video-grid,
  .process-grid,
  .form-grid {
    grid-template-columns: 1fr;
  }

  .pagination {
    grid-template-columns: 1fr 1fr;
  }

  .pagination-pages {
    grid-column: 1 / -1;
    grid-row: 1;
    justify-content: center;
  }

  .pagination-direction {
    grid-row: 2;
  }

  .service-card {
    min-height: 400px;
  }

  .team-grid {
    grid-template-columns: 1fr;
  }

  .page-hero-image {
    min-height: 380px;
  }

  .process-grid {
    gap: 12px;
  }

  .form-field.full {
    grid-column: auto;
  }

  .challenge-row {
    grid-template-columns: 1fr;
  }

  .challenge-row input {
    max-width: 140px;
  }

  .cta-band-inner,
  .footer-bottom {
    align-items: stretch;
    flex-direction: column;
  }

  .cta-band .button {
    width: 100%;
  }

  .inline-cta-actions,
  .inline-cta-actions .button {
    width: 100%;
  }

  .cta-band-actions {
    width: 100%;
  }

  .footer-grid {
    grid-template-columns: 1fr;
  }

  .footer-grid > :first-child {
    grid-column: auto;
  }

  .consent-banner {
    left: 8px;
    right: 8px;
    bottom: 8px;
  }

  .consent-actions {
    width: 100%;
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}


/* Canonical solid CTA treatment. */
.nav-cta-opportunity {
  color: var(--paper) !important;
  background: var(--red);
  box-shadow: none;
}

.button-row .button-secondary,
.aside-button-secondary,
.cta-band-actions .button-outline-dark,
.section-dark-secondary {
  color: var(--paper);
  background: var(--red);
  border-color: var(--red);
  box-shadow: none;
}

.nav-cta-opportunity:hover,
.button-row .button-secondary:hover,
.aside-button-secondary:hover,
.cta-band-actions .button-outline-dark:hover,
.section-dark-secondary:hover {
  color: var(--paper) !important;
  background: var(--red);
  border-color: var(--red);
  box-shadow: none;
  filter: brightness(0.9);
}

/* v9 commercial clarification: existing visual language, new evidence layouts. */
.footer-grid {
  grid-template-columns: 1.1fr 0.58fr 0.8fr 0.8fr 0.95fr;
}

.footer-grid-no-video {
  grid-template-columns: 1.2fr 0.62fr 0.88fr 0.9fr;
}

.nav-services-submenu {
  min-width: min(420px, 90vw);
}

.button-row .button-secondary {
  color: var(--paper);
  background: rgba(7, 29, 73, 0.2);
  border-color: rgba(255, 255, 255, 0.72);
}

.button-row .button-secondary:hover {
  color: var(--navy) !important;
  background: var(--paper);
  border-color: var(--paper);
  filter: none;
}

.cta-band-actions .button-outline-dark {
  color: var(--navy);
  background: transparent;
  border-color: var(--navy);
}

.cta-band-actions .button-outline-dark:hover {
  color: var(--paper) !important;
  background: var(--navy);
  border-color: var(--navy);
  filter: none;
}

.section-dark-secondary {
  color: var(--paper);
  background: transparent;
  border-color: rgba(255, 255, 255, 0.72);
}

.section-dark-secondary:hover {
  color: var(--navy) !important;
  background: var(--paper);
  border-color: var(--paper);
  filter: none;
}

.home-fit small,
.evidence-note,
.maturity-visual figcaption {
  color: var(--slate);
  font-size: 0.83rem;
}

.metrics-label {
  padding: 22px 0 0;
  color: var(--gold);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.16em;
}

.home-positioning {
  margin-top: 26px;
}

.work-principles-strip {
  color: var(--paper);
  background: var(--navy);
}

.work-principles-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.work-principle {
  min-width: 0;
  padding: clamp(25px, 3vw, 34px) clamp(18px, 2.5vw, 28px);
  border-right: 1px solid rgba(255, 255, 255, 0.12);
}

.work-principle:last-child {
  border-right: 0;
}

.work-principle h3 {
  margin: 0 0 9px;
  color: var(--gold);
  font-family: inherit;
  font-size: clamp(0.86rem, 1.1vw, 1rem);
  letter-spacing: 0.08em;
  overflow-wrap: anywhere;
}

.work-principle p {
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: clamp(0.82rem, 1vw, 0.92rem);
  line-height: 1.55;
}

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

.evidence-card {
  padding: clamp(22px, 3vw, 34px);
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 4px solid var(--blue);
  border-radius: 14px;
  box-shadow: 0 12px 28px rgba(7, 29, 73, 0.06);
}

.evidence-card > strong {
  display: block;
  margin-bottom: 11px;
  color: var(--navy);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.8rem, 4vw, 3rem);
}

.evidence-card a {
  color: var(--blue);
  font-size: 0.78rem;
  font-weight: 800;
}

.evidence-note {
  margin-top: 18px;
}

.specialist-grid-compact {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.specialist-grid-compact .service-card-media {
  aspect-ratio: 5 / 3;
}

.specialist-grid-compact .service-card-body {
  padding: 20px 18px 22px;
}

.specialist-grid-compact h3 {
  font-size: 1.12rem;
}

.who-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: stretch;
}

.who-grid .content-card-copy {
  padding: 22px 22px 24px;
}

.who-grid .content-card-copy h3,
.page-content-blocks .content-card-copy h3 {
  min-height: 0;
  margin-bottom: 10px;
  overflow-wrap: anywhere;
  hyphens: auto;
  font-size: clamp(0.9rem, 1.15vw, 1.08rem);
  line-height: 1.3;
}

.who-grid .content-card,
.page-content-blocks .content-card {
  display: flex;
  flex-direction: column;
}

.who-grid .content-card-copy,
.page-content-blocks .content-card-copy {
  flex: 1;
}

.sample-report-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
  gap: 16px;
}

.sample-report-card {
  min-height: 220px;
  display: flex;
  flex-direction: column;
  padding: 24px;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 12px 28px rgba(7, 29, 73, 0.06);
}

.sample-report-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(7, 29, 73, 0.11);
}

.sample-report-mark {
  width: fit-content;
  margin-bottom: 22px;
  padding: 5px 9px;
  color: var(--paper);
  background: var(--red);
  border-radius: 999px;
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.12em;
}

.sample-report-card > strong {
  color: var(--navy);
  font-size: 1rem;
}

.sample-report-card p {
  flex: 1;
  margin: 10px 0 20px;
  font-size: 0.9rem;
}

.maturity-action {
  margin-top: 28px;
  text-align: center;
}

.maturity-visual {
  margin: 0;
}

.maturity-copy {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(280px, 1.1fr);
  align-items: end;
  gap: 36px;
  margin-bottom: 28px;
}

.maturity-copy h2,
.maturity-copy h3 {
  margin-bottom: 0;
}

.maturity-route {
  position: relative;
  padding: 60px 18px 18px;
  overflow: hidden;
  background: linear-gradient(180deg, #f8fbfe, #edf4fa);
  border: 1px solid #d7e3ef;
  border-radius: 22px;
}

.maturity-route-art {
  position: absolute;
  inset: 34px 2% auto;
  width: 96%;
  height: auto;
}

.maturity-stages {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(var(--maturity-count, 6), minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.maturity-stages li {
  min-width: 0;
  padding-top: var(--stage-offset, 0);
}

.maturity-node {
  width: 64px;
  height: 64px;
  display: grid;
  place-items: center;
  margin: 0 auto 22px;
  color: var(--paper);
  background: var(--blue);
  border: 5px solid var(--paper);
  border-radius: 50%;
  box-shadow: 0 7px 18px rgba(7, 29, 73, 0.24);
  font-size: 0.94rem;
  font-weight: 900;
}

.maturity-stages li:last-child .maturity-node {
  background: var(--navy);
}

.maturity-stage-copy {
  padding: 15px 12px;
  background: rgba(255, 255, 255, 0.9);
  border-top: 3px solid #8daac6;
  border-radius: 9px;
}

.maturity-stage-copy > strong,
.maturity-stage-copy > small {
  display: block;
}

.maturity-stage-copy > strong {
  min-height: 3.9em;
  color: var(--navy);
  font-size: 0.72rem;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.maturity-stage-copy > small {
  margin-top: 5px;
  color: var(--blue);
  font-weight: 800;
}

.maturity-question {
  min-height: 5.2em;
  margin: 14px 0;
  font-size: 0.83rem;
  font-weight: 750;
  line-height: 1.45;
}

.maturity-stage-copy dl,
.maturity-stage-copy dl div {
  margin: 0;
}

.maturity-stage-copy dl div + div {
  margin-top: 11px;
}

.maturity-stage-copy dt {
  color: var(--red);
  font-size: 0.64rem;
  font-weight: 900;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.maturity-stage-copy dd {
  margin: 3px 0 0;
  font-size: 0.73rem;
  line-height: 1.42;
}

.maturity-axis {
  position: relative;
  z-index: 1;
  display: flex;
  margin: 20px 10px 0;
  padding-top: 12px;
  border-top: 1px solid #d7e3ef;
  justify-content: space-between;
  color: var(--slate);
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.maturity-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 16px 0 10px;
}

.maturity-meta p {
  display: grid;
  gap: 4px;
  margin: 0;
  padding: 16px 18px;
  color: var(--paper);
  background: var(--navy);
  border-radius: 10px;
}

.maturity-meta strong {
  color: var(--gold);
  font-size: 0.73rem;
  letter-spacing: 0.07em;
}

.maturity-meta span {
  font-size: 0.86rem;
}

.maturity-teaser .maturity-stage-copy {
  text-align: center;
}

.pricing-page-intro,
.pricing-commercial-section,
.pricing-faq-section {
  padding-block: clamp(36px, 4.5vw, 56px);
}

.pricing-catalog-section {
  padding-block: clamp(28px, 3.6vw, 44px);
}

.pricing-catalog-section .pricing-section {
  margin-top: 0;
}

.maturity-source-build {
  padding: 4px 0 16px;
}

.maturity-build-route {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 16px;
}

.maturity-build-route section {
  position: relative;
  min-height: 235px;
  padding: 30px 28px;
  background: linear-gradient(145deg, #f6f9fc, #e9f1f8);
}

.maturity-build-route section + section {
  border-left: 1px solid #cbd9e6;
}

.maturity-build-route section::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -12px;
  z-index: 2;
  width: 22px;
  height: 22px;
  background: inherit;
  border-top: 1px solid #cbd9e6;
  border-right: 1px solid #cbd9e6;
  transform: translateY(-50%) rotate(45deg);
}

.maturity-build-route section:last-child::after {
  display: none;
}

.maturity-build-index {
  color: var(--red);
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.12em;
}

.maturity-build-route strong,
.maturity-build-range {
  display: block;
}

.maturity-build-route strong {
  margin-top: 10px;
  color: var(--navy);
  letter-spacing: 0.04em;
  overflow-wrap: anywhere;
}

.maturity-build-range {
  margin: 20px 0 9px;
  color: var(--blue);
  font-size: 1.25rem;
  font-weight: 900;
}

.maturity-build-route h4 {
  margin-bottom: 8px;
}

.publication-warning {
  border-left-color: var(--red);
}

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

@media (max-width: 880px) {
  .footer-grid,
  .footer-grid-no-video {
    grid-template-columns: 1fr 1fr;
  }

  .evidence-grid {
    grid-template-columns: 1fr;
  }

  .work-principles-grid,
  .specialist-grid-compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .work-principle:nth-child(2) {
    border-right: 0;
  }

  .work-principle:nth-child(-n + 2) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }

  .maturity-copy {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .maturity-route {
    min-height: 0;
    padding: 28px 20px;
  }

  .maturity-route-art {
    display: none;
  }

  .maturity-stages {
    grid-template-columns: 1fr;
    gap: 0;
    padding-left: 8px;
  }

  .maturity-stages::before {
    content: "";
    position: absolute;
    top: 25px;
    bottom: 25px;
    left: 39px;
    width: 5px;
    background: linear-gradient(#b9cfe3, var(--blue), var(--navy));
    border-radius: 999px;
  }

  .maturity-stages li {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 17px;
    align-items: start;
    padding: 0 0 20px;
  }

  .maturity-node {
    position: relative;
    z-index: 2;
    margin: 0;
  }

  .maturity-stage-copy,
  .maturity-teaser .maturity-stage-copy {
    text-align: left;
  }

  .maturity-stage-copy > strong,
  .maturity-question {
    min-height: 0;
  }

  .maturity-axis {
    display: none;
  }

  .maturity-meta,
  .maturity-build-route {
    grid-template-columns: 1fr;
  }

  .maturity-build-route section + section {
    border-top: 1px solid #cbd9e6;
    border-left: 0;
  }

  .maturity-build-route section::after {
    top: auto;
    right: 50%;
    bottom: -12px;
    transform: translateX(50%) rotate(135deg);
  }
}

@media (max-width: 600px) {
  .specialist-grid-compact {
    grid-template-columns: 1fr;
  }

  .footer-grid,
  .footer-grid-no-video {
    grid-template-columns: 1fr;
  }

  .manual-downloads .download-list {
    grid-template-columns: 1fr;
  }

  .work-principles-grid,
  .who-grid {
    grid-template-columns: 1fr;
  }

  .work-principle,
  .work-principle:nth-child(2) {
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }

  .work-principle:last-child {
    border-bottom: 0;
  }
}

/* ---------------------------------------------------------------------------
 * v12 additions
 * ------------------------------------------------------------------------ */

.maturity-reference {
  margin: 12px 0 0;
  color: var(--slate);
  font-size: 0.8rem;
}

.check-matrix table {
  min-width: 860px;
}

.check-matrix td:first-child {
  width: 26%;
  color: var(--navy);
  font-weight: 750;
}

.check-matrix-price {
  white-space: nowrap;
  color: var(--navy);
  font-weight: 800;
}

.terms-table th[scope="row"] {
  width: 30%;
  color: var(--navy);
  background: var(--mist);
  font-weight: 800;
  text-align: left;
  vertical-align: top;
}

.terms-table td {
  vertical-align: top;
}

.pricing-commercial-section .callout {
  margin-top: 22px;
}

.form-status {
  margin: 0 0 18px;
  padding: 14px 16px;
  color: var(--ink);
  background: var(--mist);
  border: 1px solid var(--line);
  border-left: 4px solid var(--blue);
  border-radius: 10px;
  font-size: 0.9rem;
  font-weight: 650;
}

.form-status.is-error {
  color: #7a0000;
  background: #fff3f3;
  border-color: #f0c4c4;
  border-left-color: var(--red);
}

.form-field [aria-invalid="true"],
.choice-field[aria-invalid="true"] .choice-option {
  border-color: var(--red);
  box-shadow: 0 0 0 3px rgba(204, 0, 0, 0.1);
}

.choice-option-wide {
  width: 100%;
  align-items: flex-start;
  line-height: 1.45;
}

.choice-option-wide input {
  margin-top: 2px !important;
}

button[type="submit"][aria-busy="true"] {
  cursor: progress;
  opacity: 0.72;
}

.check-detail-grid {
  margin-top: 26px;
}

.not-found-page {
  min-height: 100vh;
  background: var(--section-mist);
}

.not-found {
  padding: clamp(40px, 8vw, 96px) 0;
}

.not-found .brand img {
  width: 180px;
  height: auto;
}

.not-found-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 26px;
  margin-top: 40px;
}

.not-found-grid section {
  padding: clamp(26px, 4vw, 42px);
  background: var(--paper);
  border-top: 5px solid var(--gold);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.not-found-grid .eyebrow {
  color: var(--red);
}

.not-found-grid h1,
.not-found-grid h2 {
  font-size: clamp(1.9rem, 3.4vw, 2.6rem);
  letter-spacing: -0.02em;
}

.not-found-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

@media (max-width: 880px) {
  .not-found-grid {
    grid-template-columns: 1fr;
  }
}

.service-summary {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: 18px;
  margin: 26px 0 30px;
}

.service-summary > div {
  padding: 22px 24px;
  background: var(--mist);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.service-summary > div:last-child {
  background: var(--cream);
  border-color: #f0d568;
}

.service-summary h3 {
  margin-bottom: 10px;
  font-size: 1.12rem;
}

.service-summary .check-list {
  margin: 0;
}

.service-summary p {
  margin: 0;
}

@media (max-width: 880px) {
  .service-summary {
    grid-template-columns: 1fr;
  }
}

/* Pricing tables: the section heading names the table; the caption stays for screen readers. */
.pricing-table caption {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.pricing-table td:last-child {
  color: var(--navy);
  font-weight: 750;
}

.aside-card .service-link {
  color: var(--gold);
}

.aside-card .service-link:hover {
  color: var(--paper);
}

.maturity-stage-copy {
  overflow-wrap: break-word;
  hyphens: auto;
}

/* Phones: price lists and the check overview become stacked rows instead of wide tables. */
@media (max-width: 640px) {
  .pricing-table table,
  .check-matrix table,
  .task-map table {
    min-width: 0;
  }

  .pricing-table thead,
  .check-matrix thead,
  .task-map thead {
    display: none;
  }

  .pricing-table tr,
  .check-matrix tr,
  .task-map tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(5.5rem, 34%);
    gap: 4px 14px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--line);
  }

  .pricing-table tr:last-child,
  .check-matrix tr:last-child,
  .task-map tr:last-child {
    border-bottom: 0;
  }

  .pricing-table td,
  .check-matrix td,
  .task-map td {
    display: block;
    width: auto;
    padding: 0;
    border: 0;
  }

  .pricing-table td:nth-child(1) {
    grid-column: 1;
    overflow-wrap: break-word;
    hyphens: auto;
    color: var(--navy);
    font-size: 0.94rem;
    font-weight: 800;
  }

  .pricing-table td:nth-child(3) {
    font-size: 0.92rem;
  }

  .pricing-table td:nth-child(3) {
    grid-column: 2;
    grid-row: 1;
    text-align: right;
  }

  .task-map td {
    grid-column: 1 / -1;
  }

  .task-map td:first-child {
    color: var(--ink);
    font-weight: 750;
  }

  .pricing-table td:nth-child(2) {
    grid-column: 1 / -1;
    color: var(--muted);
    font-size: 0.88rem;
  }

  .check-matrix td {
    grid-column: 1 / -1;
  }

  .check-matrix td:first-child {
    width: auto;
    color: var(--navy);
    font-weight: 800;
  }

  .check-matrix td[data-label]::before {
    content: attr(data-label) ": ";
    color: var(--navy);
    font-size: 0.78rem;
    font-weight: 800;
  }
}

/* Phones: step lists, content tables and contract terms read as stacked rows. */
@media (max-width: 640px) {
  .step-table table,
  .content-table table,
  .blog-table table {
    min-width: 0;
  }

  .step-table thead,
  .content-table thead,
  .blog-table thead {
    display: none;
  }

  .step-table tr {
    display: grid;
    grid-template-columns: 2.2rem minmax(0, 1fr);
    gap: 2px 10px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
  }

  .content-table tr,
  .blog-table tr,
  .terms-table tr {
    display: block;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
  }

  .step-table tr:last-child,
  .content-table tr:last-child,
  .blog-table tr:last-child,
  .terms-table tr:last-child {
    border-bottom: 0;
  }

  .step-table td,
  .content-table td,
  .blog-table td,
  .terms-table th,
  .terms-table td {
    display: block;
    width: auto;
    padding: 0;
    border: 0;
  }

  .step-table td:nth-child(1) {
    grid-row: 1 / span 2;
    color: var(--red);
    font-weight: 800;
  }

  .step-table td:nth-child(2) {
    color: var(--navy);
    font-weight: 800;
  }

  .step-table td:nth-child(3) {
    grid-column: 2;
    color: var(--muted);
    font-size: 0.9rem;
  }

  .content-table td + td,
  .blog-table td + td {
    margin-top: 4px;
    font-size: 0.9rem;
  }

  .content-table td:first-child,
  .blog-table td:first-child {
    color: var(--navy);
    font-weight: 800;
  }

  .content-table td + td::before,
  .blog-table td + td::before {
    content: attr(data-label) ": ";
    color: var(--navy);
    font-size: 0.78rem;
    font-weight: 800;
  }

  .terms-table th[scope="row"] {
    margin-bottom: 4px;
    background: transparent;
  }
}


/* ---------------------------------------------------------------------------
 * v13 additions: holiday notice, business hours, problem selector, report
 * preview, contact person, compact service openings, uncropped service
 * graphics, worked examples, messenger contact, guide authors.
 * ------------------------------------------------------------------------ */

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

/* Holiday notice (site.holidayNotice). site.js hides it outside its date window. */
.holiday-notice {
  padding: 11px 0;
  color: var(--navy);
  background: var(--cream);
  border-bottom: 3px solid var(--gold);
  font-size: 0.92rem;
  line-height: 1.5;
}

.holiday-notice strong {
  color: var(--red);
}

.holiday-notice[hidden],
.footer-notice[hidden] {
  display: none !important;
}

.not-found-page .holiday-notice span {
  display: block;
  margin-top: 4px;
}

/* Footer: contact channels and business hours */
.footer-contact {
  display: grid;
  gap: 10px;
  margin-top: 22px;
  font-size: 0.88rem;
}

.footer-contact-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  color: var(--paper);
  font-weight: 700;
}

.footer-contact-links a:hover {
  color: var(--gold);
}

.footer-contact-label {
  display: block;
  margin-bottom: 2px;
  color: var(--paper);
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.nowrap {
  white-space: nowrap;
}

.footer-hours,
.footer-notice {
  max-width: 420px;
  margin: 0;
}

.footer-notice strong {
  color: var(--gold);
}

/* Problem selector (homepage and services overview) */
.selector-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.selector-card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 26px 26px 24px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 4px solid var(--blue);
  border-radius: 14px;
  box-shadow: 0 12px 28px rgba(7, 29, 73, 0.05);
}

.selector-card:nth-child(3n + 2) {
  border-top-color: var(--red);
}

.selector-card:nth-child(3n) {
  border-top-color: var(--gold);
}

.selector-situation {
  margin-bottom: 18px;
  color: var(--navy);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.14rem;
  font-weight: 700;
  line-height: 1.42;
}

.selector-start {
  margin-bottom: 4px;
}

.selector-start span {
  display: block;
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.selector-start strong {
  color: var(--navy);
}

.selector-price {
  margin-bottom: 18px;
  color: var(--muted);
  font-size: 0.94rem;
}

.selector-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin: auto 0 0;
}

/* Homepage report preview */
.report-preview {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(250px, 0.7fr);
  gap: clamp(26px, 4vw, 48px);
  align-items: start;
}

.report-preview-doc {
  min-width: 0;
  padding: clamp(22px, 3vw, 36px);
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 6px solid var(--navy);
  border-radius: 14px;
  box-shadow: var(--shadow);
}

.report-preview-label {
  color: var(--red);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.14em;
}

.report-preview-doc h3 {
  margin: 8px 0 18px;
}

.report-preview-doc h4 {
  margin: 24px 0 10px;
  color: var(--navy);
  font-size: 1rem;
}

.report-preview-meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
  padding: 14px 16px;
  background: var(--mist);
  border-radius: 10px;
}

.report-preview-meta dt {
  color: var(--blue);
  font-size: 0.7rem;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.report-preview-meta dd {
  margin: 0;
  color: var(--navy);
  font-size: 0.92rem;
  font-weight: 700;
}

.report-preview-table table {
  min-width: 620px;
  font-size: 0.88rem;
}

.report-preview-decision {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 22px;
}

.report-preview-decision > div {
  padding: 16px 18px;
  background: var(--cream);
  border-left: 5px solid var(--gold);
  border-radius: 0 10px 10px 0;
}

.report-preview-decision > div + div {
  background: var(--mist);
  border-left-color: var(--blue);
}

.report-preview-decision strong {
  display: block;
  margin-bottom: 4px;
  color: var(--navy);
}

.report-preview-decision p {
  margin: 0;
  color: var(--ink);
  font-size: 0.94rem;
}

.report-preview-aside {
  display: grid;
  gap: 14px;
}

.report-preview-aside .button {
  width: 100%;
}

.report-preview-aside h3 {
  margin: 12px 0 0;
  font-size: 1.05rem;
}

.report-preview-aside .form-note {
  margin: 0;
}

.report-preview-aside .download-link {
  padding: 13px 14px;
  color: var(--ink);
  background: var(--paper);
  border-color: var(--line);
  border-left: 4px solid var(--blue);
}

.report-preview-aside .download-link:hover {
  color: var(--ink);
  background: var(--paper);
  border-color: var(--blue);
}

.report-preview-aside .download-link strong {
  color: var(--navy);
  font-size: 0.88rem;
}

.report-preview-aside .download-link small {
  color: var(--muted);
}

.report-preview-aside .download-icon {
  background: var(--blue);
}

.maturity-action {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px 26px;
}

/* Contact person (homepage, contact page) */
.person-card {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(120px, 190px) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
  padding: 22px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.person-card-media img,
.author-box-media img {
  width: 100%;
  aspect-ratio: 8 / 9;
  object-fit: cover;
  background: var(--mist);
  border-radius: 12px;
}

.person-card h3 {
  margin: 0 0 4px;
}

.person-role {
  margin-bottom: 10px;
  color: var(--blue);
  font-weight: 800;
}

.person-card p:not(.person-role):not(.person-actions) {
  color: var(--muted);
}

.person-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin: 14px 0 0;
  color: var(--blue);
  font-weight: 800;
}

.person-actions a:hover {
  color: var(--navy);
}

/* Homepage: families, method and final step */
.section.home-services-section {
  margin-top: 0;
}

.home-fit-note {
  max-width: 780px;
  margin: 18px auto 0;
  text-align: center;
}

.home-fit-note small {
  color: var(--slate);
  font-size: 0.83rem;
}

.final-choice-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
  gap: 22px;
}

.final-choice {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: clamp(24px, 3vw, 36px);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: var(--radius);
}

.final-choice h3 {
  margin-bottom: 10px;
}

.final-choice > p {
  color: rgba(255, 255, 255, 0.78);
}

.final-choice > .button {
  margin-top: auto;
}

.process-grid.process-grid-compact {
  width: 100%;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin: 6px 0 24px;
}

.process-grid-compact .process-step {
  padding-top: 16px;
}

.process-grid-compact .process-step span {
  margin-bottom: 8px;
  font-size: 1.6rem;
}

.process-grid-compact h4 {
  margin: 0 0 6px;
  color: var(--paper);
  font-size: 0.98rem;
}

.process-grid-compact .process-step p {
  font-size: 0.88rem;
}

.final-note {
  margin: 24px 0 0;
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.88rem;
}

.home-evidence-compact {
  padding: clamp(48px, 6vw, 76px) 0;
  background: var(--section-mist);
}

.home-evidence-compact .section-head {
  margin-bottom: 28px;
}

.home-evidence-compact .section-head h2 {
  font-size: clamp(1.45rem, 2.4vw, 2rem);
}

.home-evidence-compact .evidence-card {
  padding: clamp(18px, 2.4vw, 26px);
  box-shadow: none;
}

.home-evidence-compact .evidence-card > strong {
  font-size: clamp(1.35rem, 2.4vw, 1.9rem);
}

/* Price tables: service | price | scope (v13 layout) */
.pricing-group-note {
  margin: 14px 0 0;
  color: var(--muted);
  font-size: 0.92rem;
}

.price-list td:last-child {
  color: inherit;
  font-weight: inherit;
}

.price-list td:nth-child(2) {
  color: var(--navy);
  font-weight: 800;
}

.price-list td:nth-child(2) {
  min-width: 7.5em;
}

/* Service page opening: suitability, tasks, result, price, what you send, next step */
.service-profile {
  margin: 30px 0 8px;
  padding: clamp(20px, 3vw, 30px);
  background: var(--mist);
  border: 1px solid var(--line);
  border-radius: 14px;
}

.prose .service-profile h3 {
  margin: 0 0 14px;
}

.service-profile dl {
  display: grid;
  margin: 0;
}

.service-profile dl > div {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  gap: 16px;
  padding: 12px 0;
  border-top: 1px solid var(--line);
}

.service-profile dl > div:first-child {
  padding-top: 0;
  border-top: 0;
}

.service-profile dt {
  padding-top: 3px;
  color: var(--blue);
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.service-profile dd {
  min-width: 0;
  margin: 0;
  color: var(--ink);
}

.service-profile dd p {
  margin: 0 0 6px;
}

.service-profile .check-list {
  margin: 0;
}

.profile-prices {
  display: grid;
  gap: 4px;
  margin: 0 0 8px;
  padding: 0;
  list-style: none;
}

.prose .profile-prices li {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 2px 12px;
  padding-bottom: 4px;
  color: var(--ink);
  border-bottom: 1px dashed var(--line);
}

.profile-prices strong {
  margin-left: auto;
  color: var(--navy);
  text-align: right;
}

.service-profile-next dd {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 20px;
}

/* Service graphics: shown completely and scaled down, never cropped or enlarged. */
.content-figure.service-figure {
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
  background: var(--paper);
}

.content-figure.service-figure img {
  width: auto;
  max-width: 100%;
  height: auto;
  aspect-ratio: auto;
  object-fit: contain;
}

/* Build route with four stages (AUFBAUEN) */
.maturity-build-route {
  grid-template-columns: repeat(var(--build-count, 3), minmax(0, 1fr));
}

.prose .maturity-build-route {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.prose .maturity-build-route section:nth-child(2n + 1) {
  border-left: 0;
}

.prose .maturity-build-route section:nth-child(n + 3) {
  border-top: 1px solid #cbd9e6;
}

/* Worked examples (observation → decision) */
.example-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin: 24px 0;
}

.example-card {
  min-width: 0;
  padding: 24px;
}

.example-card h3 {
  margin: 0 0 14px;
  font-size: 1.05rem;
}

.example-card dl {
  display: grid;
  gap: 10px;
  margin: 0;
}

.example-card dt {
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.example-card dd {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 0.92rem;
}

.example-card dl > div:last-child dd {
  color: var(--navy);
  font-weight: 700;
}

/* Contact page: messengers with QR codes and the contact person */
.contact-channel-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 22px;
  align-items: start;
}

.messenger-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.messenger-card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
}

.messenger-card h3 {
  margin: 0;
}

.messenger-number {
  margin: 0;
  color: var(--navy);
  font-weight: 800;
  overflow-wrap: anywhere;
}

.messenger-qr {
  width: 100%;
  max-width: 200px;
  height: auto;
  margin: 8px 0;
  border: 1px solid var(--line);
  border-radius: 10px;
}

.contact-person .person-card {
  grid-template-columns: minmax(100px, 150px) minmax(0, 1fr);
}

/* Guides: author box and related service */
.author-box {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  margin: 40px 0 0;
  padding: 22px;
  background: var(--mist);
  border-radius: 14px;
}

.prose .author-name {
  margin: 0;
  color: var(--navy);
  font-weight: 800;
}

.author-box .person-role {
  margin: 0 0 8px;
}

.author-box p:last-child {
  margin-bottom: 0;
}

.related-service a {
  color: var(--blue);
  font-weight: 800;
}

.team-grid.team-grid-single {
  grid-template-columns: minmax(0, 380px);
}

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

  .report-preview,
  .contact-channel-grid {
    grid-template-columns: 1fr;
  }

  .report-preview-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 880px) {
  .maturity-build-route,
  .prose .maturity-build-route {
    grid-template-columns: 1fr;
  }

  .prose .maturity-build-route section + section {
    border-top: 1px solid #cbd9e6;
  }

  .final-choice-grid,
  .example-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .selector-grid,
  .messenger-grid,
  .report-preview-decision,
  .process-grid.process-grid-compact {
    grid-template-columns: 1fr;
  }

  .person-card,
  .contact-person .person-card,
  .author-box {
    grid-template-columns: 1fr;
  }

  .person-card-media,
  .author-box-media {
    max-width: 180px;
  }

  .service-profile dl > div {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .team-grid.team-grid-single {
    grid-template-columns: 1fr;
  }

  .price-list tr {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .price-list td:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    max-width: 9.5rem;
    text-align: right;
    font-size: 0.92rem;
  }

  .price-list td:nth-child(3) {
    grid-column: 1 / -1;
    grid-row: auto;
    text-align: left;
    color: var(--muted);
    font-size: 0.88rem;
    font-weight: 400;
  }

  .report-preview-table table {
    min-width: 0;
  }

  .report-preview-table thead {
    display: none;
  }

  .report-preview-table tr {
    display: block;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
  }

  .report-preview-table tr:last-child {
    border-bottom: 0;
  }

  .report-preview-table td {
    display: block;
    padding: 0;
    border: 0;
  }

  .report-preview-table td:first-child {
    color: var(--navy);
    font-weight: 800;
  }

  .report-preview-table td + td {
    margin-top: 4px;
  }

  .report-preview-table td + td::before {
    content: attr(data-label) ": ";
    color: var(--navy);
    font-size: 0.78rem;
    font-weight: 800;
  }
}

/* v13: tab labels wrap onto a second row instead of being cut off. */
.tab-list {
  flex-wrap: wrap;
}

.contact-messenger .placeholder-note {
  margin-top: 24px;
}

/* ---------------------------------------------------------------------------
 * v14 homepage: aligned situation cards, smaller special-module cards and
 * "Wer wir sind" without a contact person. Scoped to the homepage; the shared
 * components on other pages are unchanged.
 * ------------------------------------------------------------------------ */

/* Situation cards on the service-card grid; cards in a row share their lines. */
.home-selector .selector-grid {
  gap: 20px;
}

@supports (grid-template-rows: subgrid) {
  .home-selector .selector-card {
    display: grid;
    grid-row: span 4;
    grid-template-rows: subgrid;
    row-gap: 0;
  }
}

/* Special modules: picture cards, visibly smaller than the six main cards. */
.home-specialist-title {
  margin: clamp(44px, 5vw, 60px) 0 20px;
  font-size: clamp(1.2rem, 1.7vw, 1.4rem);
}

.home-specialist-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 20px;
}

.service-card-mini {
  min-height: 0;
}

.service-card-mini .service-card-body {
  padding: 16px 15px 18px;
}

.service-card-mini .service-number {
  margin-bottom: 8px;
  font-size: 0.78rem;
}

.service-card-mini h4 {
  margin: 0 0 14px;
  font-size: 0.98rem;
  line-height: 1.3;
}

.service-card-mini .service-link {
  font-size: 0.8rem;
}

/* Narrower screens: picture beside the text, in the same columns as the main cards. */
@media (max-width: 1100px) {
  .home-specialist-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .service-card-mini {
    flex-direction: row;
    align-items: stretch;
    gap: 14px;
    padding: 16px 14px 12px;
  }

  .service-card-mini .service-card-media {
    flex: 0 0 116px;
    align-self: center;
    border-radius: 8px;
  }

  .service-card-mini .service-card-body {
    min-width: 0;
    padding: 0;
  }

  .service-card-mini h4 {
    margin-bottom: 8px;
  }
}

@media (max-width: 1020px) {
  .home-specialist-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .home-specialist-grid {
    grid-template-columns: 1fr;
  }
}

/* Situation cards: a second link wraps above the main link, so main links stay level.
   v15: for the shared component on the homepage and the services overview. */
.selector-links {
  flex-wrap: wrap-reverse;
}

/* The brand line closes the dark block (hero and principles strip) at its lower edge. */
.hero:has(+ .work-principles-strip)::after {
  display: none;
}

.hero + .work-principles-strip {
  position: relative;
}

.hero + .work-principles-strip::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 7px;
  background: linear-gradient(90deg, var(--blue) 0 33.33%, var(--red) 33.33% 66.66%, var(--gold) 66.66%);
}

/* Market context: sources on one line across the cards. */
.home-evidence-compact .evidence-card {
  display: flex;
  flex-direction: column;
}

.home-evidence-compact .evidence-card a {
  margin-top: auto;
}

/* "Wer wir sind": four equal cards on the same grid as the cards above. */
.home-office .who-grid {
  gap: 20px;
  margin: 0;
}

.home-office .content-card-copy p + p {
  margin-top: 8px;
}

/* v14 ENTWICKELN: one block per service, same structure as "Auf einen Blick", on white. */
.service-profile-detail {
  background: var(--paper);
}

.prose .service-profile-lead {
  margin: -6px 0 16px;
  color: var(--muted);
}

.service-profile .numbered-list {
  margin: 0;
}

/* v14 service pages: worked examples inside the narrow text column, one per row. */
.detail-grid .example-grid {
  grid-template-columns: 1fr;
}

.detail-grid .example-card dl > div {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  gap: 16px;
}

.detail-grid .example-card dt {
  padding-top: 3px;
}

@media (max-width: 640px) {
  .detail-grid .example-card dl > div {
    grid-template-columns: 1fr;
    gap: 2px;
  }
}

/* v14 contact details without JavaScript: short note instead of number, ID or QR code. */
.contact-fallback {
  display: block;
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 400;
}

/* ---------------------------------------------------------------------------
 * v15 visual corrections (authorised by the owner): stronger blue information
 * panels, aligned button/link rows and a clearer answer in the situation cards.
 * Header: see the navigation media queries after the footer rules.
 * ------------------------------------------------------------------------ */

/* Blue information panels: --panel-blue instead of the near-white --mist, with a
   restrained border. Inner dividers follow the panel so they stay visible. */
.service-profile:not(.service-profile-detail),
.service-summary > div:first-child {
  background: var(--panel-blue);
  border-color: var(--panel-blue-line);
}

.contact-card,
.author-box {
  background: var(--panel-blue);
  box-shadow: inset 0 0 0 1px var(--panel-blue-line);
}

.form-challenge {
  background: var(--panel-blue);
  border-color: var(--panel-blue-line);
  border-left-color: var(--gold);
}

/* Targeted contrast correction on the stronger panel (WCAG AA for the small notes). */
.form-challenge .challenge-status {
  color: #4f5f7c;
}

.form-challenge .challenge-error {
  color: #b00000;
}

.form-status:not(.is-error) {
  background: var(--panel-blue);
  border-color: var(--panel-blue-line);
  border-left-color: var(--blue);
}

.service-profile:not(.service-profile-detail) dl > div,
.service-profile:not(.service-profile-detail) .check-list li,
.contact-card .contact-list div {
  border-color: var(--panel-blue-line);
}

.service-profile:not(.service-profile-detail) .profile-prices li {
  border-bottom-color: var(--panel-blue-line);
}

/* Button and text link in one row: both on the same centre line. .service-link keeps
   its automatic top margin in cards (links level at the card bottom) but not in rows. */
.service-profile-next dd > .service-link,
.maturity-action > .service-link,
.button-row > .service-link,
.inline-cta-actions > .service-link,
.cta-band-actions > .service-link {
  margin-top: 0;
  align-self: center;
}

/* Situation cards: the recommended entry ("Passender Einstieg") in brand red, so the
   customer's question (navy) and the answer are clearly distinct. */
.selector-start span {
  color: var(--red);
}

/* v15: links to the fictional sample reports (price page, 48h page). */
.pricing-samples {
  display: flex;
  align-items: baseline;
  gap: 6px 14px;
  margin: 14px 0 0;
  font-size: 0.87rem;
}

.pricing-samples-label {
  flex: none;
  color: var(--muted);
  font-weight: 750;
}

.pricing-samples-links {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 22px;
  min-width: 0;
}

.check-sample {
  margin: 14px 0 0;
}

/* v15: sample deliverables listed in a service profile row – one link per line, no bullets. */
.service-profile .profile-samples {
  display: grid;
  gap: 8px;
  margin: 2px 0 0;
  padding: 0;
  list-style: none;
}

.service-profile .profile-samples li {
  margin: 0;
  padding: 0;
}

.service-profile .profile-samples li::before {
  content: none;
}

/* v15: cross-links under a content block (e.g. Partnermanagement → VERBESSERN, SCHÜTZEN). */
.block-links {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 24px;
  margin: 12px 0 0;
}

.block-links .service-link {
  margin-top: 0;
}

/* v15: callouts with more than one paragraph. */
.callout p + p {
  margin-top: 8px;
}

/* v15: conditionally required form fields (site.js shows them only while needed). */
.form-field[hidden],
.required-mark[hidden] {
  display: none;
}

/* v15: the call request has help texts under some fields (time zone, city); short labels allow
   top alignment, so inputs stay level whether or not a help text follows. */
.appointment-request .form-grid {
  align-items: start;
}

/* v15: AGB / Terms – numbered clauses and paragraphs, open choices, print layout. */
/* AGB/Terms (v15): the long German title "Allgemeine Geschäfts­bedingungen" carries a soft
   hyphen. It may break there on phones only; on wider screens the title breaks at its space. */
.page-hero h1 {
  -webkit-hyphens: none;
  hyphens: none;
}

@media (max-width: 640px) {
  .page-hero h1 {
    -webkit-hyphens: manual;
    hyphens: manual;
  }
}

.terms-version {
  margin: 0 0 18px;
  color: var(--muted);
  font-size: 0.87rem;
  font-weight: 750;
}

.terms-version-end {
  margin-top: 44px;
}

.terms-attention {
  color: var(--muted);
  font-size: 0.92rem;
}

.terms-print-row {
  margin: 0 0 8px;
}

.terms-toc {
  margin: 26px 0 8px;
  padding: 20px 24px;
  background: var(--panel-blue);
  border: 1px solid var(--panel-blue-line);
  border-radius: 12px;
}

.terms-toc h2 {
  margin: 0 0 10px;
  font-size: 1.15rem;
}

.terms-toc ol {
  margin: 0;
  padding-left: 0;
  columns: 2 280px;
  column-gap: 32px;
}

/* Each column keeps its own number indent, so the numbers of the second column never
   touch the text of the first. */
.terms-toc li {
  margin: 0 0 5px 1.8em;
  break-inside: avoid;
}

.terms-clause h2 span {
  color: var(--red);
}

.terms-paragraphs {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: terms-paragraph;
}

.terms-paragraphs > li {
  position: relative;
  margin: 0 0 12px;
  padding-left: 2.6em;
  counter-increment: terms-paragraph;
}

.terms-paragraphs > li::before {
  content: "(" counter(terms-paragraph) ")";
  position: absolute;
  left: 0;
  color: var(--muted);
  font-weight: 750;
}

.terms-paragraphs > li > p {
  margin: 0;
}

.terms-paragraphs > li.terms-highlight {
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 14px;
  background: var(--cream);
  border-left: 4px solid var(--gold);
  border-radius: 0 8px 8px 0;
}

.terms-paragraphs > li.terms-highlight::before {
  top: 10px;
  left: 10px;
}

.terms-paragraphs > li.terms-highlight {
  padding-left: calc(2.6em + 10px);
}

.terms-marker {
  display: inline-block;
  padding: 1px 8px;
  color: #ffffff;
  background: var(--red);
  border-radius: 4px;
  font-size: 0.78rem;
  letter-spacing: 0.06em;
}

.terms-choice dl {
  display: grid;
  gap: 8px;
  margin: 10px 0 0;
}

.terms-choice dl > div {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 12px;
}

.terms-choice dt {
  color: var(--blue);
  font-weight: 800;
}

.terms-choice dd {
  margin: 0;
}

.terms-link-note {
  margin: 18px 0 0;
}

@media (max-width: 640px) {
  .terms-choice dl > div {
    grid-template-columns: 1fr;
    gap: 2px;
  }
}

@media print {
  .topbar,
  .site-header,
  .site-footer,
  .skip-link,
  .consent-banner,
  .page-hero-media,
  .cta-band,
  .terms-print-row {
    display: none !important;
  }

  body {
    background: #ffffff;
    color: #000000;
  }

  .page-hero {
    min-height: 0;
    padding: 0 0 12px;
    color: #000000;
    background: none;
  }

  .page-hero * {
    color: #000000 !important;
  }

  .legal-copy,
  .terms-copy {
    max-width: none;
  }

  .terms-clause {
    break-inside: auto;
  }

  .terms-clause h2 {
    break-after: avoid;
  }

  .terms-paragraphs > li {
    break-inside: avoid;
  }

  .terms-toc {
    background: none;
  }

  .terms-marker {
    color: #b00000;
    background: none;
    border: 1px solid #b00000;
  }

  .terms-paragraphs > li.terms-highlight {
    background: none;
    border-left: 3px solid #000000;
  }

  a {
    color: inherit;
    text-decoration: none;
  }
}

/* ---------------------------------------------------------------------------
 * v21
 * ------------------------------------------------------------------------ */

/* Team on "Über uns": members side by side. The number of columns follows the number of
   members (two in a row, three in a row, four as 2 x 2) or "Spalten" in seiten/ueber-uns.md.
   Cards keep the width of the single card (380 px); tablets show two per row, phones one. */
.team-grid.team-grid-cols-1 {
  grid-template-columns: minmax(0, 380px);
}

.team-grid.team-grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 380px));
}

.team-grid.team-grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 380px));
}

.team-grid.team-grid-cols-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* Photos of different formats: "Bildausschnitt: oben|unten" of a person. */
.team-card-media img.image-focus-top,
.person-card-media img.image-focus-top,
.author-box-media img.image-focus-top {
  object-position: center top;
}

.team-card-media img.image-focus-bottom,
.person-card-media img.image-focus-bottom,
.author-box-media img.image-focus-bottom {
  object-position: center bottom;
}

@media (max-width: 1020px) {
  .team-grid.team-grid-cols-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 880px) {
  .team-grid.team-grid-cols-2,
  .team-grid.team-grid-cols-3,
  .team-grid.team-grid-cols-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .team-grid.team-grid-cols-1,
  .team-grid.team-grid-cols-2,
  .team-grid.team-grid-cols-3,
  .team-grid.team-grid-cols-4 {
    grid-template-columns: minmax(0, 440px);
  }
}

/* Links to AGB paragraphs under a price table ("AGB-Paragrafen" in preise.md), styled like the
   sample links: muted label, links side by side, wrapping on small screens. */
.pricing-terms-links {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 22px;
  margin: 14px 0 0;
  font-size: 0.87rem;
}

.pricing-terms-label {
  flex: none;
  color: var(--muted);
  font-weight: 750;
}

.terms-table .terms-clause-link {
  white-space: normal;
}

/* Images inside articles ("Art: bild"): natural proportions instead of the 5:3 crop of the
   header image, three widths (voll / mittel / klein), visible caption below. On phones every
   image uses the full column width. */
.article-figure img {
  aspect-ratio: auto;
  height: auto;
  object-fit: contain;
  background: var(--paper);
}

.article-figure-medium {
  max-width: 520px;
  margin-inline: auto;
}

.article-figure-small {
  max-width: 360px;
  margin-inline: auto;
}

.article-figure figcaption {
  font-size: 0.84rem;
  line-height: 1.5;
}

.figure-credit {
  color: var(--slate);
  font-style: italic;
}

@media (max-width: 640px) {
  .article-figure-medium,
  .article-figure-small {
    max-width: none;
  }
}

/* Quote with source ("Art: zitat" with "Quelle"). */
.quote-figure {
  margin: 38px 0;
}

.rich-content .quote-figure blockquote {
  margin: 0;
}

.quote-figure figcaption {
  padding-left: 52px;
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 750;
}

.quote-figure figcaption::before {
  content: "– ";
}
