/* SeoForge corporate typography uses the centrally hosted DM Sans family.
   Independent concept studies and the logo retain their own typography. */
.seo-agentur-page {
  --paper: #f8f7f5;
  --warm: #f1ece4;
  --canvas: #fff;
  --ink: #211e19;
  --muted: #625b51;
  --line: #d8cec0;
  --copper: #85471f;
  --copper-hover: #6d3818;
  --gold: #d4a853;
  --space: 8px;
  --measure: 70ch;
  --radius: 4px;
}
.seo-agentur-page * {
  box-sizing: border-box;
}
.seo-agentur-page {
  scroll-behavior: smooth;
  scroll-padding-top: 148px;
}
.seo-agentur-page {
  margin: 0;
  background: var(--canvas);
  color: var(--ink);
  font-family: var(--font-dm-sans), system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.seo-agentur-page ::selection {
  background: #e8c8a6;
  color: var(--ink);
}
.seo-agentur-page button,
.seo-agentur-page input,
.seo-agentur-page textarea {
  font: inherit;
}
.seo-agentur-page button,
.seo-agentur-page a,
.seo-agentur-page input,
.seo-agentur-page textarea,
.seo-agentur-page summary {
  -webkit-tap-highlight-color: transparent;
}
.seo-agentur-page a {
  color: var(--copper);
  text-underline-offset: 5px;
  text-decoration-thickness: 1px;
}
.seo-agentur-page a:hover {
  text-decoration-thickness: 2px;
}
.seo-agentur-page a:focus-visible,
.seo-agentur-page button:focus-visible,
.seo-agentur-page summary:focus-visible,
.seo-agentur-page input:focus-visible,
.seo-agentur-page textarea:focus-visible {
  outline: 3px solid var(--copper);
  outline-offset: 5px;
}
.seo-agentur-page button {
  cursor: pointer;
}
.seo-agentur-page img {
  display: block;
  max-width: 100%;
  height: auto;
}
.seo-agentur-page figure,
.seo-agentur-page dl {
  margin: 0;
}
.seo-agentur-page p {
  font-size: 16px;
  line-height: 1.75;
  margin: 0 0 20px;
  color: var(--muted);
  max-width: var(--measure);
}
.seo-agentur-page h1,
.seo-agentur-page h2,
.seo-agentur-page h3,
.seo-agentur-page h4 {
  margin: 0;
  text-wrap: balance;
  color: var(--ink);
}
.seo-agentur-page h1,
.seo-agentur-page h2 {
  font-family: var(--font-dm-sans), system-ui, sans-serif;
  letter-spacing: -0.035em;
  font-weight: 650;
}
.seo-agentur-page h1 {
  font-size: clamp(44px, 4.45vw, 66px);
  line-height: 1.1;
}
.seo-agentur-page h1 em {
  font-style: normal;
  color: var(--copper);
}
.seo-agentur-page h2 {
  font-size: clamp(34px, 3.15vw, 46px);
  line-height: 1.14;
  margin-bottom: 24px;
}
.seo-agentur-page h3 {
  font-size: 22px;
  line-height: 1.3;
  letter-spacing: -0.02em;
  font-weight: 700;
  margin-bottom: 16px;
}
.seo-agentur-page h4 {
  font-size: 24px;
  line-height: 1.3;
  margin-bottom: 20px;
}
.seo-agentur-page small,
.seo-agentur-page .source {
  font-size: 13px;
  line-height: 1.65;
}
.seo-agentur-page .source {
  margin: 16px 0;
  color: var(--muted);
}
.seo-agentur-page .wrap {
  width: calc(100% - 96px);
  max-width: 1240px;
  margin-inline: auto;
}
.seo-agentur-page .skip {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 30;
  transform: translateY(-150%);
  padding: 16px;
  background: white;
}
.seo-agentur-page .skip:focus {
  transform: translateY(0);
}
.seo-agentur-page .preview-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  min-height: 32px;
  padding: 6px 20px;
  background: var(--ink);
  color: #efe4d6;
  font-size: 12px;
}
.seo-agentur-page .preview-note a {
  color: #efe4d6;
}
.seo-agentur-page .preview-note span {
  color: #d0bc9f;
}
.seo-agentur-page .site-header {
  background: var(--canvas);
  border-bottom: 1px solid var(--line);
}
.seo-agentur-page .header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  height: 76px;
}
.seo-agentur-page .logo {
  width: 186px;
}
.seo-agentur-page .desktop-nav {
  display: flex;
  gap: 21px;
  align-items: center;
}
.seo-agentur-page .desktop-nav a {
  color: var(--ink);
  text-decoration: none;
  font-size: 14px;
  min-height: 44px;
  display: flex;
  align-items: center;
}
.seo-agentur-page .button {
  background: var(--copper);
  color: white;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 14px 23px;
  font-size: 14px;
  font-weight: 750;
  border: 1px solid transparent;
  border-radius: 0;
  text-decoration: none;
  white-space: nowrap;
  transition:
    background 0.18s,
    transform 0.18s;
}
.seo-agentur-page .button:hover {
  background: var(--copper-hover);
  transform: translateY(-2px);
  text-decoration: none;
}
.seo-agentur-page .button:active {
  transform: translateY(0);
}
.seo-agentur-page .mobile-menu {
  display: none;
}
.seo-agentur-page .hero {
  background: var(--paper);
  padding: 64px 0 52px;
}
.seo-agentur-page .hero-grid {
  display: grid;
  grid-template-columns: 1.08fr 1fr;
  gap: 48px;
  align-items: center;
}
.seo-agentur-page .hero-copy {
  padding-bottom: 12px;
}
.seo-agentur-page .hero-copy p {
  font-size: 19px;
  line-height: 1.65;
  max-width: 43ch;
  margin-top: 28px;
}
.seo-agentur-page .actions {
  display: flex;
  gap: 28px;
  align-items: center;
  margin-top: 30px;
  flex-wrap: wrap;
}
.seo-agentur-page .text-link {
  font-size: 15px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
.seo-agentur-page .hero-figure {
  min-width: 0;
}
.seo-agentur-page .work-image {
  width: 100%;
  height: 420px;
  object-fit: cover;
  border: 1px solid var(--ink);
  object-position: 48% 50%;
}
.seo-agentur-page figcaption {
  font-size: 12px;
  line-height: 1.5;
  color: var(--muted);
  margin-top: 12px;
}
.seo-agentur-page .hero-figure figcaption {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.seo-agentur-page .hero-figure figcaption strong {
  font-size: 17px;
  font-family: var(--font-dm-sans), system-ui, sans-serif;
  color: var(--ink);
}
.seo-agentur-page .page-nav {
  position: sticky;
  top: 80px;
  background: #fff;
  z-index: 10;
  border-bottom: 1px solid var(--line);
}
.seo-agentur-page .page-nav .wrap {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  min-height: 64px;
}
.seo-agentur-page .page-nav a {
  display: flex;
  align-items: center;
  min-height: 44px;
  text-decoration: none;
  font-size: 14px;
  font-weight: 650;
  color: var(--ink);
}
.seo-agentur-page .page-nav a:hover {
  color: var(--copper);
}
.seo-agentur-page .section {
  padding: 96px 0;
}
.seo-agentur-page .paper {
  background: var(--paper);
}
.seo-agentur-page .section-head {
  max-width: 800px;
  margin-bottom: 48px;
}
.seo-agentur-page .section-head p {
  font-size: 17px;
}
.seo-agentur-page .service-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 64px;
  row-gap: 48px;
}
.seo-agentur-page .service {
  border-top: 1px solid var(--line);
  padding-top: 28px;
}
.seo-agentur-page .service p {
  max-width: 63ch;
}
.seo-agentur-page .service a,
.seo-agentur-page .collaboration a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  font-size: 14px;
  font-weight: 650;
  margin-right: 20px;
}
.seo-agentur-page .deliverable {
  display: flex;
  flex-direction: column;
  gap: 5px;
  background: var(--paper);
  padding: 20px 24px;
  margin-top: 24px;
}
.seo-agentur-page .deliverable span {
  font-size: 12px;
  color: var(--muted);
}
.seo-agentur-page .deliverable strong {
  font-size: 15px;
  line-height: 1.5;
}
.seo-agentur-page .featured-case {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 56px;
  align-items: start;
}
.seo-agentur-page .featured-case figure {
  min-width: 0;
}
.seo-agentur-page .featured-case img {
  width: 100%;
  aspect-ratio: 1.6;
  object-fit: cover;
  object-position: top;
  border: 1px solid var(--line);
}
.seo-agentur-page .case-story h3 {
  font-family: var(--font-dm-sans), system-ui, sans-serif;
  font-size: 34px;
}
.seo-agentur-page .case-intro {
  font-size: 20px;
  color: var(--ink);
  line-height: 1.5;
}
.seo-agentur-page .case-compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  padding-block: 22px;
  border-block: 1px solid var(--line);
}
.seo-agentur-page .case-compare dt {
  font-size: 13px;
  color: var(--muted);
}
.seo-agentur-page .case-compare dd {
  margin: 5px 0 0;
  font-size: 32px;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  letter-spacing: -0.025em;
}
.seo-agentur-page .case-compare div:last-child dd {
  color: var(--copper);
}
.seo-agentur-page .supporting-cases {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  margin-top: 48px;
  padding-top: 32px;
  border-top: 1px solid var(--line);
}
.seo-agentur-page .supporting-cases article {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 24px;
}
.seo-agentur-page .supporting-cases img {
  aspect-ratio: 1.2;
  object-fit: cover;
  object-position: top;
  border: 1px solid var(--line);
}
.seo-agentur-page .supporting-cases h3 {
  font-size: 21px;
}
.seo-agentur-page .supporting-cases p {
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 12px;
}
.seo-agentur-page .supporting-cases a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  font-size: 14px;
  font-weight: 650;
}
.seo-agentur-page .fit-layout {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 96px;
}
.seo-agentur-page .fit-intro {
  max-width: 470px;
}
.seo-agentur-page .fit-cases article {
  padding: 0 0 28px;
  margin-bottom: 28px;
  border-bottom: 1px solid var(--line);
}
.seo-agentur-page .fit-cases article:last-child {
  border: 0;
  padding: 0;
  margin: 0;
}
.seo-agentur-page .fit-cases p {
  margin-bottom: 10px;
}
.seo-agentur-page .fit-cases a {
  font-size: 14px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  font-weight: 650;
}
.seo-agentur-page .fit-limit {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 40px;
  margin-top: 48px;
  padding: 24px 32px;
  background: var(--warm);
}
.seo-agentur-page .fit-limit strong {
  font-size: 18px;
  line-height: 1.5;
}
.seo-agentur-page .fit-limit p {
  margin: 0;
}
.seo-agentur-page .cost-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
}
.seo-agentur-page .cost-offer { margin: 28px 0; padding: 28px; border: 1px solid var(--line); border-radius: 12px; background: var(--warm); }
.seo-agentur-page #kosten .cost-amount { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; margin: 0 0 16px; color: var(--ink); font-size: clamp(64px, 6vw, 88px); font-weight: 650; line-height: 1.1; letter-spacing: -.04em; }
.seo-agentur-page #kosten .cost-amount span { font-size: 18px; font-weight: 450; letter-spacing: -.01em; }
.seo-agentur-page .cost-offer > p:not(.cost-amount) { max-width: 42ch; font-size: 15px; }
.seo-agentur-page .cost-offer .button { margin: 4px 0 24px; }
.seo-agentur-page .cost-delivery { display: grid; gap: 10px; border-top: 1px solid var(--line); padding-top: 20px; }
.seo-agentur-page .cost-delivery span { display: flex; gap: 12px; align-items: center; font-size: 13px; font-weight: 550; }
.seo-agentur-page .cost-delivery span::before { content: ''; width: 14px; height: 7px; flex-shrink: 0; border-left: 1.5px solid var(--copper); border-bottom: 1.5px solid var(--copper); transform: rotate(-45deg); }
.seo-agentur-page .cost-workbook { margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--line); }
.seo-agentur-page .workbook-heading h3 { margin: 0 0 12px; font-size: 30px; }
.seo-agentur-page .workbook-heading > p { max-width: 70ch; margin-bottom: 28px; font-size: 15px; }
.seo-agentur-page .workbook-rows { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: white; }
.seo-agentur-page .workbook-rows > div { display: grid; grid-template-columns: 1fr 1.4fr 1fr; gap: 32px; padding: 24px 28px; align-items: center; }
.seo-agentur-page .workbook-rows > div + div { border-top: 1px solid var(--line); }
.seo-agentur-page .workbook-rows .workbook-labels { background: var(--warm); padding-block: 14px; font-size: 12px; font-weight: 650; }
.seo-agentur-page .workbook-rows p { margin: 0; font-size: 14px; }
.seo-agentur-page .workbook-rows > div > strong { font-size: 17px; line-height: 1.4; }
.seo-agentur-page .workbook-rows > div > span { font-size: 13px; line-height: 1.8; }
.seo-agentur-page .workbook-rows b { color: var(--copper); font-weight: 550; }
.seo-agentur-page .intent-example { margin-top: 28px; padding: 24px; background: var(--paper); border-radius: 12px; border: 1px solid var(--line); }
.seo-agentur-page .intent-example h3 { font: 650 18px/1.4 var(--font-dm-sans), system-ui, sans-serif; margin: 0 0 4px; }
.seo-agentur-page .intent-example > p { font-size: 12px; margin: 0 0 20px; }
.seo-agentur-page .intent-example dl { margin: 0; display: grid; gap: 12px; }
.seo-agentur-page .intent-example dl > div { display: grid; grid-template-columns: 1.25fr 1fr; gap: 20px; align-items: center; font-size: 13px; }
.seo-agentur-page .intent-example dt { position: relative; padding: 8px 10px; background: white; border: 1px solid var(--line); border-radius: 6px; }
.seo-agentur-page .intent-example dt::after { content: ''; position: absolute; width: 20px; height: 1px; right: -21px; top: 50%; background: var(--line); }
.seo-agentur-page .intent-example dd { margin: 0; color: var(--copper); font-weight: 550; }
.seo-agentur-page .offer-comparison { display: grid; grid-template-columns: .8fr 1.2fr; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; margin-bottom: 32px; }
.seo-agentur-page .offer-comparison > div { padding: 28px 32px; background: var(--paper); }
.seo-agentur-page .offer-comparison > div + div { background: var(--warm); border-left: 1px solid var(--line); }
.seo-agentur-page .offer-comparison h3 { font: 650 20px/1.4 var(--font-dm-sans), system-ui, sans-serif; margin: 0 0 20px; }
.seo-agentur-page .offer-comparison p { font-size: 15px; margin: 0; padding-block: 12px; }
.seo-agentur-page .offer-comparison p + p { border-top: 1px solid var(--line); }
.seo-agentur-page .assessment-preview { margin-top: 28px; border-top: 1px solid var(--line); padding-top: 24px; }
.seo-agentur-page .assessment-preview h3 { font: 650 20px/1.4 var(--font-dm-sans), system-ui, sans-serif; margin: 0 0 20px; }
.seo-agentur-page .assessment-preview dl { display: grid; gap: 18px; margin: 0; }
.seo-agentur-page .assessment-preview dl > div { display: grid; grid-template-columns: 130px 1fr; gap: 16px; font-size: 14px; line-height: 1.6; }
.seo-agentur-page .assessment-preview dt { color: var(--copper); font-weight: 600; }
.seo-agentur-page .assessment-preview dd { margin: 0; color: var(--muted); }
@media (max-width: 767px) {
  .seo-agentur-page .cost-offer { padding: 22px; }
  .seo-agentur-page .cost-offer .button { padding-inline: 14px; font-size: 13px; }
  .seo-agentur-page .cost-workbook { margin-top: 32px; }
  .seo-agentur-page .workbook-rows > div { grid-template-columns: 1fr; gap: 10px; padding: 22px; }
  .seo-agentur-page .workbook-rows .workbook-labels { display: none; }
  .seo-agentur-page .workbook-rows > div > span { border-top: 1px solid var(--line); padding-top: 10px; }
  .seo-agentur-page .offer-comparison { grid-template-columns: 1fr; }
  .seo-agentur-page .offer-comparison > div { padding: 24px; }
  .seo-agentur-page .offer-comparison > div + div { border-left: 0; border-top: 1px solid var(--line); }
  .seo-agentur-page .intent-example { padding: 20px; }
  .seo-agentur-page .intent-example dl > div { grid-template-columns: 1.2fr 1fr; gap: 16px; font-size: 11px; }
  .seo-agentur-page .intent-example dt::after { width: 16px; right: -17px; }
  .seo-agentur-page .assessment-preview dl > div { grid-template-columns: 1fr; gap: 4px; }
}
.seo-agentur-page .price-facts {
  margin: 32px 0 20px;
}
.seo-agentur-page .price-facts div {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 20px;
  padding: 13px 0;
  border-top: 1px solid var(--line);
  font-size: 14px;
  line-height: 1.5;
}
.seo-agentur-page .price-facts dt {
  color: var(--muted);
}
.seo-agentur-page .price-facts dd {
  margin: 0;
  font-weight: 650;
}
.seo-agentur-page .scope-sheet {
  background: var(--warm);
  padding: 36px 40px;
}
.seo-agentur-page .scope-sheet h3 {
  font-family: var(--font-dm-sans), system-ui, sans-serif;
  font-size: 28px;
  line-height: 1.2;
  margin-bottom: 28px;
}
.seo-agentur-page .scope-sheet ol {
  padding-left: 23px;
  margin: 0;
}
.seo-agentur-page .scope-sheet li {
  padding-left: 8px;
  margin-bottom: 24px;
}
.seo-agentur-page .scope-sheet li::marker {
  color: var(--copper);
  font-variant-numeric: tabular-nums;
}
.seo-agentur-page .scope-sheet p {
  font-size: 14px;
  line-height: 1.7;
  margin: 8px 0 0;
}
.seo-agentur-page .scope-sheet a {
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-weight: 650;
}
.seo-agentur-page .collaboration {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 72px;
  align-items: start;
}
.seo-agentur-page .collaboration figure img {
  width: 100%;
  height: 480px;
  object-fit: cover;
  object-position: 45% center;
}
.seo-agentur-page .responsibilities {
  margin-block: 26px;
}
.seo-agentur-page .responsibilities div {
  display: grid;
  grid-template-columns: 128px 1fr;
  gap: 20px;
  padding: 17px 0;
  border-top: 1px solid var(--line);
  font-size: 15px;
  line-height: 1.6;
}
.seo-agentur-page .responsibilities dt {
  font-weight: 700;
}
.seo-agentur-page .responsibilities dd {
  margin: 0;
  color: var(--muted);
}
.seo-agentur-page .timeline {
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  list-style: none;
  gap: 0;
}
.seo-agentur-page .timeline li {
  padding: 28px 28px 0 0;
  border-top: 2px solid var(--copper);
  position: relative;
}
.seo-agentur-page .timeline li:not(:first-child) {
  padding-left: 28px;
}
.seo-agentur-page .timeline li:before {
  content: "";
  position: absolute;
  top: -6px;
  left: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--copper);
}
.seo-agentur-page .timeline li:not(:first-child):before {
  left: 28px;
}
.seo-agentur-page .timeline span {
  display: block;
  font-size: 13px;
  font-weight: 650;
  color: var(--copper);
  margin-bottom: 20px;
}
.seo-agentur-page .timeline h3 {
  font-size: 22px;
}
.seo-agentur-page .timeline p {
  font-size: 15px;
}
.seo-agentur-page .timeline strong {
  display: block;
  font-size: 14px;
  line-height: 1.65;
}
.seo-agentur-page .inline-note {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 40px;
  margin-top: 48px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
}
.seo-agentur-page .inline-note h3 {
  font-size: 20px;
}
.seo-agentur-page .inline-note p {
  margin: 0;
}
.seo-agentur-page .measurement-chain {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding: 28px 0;
  margin: 0 0 56px;
  border-block: 1px solid var(--line);
  gap: 40px;
}
.seo-agentur-page .measurement-chain li {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.seo-agentur-page .measurement-chain li + li {
  border-left: 1px solid var(--line);
  padding-left: 40px;
}
.seo-agentur-page .measurement-chain strong {
  font-family: var(--font-dm-sans), system-ui, sans-serif;
  font-size: 25px;
}
.seo-agentur-page .measurement-chain span {
  font-size: 15px;
  line-height: 1.6;
  color: var(--muted);
}
.seo-agentur-page .measurement-chain small {
  color: var(--copper);
}
.seo-agentur-page .diagnosis {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 64px;
  background: var(--warm);
  padding: 40px;
  margin-bottom: 32px;
}
.seo-agentur-page .diagnosis h3 {
  font-family: var(--font-dm-sans), system-ui, sans-serif;
  font-size: 30px;
  line-height: 1.2;
}
.seo-agentur-page .diagnosis p {
  font-size: 15px;
}
.seo-agentur-page .diagnosis-choices {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.seo-agentur-page .diagnosis-choices button {
  background: transparent;
  border: 1px solid #8a7b69;
  color: var(--ink);
  padding: 13px 17px;
  text-align: left;
  font-weight: 650;
  font-size: 14px;
  min-height: 48px;
}
.seo-agentur-page .diagnosis-choices button[aria-pressed="true"] {
  background: var(--copper);
  border-color: var(--copper);
  color: white;
}
.seo-agentur-page .diagnosis-result {
  padding: 30px;
  background: white;
  align-self: stretch;
}
.seo-agentur-page .diagnosis-result article:not([hidden]) ~ article:not([hidden]) {
  margin-top: 24px;
}
.seo-agentur-page .diagnosis-result strong {
  display: block;
  font-size: 15px;
  line-height: 1.6;
}
.seo-agentur-page .diagnosis-result article[hidden] {
  display: none;
}
.seo-agentur-page .reading {
  max-width: 80ch;
  font-size: 16px;
  margin-bottom: 0;
}
.seo-agentur-page .ai-layout {
  display: grid;
  grid-template-columns: 1fr 0.9fr;
  gap: 88px;
}
.seo-agentur-page .ai-comparison {
  border: 1px solid var(--line);
  padding: 32px;
}
.seo-agentur-page .ai-comparison article + article {
  border-top: 1px solid var(--line);
  padding-top: 24px;
}
.seo-agentur-page .ai-comparison p {
  font-size: 15px;
}
.seo-agentur-page .ai-comparison .source {
  font-size: 12px;
  margin-bottom: 0;
}
.seo-agentur-page .selection-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px 64px;
  margin-bottom: 32px;
}
.seo-agentur-page .selection-grid h3 {
  font-size: 22px;
}
.seo-agentur-page .selection-grid article {
  border-top: 1px solid var(--line);
  padding-top: 24px;
}
.seo-agentur-page .reading-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 32px;
  margin-top: 24px;
}
.seo-agentur-page .reading-links a {
  font-size: 14px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  font-weight: 650;
}
.seo-agentur-page .faq-layout {
  display: grid;
  grid-template-columns: 1fr 1.55fr;
  gap: 80px;
}
.seo-agentur-page .faqs details {
  border-top: 1px solid var(--line);
}
.seo-agentur-page .faqs details:last-child {
  border-bottom: 1px solid var(--line);
}
.seo-agentur-page .faqs summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  min-height: 76px;
  padding: 20px 0;
  font-size: 17px;
  font-weight: 650;
  cursor: pointer;
  list-style: none;
}
.seo-agentur-page .faqs summary::-webkit-details-marker {
  display: none;
}
.seo-agentur-page .faqs summary::after {
  content: "+";
  font-size: 25px;
  color: var(--copper);
  font-weight: 400;
}
.seo-agentur-page .faqs details[open] summary::after {
  content: "−";
}
.seo-agentur-page .faqs details p {
  margin-top: 0;
  padding-right: 24px;
  font-size: 15px;
}
.seo-agentur-page .faqs details a {
  display: inline-block;
  margin-bottom: 24px;
  font-size: 14px;
}
.seo-agentur-page .contact {
  background: var(--warm);
  border-top: 1px solid var(--line);
}
.seo-agentur-page .contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 96px;
}
.seo-agentur-page .contact h2 {
  font-size: 48px;
}
.seo-agentur-page .contact-owner {
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin-top: 36px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
  font-size: 14px;
}
.seo-agentur-page .contact-owner span {
  color: var(--muted);
}
.seo-agentur-page .contact-owner a {
  align-self: flex-start;
  min-height: 44px;
  display: flex;
  align-items: center;
}
.seo-agentur-page form {
  background: white;
  border: 1px solid var(--line);
  padding: 32px;
}
.seo-agentur-page .form-note {
  font-size: 12px;
  color: var(--muted);
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.seo-agentur-page label {
  display: block;
  font-size: 14px;
  font-weight: 650;
  margin: 18px 0 8px;
}
.seo-agentur-page label span {
  font-weight: 400;
  color: var(--muted);
}
.seo-agentur-page input,
.seo-agentur-page textarea {
  width: 100%;
  border: 1px solid #8a7b69;
  border-radius: 0;
  background: var(--paper);
  padding: 14px 16px;
  color: var(--ink);
  caret-color: var(--copper);
  min-height: 50px;
}
.seo-agentur-page input::placeholder,
.seo-agentur-page textarea::placeholder {
  color: #756b5e;
  opacity: 1;
}
.seo-agentur-page textarea {
  resize: vertical;
  line-height: 1.6;
}
.seo-agentur-page form .button {
  width: 100%;
}
.seo-agentur-page .privacy {
  font-size: 12px;
  line-height: 1.7;
  margin-block: 18px;
}
.seo-agentur-page #form-status:empty {
  display: none;
}
.seo-agentur-page #form-status {
  font-size: 14px;
  border: 1px solid var(--copper);
  padding: 16px;
  margin: 20px 0 0;
}
.seo-agentur-page footer {
  padding: 40px 0;
  background: var(--canvas);
  border-top: 1px solid var(--line);
}
.seo-agentur-page .footer-inner {
  display: flex;
  gap: 40px;
  align-items: center;
  justify-content: space-between;
}
.seo-agentur-page .footer-inner p {
  font-size: 13px;
  line-height: 1.6;
  margin: 0;
}
.seo-agentur-page .footer-inner nav {
  display: flex;
  gap: 24px;
}
.seo-agentur-page .footer-inner nav a {
  font-size: 13px;
  min-height: 44px;
  display: flex;
  align-items: center;
}
.seo-agentur-page .desktop-nav a:hover,
.seo-agentur-page .footer-inner a:hover {
  color: var(--copper);
}
@media (min-width: 1600px) {
  .seo-agentur-page .hero {
    padding-block: 72px;
  }
  .seo-agentur-page .work-image {
    height: 450px;
  }
}
@media (max-width: 1200px) {
  .seo-agentur-page .wrap {
    width: calc(100% - 64px);
  }
  .seo-agentur-page .desktop-nav {
    gap: 14px;
  }
  .seo-agentur-page .desktop-nav a {
    font-size: 12px;
  }
  .seo-agentur-page .logo {
    width: 160px;
  }
  .seo-agentur-page .header-cta {
    padding-inline: 16px;
    font-size: 12px;
  }
  .seo-agentur-page .hero-grid {
    gap: 32px;
  }
  .seo-agentur-page .work-image {
    height: 390px;
  }
  .seo-agentur-page .service-grid {
    column-gap: 40px;
  }
  .seo-agentur-page .featured-case {
    gap: 40px;
  }
  .seo-agentur-page .supporting-cases article {
    grid-template-columns: 110px 1fr;
    gap: 20px;
  }
  .seo-agentur-page .fit-layout,
  .seo-agentur-page .cost-layout,
  .seo-agentur-page .collaboration,
  .seo-agentur-page .contact-grid {
    gap: 48px;
  }
  .seo-agentur-page .ai-layout {
    gap: 48px;
  }
  .seo-agentur-page .timeline li {
    padding-right: 18px;
  }
  .seo-agentur-page .timeline li:not(:first-child) {
    padding-left: 18px;
  }
  .seo-agentur-page .timeline li:not(:first-child):before {
    left: 18px;
  }
  .seo-agentur-page .timeline h3 {
    font-size: 20px;
  }
  .seo-agentur-page .timeline p {
    font-size: 14px;
  }
  .seo-agentur-page .diagnosis {
    gap: 32px;
  }
  .seo-agentur-page .faq-layout {
    gap: 40px;
  }
}
@media (max-width: 1023px) {
  .seo-agentur-page .desktop-nav {
    display: none;
  }
  .seo-agentur-page .header-cta {
    margin-left: auto;
    font-size: 14px;
  }
  .seo-agentur-page .mobile-menu {
    display: block;
    position: relative;
    z-index: 20;
  }
  .seo-agentur-page .mobile-menu summary {
    cursor: pointer;
    font-size: 14px;
    min-height: 44px;
    padding: 12px;
  }
  .seo-agentur-page .mobile-menu nav {
    position: absolute;
    right: 0;
    top: 50px;
    display: flex;
    flex-direction: column;
    min-width: 220px;
    background: white;
    border: 1px solid var(--line);
    padding: 12px;
  }
  .seo-agentur-page .mobile-menu a {
    padding: 12px;
    color: var(--ink);
    font-size: 15px;
  }
  .seo-agentur-page .page-nav .wrap {
    gap: 12px;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding-block: 8px;
    column-gap: 24px;
  }
  .seo-agentur-page .page-nav a {
    font-size: 13px;
    min-height: 36px;
  }
  .seo-agentur-page .hero-copy p {
    font-size: 16px;
  }
  .seo-agentur-page .hero h1 {
    font-size: 46px;
  }
  .seo-agentur-page .work-image {
    height: 360px;
  }
    .seo-agentur-page .supporting-cases article {
    display: block;
  }
  .seo-agentur-page .supporting-cases img {
    width: 180px;
    margin-bottom: 24px;
  }
  .seo-agentur-page .collaboration {
    grid-template-columns: 0.7fr 1fr;
    gap: 32px;
  }
  .seo-agentur-page .timeline {
    grid-template-columns: 1fr 1fr;
    gap: 36px;
  }
  .seo-agentur-page .timeline li,
  .seo-agentur-page .timeline li:not(:first-child) {
    padding-left: 0;
  }
  .seo-agentur-page .timeline li:not(:first-child):before {
    left: 0;
  }
  .seo-agentur-page .diagnosis {
    padding: 32px;
  }
  .seo-agentur-page .fit-limit,
  .seo-agentur-page .inline-note {
    grid-template-columns: 220px 1fr;
    gap: 24px;
  }
  .seo-agentur-page .contact h2 {
    font-size: 40px;
  }
  .seo-agentur-page .contact-grid {
    gap: 32px;
  }
  .seo-agentur-page .scope-sheet {
    padding: 28px;
  }
}
@media (max-width: 767px) {
  .seo-agentur-page {
    scroll-padding-top: 24px;
  }
  .seo-agentur-page .wrap {
    width: calc(100% - 40px);
  }
  .seo-agentur-page .preview-note {
    font-size: 11px;
    gap: 12px;
  }
  .seo-agentur-page .preview-note span {
    display: none;
  }
  .seo-agentur-page .header-inner {
    height: 74px;
    gap: 8px;
  }
  .seo-agentur-page .logo {
    width: 145px;
  }
  .seo-agentur-page .header-cta {
    display: none;
  }
  .seo-agentur-page .mobile-menu {
    margin-left: auto;
  }
  .seo-agentur-page .hero {
    padding: 36px 0 32px;
  }
  .seo-agentur-page .hero-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .seo-agentur-page .hero-copy {
    padding: 0;
  }
  .seo-agentur-page .hero h1 {
    font-size: clamp(37px, 8.9vw, 54px);
  }
  .seo-agentur-page .hero-copy p {
    font-size: 16px;
    margin-top: 24px;
    line-height: 1.7;
    max-width: 52ch;
  }
  .seo-agentur-page .actions {
    gap: 14px 24px;
    margin-top: 24px;
  }
  .seo-agentur-page .button {
    font-size: 13px;
    padding-inline: 20px;
  }
  .seo-agentur-page .work-image {
    height: 270px;
    object-position: center;
  }
  .seo-agentur-page .hero-figure figcaption strong {
    font-size: 16px;
  }
  .seo-agentur-page .hero-figure figcaption span {
    font-size: 11px;
  }
      .seo-agentur-page .page-nav {
    position: static;
  }
  .seo-agentur-page .page-nav .wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 18px;
    padding-block: 12px;
  }
  .seo-agentur-page .page-nav a {
    font-size: 13px;
    min-height: 44px;
  }
  .seo-agentur-page .section {
    padding: 60px 0;
  }
  .seo-agentur-page h2 {
    font-size: 35px;
    line-height: 1.15;
    margin-bottom: 20px;
  }
  .seo-agentur-page h3 {
    font-size: 21px;
  }
  .seo-agentur-page .section-head {
    margin-bottom: 32px;
  }
  .seo-agentur-page .section-head p {
    font-size: 16px;
  }
  .seo-agentur-page .service-grid,
  .seo-agentur-page .featured-case,
  .seo-agentur-page .fit-layout,
  .seo-agentur-page .cost-layout,
  .seo-agentur-page .collaboration,
  .seo-agentur-page .ai-layout,
  .seo-agentur-page .selection-grid,
  .seo-agentur-page .faq-layout,
  .seo-agentur-page .contact-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .seo-agentur-page .service-grid {
    row-gap: 32px;
  }
  .seo-agentur-page .service {
    padding-top: 24px;
  }
  .seo-agentur-page .service p {
    font-size: 15px;
  }
  .seo-agentur-page .deliverable {
    padding: 18px 20px;
  }
  .seo-agentur-page .featured-case {
    gap: 24px;
  }
  .seo-agentur-page .case-story h3 {
    font-size: 30px;
  }
  .seo-agentur-page .case-intro {
    font-size: 19px;
  }
  .seo-agentur-page .case-compare dd {
    font-size: 29px;
  }
  .seo-agentur-page .supporting-cases {
    grid-template-columns: 1fr;
    gap: 32px;
    margin-top: 36px;
    padding-top: 28px;
  }
  .seo-agentur-page .supporting-cases article {
    display: grid;
    grid-template-columns: 95px 1fr;
    gap: 20px;
  }
  .seo-agentur-page .supporting-cases img {
    width: 100%;
    margin: 0;
  }
  .seo-agentur-page .supporting-cases h3 {
    font-size: 20px;
  }
  .seo-agentur-page .supporting-cases p {
    font-size: 14px;
  }
  .seo-agentur-page .fit-limit,
  .seo-agentur-page .inline-note {
    grid-template-columns: 1fr;
    gap: 8px;
    margin-top: 32px;
  }
  .seo-agentur-page .fit-limit {
    padding: 24px;
  }
  .seo-agentur-page .fit-limit p,
  .seo-agentur-page .inline-note p {
    font-size: 15px;
  }
  .seo-agentur-page .cost-intro p {
    font-size: 15px;
  }
  .seo-agentur-page .price-facts div {
    grid-template-columns: 0.9fr 1.1fr;
  }
  .seo-agentur-page .scope-sheet {
    padding: 28px 24px;
  }
  .seo-agentur-page .scope-sheet h3 {
    font-size: 27px;
  }
  .seo-agentur-page .collaboration figure img {
    height: 290px;
    object-position: center;
  }
  .seo-agentur-page .collaboration p {
    font-size: 15px;
  }
  .seo-agentur-page .responsibilities div {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .seo-agentur-page .timeline {
    grid-template-columns: 1fr;
    gap: 0;
    padding-left: 8px;
  }
  .seo-agentur-page .timeline li,
  .seo-agentur-page .timeline li:not(:first-child) {
    border-top: 0;
    border-left: 2px solid var(--copper);
    padding: 0 0 32px 28px;
  }
  .seo-agentur-page .timeline li:before,
  .seo-agentur-page .timeline li:not(:first-child):before {
    left: -6px;
    top: 3px;
  }
  .seo-agentur-page .timeline li:last-child {
    padding-bottom: 0;
  }
  .seo-agentur-page .timeline span {
    margin-bottom: 12px;
  }
  .seo-agentur-page .timeline h3 {
    font-size: 22px;
  }
  .seo-agentur-page .timeline p {
    font-size: 15px;
    margin-bottom: 12px;
  }
  .seo-agentur-page .inline-note {
    padding-top: 24px;
  }
  .seo-agentur-page .measurement-chain {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 24px 0;
    margin-bottom: 32px;
  }
  .seo-agentur-page .measurement-chain li + li {
    border-left: 0;
    border-top: 1px solid var(--line);
    padding: 24px 0 0;
  }
  .seo-agentur-page .measurement-chain strong {
    font-size: 25px;
  }
  .seo-agentur-page .diagnosis {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 24px;
  }
  .seo-agentur-page .diagnosis h3 {
    font-size: 28px;
  }
  .seo-agentur-page .diagnosis-result {
    padding: 24px;
  }
  .seo-agentur-page .diagnosis-result h4 {
    font-size: 22px;
  }
  .seo-agentur-page .diagnosis-result p {
    font-size: 15px;
  }
  .seo-agentur-page .reading {
    font-size: 15px;
  }
  .seo-agentur-page .ai-comparison {
    padding: 24px;
  }
  .seo-agentur-page .selection-grid {
    gap: 12px;
  }
  .seo-agentur-page .selection-grid p {
    font-size: 15px;
  }
  .seo-agentur-page .faq-layout {
    gap: 12px;
  }
  .seo-agentur-page .faqs summary {
    font-size: 16px;
    min-height: 76px;
  }
  .seo-agentur-page .faqs details p {
    padding-right: 0;
  }
  .seo-agentur-page .contact h2 {
    font-size: 38px;
  }
  .seo-agentur-page .contact p {
    font-size: 15px;
  }
  .seo-agentur-page fieldset {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
  }
  .seo-agentur-page form {
    padding: 24px;
  }
  .seo-agentur-page .contact .form-note,
  .seo-agentur-page .contact .privacy {
    font-size: 12px;
  }
  .seo-agentur-page .footer-inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .seo-agentur-page .footer-inner nav {
    flex-wrap: wrap;
  }
  .seo-agentur-page .footer-inner p {
    font-size: 13px;
  }
}
@media (max-width: 360px) {
  .seo-agentur-page .wrap {
    width: calc(100% - 32px);
  }
  .seo-agentur-page .hero h1 {
    font-size: 35px;
  }
  .seo-agentur-page .hero h1 br:last-child {
    display: none;
  }
  .seo-agentur-page .actions {
    gap: 8px 20px;
  }
  .seo-agentur-page .actions .button {
    padding-inline: 16px;
    font-size: 12px;
  }
  .seo-agentur-page .work-image {
    height: 230px;
  }
  .seo-agentur-page .supporting-cases article {
    grid-template-columns: 1fr;
  }
  .seo-agentur-page .supporting-cases img {
    width: 150px;
  }
  .seo-agentur-page .scope-sheet,
  .seo-agentur-page .diagnosis,
  .seo-agentur-page form {
    padding: 20px;
  }
  .seo-agentur-page .diagnosis-result {
    padding: 20px;
  }
  .seo-agentur-page h2 {
    font-size: 32px;
  }
  .seo-agentur-page .case-compare dd {
    font-size: 25px;
  }
  .seo-agentur-page .contact h2 {
    font-size: 34px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .seo-agentur-page {
    scroll-behavior: auto;
  }
  .seo-agentur-page *,
  .seo-agentur-page *::before,
  .seo-agentur-page *::after {
    animation: none !important;
    transition: none !important;
  }
}
/* Approved hero composition with an explicitly illustrative traffic mini-app. */
.seo-agentur-page .hero h1 {
  font-family: var(--font-dm-sans), system-ui, sans-serif;
  font-size: clamp(52px, 5.25vw, 76px);
  font-weight: 750;
  line-height: 1.06;
  letter-spacing: -0.04em;
  text-wrap: initial;
}
.seo-agentur-page .hero h1 em { display: inline-block; font-weight: 500; }
.seo-agentur-page .hero .actions { gap: 20px; }
.seo-agentur-page .hero .button { min-height: 58px; padding-inline: 25px; }
.seo-agentur-page .traffic-app {
  --app-surface: #fdfcfa;
  --app-text: #211e19;
  --app-muted: #6b6257;
  --app-accent: #85471f;
  --app-control: #b7a58e;
  --app-rule: #e9e3da;
  min-width: 0; padding: 26px 26px 20px; background: var(--app-surface); color: var(--app-text); border: 1px solid #e1d9ce; border-radius: 14px; color-scheme: light;
}
.seo-agentur-page .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.seo-agentur-page .traffic-app :is(button, input):focus-visible { outline-color: var(--app-accent); }
.seo-agentur-page .traffic-app ::selection { background: var(--app-accent); color: var(--app-surface); }
.seo-agentur-page .traffic-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.seo-agentur-page .traffic-top strong { font-size: 15px; font-weight: 700; }
.seo-agentur-page .demo-label { font-size: 11px; color: var(--app-muted); }
.seo-agentur-page .traffic-summary { display: flex; justify-content: space-between; align-items: flex-end; gap: 14px; margin-top: 34px; }
.seo-agentur-page .traffic-summary > div:first-child { display: grid; gap: 2px; }
.seo-agentur-page .traffic-summary span { color: var(--app-muted); font-size: 12px; }
.seo-agentur-page #traffic-value { font-size: 68px; line-height: 1.1; font-weight: 500; letter-spacing: -.035em; font-variant-numeric: tabular-nums; color: var(--app-text); margin-top: 7px; }
.seo-agentur-page .traffic-date { display: grid; text-align: right; gap: 6px; padding-bottom: 10px; }
.seo-agentur-page .traffic-date #traffic-month { font-size: 18px; color: var(--app-text); font-weight: 500; }
.seo-agentur-page .traffic-date span:last-child { font-size: 11px; }
.seo-agentur-page #traffic-chart { width: 100%; height: 242px; display: block; margin-top: 18px; overflow: visible; }
.seo-agentur-page .chart-grid path { fill: none; stroke: var(--app-rule); stroke-width: 1; }
.seo-agentur-page .chart-grid text, .seo-agentur-page .chart-months text { fill: var(--app-muted); font-size: 11px; font-family: var(--font-dm-sans), system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.seo-agentur-page #traffic-line { fill: none; stroke: var(--app-accent); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 0; vector-effect: non-scaling-stroke; }
.seo-agentur-page #traffic-guide { stroke: var(--app-control); stroke-width: 1; stroke-dasharray: 3 4; }
.seo-agentur-page #traffic-point { fill: var(--app-surface); stroke: var(--app-accent); stroke-width: 2; }
.seo-agentur-page #traffic-fill stop { stop-color: var(--app-accent); }
.seo-agentur-page .traffic-bottom { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; padding-top: 6px; font-size: 11px; color: var(--app-muted); }
.seo-agentur-page .traffic-phases { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; list-style: none; margin: 22px 0 0; padding: 0; }
.seo-agentur-page .traffic-phases li { position: relative; padding-top: 12px; border-top: 1px solid var(--app-rule); }
.seo-agentur-page .traffic-phases li::before { content: ""; position: absolute; top: -1px; left: 0; right: 0; height: 2px; background: var(--app-accent); transform: scaleX(0); transform-origin: left; transition: transform .45s cubic-bezier(.16,1,.3,1); }
.seo-agentur-page .traffic-phases li[data-state="current"]::before, .seo-agentur-page .traffic-phases li[data-state="done"]::before { transform: scaleX(1); }
.seo-agentur-page .traffic-phases strong { display: block; color: var(--app-text); font-size: 12px; font-weight: 600; }
.seo-agentur-page .traffic-phases span { display: block; color: var(--app-muted); font-size: 11px; line-height: 1.5; margin-top: 5px; }
.seo-agentur-page .traffic-phases li[data-state="current"] strong { color: var(--app-accent); }
.seo-agentur-page .traffic-app[data-motion="paused"] .traffic-phases li::before { transition: none; }
.seo-agentur-page #traffic-pause { display: none; background: transparent; color: var(--app-muted); border: 0; min-height: 44px; padding: 5px 0; font-size: 11px; text-decoration: underline; text-underline-offset: 4px; white-space: nowrap; }
.seo-agentur-page.js #traffic-pause:not([hidden]) { display: block; }
.seo-agentur-page #traffic-pause:hover { color: var(--app-text); }
.seo-agentur-page #traffic-disclaimer { font-size: 11px; line-height: 1.5; color: var(--app-muted); margin: 4px 0 0; max-width: 60ch; }
.seo-agentur-page .tool-stack { grid-column: 1 / -1; background: var(--paper); padding: 0; }
.seo-agentur-page .tool-stack p { font-size: 13px; font-weight: 650; color: var(--ink); margin-bottom: 22px; }
.seo-agentur-page .tool-stack p span { font-weight: 400; color: var(--muted); margin-left: 6px; }
.seo-agentur-page .tool-logos { padding: 0; margin: 0; list-style: none; display: grid; grid-template-columns: repeat(6, 1fr); align-items: center; gap: 24px; }
.seo-agentur-page .tool-logos li { display: flex; align-items: center; gap: 9px; min-height: 44px; font-size: 20px; font-weight: 650; letter-spacing: -.025em; }
.seo-agentur-page .tool-logos li:first-child span { font-size: 14px; }
.seo-agentur-page .tool-logos li:first-child b { display: block; font-size: 22px; line-height: 1.15; }
.seo-agentur-page .tool-logos img { width: 32px; height: 32px; object-fit: contain; }
.seo-agentur-page .tool-logos .frog-mark img { width: 140px; height: 40px; }
.seo-agentur-page .tool-logos svg { width: 32px; height: 32px; fill: #f05032; }
.seo-agentur-page .tool-logos .stacked-word { font-size: 12px; line-height: 1.35; letter-spacing: 0; font-weight: 400; }
.seo-agentur-page .tool-logos .stacked-word b { font-size: 14px; font-weight: 650; }
.seo-agentur-page .tool-logos .ahrefs-mark { display: flex; width: 124px; height: 39px; overflow: hidden; align-items: center; justify-content: center; border-radius: 3px; }
.seo-agentur-page .tool-logos .ahrefs-mark img { width: 144px; height: 144px; max-width: none; flex-shrink: 0; }
.seo-agentur-page .section-head h2 { max-width: 23ch; }
.seo-agentur-page #belege .featured-case { grid-template-columns: 1.4fr 1fr; gap: 64px; align-items: center; }
.seo-agentur-page #belege .featured-case figure { transform: rotate(-1deg); }
.seo-agentur-page #belege .featured-case img { box-shadow: 0 20px 45px #4933191a; }
.seo-agentur-page #leistungen .service-grid { column-gap: 80px; row-gap: 56px; }
.seo-agentur-page #leistungen .service:nth-child(even) { margin-top: 50px; }
.seo-agentur-page #leistungen .service h3 { font-size: 28px; max-width: 24ch; }
.seo-agentur-page #leistungen .deliverable { background: transparent; padding: 8px 0 0; }
.seo-agentur-page #leistungen .deliverable strong { font-size: 17px; }
@media (prefers-reduced-motion: no-preference) {
  .seo-agentur-page .hero-copy { animation: hero-arrive .75s cubic-bezier(.16,1,.3,1) both; }
  @keyframes hero-arrive { from { opacity: .7; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
}
@media (max-width: 1199px) {
  .seo-agentur-page .hero-grid { gap: 30px; }
  .seo-agentur-page .hero h1 { font-size: clamp(48px, 5.25vw, 64px); }
  .seo-agentur-page .traffic-app { padding: 22px; }
  .seo-agentur-page .tool-logos { gap: 20px; }
  .seo-agentur-page .tool-logos li { font-size: 17px; gap: 7px; }
}
@media (max-width: 1023px) and (min-width: 768px) {
  .seo-agentur-page .hero-grid { grid-template-columns: 1fr; gap: 40px; }
  .seo-agentur-page .hero h1 { font-size: 72px; }
  .seo-agentur-page .hero-copy p { max-width: 45ch; }
  .seo-agentur-page .traffic-app { max-width: 650px; }
  .seo-agentur-page .tool-logos { grid-template-columns: repeat(3, 1fr); gap: 24px; }
}
@media (max-width: 767px) {
  .seo-agentur-page .hero { padding: 32px 0 30px; }
  .seo-agentur-page .hero-grid { grid-template-columns: 1fr; gap: 32px; }
  .seo-agentur-page .hero h1 { font-size: clamp(43px, 10.4vw, 68px); }
  .seo-agentur-page .hero h1 br { display: initial; }
  .seo-agentur-page .hero-copy { padding: 0; }
  .seo-agentur-page .hero-copy p { font-size: 16px; line-height: 1.65; margin-top: 22px; }
  .seo-agentur-page .hero .actions { gap: 12px 22px; margin-top: 20px; }
  .seo-agentur-page .hero .button { min-height: 54px; padding-inline: 20px; }
  .seo-agentur-page .traffic-app { padding: 20px 16px; }
  .seo-agentur-page .traffic-top strong { font-size: 14px; }
  .seo-agentur-page #traffic-value { font-size: 52px; }
  .seo-agentur-page #traffic-chart { height: auto; }
  .seo-agentur-page .chart-grid text, .seo-agentur-page .chart-months text { font-size: 15px; }
  .seo-agentur-page .traffic-summary { gap: 8px; }
  .seo-agentur-page .traffic-date #traffic-month { font-size: 16px; }
  .seo-agentur-page .traffic-date span:last-child { font-size: 10px; }
  .seo-agentur-page .traffic-phases { gap: 12px; }
  .seo-agentur-page .traffic-phases strong { font-size: 11px; }
  .seo-agentur-page .traffic-phases span { font-size: 10px; }
  .seo-agentur-page .traffic-bottom { flex-wrap: wrap; gap: 0 12px; }
  .seo-agentur-page .hero-copy { order: 0; }
  .seo-agentur-page .tool-stack { padding: 0; order: 1; }
  .seo-agentur-page .traffic-app { order: 2; }
  .seo-agentur-page .tool-stack p { font-size: 12px; margin-bottom: 18px; }
  .seo-agentur-page .tool-stack p span { display: block; margin-left: 0; }
  .seo-agentur-page .tool-logos { grid-template-columns: repeat(2, 1fr); gap: 22px 24px; }
  .seo-agentur-page .tool-logos li { font-size: 19px; }
      .seo-agentur-page #belege .featured-case { grid-template-columns: 1fr; gap: 30px; }
  .seo-agentur-page #leistungen .service-grid { row-gap: 32px; }
  .seo-agentur-page #leistungen .service:nth-child(even) { margin-top: 0; }
  .seo-agentur-page #leistungen .service h3 { font-size: 25px; }
}
@media print {
  .seo-agentur-page .preview-note,
  .seo-agentur-page .site-header,
  .seo-agentur-page .page-nav,
  .seo-agentur-page .actions,
  .seo-agentur-page form,
  .seo-agentur-page .diagnosis-choices {
    display: none;
  }
  .seo-agentur-page .section {
    padding: 30px 0;
  }
  .seo-agentur-page .wrap {
    width: 100%;
  }
  .seo-agentur-page .diagnosis-result article[hidden] {
    display: block !important;
  }
  .seo-agentur-page .hero {
    padding: 20px 0;
  }
  .seo-agentur-page a {
    color: inherit;
  }
  .seo-agentur-page .hero h1 {
    font-size: 38px;
  }
  .seo-agentur-page h2 {
    font-size: 28px;
  }
  .seo-agentur-page article {
    break-inside: avoid;
  }
}

/* Lower-page editorial system. Deliberately scoped: approved upper page is locked. */
.seo-agentur-page #passung { border-top: 1px solid var(--line); }
.seo-agentur-page #passung .fit-layout { grid-template-columns: 1fr 1fr; gap: 80px; }
.seo-agentur-page #passung .fit-intro { max-width: none; }
.seo-agentur-page #passung .fit-cases { padding-top: 8px; }
.seo-agentur-page #passung .fit-cases article { padding: 24px 0 32px; margin: 0; }
.seo-agentur-page #passung .fit-cases article:first-child { padding-top: 0; }
.seo-agentur-page #passung .fit-cases h3 { font-size: 25px; max-width: 26ch; }
.seo-agentur-page #passung .fit-limit { background: none; padding: 32px 0 0; border-top: 1px solid var(--line); }
.seo-agentur-page .topic-map { margin: 32px 0 0; }
.seo-agentur-page .topic-network { position: relative; height: 280px; background: var(--paper); border-radius: 12px; }
.seo-agentur-page .topic-network svg { position: absolute; inset: 0; width: 100%; height: 100%; color: var(--line); }
.seo-agentur-page .topic-node { position: absolute; width: 43%; text-align: center; font-size: 14px; font-weight: 650; background: var(--paper); padding: 8px 4px; }
.seo-agentur-page .topic-node small { display: block; color: var(--muted); font-size: 11px; font-weight: 400; margin-top: 3px; }
.seo-agentur-page .topic-one { top: 12px; left: 0; }.seo-agentur-page .topic-two { top: 12px; right: 0; }
.seo-agentur-page .topic-three { bottom: 12px; left: 0; }.seo-agentur-page .topic-four { bottom: 12px; right: 0; }
.seo-agentur-page .topic-core { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 60%; padding: 16px 8px; text-align: center; background: white; border: 1px solid var(--copper); border-radius: 12px; font-size: 19px; }
.seo-agentur-page .topic-core span { display: block; color: var(--muted); font-weight: 400; font-size: 11px; margin-top: 4px; }
.seo-agentur-page .topic-map figcaption { font-size: 12px; line-height: 1.7; margin-top: 16px; color: var(--muted); }
.seo-agentur-page .topic-map figcaption strong { display: block; color: var(--ink); font-size: 13px; margin-bottom: 4px; }
.seo-agentur-page .topic-trace { stroke: var(--copper); }
@keyframes topic-connect { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: no-preference) {
  .seo-agentur-page .topic-map.is-seen .topic-trace { stroke-dasharray: 1; animation: topic-connect 2.6s cubic-bezier(.16,1,.3,1) both; }
}
.seo-agentur-page #kosten .cost-layout { gap: 80px; align-items: start; }
.seo-agentur-page #kosten .scope-sheet { padding: 32px; background: white; border: 1px solid var(--line); border-radius: 12px; }
.seo-agentur-page #kosten .scope-sheet h3 { font-family: var(--font-dm-sans), system-ui, sans-serif; font-size: 23px; }
.seo-agentur-page .scope-composition { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--line); border: 1px solid var(--line); margin-bottom: 28px; }
.seo-agentur-page .scope-composition span { padding: 16px; background: var(--paper); font-size: 13px; font-weight: 650; }
.seo-agentur-page .scope-composition span:first-child { color: var(--copper); }
.seo-agentur-page #kosten .scope-sheet li { padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid var(--line); }
.seo-agentur-page #kosten .scope-sheet li:last-child { border: 0; padding-bottom: 0; }
.seo-agentur-page #kosten .price-facts { margin-top: 40px; }
.seo-agentur-page #arbeitsweise .collaboration { grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: center; }
.seo-agentur-page #arbeitsweise .release-visual { margin: 0; padding: 32px; background: var(--paper); border-radius: 12px; }
.seo-agentur-page .release-heading { display: flex; justify-content: space-between; gap: 16px; align-items: start; margin-bottom: 40px; }
.seo-agentur-page .release-heading strong { font-family: var(--font-dm-sans), system-ui, sans-serif; font-size: 30px; line-height: 1.2; font-weight: 600; }
.seo-agentur-page .release-heading svg { flex: 0 0 40px; color: var(--copper); }
.seo-agentur-page .release-path { list-style: none; padding: 0; margin: 0; }
.seo-agentur-page .release-path li { display: grid; grid-template-columns: 16px 1fr; gap: 8px 20px; padding-bottom: 32px; position: relative; }
.seo-agentur-page .release-path li:not(:last-child)::before { content: ""; position: absolute; left: 6px; top: 12px; bottom: 0; border-left: 1px solid var(--line); }
.seo-agentur-page .release-dot { width: 13px; height: 13px; border: 1px solid var(--copper); background: var(--paper); border-radius: 50%; margin-top: 5px; z-index: 1; }
.seo-agentur-page .release-path li:last-child .release-dot { background: var(--copper); }
.seo-agentur-page .release-path strong { font-size: 17px; }.seo-agentur-page .release-path p { font-size: 13px; margin: 4px 0 0; line-height: 1.6; }
.seo-agentur-page .release-path small { grid-column: 2; color: var(--copper); font-size: 11px; }
.seo-agentur-page .release-visual figcaption { font-size: 11px; padding-top: 16px; border-top: 1px solid var(--line); }
.seo-agentur-page #start .timeline { gap: 24px; }
.seo-agentur-page #start .timeline li, .seo-agentur-page #start .timeline li:not(:first-child) { padding: 28px 0 0; border-top: 1px solid var(--line); }
.seo-agentur-page #start .timeline li::before, .seo-agentur-page #start .timeline li:not(:first-child)::before { left: 0; width: 32px; height: 5px; top: -3px; border-radius: 0; }
.seo-agentur-page #start .timeline h3 { min-height: 56px; }
.seo-agentur-page #start .timeline strong { padding-top: 20px; margin-top: 24px; border-top: 1px solid var(--line); font-weight: 500; }
.seo-agentur-page #start .timeline span { color: var(--muted); }
.seo-agentur-page #messung .measurement-chain { gap: 0; padding: 0; border: 0; }
.seo-agentur-page #messung .measurement-chain li { padding: 28px 32px; border: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); position: relative; background: var(--paper); }
.seo-agentur-page #messung .measurement-chain li + li { border-left: 1px solid var(--line); }
.seo-agentur-page #messung .measurement-chain li:not(:last-child)::after { content: ""; position: absolute; right: -6px; top: 40px; width: 10px; height: 10px; border-top: 1px solid var(--copper); border-right: 1px solid var(--copper); transform: rotate(45deg); background: var(--paper); z-index: 1; }
.seo-agentur-page #messung .measurement-chain strong { font-family: var(--font-dm-sans), system-ui, sans-serif; font-size: 23px; }
.seo-agentur-page #messung .diagnosis { background: none; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 32px 0; }
.seo-agentur-page #messung .diagnosis-result { background: var(--paper); border-radius: 12px; }
.seo-agentur-page #messung .diagnosis-choices button { border: 0; border-bottom: 1px solid var(--line); padding: 16px 0; }
.seo-agentur-page #messung .diagnosis-choices button[aria-pressed="true"] { background: none; color: var(--copper); border-bottom-color: var(--copper); }
.seo-agentur-page #seo-und-ki .ai-layout { gap: 80px; align-items: start; }
.seo-agentur-page #seo-und-ki .ai-comparison { border: 0; padding: 0; }
.seo-agentur-page .trust-model { margin: 0 0 40px; padding: 28px; background: white; border: 1px solid var(--line); border-radius: 12px; }
.seo-agentur-page .trust-letters { display: grid; grid-template-columns: repeat(4,1fr); border-bottom: 1px solid var(--line); padding-bottom: 20px; margin-bottom: 24px; }
.seo-agentur-page .trust-letters span { font-family: var(--font-dm-sans), system-ui, sans-serif; font-size: clamp(44px,5vw,72px); line-height: 1; text-align: center; border-right: 1px solid var(--line); }
.seo-agentur-page .trust-letters span:last-child { border: 0; color: var(--copper); }
.seo-agentur-page .trust-model figcaption { font-size: 22px; color: var(--ink); line-height: 1.3; }
.seo-agentur-page .trust-evidence { margin: 24px 0; }.seo-agentur-page .trust-evidence div { display: grid; grid-template-columns: 96px 1fr; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 13px; line-height: 1.6; }
.seo-agentur-page .trust-evidence dt { font-weight: 650; }.seo-agentur-page .trust-evidence dd { margin: 0; color: var(--muted); }
.seo-agentur-page #auswahl .selection-grid { gap: 0 64px; }
.seo-agentur-page #auswahl .selection-grid article { padding: 28px 0 24px 36px; position: relative; }
.seo-agentur-page #auswahl .selection-grid article::before { content: ""; position: absolute; left: 3px; top: 33px; width: 9px; height: 15px; border: solid var(--copper); border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); }
.seo-agentur-page #entscheidung { background: white; border-top: 1px solid var(--line); }
.seo-agentur-page #entscheidung .faq-layout { gap: 80px; }
.seo-agentur-page #entscheidung .faqs summary { font-size: 18px; min-height: 88px; }
.seo-agentur-page #entscheidung .faqs details[open] { background: var(--paper); padding-inline: 20px; }
.seo-agentur-page #kontakt { background: var(--paper); }
.seo-agentur-page #kontakt .contact-grid { gap: 80px; align-items: start; }
.seo-agentur-page #kontakt form { border-radius: 12px; padding: 32px; }
.seo-agentur-page #kontakt input, .seo-agentur-page #kontakt textarea { border-color: var(--line); background: white; border-radius: 4px; }
.seo-agentur-page #kontakt .contact-owner { margin-top: 48px; }
@media (max-width: 1023px) {
  .seo-agentur-page #passung .fit-layout, .seo-agentur-page #kosten .cost-layout, .seo-agentur-page #arbeitsweise .collaboration, .seo-agentur-page #seo-und-ki .ai-layout, .seo-agentur-page #kontakt .contact-grid, .seo-agentur-page #entscheidung .faq-layout { gap: 40px; }
  .seo-agentur-page #arbeitsweise .release-visual { padding: 24px; }
  .seo-agentur-page #start .timeline { grid-template-columns: repeat(2,1fr); gap: 40px; }
}
@media (max-width: 767px) {
  .seo-agentur-page #passung .fit-layout, .seo-agentur-page #kosten .cost-layout, .seo-agentur-page #arbeitsweise .collaboration, .seo-agentur-page #seo-und-ki .ai-layout, .seo-agentur-page #kontakt .contact-grid, .seo-agentur-page #entscheidung .faq-layout { grid-template-columns: 1fr; }
  .seo-agentur-page #passung .fit-cases { padding: 0; } .seo-agentur-page #passung .fit-cases article:first-child { padding-top: 24px; border-top: 1px solid var(--line); }
  .seo-agentur-page #passung .fit-limit { grid-template-columns: 1fr; gap: 16px; }
  .seo-agentur-page #arbeitsweise .release-visual { order: 2; }
  .seo-agentur-page #kosten .scope-sheet { padding: 24px; }
  .seo-agentur-page #start .timeline { grid-template-columns: 1fr; gap: 32px; }
  .seo-agentur-page #start .timeline li { border-left: 0; margin: 0; }
  .seo-agentur-page #start .timeline h3 { min-height: 0; } .seo-agentur-page #start .timeline strong { margin-top: 16px; padding-top: 16px; }
  .seo-agentur-page #messung .measurement-chain { grid-template-columns: 1fr; }
  .seo-agentur-page #messung .measurement-chain li { padding: 24px; }
  .seo-agentur-page #messung .measurement-chain li + li { border-left: 0; border-top: 0; }
  .seo-agentur-page #messung .measurement-chain li:not(:last-child)::after { top: auto; bottom: -6px; right: 32px; transform: rotate(135deg); }
  .seo-agentur-page #messung .diagnosis { gap: 24px; } .seo-agentur-page #messung .diagnosis-result { padding: 24px; }
  .seo-agentur-page .trust-model { padding: 24px; }.seo-agentur-page .trust-evidence div { grid-template-columns: 84px 1fr; gap: 12px; }
  .seo-agentur-page #auswahl .selection-grid { grid-template-columns: 1fr; }
  .seo-agentur-page #entscheidung .faqs summary { font-size: 16px; }
  .seo-agentur-page #kontakt form { padding: 24px; } .seo-agentur-page #kontakt .contact-owner { margin-top: 32px; }
}

/* Ninety-day section: centered editorial heading and a full-width link graph. */
.seo-agentur-page #start .section-head { display: block; max-width: none; width: 100%; text-align: center; margin-bottom: 48px; }
.seo-agentur-page #start .section-head h2 { max-width: none; margin: 0 auto 24px; font-size: clamp(32px,3.6vw,50px); line-height: 1.13; }
.seo-agentur-page #start .section-head p { max-width: 68ch; margin: 0 auto; }
.seo-agentur-page .link-universe { margin: 0; background: white; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.seo-agentur-page .universe-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 16px 28px; border-bottom: 1px solid var(--line); font-size: 13px; color: var(--muted); }
.seo-agentur-page .universe-stage { max-width: 1040px; margin: 0 auto; padding: 16px; }.seo-agentur-page .universe-stage svg { display: block; width: 100%; height: auto; }
.seo-agentur-page .universe-links path { stroke: var(--copper); stroke-width: 1.5; }.seo-agentur-page .universe-links .universe-secondary { stroke: #a49787; stroke-width: 1; }.seo-agentur-page .universe-links .universe-cross { stroke: #baad9d; stroke-width: 1; stroke-dasharray: 4 4; }
.seo-agentur-page .universe-stage [data-page-at] rect { fill: var(--paper); stroke: var(--line); stroke-width: 1; }.seo-agentur-page .universe-stage .universe-page rect { fill: white; }.seo-agentur-page .universe-stage text { font: 500 15px var(--font-dm-sans), system-ui, sans-serif; text-anchor: middle; fill: var(--ink); }.seo-agentur-page .universe-stage .universe-page text { font-size: 13px; }.seo-agentur-page .universe-stage .universe-keyword { fill: var(--copper); }
.seo-agentur-page .universe-center rect { fill: var(--ink); }.seo-agentur-page .universe-center text { fill: white; font-size: 21px; font-weight: 600; }.seo-agentur-page .universe-center .universe-center-sub { fill: #e4ded6; font-size: 11px; font-weight: 400; }
.seo-agentur-page .universe-legend { display: flex; flex-wrap: wrap; gap: 12px 28px; padding: 0 32px 28px; font-size: 12px; color: var(--muted); }.seo-agentur-page .universe-legend span { display: flex; align-items: center; gap: 8px; }.seo-agentur-page .universe-legend strong { margin-left: auto; font-weight: 500; color: var(--copper); }.seo-agentur-page .legend-page { width: 12px; height: 10px; border: 1px solid var(--muted); border-radius: 2px; }.seo-agentur-page .legend-link { width: 16px; height: 1px; background: var(--muted); }.seo-agentur-page .legend-keyword { width: 6px; height: 6px; border-radius: 50%; background: var(--copper); }
.seo-agentur-page .universe-explanation { display: grid; grid-template-columns: repeat(3,1fr); gap: 32px; padding: 28px 32px; border-top: 1px solid var(--line); background: var(--paper); }.seo-agentur-page .universe-explanation strong { font-size: 16px; }.seo-agentur-page .universe-explanation p { font-size: 13px; line-height: 1.7; margin: 10px 0 0; }
.seo-agentur-page .link-universe figcaption { margin: 0; padding: 16px 32px; color: var(--muted); font-size: 11px; line-height: 1.7; }
@media(max-width: 767px) {
  .seo-agentur-page #start .section-head { text-align: left; margin-bottom: 32px; } .seo-agentur-page #start .section-head h2 { font-size: 34px; } .seo-agentur-page #start .section-head p { font-size: 15px; }
  .seo-agentur-page .universe-stage { padding: 16px 0; }.seo-agentur-page .universe-stage text, .seo-agentur-page .universe-stage .universe-page text { font-size: 23px; }.seo-agentur-page .universe-center text { font-size: 27px; }.seo-agentur-page .universe-center .universe-center-sub { display: none; }
  .seo-agentur-page .universe-toolbar { padding: 16px 20px; }.seo-agentur-page .universe-legend { padding: 0 20px 20px; gap: 12px 20px; font-size: 11px; }.seo-agentur-page .universe-legend strong { width: 100%; margin: 0; }
  .seo-agentur-page .universe-explanation { grid-template-columns: 1fr; gap: 20px; padding: 24px 20px; }.seo-agentur-page .link-universe figcaption { padding: 16px 20px; }
}
/* Compact tool-style overview: graph on the left, explained comparisons on the right. */
.seo-agentur-page #start .seo-overview { max-width: 1120px; margin-inline: auto; }
.seo-agentur-page .seo-overview .universe-toolbar { padding: 16px 24px; color: var(--ink); }
.seo-agentur-page .seo-overview .universe-toolbar > div { display: flex; flex-direction: column; gap: 6px; }
.seo-agentur-page .seo-overview .universe-toolbar strong { font-size: 16px; }.seo-agentur-page .seo-overview .universe-toolbar span { font-size: 11px; color: var(--muted); }
.seo-agentur-page .overview-columns { display: grid; grid-template-columns: 1fr 1fr; }
.seo-agentur-page .overview-network { padding: 24px 20px; background: #fcfbfa; }
.seo-agentur-page .overview-panel-title { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: baseline; justify-content: space-between; }
.seo-agentur-page .overview-panel-title > strong { font-size: 13px; }.seo-agentur-page .overview-panel-title > span { font-size: 10px; color: var(--muted); }.seo-agentur-page .overview-panel-title b { font-weight: 500; }
.seo-agentur-page .seo-overview .universe-stage { padding: 24px 0 12px; }
.seo-agentur-page .seo-overview .universe-stage text, .seo-agentur-page .seo-overview .universe-stage .universe-page text { font-size: 23px; }
.seo-agentur-page .seo-overview .universe-center text { font-size: 27px; }.seo-agentur-page .seo-overview .universe-center .universe-center-sub { display: none; }
.seo-agentur-page .seo-overview .universe-legend { padding: 8px 0 20px; gap: 12px 20px; font-size: 10px; }
.seo-agentur-page .overview-network-note { font-size: 12px; line-height: 1.7; margin: 0; max-width: 58ch; color: var(--muted); }
.seo-agentur-page .overview-stats { padding: 24px; border-left: 1px solid var(--line); }
.seo-agentur-page .overview-stat { display: grid; grid-template-columns: 1fr 88px; gap: 24px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.seo-agentur-page .overview-stat h3 { font-size: 14px; margin: 0 0 6px; }.seo-agentur-page .overview-stat p { font-size: 12px; line-height: 1.65; margin: 0; }
.seo-agentur-page .overview-value { display: flex; align-items: baseline; justify-content: flex-end; gap: 12px; font-variant-numeric: tabular-nums; }
.seo-agentur-page .overview-value span { font-size: 12px; color: var(--muted); }.seo-agentur-page .overview-value strong { font-size: 28px; font-weight: 550; letter-spacing: -.025em; min-width: 3ch; text-align: right; color: var(--copper); }
.seo-agentur-page .overview-action { margin-top: 20px; min-height: 104px; }.seo-agentur-page .overview-action > strong { font-size: 13px; }.seo-agentur-page .overview-action p { font-size: 12px; line-height: 1.7; margin: 8px 0 0; }
.seo-agentur-page .overview-periods { display: grid; grid-template-columns: repeat(4,1fr); list-style: none; margin: 0; padding: 0 24px; background: var(--paper); border-top: 1px solid var(--line); }
.seo-agentur-page .overview-periods li { position: relative; padding: 16px 12px; }.seo-agentur-page .overview-periods strong { display: block; font-size: 12px; font-weight: 650; }.seo-agentur-page .overview-periods span { display: block; font-size: 11px; color: var(--muted); margin-top: 5px; }.seo-agentur-page .overview-periods li::before { content: ''; position: absolute; height: 2px; background: var(--copper); left: 0; right: 0; top: -1px; transform: scaleX(0); transform-origin: left; transition: transform .5s cubic-bezier(.16,1,.3,1); }.seo-agentur-page .overview-periods li[data-state="done"]::before,.seo-agentur-page .overview-periods li[aria-current]::before { transform: scaleX(1); }.seo-agentur-page .overview-periods li[aria-current] strong { color: var(--copper); }
.seo-agentur-page .seo-overview figcaption { font-size: 10px; padding: 16px 24px; }
@media(max-width: 900px) {
  .seo-agentur-page .overview-columns { grid-template-columns: 1fr; }.seo-agentur-page .overview-stats { border-left: 0; border-top: 1px solid var(--line); }.seo-agentur-page .overview-network { max-width: 100%; }.seo-agentur-page .seo-overview .universe-stage { max-width: 560px; }
}
@media(max-width: 480px) {
  .seo-agentur-page .overview-network,.seo-agentur-page .overview-stats { padding: 20px; }.seo-agentur-page .overview-stat { grid-template-columns: 1fr 70px; gap: 12px; }.seo-agentur-page .overview-value { gap: 6px; }.seo-agentur-page .overview-value strong { font-size: 24px; }.seo-agentur-page .overview-periods { padding-inline: 12px; }.seo-agentur-page .overview-periods li { padding-inline: 6px; }.seo-agentur-page .overview-periods strong { font-size: 10px; }.seo-agentur-page .overview-periods span { font-size: 10px; }.seo-agentur-page .overview-action { min-height: 120px; }
}
@media(prefers-reduced-motion: reduce) { .seo-agentur-page .overview-periods li::before { transition: none; } }
/* Reference: Semrush Network Graph UI, inspected from official documentation. */
.seo-agentur-page #start .seo-overview { --line: #e0e1e7; --muted: #656875; --copper: #0078c8; --ink: #252730; --paper: #f5f5f8; border-color: #dfe0e6; border-radius: 8px; }
.seo-agentur-page .seo-overview .universe-toolbar { background: #f7f7fa; border-bottom-color: #dfe0e6; }.seo-agentur-page .seo-overview .overview-network { background: white; }
.seo-agentur-page .seo-overview .overview-panel-title { border-bottom: 1px solid #e0e1e7; padding-bottom: 16px; }.seo-agentur-page .seo-overview .overview-panel-title > strong { font-size: 14px; }
.seo-agentur-page .seo-overview .universe-stage { max-width: 430px; padding: 4px 0; }
.seo-agentur-page .seo-overview .semrush-mesh .universe-links path { stroke: #d2d5de; stroke-width: 1; }.seo-agentur-page .seo-overview .semrush-mesh .universe-links .mesh-strong { stroke: #00a98f; stroke-width: 1.3; }
.seo-agentur-page .mesh-neutral { fill: #c4c7d0; stroke: white; stroke-width: 1.5; }.seo-agentur-page .mesh-relevant { fill: #00b894; stroke: white; stroke-width: 1.5; }.seo-agentur-page .mesh-root { fill: #26a9ed; stroke: #d9f1ff; stroke-width: 7; }
.seo-agentur-page .seo-overview .semrush-mesh .mesh-domain-label { fill: #0078c8; font-size: 16px; font-weight: 650; text-anchor: middle; }
.seo-agentur-page .seo-overview .overview-value strong { color: #0078c8; }.seo-agentur-page .seo-overview .overview-stat { padding-block: 18px; }.seo-agentur-page .seo-overview .overview-action { background: #f1fbf8; padding: 16px; border-radius: 4px; min-height: 120px; }.seo-agentur-page .seo-overview .overview-action > strong { color: #087f6e; }
.seo-agentur-page .seo-overview .overview-periods { background: #f5f5f8; }.seo-agentur-page .seo-overview .overview-periods li::before { background: #ff642d; }.seo-agentur-page .seo-overview .overview-periods li[aria-current] strong { color: #252730; }
.seo-agentur-page .seo-overview .universe-legend .legend-page { border: 0; border-radius: 50%; background: #c4c7d0; width: 8px; height: 8px; }.seo-agentur-page .seo-overview .universe-legend .legend-keyword { background: #00b894; }
.seo-agentur-page .agency-efficiency { max-width: 1120px; margin: 40px auto 48px; display: grid; grid-template-columns: 1.4fr 1fr; gap: 64px; align-items: center; }
.seo-agentur-page .agency-efficiency h3 { font-size: 26px; line-height: 1.25; margin-bottom: 16px; }.seo-agentur-page .agency-efficiency p { font-size: 14px; line-height: 1.75; margin-bottom: 0; }
.seo-agentur-page .efficiency-price { border-left: 1px solid var(--line); padding-left: 40px; }.seo-agentur-page .efficiency-price > span { font-size: 12px; color: var(--muted); }.seo-agentur-page .efficiency-price > strong { display: block; font-size: 38px; font-weight: 550; margin-top: 8px; }.seo-agentur-page .efficiency-price small { font-size: 14px; font-weight: 400; margin-left: 8px; }.seo-agentur-page .efficiency-price p { font-size: 12px; }.seo-agentur-page .efficiency-price a { font-size: 13px; }
@media(max-width: 767px) { .seo-agentur-page .agency-efficiency { grid-template-columns: 1fr; gap: 24px; margin-top: 32px; }.seo-agentur-page .efficiency-price { padding: 24px 0 0; border-left: 0; border-top: 1px solid var(--line); }.seo-agentur-page .seo-overview .semrush-mesh .mesh-domain-label { font-size: 21px; } }
/* Measurement and FAQ: one reading axis, explicit grouping, stable disclosure. */
.seo-agentur-page #messung > .wrap { max-width: 1120px; }
.seo-agentur-page #messung .section-head { width: 100%; max-width: none; text-align: center; margin-bottom: 40px; }
.seo-agentur-page #messung .section-head h2 { max-width: none; font-size: clamp(32px,3.5vw,48px); line-height: 1.15; margin-bottom: 24px; }
.seo-agentur-page #messung .section-head p { max-width: 64ch; margin: 0 auto; }
.seo-agentur-page #messung .measurement-chain { margin-bottom: 40px; border: 1px solid var(--line); border-top: 0; border-radius: 0 0 12px 12px; overflow: hidden; }
.seo-agentur-page .measurement-flow { margin: 0; border: 1px solid var(--line); border-radius: 12px 12px 0 0; background: var(--paper); overflow: hidden; }
.seo-agentur-page .measurement-flow-labels { display: grid; grid-template-columns: repeat(3,1fr); padding: 28px 32px 0; text-align: center; }
.seo-agentur-page .measurement-flow-labels strong { font-size: 23px; letter-spacing: -.02em; }
.seo-agentur-page .measurement-flow-labels span { display: block; font-size: 13px; font-weight: 400; color: var(--muted); margin-top: 6px; letter-spacing: 0; }
.seo-agentur-page .measurement-flow-canvas { position: relative; margin: 10px 32px 0; padding-bottom: 40px; }
.seo-agentur-page .measurement-flow svg { display: block; width: 100%; height: auto; overflow: visible; }
.seo-agentur-page .flow-routes { stroke: var(--line); }
.seo-agentur-page .flow-ribbon { fill: var(--warm); }
.seo-agentur-page .flow-focus { stroke: var(--copper); }
.seo-agentur-page .flow-endpoints { fill: var(--paper); stroke: var(--line); stroke-width: 2; }
.seo-agentur-page .flow-endpoints .flow-conversion { fill: var(--copper); stroke: var(--paper); stroke-width: 5; }
.seo-agentur-page .flow-page > rect:first-child { fill: white; stroke: var(--line); }
.seo-agentur-page .flow-page path { stroke: var(--muted); stroke-width: 2; }
.seo-agentur-page .flow-page > rect:last-child { fill: var(--copper); }
.seo-agentur-page .flow-example { position: absolute; bottom: 22px; font-size: 12px; font-weight: 550; color: var(--muted); }
.seo-agentur-page .flow-example-search { left: 0; }.seo-agentur-page .flow-example-page { left: 50%; transform: translateX(-50%); text-align: center; }.seo-agentur-page .flow-example-lead { right: 0; color: var(--copper); }
.seo-agentur-page .measurement-flow figcaption { border-top: 1px solid var(--line); padding: 14px 28px; font-size: 11px; line-height: 1.6; color: var(--muted); }
@media (prefers-reduced-motion: no-preference) {
  .seo-agentur-page .measurement-flow.flow-visible .flow-focus { animation: measurement-route 2.6s cubic-bezier(.16,1,.3,1) both; }
  @keyframes measurement-route { from { stroke-dasharray: 1; stroke-dashoffset: 1; } to { stroke-dasharray: 1; stroke-dashoffset: 0; } }
}
@media (max-width: 767px) {
  .seo-agentur-page .measurement-flow-labels { padding: 20px 12px 0; gap: 8px; }
  .seo-agentur-page .measurement-flow-labels strong { font-size: 14px; }.seo-agentur-page .measurement-flow-labels span { font-size: 10px; line-height: 1.4; }
  .seo-agentur-page .measurement-flow-canvas { margin: 18px 16px 0; padding-bottom: 42px; }
  .seo-agentur-page .flow-example { bottom: 12px; font-size: 10px; max-width: 30%; line-height: 1.4; }
  .seo-agentur-page .flow-example-lead { text-align: right; }
  .seo-agentur-page .measurement-flow figcaption { padding: 14px 20px; }
}
.seo-agentur-page #messung .measurement-chain li { background: white; padding: 28px; border: 0; gap: 12px; }
.seo-agentur-page #messung .measurement-chain li + li { border-left: 1px solid var(--line); }
.seo-agentur-page #messung .measurement-chain li::after { display: none; }
.seo-agentur-page #messung .measurement-chain strong { font-size: 21px; line-height: 1.25; }
.seo-agentur-page #messung .measurement-chain span { font-size: 14px; line-height: 1.6; }
.seo-agentur-page #messung .measurement-chain small { font-size: 11px; margin-top: auto; padding-top: 16px; color: var(--muted); }
.seo-agentur-page #messung .diagnosis { display: block; padding: 32px; border: 0; border-radius: 12px; background: var(--paper); margin-bottom: 24px; }
.seo-agentur-page #messung .diagnosis > div:first-child { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 40px; align-items: start; }
.seo-agentur-page #messung .diagnosis h3 { font-family: var(--font-dm-sans), system-ui, sans-serif; font-size: 24px; line-height: 1.3; margin: 0; }
.seo-agentur-page #messung .diagnosis > div:first-child > p { margin: 0; font-size: 14px; }
.seo-agentur-page #messung .diagnosis-choices { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3,1fr); gap: 0; margin-top: 12px; border-bottom: 1px solid var(--line); }
.seo-agentur-page #messung .diagnosis-choices button { padding: 16px 12px; border: 0; border-bottom: 2px solid transparent; font-size: 13px; text-align: center; min-height: 52px; }
.seo-agentur-page #messung .diagnosis-choices button[aria-pressed='true'] { border-bottom-color: var(--copper); color: var(--copper); background: white; }
.seo-agentur-page #messung .diagnosis-choices button:hover { background: white; }
.seo-agentur-page #messung .diagnosis-result { margin-top: 28px; padding: 0; background: none; }
.seo-agentur-page #messung .diagnosis-result article:not([hidden]) { display: grid; grid-template-columns: 1fr 1.4fr; gap: 16px 40px; align-items: start; }
.seo-agentur-page #messung .diagnosis-result h4 { font-size: 22px; font-weight: 550; line-height: 1.4; margin: 0; }
.seo-agentur-page #messung .diagnosis-result p { font-size: 14px; line-height: 1.75; margin: 0; }
.seo-agentur-page #messung .diagnosis-result strong { grid-column: 2; padding-top: 16px; border-top: 1px solid var(--line); font-size: 13px; font-weight: 650; }
.seo-agentur-page #messung .reading { max-width: none; font-size: 13px; line-height: 1.75; color: var(--muted); }
.seo-agentur-page #entscheidung .faq-layout { display: block; max-width: 960px; }
.seo-agentur-page #entscheidung .faq-intro { margin-bottom: 40px; text-align: center; }
.seo-agentur-page #entscheidung .faq-intro h2 { font-size: clamp(32px,3.5vw,46px); line-height: 1.2; margin-bottom: 20px; }
.seo-agentur-page #entscheidung .faq-intro p { max-width: 58ch; margin: 0 auto; font-size: 15px; }
.seo-agentur-page #entscheidung .faqs { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.seo-agentur-page #entscheidung .faqs details, .seo-agentur-page #entscheidung .faqs details[open] { padding: 0 28px; border: 0; background: white; }
.seo-agentur-page #entscheidung .faqs details + details { border-top: 1px solid var(--line); }
.seo-agentur-page #entscheidung .faqs details[open] { background: var(--paper); }
.seo-agentur-page #entscheidung .faqs summary { padding: 24px 0; min-height: 80px; font-size: 17px; line-height: 1.5; gap: 24px; }
.seo-agentur-page #entscheidung .faqs summary::after { flex-shrink: 0; width: 24px; text-align: center; }
.seo-agentur-page #entscheidung .faqs details p { max-width: 75ch; padding: 0 40px 24px 0; margin: 0; font-size: 15px; line-height: 1.8; }
.seo-agentur-page #entscheidung .faqs details a { margin-bottom: 24px; font-size: 13px; min-height: 44px; display: inline-flex; align-items: center; }
@media(max-width: 767px) {
  .seo-agentur-page #messung .section-head, .seo-agentur-page #entscheidung .faq-intro { text-align: left; }
  .seo-agentur-page #messung .measurement-chain li + li { border-left: 0; border-top: 1px solid var(--line); }
  .seo-agentur-page #messung .measurement-chain li { padding: 24px; gap: 8px; }
  .seo-agentur-page #messung .measurement-chain small { padding-top: 8px; }
  .seo-agentur-page #messung .diagnosis { padding: 24px; }
  .seo-agentur-page #messung .diagnosis > div:first-child, .seo-agentur-page #messung .diagnosis-result article:not([hidden]) { grid-template-columns: 1fr; gap: 16px; }
  .seo-agentur-page #messung .diagnosis h3 { font-size: 22px; }
  .seo-agentur-page #messung .diagnosis-choices { grid-template-columns: 1fr; margin-top: 8px; }
  .seo-agentur-page #messung .diagnosis-choices button { text-align: left; padding: 14px 12px; }
  .seo-agentur-page #messung .diagnosis-result strong { grid-column: 1; }
  .seo-agentur-page #messung .diagnosis-result h4 { font-size: 20px; }
  .seo-agentur-page #entscheidung .faqs details, .seo-agentur-page #entscheidung .faqs details[open] { padding-inline: 20px; }
  .seo-agentur-page #entscheidung .faqs summary { font-size: 15px; padding-block: 20px; gap: 16px; }
  .seo-agentur-page #entscheidung .faqs details p { padding-right: 0; font-size: 14px; }
}
/* Growth scene: one expanding topic system, synchronized illustrative metrics. */
.seo-agentur-page .growth-engine { margin: 0; border: 1px solid var(--line); border-radius: 12px; background: white; overflow: hidden; }
.seo-agentur-page .growth-header { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; padding: 16px 28px; border-bottom: 1px solid var(--line); }.seo-agentur-page .growth-header > strong { font-size: 16px; }
.seo-agentur-page .growth-body { display: grid; grid-template-columns: 1.4fr 1fr; }
.seo-agentur-page .growth-canvas { align-self: center; padding: 24px 16px 16px; min-width: 0; }.seo-agentur-page .growth-map { display: block; width: 100%; height: auto; overflow: visible; }
.seo-agentur-page .growth-edge { stroke: var(--copper); stroke-width: 1.5; }.seo-agentur-page .growth-twig { stroke: #a69a8b; stroke-width: 1; }
.seo-agentur-page .growth-node rect { fill: var(--paper); stroke: var(--line); stroke-width: 1; }.seo-agentur-page .growth-node text { font: 500 13px var(--font-dm-sans), system-ui, sans-serif; fill: var(--ink); text-anchor: middle; }.seo-agentur-page .growth-leaf rect { fill: white; }.seo-agentur-page .growth-leaf path { fill: none; stroke: var(--copper); stroke-width: 1.2; }
.seo-agentur-page .growth-domain rect { fill: var(--ink); }.seo-agentur-page .growth-domain text { text-anchor: middle; font: 650 19px var(--font-dm-sans), system-ui, sans-serif; fill: white; }.seo-agentur-page .growth-domain .growth-domain-sub { font-size: 10px; font-weight: 400; fill: #e4ded6; }
.seo-agentur-page .growth-map-caption { display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: space-between; padding: 16px 16px 0; font-size: 12px; color: var(--muted); }.seo-agentur-page .growth-map-caption > span:first-child { color: var(--ink); font-weight: 650; }
.seo-agentur-page .growth-readout { padding: 32px; border-left: 1px solid var(--line); background: var(--paper); }
.seo-agentur-page .growth-metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; padding-bottom: 28px; border-bottom: 1px solid var(--line); }.seo-agentur-page .growth-metrics span { display: block; min-height: 36px; font-size: 11px; color: var(--muted); }.seo-agentur-page .growth-metrics strong { display: block; font-size: clamp(32px,3.5vw,48px); line-height: 1.1; font-weight: 550; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }.seo-agentur-page .growth-metrics small { display: block; font-size: 10px; color: var(--muted); margin-top: 10px; }
.seo-agentur-page .growth-keywords { padding-top: 28px; }.seo-agentur-page .growth-keywords > div:first-child { margin-bottom: 24px; }.seo-agentur-page .growth-keywords > div:first-child strong { display: block; font-size: 17px; }.seo-agentur-page .growth-keywords > div:first-child > span { display: block; font-size: 11px; color: var(--muted); margin-top: 6px; }
.seo-agentur-page .growth-keyword-row { display: grid; grid-template-columns: 1fr 28px; gap: 8px 16px; margin-top: 20px; }.seo-agentur-page .growth-keyword-row > span { font-size: 12px; }.seo-agentur-page .growth-keyword-row > strong { grid-column: 2; grid-row: 1 / 3; align-self: center; font-size: 14px; font-variant-numeric: tabular-nums; font-weight: 550; }.seo-agentur-page .growth-bar-track { height: 4px; background: #e5dfd7; }.seo-agentur-page .growth-bar-track i { display: block; height: 100%; width: 100%; background: var(--copper); transform-origin: left; transform: scaleX(.9); }
.seo-agentur-page .growth-engine figcaption { padding: 20px 28px; margin: 0; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; line-height: 1.7; }
.seo-agentur-page .growth-compact .growth-body { grid-template-columns: 1fr; }.seo-agentur-page .growth-compact .growth-readout { border-left: 0; border-top: 1px solid var(--line); padding: 24px; }.seo-agentur-page .growth-compact .growth-keywords { display: none; }.seo-agentur-page .growth-compact .growth-metrics { padding-bottom: 0; border: 0; }.seo-agentur-page .growth-compact .growth-canvas { padding: 16px 8px; }.seo-agentur-page .growth-compact .growth-header { padding-inline: 24px; }.seo-agentur-page .growth-compact .growth-header > strong { font-size: 14px; }
@media(max-width: 1023px) { .seo-agentur-page .growth-body { grid-template-columns: 1fr; }.seo-agentur-page .growth-readout { border-left: 0; border-top: 1px solid var(--line); }.seo-agentur-page .growth-keywords { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 24px; }.seo-agentur-page .growth-keywords > div:first-child { grid-column: 1 / -1; margin-bottom: 0; } }
@media(max-width: 767px) { .seo-agentur-page #arbeitsweise .growth-engine { order: 2; }.seo-agentur-page .growth-header, .seo-agentur-page .growth-readout { padding: 20px; }.seo-agentur-page .growth-header > strong { font-size: 15px; }.seo-agentur-page .growth-canvas { padding: 20px 0; }.seo-agentur-page .growth-map-caption { font-size: 10px; padding-inline: 20px; }.seo-agentur-page .growth-metrics { gap: 12px; }.seo-agentur-page .growth-metrics strong { font-size: 34px; }.seo-agentur-page .growth-metrics span { font-size: 10px; }.seo-agentur-page .growth-metrics small { font-size: 9px; }.seo-agentur-page .growth-keywords { grid-template-columns: 1fr; }.seo-agentur-page .growth-engine figcaption { padding: 16px 20px; }.seo-agentur-page .growth-compact .growth-canvas { padding: 20px 0; } }
@media(max-width: 767px) {
  .seo-agentur-page .growth-node text { font-size: 24px; }
  .seo-agentur-page .growth-domain text { font-size: 26px; }
  .seo-agentur-page .growth-domain .growth-domain-sub { display: none; }
}
/* Responsibility demonstrated as one continuous, scoped handoff. */
.seo-agentur-page .handoff-app { margin: 0; background: white; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.seo-agentur-page .handoff-top { padding: 16px 24px; display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: center; border-bottom: 1px solid var(--line); }.seo-agentur-page .handoff-top > strong { font-size: 14px; }
.seo-agentur-page .handoff-owners { display: flex; align-items: center; gap: 16px; padding: 28px 28px 0; font-size: 12px; font-weight: 650; }.seo-agentur-page .handoff-owners span { flex-shrink: 0; padding: 8px 0; border-bottom: 1px solid transparent; }.seo-agentur-page .handoff-owners svg { width: 100%; height: 32px; overflow: visible; }.seo-agentur-page .handoff-owners path { stroke: var(--line); stroke-width: 1; }.seo-agentur-page .handoff-owners circle { fill: var(--copper); }
.seo-agentur-page .handoff-task { padding: 28px; }.seo-agentur-page .handoff-task h3 { font-family: var(--font-dm-sans), system-ui, sans-serif; font-size: 32px; line-height: 1.2; margin-bottom: 16px; }.seo-agentur-page .handoff-task > p { font-size: 14px; }
.seo-agentur-page .handoff-document { position: relative; overflow: hidden; padding: 24px; background: var(--paper); margin-top: 28px; }.seo-agentur-page .handoff-document-title { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 11px; }.seo-agentur-page .handoff-document-title svg { flex-shrink: 0; }
.seo-agentur-page .handoff-lines { display: grid; gap: 10px; margin: 24px 0; }.seo-agentur-page .handoff-lines i { height: 3px; background: var(--line); width: 100%; }.seo-agentur-page .handoff-lines i:last-child { width: 72%; }
.seo-agentur-page .handoff-link { display: flex; align-items: center; gap: 12px; width: fit-content; font-size: 12px; color: var(--copper); border-bottom: 1px solid currentColor; padding-bottom: 8px; }.seo-agentur-page .handoff-link svg { flex-shrink: 0; }
.seo-agentur-page .handoff-scan { position: absolute; top: 0; bottom: 0; width: 1px; background: var(--copper); left: 0; opacity: 0; }
.seo-agentur-page .handoff-status { display: flex; gap: 12px; align-items: start; margin-top: 24px; min-height: 80px; }.seo-agentur-page .handoff-status > svg { flex-shrink: 0; color: var(--copper); }.seo-agentur-page .handoff-status strong { font-size: 14px; display: block; margin-bottom: 6px; }.seo-agentur-page .handoff-status span { display: block; font-size: 12px; color: var(--muted); line-height: 1.6; }
.seo-agentur-page .handoff-stages { list-style: none; display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin: 0 28px; padding: 0; }.seo-agentur-page .handoff-stages li { font-size: 11px; padding: 14px 0; color: var(--muted); border-top: 1px solid var(--line); }.seo-agentur-page .handoff-stages li[data-state="done"], .seo-agentur-page .handoff-stages li[aria-current] { color: var(--copper); border-top-color: var(--copper); }
.seo-agentur-page .handoff-app figcaption { margin: 8px 28px 24px; font-size: 11px; line-height: 1.7; }
.seo-agentur-page .handoff-app[data-stage="1"] [data-owner="team"], .seo-agentur-page .handoff-app:not([data-stage="1"]) [data-owner="forge"] { border-bottom-color: var(--copper); color: var(--copper); }
@keyframes handoff-review { from { transform: translateX(0); opacity: .65; } to { transform: translateX(440px); opacity: 0; } }
@media (prefers-reduced-motion: no-preference) {
  .seo-agentur-page .handoff-owners circle { transform: translateX(-64px); transition: transform 850ms cubic-bezier(.16,1,.3,1); }
  .seo-agentur-page .handoff-app[data-stage="1"] .handoff-owners circle { transform: translateX(64px); }
  .seo-agentur-page .handoff-link { transition: clip-path 900ms cubic-bezier(.16,1,.3,1), opacity 450ms ease; clip-path: inset(0); }
  .seo-agentur-page .handoff-app[data-stage="0"] .handoff-link { clip-path: inset(0 90% 0 0); opacity: .35; }
  .seo-agentur-page .handoff-app[data-stage="1"] .handoff-link { opacity: .5; }
  .seo-agentur-page .handoff-check { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 650ms cubic-bezier(.16,1,.3,1); }
  .seo-agentur-page .handoff-app[data-stage="3"] .handoff-check { stroke-dashoffset: 0; }
  .seo-agentur-page .handoff-app.motion-ready[data-stage="3"] .handoff-scan { animation: handoff-review 1.2s ease-out both; }
}
@media (max-width: 767px) {
  .seo-agentur-page #arbeitsweise .handoff-app { order: 2; }.seo-agentur-page .handoff-task { padding: 24px; }.seo-agentur-page .handoff-task h3 { font-size: 28px; }.seo-agentur-page .handoff-owners { padding-inline: 24px; }.seo-agentur-page .handoff-document { padding: 20px; }.seo-agentur-page .handoff-stages { margin-inline: 24px; gap: 8px; }.seo-agentur-page .handoff-app figcaption { margin-inline: 24px; }
}
/* Two authored SEO demonstrations: actual work artifacts and source relationships. */
.seo-agentur-page .delivery-demo, .seo-agentur-page .search-demo { background: white; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.seo-agentur-page .demo-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 24px; padding: 20px 28px; border-bottom: 1px solid var(--line); }
.seo-agentur-page .demo-toolbar strong { font-size: 15px; }.seo-agentur-page .demo-toolbar > span { font-size: 12px; color: var(--muted); }
.seo-agentur-page .seo-motion-toggle { margin-left: auto; padding: 10px 0; min-height: 44px; color: var(--copper); border: 0; border-bottom: 1px solid currentColor; background: none; font-size: 11px; cursor: pointer; }
.seo-agentur-page .seo-motion-toggle[hidden] { display: none; }
.seo-agentur-page .delivery-workspace { display: grid; grid-template-columns: 1fr 1fr; }
.seo-agentur-page .delivery-file, .seo-agentur-page .delivery-change { padding: 40px; }
.seo-agentur-page .delivery-change { border-left: 1px solid var(--line); background: var(--paper); }
.seo-agentur-page .artifact-label { display: block; color: var(--muted); font-size: 12px; margin-bottom: 16px; }
.seo-agentur-page .delivery-workspace h3 { font-family: var(--font-dm-sans), system-ui, sans-serif; font-size: 32px; line-height: 1.2; margin-bottom: 24px; }
.seo-agentur-page .delivery-file > code { display: block; font-size: 14px; color: var(--copper); padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.seo-agentur-page .delivery-file dl { margin: 0 0 24px; }.seo-agentur-page .delivery-file dl div { display: grid; grid-template-columns: 96px 1fr; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 13px; line-height: 1.6; }
.seo-agentur-page .delivery-file dd { margin: 0; }.seo-agentur-page .delivery-file dt { color: var(--muted); }
.seo-agentur-page .delivery-workspace p { font-size: 13px; line-height: 1.7; margin-bottom: 0; }
.seo-agentur-page .code-change { margin-bottom: 24px; }.seo-agentur-page .code-change > div { padding: 16px 0; border-bottom: 1px solid var(--line); }.seo-agentur-page .code-change span { font-size: 11px; color: var(--muted); display: block; margin-bottom: 8px; }.seo-agentur-page .code-change code { font-size: 15px; line-height: 1.7; overflow-wrap: anywhere; }.seo-agentur-page .code-after { color: var(--copper); }
.seo-agentur-page .release-confirmation { display: flex; gap: 12px; align-items: center; font-size: 13px; color: var(--copper); }
.seo-agentur-page .deliverable-ledger { display: grid; grid-template-columns: repeat(4,1fr); gap: 32px; list-style: none; padding: 0; margin: 40px 0 0; }
.seo-agentur-page .deliverable-ledger li { border-bottom: 1px solid var(--line); padding-bottom: 24px; }.seo-agentur-page .deliverable-ledger li > span { display: block; font-size: 12px; color: var(--copper); margin-bottom: 12px; }.seo-agentur-page .deliverable-ledger h3 { font-size: 19px; }.seo-agentur-page .deliverable-ledger p { font-size: 14px; }.seo-agentur-page .deliverable-ledger strong { font-size: 13px; line-height: 1.7; font-weight: 500; display: block; }
.seo-agentur-page #seo-und-ki .ai-layout { grid-template-columns: .85fr 1.15fr; gap: 48px 64px; align-items: center; }
.seo-agentur-page .search-demo .demo-toolbar { padding: 12px 24px; }
.seo-agentur-page .source-document { margin: 28px 28px 0; padding: 24px; background: var(--paper); border-radius: 8px; }.seo-agentur-page .source-document h3 { font-size: 22px; margin-bottom: 12px; }.seo-agentur-page .source-document p { font-size: 13px; margin-bottom: 16px; }
.seo-agentur-page .source-excerpt { padding: 12px 0; border-block: 1px solid var(--line); font-size: 13px; line-height: 1.7; color: var(--copper); }
.seo-agentur-page .source-proof { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-top: 16px; font-size: 11px; color: var(--muted); }
.seo-agentur-page .source-routing { height: 48px; color: var(--copper); margin: 0 28px; }.seo-agentur-page .source-routing svg { height: 100%; width: 100%; }
.seo-agentur-page .search-destinations { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding: 0 28px 24px; }.seo-agentur-page .search-destinations > div { border-top: 1px solid var(--copper); padding-top: 20px; }.seo-agentur-page .search-destinations .artifact-label { margin-bottom: 16px; }.seo-agentur-page .search-result small { display: block; font-size: 10px; margin-bottom: 8px; color: var(--muted); }.seo-agentur-page .search-result strong { display: block; color: var(--copper); font-size: 15px; line-height: 1.5; }.seo-agentur-page .search-destinations p { font-size: 12px; line-height: 1.7; margin: 8px 0 12px; }.seo-agentur-page .answer-citation { font-size: 11px; display: inline-block; border-bottom: 1px solid var(--copper); color: var(--copper); padding-bottom: 4px; }
.seo-agentur-page .search-demo .demo-disclaimer { font-size: 11px; padding: 0 28px 20px; margin: 0; line-height: 1.7; }
.seo-agentur-page .ai-evidence-row { grid-column: 1 / -1; display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 32px; padding-top: 32px; border-top: 1px solid var(--line); align-items: start; }
.seo-agentur-page #seo-und-ki .trust-model { padding: 0; border: 0; background: none; margin: 0; }.seo-agentur-page .ai-evidence-row .trust-letters { display: none; }.seo-agentur-page .ai-evidence-row .trust-model figcaption { font-size: 22px; }.seo-agentur-page .ai-evidence-row .trust-evidence { margin-top: 16px; }.seo-agentur-page .ai-evidence-row .source { font-size: 11px; line-height: 1.7; }.seo-agentur-page .ai-evidence-row > .source { grid-column: 2 / -1; margin-top: -16px; }.seo-agentur-page .ai-evidence-row article p { font-size: 14px; }
@keyframes release-edit { 0%,15% { opacity: .4; clip-path: inset(0 0 80% 0); } 35%,90% { opacity: 1; clip-path: inset(0); } 100% { opacity: .4; clip-path: inset(0 0 80% 0); } }
@keyframes release-check { 0%,35% { opacity: .35; transform: translateY(4px); } 55%,90% { opacity: 1; transform: translateY(0); } 100% { opacity: .35; transform: translateY(4px); } }
@keyframes source-connect { 0%,15% { stroke-dashoffset: 1; } 55%,90% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 1; } }
@keyframes source-cite { 0%,40% { opacity: .4; } 65%,90% { opacity: 1; } 100% { opacity: .4; } }
@media (prefers-reduced-motion: no-preference) {
  .seo-agentur-page [data-seo-motion].motion-ready .code-after { animation: release-edit 9s cubic-bezier(.16,1,.3,1) infinite; }
  .seo-agentur-page [data-seo-motion].motion-ready .release-confirmation { animation: release-check 9s cubic-bezier(.16,1,.3,1) infinite; }
  .seo-agentur-page [data-seo-motion].motion-ready .source-routing path { stroke-dasharray: 1; animation: source-connect 9s cubic-bezier(.16,1,.3,1) infinite; }
  .seo-agentur-page [data-seo-motion].motion-ready .answer-citation { animation: source-cite 9s ease-out infinite; }
  .seo-agentur-page [data-seo-motion]:not([data-playing="true"]) * { animation-play-state: paused !important; }
}
@media (max-width: 1023px) {
  .seo-agentur-page #seo-und-ki .ai-layout { grid-template-columns: 1fr; }
  .seo-agentur-page .delivery-file, .seo-agentur-page .delivery-change { padding: 28px; }.seo-agentur-page .deliverable-ledger { grid-template-columns: 1fr 1fr; }.seo-agentur-page .ai-evidence-row { grid-template-columns: 1fr 1fr; }.seo-agentur-page .ai-evidence-row .trust-model { grid-column: 1 / -1; }.seo-agentur-page .ai-evidence-row > .source { grid-column: 1 / -1; margin: 0; }
}
@media (max-width: 600px) {
  .seo-agentur-page .delivery-workspace { grid-template-columns: 1fr; }.seo-agentur-page .delivery-change { border-left: 0; border-top: 1px solid var(--line); }.seo-agentur-page .delivery-file, .seo-agentur-page .delivery-change { padding: 24px; }.seo-agentur-page .delivery-workspace h3 { font-size: 27px; }.seo-agentur-page .demo-toolbar { padding: 16px 24px; }.seo-agentur-page .demo-toolbar > span { width: 100%; }.seo-agentur-page .seo-motion-toggle { margin-left: 0; }.seo-agentur-page .deliverable-ledger { grid-template-columns: 1fr; gap: 24px; }.seo-agentur-page .deliverable-ledger p { margin-bottom: 12px; }
  .seo-agentur-page .source-document { margin: 20px 16px 0; padding: 20px; }.seo-agentur-page .search-destinations { gap: 16px; padding: 0 16px 16px; }.seo-agentur-page .search-demo .demo-disclaimer { padding-inline: 16px; }.seo-agentur-page .search-result strong { font-size: 13px; }.seo-agentur-page .search-destinations p { font-size: 11px; }.seo-agentur-page .ai-evidence-row { grid-template-columns: 1fr; }.seo-agentur-page .ai-evidence-row article { border-top: 1px solid var(--line); padding-top: 24px; }
}

.seo-agentur-page fieldset{border:0;padding:0;margin:0;min-width:0}.seo-agentur-page .skip:not(:focus){transform:translateY(-200%)}

/* Selected Dark Analytics cost section, 2026-09-22. */
.seo-agentur-page .sf-cost-page{--ink:#211e19;--muted:#625b51;--paper:#f8f7f5;--warm:#f1ece4;--line:#d8cec0;--copper:#85471f;background:var(--paper);color:var(--ink);font-family:var(--font-dm-sans),sans-serif;color-scheme:light}
.seo-agentur-page .sf-cost-page *{box-sizing:border-box}.seo-agentur-page .sf-cost-page ::selection{background:#e8c8a6;color:var(--ink)}.seo-agentur-page .sf-cost-page :is(a,summary):focus-visible{outline:2px solid var(--copper);outline-offset:5px}.seo-agentur-page .sf-cost-page a{text-decoration:none;text-underline-offset:5px}.seo-agentur-page .sf-cost-page p{color:var(--muted);font-size:15px;line-height:1.75}.seo-agentur-page .sf-cost-page :is(h2,h3,h4){margin:0;letter-spacing:-.025em;text-wrap:balance}.seo-agentur-page .sf-cost-page h2{font-size:clamp(38px,4.5vw,64px);font-weight:600;line-height:1.08;max-width:900px}.seo-agentur-page .sf-cost-page h3{font-size:23px;line-height:1.3;font-weight:600}.seo-agentur-page .sf-cost-page h4{font-size:17px;line-height:1.4;font-weight:600}
.seo-agentur-page .sf-cost-section{padding:80px 0 44px;scroll-margin-top:70px}.seo-agentur-page .sf-cost-wrap{max-width:1320px;margin:auto;padding-inline:48px}.seo-agentur-page .sf-cost-analyticsGrid{display:grid;grid-template-columns:1.7fr 1fr;gap:65px;align-items:center;margin-top:48px}.seo-agentur-page .sf-cost-visual{min-width:0;margin:0}.seo-agentur-page .sf-cost-visual img{display:block;width:100%;height:auto;mix-blend-mode:multiply}.seo-agentur-page .sf-cost-visual figcaption{font-size:11px;color:var(--muted);line-height:1.6;margin-top:12px}.seo-agentur-page .sf-cost-offer>h3{font-size:16px;font-weight:500;letter-spacing:0}.seo-agentur-page .sf-cost-page .sf-cost-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:10px;margin:18px 0 22px;color:var(--ink);line-height:1}.seo-agentur-page .sf-cost-price strong{font-size:88px;font-weight:550;letter-spacing:-.04em}.seo-agentur-page .sf-cost-price span{font-size:17px;font-weight:450;letter-spacing:-.01em}.seo-agentur-page .sf-cost-offer>p:not(.sf-cost-price){margin:0 0 24px;font-size:16px}.seo-agentur-page .sf-cost-button{display:inline-flex;align-items:center;justify-content:space-between;gap:20px;min-height:52px;padding:14px 20px;background:var(--copper);color:var(--paper);font-size:13px;font-weight:600;border-radius:4px;max-width:100%;transition:background .2s ease}.seo-agentur-page .sf-cost-button:hover{background:#6d3818}.seo-agentur-page .sf-cost-button svg{flex-shrink:0;transition:transform .2s ease}.seo-agentur-page .sf-cost-button:hover svg{transform:translate(2px,-2px)}.seo-agentur-page .sf-cost-button:active svg{transform:none}.seo-agentur-page .sf-cost-smallNote{display:block;margin-top:15px;font-size:12px;color:var(--muted)}
.seo-agentur-page .sf-cost-more{margin-top:40px;border-top:1px solid var(--line);padding:22px 0 0}.seo-agentur-page .sf-cost-more>summary{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:14px;font-weight:550;cursor:pointer;min-height:36px;list-style:none}.seo-agentur-page .sf-cost-page summary::-webkit-details-marker{display:none}.seo-agentur-page .sf-cost-page details[open]>summary>svg{transform:rotate(45deg)}.seo-agentur-page .sf-cost-page summary svg{flex-shrink:0;color:var(--copper);transition:transform .2s ease}.seo-agentur-page .sf-cost-moreContent{display:grid;grid-template-columns:1fr 1.3fr;gap:65px;margin-top:35px}.seo-agentur-page .sf-cost-moreContent h3{margin-bottom:22px}.seo-agentur-page .sf-cost-facts{margin:0;display:grid;gap:15px}.seo-agentur-page .sf-cost-facts>div{display:grid;grid-template-columns:1fr 1.2fr;gap:18px;font-size:13px;line-height:1.6}.seo-agentur-page .sf-cost-facts dt{color:var(--muted)}.seo-agentur-page .sf-cost-facts dd{margin:0;font-weight:550}.seo-agentur-page .sf-cost-scopeNote{font-size:13px!important;margin-top:25px}.seo-agentur-page .sf-cost-delivery{display:grid;gap:10px;list-style:none;padding:0;margin:25px 0;font-size:13px}.seo-agentur-page .sf-cost-delivery li{display:flex;gap:10px;align-items:center}.seo-agentur-page .sf-cost-delivery svg{color:var(--copper)}.seo-agentur-page .sf-cost-factors{display:grid;grid-template-columns:1fr 1fr;gap:26px}.seo-agentur-page .sf-cost-factors p{font-size:13px;margin:9px 0 0}.seo-agentur-page .sf-cost-offerNote{font-size:12px!important;margin-top:26px}.seo-agentur-page .sf-cost-work{margin-top:40px}.seo-agentur-page .sf-cost-work header>p{max-width:740px;font-size:13px}.seo-agentur-page .sf-cost-workItems{display:grid;grid-template-columns:repeat(3,1fr);gap:35px}.seo-agentur-page .sf-cost-workItems article{padding-top:20px;border-top:1px solid var(--line)}.seo-agentur-page .sf-cost-workItems p{font-size:13px;min-height:70px}.seo-agentur-page .sf-cost-result{display:grid;gap:9px;font-size:13px}.seo-agentur-page .sf-cost-result>span{color:var(--muted)}.seo-agentur-page .sf-cost-result strong{display:flex;gap:10px;align-items:center;color:var(--copper);font-weight:550}.seo-agentur-page .sf-cost-guideLinks{display:flex;gap:24px 50px;flex-wrap:wrap;margin-top:26px}.seo-agentur-page .sf-cost-guideLinks a{display:flex;align-items:center;gap:12px;min-height:44px;font-size:13px;color:var(--copper)}.seo-agentur-page .sf-cost-guideLinks a:hover{text-decoration:underline}
@media(min-width:768px) and (max-width:1150px){.seo-agentur-page .sf-cost-analyticsGrid{gap:36px;grid-template-columns:1.2fr 1fr}.seo-agentur-page .sf-cost-price strong{font-size:74px}.seo-agentur-page .sf-cost-button{font-size:12px;padding-inline:14px;gap:12px}.seo-agentur-page .sf-cost-moreContent{gap:35px}}
@media(max-width:767px){.seo-agentur-page .sf-cost-section{padding:48px 0 32px;scroll-margin-top:58px}.seo-agentur-page .sf-cost-wrap{padding-inline:24px}.seo-agentur-page .sf-cost-page h2{font-size:39px;max-width:440px}.seo-agentur-page .sf-cost-analyticsGrid{grid-template-columns:1fr;gap:30px}.seo-agentur-page .sf-cost-analyticsGrid{margin-top:28px}.seo-agentur-page .sf-cost-analyticsGrid .sf-cost-visual{margin-inline:-10px}.seo-agentur-page .sf-cost-price strong{font-size:80px}.seo-agentur-page .sf-cost-offer>p:not(.sf-cost-price){font-size:15px}.seo-agentur-page .sf-cost-visual figcaption{font-size:11px}.seo-agentur-page .sf-cost-more{margin-top:28px}.seo-agentur-page .sf-cost-more>summary{font-size:13px}.seo-agentur-page .sf-cost-moreContent,.seo-agentur-page .sf-cost-factors,.seo-agentur-page .sf-cost-workItems{grid-template-columns:1fr;gap:28px}.seo-agentur-page .sf-cost-workItems p{min-height:0}.seo-agentur-page .sf-cost-result{margin-top:18px}.seo-agentur-page .sf-cost-guideLinks{gap:8px}.seo-agentur-page .sf-cost-guideLinks a{font-size:12px}}
@media(max-width:359px){.seo-agentur-page .sf-cost-wrap{padding-inline:20px}.seo-agentur-page .sf-cost-page h2{font-size:35px}.seo-agentur-page .sf-cost-price strong{font-size:74px}.seo-agentur-page .sf-cost-price span{font-size:15px}.seo-agentur-page .sf-cost-button{font-size:12px;padding-inline:14px;gap:14px}}
@media(prefers-reduced-motion:reduce){.seo-agentur-page .sf-cost-page *{transition:none!important}}

.seo-agentur-page .sf-cost-section{scroll-margin-top:148px}

/* Tilt the artwork; keep its hover area and caption stationary. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .seo-agentur-page .sf-cost-visual {
    perspective: 1200px;
  }
  .seo-agentur-page .sf-cost-visual img {
    transform: rotateX(8deg) rotateY(-10deg) rotateZ(-1.5deg) scale(.97);
    transition: transform 650ms cubic-bezier(.16, 1, .3, 1);
  }
  .seo-agentur-page .sf-cost-visual:hover img {
    transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
  }
}

/* Responsibility: a concrete work item, from approval to checked publication. */
.seo-agentur-page .ownership{background:#f1ece4;padding-block:100px}
.seo-agentur-page .ownership-layout{display:grid;grid-template-columns:1fr 1.12fr;gap:72px;align-items:center}
.seo-agentur-page .ownership-intro h2{font-size:clamp(36px,3.5vw,52px);line-height:1.1;letter-spacing:-.035em;margin-bottom:28px}
.seo-agentur-page .ownership-intro h2 span{color:#85471f}
.seo-agentur-page .ownership-intro>p{max-width:44ch}
.seo-agentur-page .ownership-link{display:inline-flex;align-items:center;gap:16px;min-height:44px;font-size:14px;font-weight:600;text-decoration:none}
.seo-agentur-page .ownership-link:hover{text-decoration:underline}
.seo-agentur-page .ownership-app{background:#24231f;color:#f8f4ed;border-radius:12px;box-shadow:0 22px 44px -24px #34271870;overflow:hidden}
.seo-agentur-page .ownership-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:19px 26px;border-bottom:1px solid #49463e;font-size:12px}
.seo-agentur-page .ownership-toolbar strong{font-weight:550}
.seo-agentur-page .ownership-toolbar span{color:#c2b8a8}
.seo-agentur-page .ownership-task{padding:30px 26px 24px}
.seo-agentur-page .ownership-status{display:flex;align-items:center;gap:8px;color:#e6bc8f;font-size:12px;margin-bottom:18px}
.seo-agentur-page .ownership-status i{width:6px;height:6px;background:currentColor;border-radius:50%}
.seo-agentur-page .ownership-task h3{color:#f8f4ed;font-size:25px;line-height:1.25;margin:0 0 12px}
.seo-agentur-page .ownership-task p{color:#c2b8a8;font-size:13px;line-height:1.65;margin:0}
.seo-agentur-page .ownership-flow{display:grid;grid-template-columns:repeat(4,1fr);list-style:none;padding:0;margin:30px 0;gap:0}
.seo-agentur-page .ownership-flow li{position:relative;display:flex;flex-direction:column;gap:12px;font-size:11px;color:#e6d9c8}
.seo-agentur-page .ownership-flow li:before{content:"";position:absolute;top:14px;left:28px;right:0;height:1px;background:#906b47}
.seo-agentur-page .ownership-flow li:last-child:before{display:none}
.seo-agentur-page .ownership-flow svg{box-sizing:content-box;padding:6px;border:1px solid #906b47;border-radius:50%;color:#e6bc8f}
.seo-agentur-page .ownership-task-meta{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:0 0 26px}
.seo-agentur-page .ownership-task-meta dt{font-size:11px;color:#c2b8a8;margin-bottom:5px}
.seo-agentur-page .ownership-task-meta dd{font-size:14px;margin:0;color:#f8f4ed}
.seo-agentur-page .ownership-result{display:flex;gap:12px;border-top:1px solid #49463e;padding-top:22px}
.seo-agentur-page .ownership-result>svg{flex-shrink:0;margin-top:3px;color:#e6bc8f}
.seo-agentur-page .ownership-result strong{display:block;font-size:14px;font-weight:550;margin-bottom:6px}
.seo-agentur-page .ownership-app figcaption{padding:14px 26px;background:#1d1c19;color:#c2b8a8;font-size:10px;line-height:1.6}
.seo-agentur-page .ownership-roles{display:grid;grid-template-columns:repeat(3,1fr);gap:44px;margin-top:72px}
.seo-agentur-page .ownership-roles>div{border-top:1px solid #cbbda9;padding-top:24px}
.seo-agentur-page .ownership-roles dt{font-size:21px;font-weight:600;letter-spacing:-.025em;margin-bottom:12px}
.seo-agentur-page .ownership-roles dd{margin:0;color:#625b51;font-size:14px;line-height:1.8}
.seo-agentur-page .ownership-handover{display:grid;grid-template-columns:1fr 2fr;gap:44px;border-top:1px solid #cbbda9;margin-top:48px;padding-top:30px}
.seo-agentur-page .ownership-handover h3{font-size:21px;line-height:1.4;margin:0}
.seo-agentur-page .ownership-handover p{font-size:14px;margin-bottom:8px}
@media(max-width:1000px){.seo-agentur-page .ownership-layout{gap:36px;grid-template-columns:1fr 1fr}.seo-agentur-page .ownership-flow li{font-size:10px}.seo-agentur-page .ownership-task{padding:24px 20px}}
@media(max-width:767px){.seo-agentur-page .ownership{padding-block:56px}.seo-agentur-page .ownership-layout{grid-template-columns:1fr;gap:32px}.seo-agentur-page .ownership-intro h2{font-size:38px}.seo-agentur-page .ownership-roles{grid-template-columns:1fr;gap:26px;margin-top:40px}.seo-agentur-page .ownership-handover{grid-template-columns:1fr;gap:18px;margin-top:32px}.seo-agentur-page .ownership-task h3{font-size:23px}.seo-agentur-page .ownership-toolbar{padding:17px 20px}.seo-agentur-page .ownership-app figcaption{padding-inline:20px}}
@media(max-width:359px){.seo-agentur-page .ownership-intro h2{font-size:33px}.seo-agentur-page .ownership-task{padding-inline:16px}.seo-agentur-page .ownership-flow li{font-size:9px}.seo-agentur-page .ownership-toolbar{padding-inline:16px}}

/* Terms belong to the hero decision, separate from section navigation. */
.seo-agentur-page .hero-terms { margin-top: 30px; padding-top: 23px; border-top: 1px solid var(--line); max-width: 510px; }
.seo-agentur-page .hero-terms .hero-terms-price { font-size: 15px; line-height: 1.6; margin: 0; max-width: none; }
.seo-agentur-page .hero-terms-price strong { color: var(--ink); font-size: 19px; font-weight: 600; white-space: nowrap; }
.seo-agentur-page .hero-terms ul { display: flex; flex-wrap: wrap; gap: 8px 24px; list-style: none; padding: 0; margin: 12px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.seo-agentur-page .hero-terms li { display: flex; align-items: center; gap: 8px; }
.seo-agentur-page .hero-terms li::before { content: ""; width: 12px; height: 7px; border-left: 1.5px solid var(--copper); border-bottom: 1.5px solid var(--copper); transform: translateY(-2px) rotate(-45deg); }
.seo-agentur-page .hero-terms .hero-terms-focus { font-size: 12px; line-height: 1.7; margin: 16px 0 0; max-width: none; }
@media(max-width:600px) { .seo-agentur-page .hero-terms { margin-top: 26px; padding-top: 20px; } .seo-agentur-page .hero-terms .hero-terms-price { font-size: 14px; } .seo-agentur-page .hero-terms-price strong { font-size: 17px; } .seo-agentur-page .hero-terms ul { gap: 8px 18px; } }