:root {
  --ridder-ink: #0b0b0d;
  --ridder-blue: #3969f1;
  --ridder-coral: #ff5545;
  --ridder-paper: #f6f3ec;
  --ridder-pale-blue: #e8edff;
  --ridder-line: #d8d5ce;
  --ridder-page: min(1760px, calc(100vw - 80px));
}

body { margin: 0; overflow-x: hidden; }
.ridder-home *, .ridder-about *, .ridder-services *, .ridder-blog *, .ridder-single * { box-sizing: border-box; }
.ridder-about-intro > *, .ridder-highlight-grid > *, .ridder-services-hero > *, .ridder-services-grid > *, .ridder-work-intro > *, .ridder-project > *, .ridder-blog-hero > *, .ridder-blog-feature-article > *, .ridder-blog-list-grid > * { min-width: 0; }
.ridder-about img, .ridder-services img, .ridder-blog img, .ridder-single img { max-width: 100%; height: auto; }
.ridder-home, .ridder-header, .ridder-footer, .ridder-about { font-family: "Figtree", sans-serif; }
.ridder-home-stage { min-height: calc(100svh - 112px); display: flex; flex-direction: column; }
.ridder-header {
  width: var(--ridder-page); min-height: 112px; margin: 0 auto; display: flex;
  align-items: center; justify-content: space-between; border-bottom: 1px solid var(--ridder-ink);
}
.ridder-brand { display: block; width: 260px; line-height: 0; }
.ridder-brand img { width: 100%; height: auto; mix-blend-mode: multiply; }
.ridder-nav { display: flex; align-items: center; gap: clamp(26px, 3vw, 60px); }
.ridder-nav a { position: relative; color: var(--ridder-ink); text-decoration: none; font-size: 16px; font-weight: 500; }
.ridder-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -7px; height: 2px; background: var(--ridder-blue); transition: right 180ms ease; }
.ridder-nav a:hover::after, .ridder-nav a:focus-visible::after { right: 0; }
.ridder-nav .ridder-contact { color: var(--ridder-coral); }
.ridder-nav .ridder-contact::after { background: var(--ridder-coral); }
.ridder-octagon { display: inline-block; width: .5em; height: .5em; margin-left: .12em; background: var(--ridder-coral); clip-path: polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%); }

.ridder-hero { position: relative; width: var(--ridder-page); box-sizing: border-box; margin: 0 auto; padding: clamp(55px,6vh,90px) 0 clamp(75px,7vh,105px); display: grid; flex: 1; grid-template-columns: minmax(0,2.15fr) minmax(320px,.85fr); column-gap: clamp(45px,6vw,120px); align-content: start; }
.ridder-eyebrow { grid-column: 1/-1; margin: 0 0 34px; font-size: 12px; line-height: 1.3; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.ridder-eyebrow i { color: var(--ridder-coral); padding: 0 .35em; font-style: normal; }
.ridder-eyebrow-compact { display: none; }
.ridder-hero h1 { position: relative; z-index: 1; margin: 0; font-size: clamp(72px,8.4vw,158px); line-height: .84; letter-spacing: -.064em; font-weight: 700; }
.ridder-hero h1 > span { display: block; }
.ridder-line-one { font-size: 1.078em; color: var(--ridder-ink); }
.ridder-line-two { color: var(--ridder-blue); }
.ridder-brand-stop { display: inline-block; width: .18em; height: .18em; margin-left: .055em; background: var(--ridder-coral); vertical-align: .035em; clip-path: polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%); }
.ridder-brand-stop-small { width: .48em; height: .48em; margin-left: .12em; vertical-align: -.02em; }
.ridder-hero-copy { position: relative; z-index: 1; align-self: end; }
.ridder-hero-copy > p { margin: 0; font-family: "Newsreader", Georgia, serif; font-size: clamp(22px,1.75vw,34px); line-height: 1.25; letter-spacing: -.018em; }
.ridder-actions { margin-top: 42px; display: flex; flex-wrap: wrap; gap: 18px 30px; }
.ridder-action { display: inline-flex; align-items: center; justify-content: space-between; min-width: 160px; padding: 12px 0 10px; border-bottom: 2px solid currentColor; text-decoration: none; font-size: 15px; font-weight: 700; }
.ridder-action-blue { color: var(--ridder-blue); }
.ridder-action-coral { color: var(--ridder-coral); }
.ridder-hero-marker { position: absolute; width: clamp(190px,21vw,400px); aspect-ratio: 1; right: clamp(-210px,-10vw,-100px); top: 12%; background: var(--ridder-blue); opacity: .11; clip-path: polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%); }

.ridder-experience { width: 100%; min-height: 120px; padding: 23px max(40px,calc((100vw - 1760px)/2)); display: flex; align-items: center; background: var(--ridder-ink); color: var(--ridder-paper); box-sizing: border-box; }
.ridder-experience p { width: min(1480px,100%); margin: 0; font-family: "Newsreader", Georgia, serif; font-size: clamp(19px,1.35vw,27px); line-height: 1.18; letter-spacing: -.015em; }
.ridder-experience p > span, .ridder-experience strong { display: block; }
.ridder-experience strong { margin-top: .38em; font-family: "Figtree", sans-serif; font-weight: 700; }
.ridder-experience-stop { color: var(--ridder-coral); }

.ridder-insights { width: var(--ridder-page); margin: 0 auto; padding: clamp(80px,10vw,160px) 0; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(50px,8vw,145px); }
.ridder-insights > div { min-width: 0; }
.ridder-video-feature { padding-left: clamp(40px,5vw,90px); border-left: 1px solid var(--ridder-line); }
.ridder-section-label { margin: 0 0 42px; font-size: 14px; line-height: 1; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.ridder-latest-query .wp-block-post-template { margin: 0; padding: 0; }
.ridder-latest-query .wp-block-post { list-style: none; }
.ridder-post-meta { margin: 0 0 18px; color: #64625e; font-size: 13px; letter-spacing: .03em; text-transform: uppercase; }
.ridder-latest-query h2 { max-width: 700px; margin: 0; font-size: clamp(42px,4vw,72px); line-height: .98; letter-spacing: -.048em; }
.ridder-latest-query h2 a { color: var(--ridder-ink); text-decoration: none; }
.ridder-latest-query .wp-block-post-excerpt { max-width: 670px; margin: 30px 0 0; font-family: "Newsreader", Georgia, serif; font-size: clamp(21px,1.5vw,28px); line-height: 1.28; }
.ridder-latest-query .wp-block-post-excerpt__more-link { display: inline-flex; margin-top: 25px; padding: 11px 0; border-bottom: 2px solid var(--ridder-blue); color: var(--ridder-blue); font-family: "Figtree", sans-serif; font-size: 15px; font-weight: 700; text-decoration: none; }
.ridder-video-poster { position: relative; width: 100%; aspect-ratio: 16/10; overflow: hidden; padding: 0; border: 0; background: var(--ridder-blue) url("../images/markus-ridder-portrait.png") center 18% / cover no-repeat; color: var(--ridder-paper); cursor: default; text-align: left; }
.ridder-video-poster::before { content: ""; position: absolute; inset: 55% 0 0; background: linear-gradient(to bottom,transparent,rgba(11,11,13,.72)); }
.ridder-play { position: absolute; left: 72%; top: 49%; width: clamp(64px,5.3vw,92px); aspect-ratio: 1; background: var(--ridder-coral); transform: translate(-50%,-50%); clip-path: polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%); }
.ridder-play i { position: absolute; left: 43%; top: 34%; width: 0; height: 0; border-top: 17px solid transparent; border-bottom: 17px solid transparent; border-left: 27px solid var(--ridder-ink); }
.ridder-video-caption { position: absolute; left: 6%; right: 6%; bottom: 6%; font-size: 15px; font-weight: 700; }

.ridder-content { padding: clamp(70px,9vw,150px) 40px; }
.ridder-content h1 { font-size: clamp(55px,7vw,110px); line-height: .92; letter-spacing: -.055em; }
.ridder-single .wp-block-post-content, .ridder-content > .wp-block-post-content { font-family: "Newsreader", Georgia, serif; font-size: 22px; }
.ridder-footer { width: var(--ridder-page); min-height: 120px; margin: 0 auto; border-top: 1px solid var(--ridder-ink); display: flex; align-items: center; justify-content: space-between; font-size: 14px; }
.ridder-footer nav { display: flex; gap: 30px; }
.ridder-footer a { color: var(--ridder-ink); }
.ridder-copyright { display: block; }
.ridder-footer-brand-stop { color: var(--ridder-blue); }


/* Stirb & Werde */
/* The about pattern is inserted into the normal page template. Expand that page's
   constrained content area, hide the automatically generated page title and let
   the designed hero align with the header. */
.ridder-content:has(.ridder-about) { width: 100% !important; max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; padding-top: 0; padding-left: 0; padding-right: 0; box-sizing: border-box; }
.ridder-content:has(.ridder-about) > .wp-block-post-title { display: none; }
.ridder-content:has(.ridder-about) > .wp-block-post-content { width: 100%; max-width: none !important; margin: 0 !important; }
.ridder-content:has(.ridder-about) > .wp-block-post-content > .ridder-about { max-width: none; }
.ridder-about { width: var(--ridder-page); max-width: none; margin: 0 auto; padding: clamp(48px,5vw,82px) 0 clamp(90px,10vw,170px); }
.ridder-about-intro { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(360px,.95fr); gap: clamp(55px,8vw,150px); align-items: center; }
.ridder-about-kicker, .ridder-about .ridder-section-label { margin: 0 0 28px; font-size: 13px; line-height: 1.2; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.ridder-about-title { margin: 0 0 38px; font-size: clamp(68px,8vw,145px); line-height: .86; letter-spacing: -.06em; }
.ridder-about-title .ridder-brand-stop-small { display: none; }
.ridder-about-title::after { content: ""; display: inline-block; width: .15em; height: .15em; margin-left: -.085em; background: var(--ridder-coral); vertical-align: -.015em; clip-path: polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%); }
.ridder-about-lead { margin: 0; max-width: 760px; font-family: "Newsreader", Georgia, serif; font-size: clamp(24px,2vw,36px); line-height: 1.24; letter-spacing: -.02em; }
.ridder-about-photo img { width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: center 15%; }
.ridder-about-story { max-width: 1080px; margin: clamp(90px,11vw,180px) auto 0; }
.ridder-about-story h2, .ridder-highlights h2 { margin: 0 0 36px; font-size: clamp(44px,5vw,82px); line-height: .96; letter-spacing: -.045em; }
.ridder-highlights > h2 { text-align: center; }
.ridder-about-story p { font-family: "Newsreader", Georgia, serif; font-size: clamp(21px,1.5vw,28px); line-height: 1.42; }
/* If additional headings or paragraphs are inserted directly on the page after the
   pattern was added, keep them on the same content axis and in the same type scale. */
.ridder-about > h2.wp-block-heading,
.ridder-about > h3.wp-block-heading,
.ridder-about > h4.wp-block-heading,
.ridder-about > p,
.ridder-about > ul,
.ridder-about > ol {
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
}
.ridder-about > h2.wp-block-heading,
.ridder-about > h3.wp-block-heading,
.ridder-about > h4.wp-block-heading {
  text-align: left;
}
.ridder-about > h3.wp-block-heading,
.ridder-about > h4.wp-block-heading {
  margin-top: 50px;
  margin-bottom: 18px;
  font-size: clamp(27px,2.1vw,38px);
  line-height: 1.06;
  letter-spacing: -.03em;
}
.ridder-about > p,
.ridder-about > ul,
.ridder-about > ol {
  font-family: "Newsreader", Georgia, serif;
  font-size: clamp(21px,1.5vw,28px);
  line-height: 1.42;
}
.ridder-about > p + p { margin-top: 22px; }
.ridder-about ul,
.ridder-about ol { padding-left: 1.25em; }
.ridder-about li { margin-bottom: .35em; }
.ridder-highlights { margin-top: clamp(95px,12vw,190px); }
.ridder-highlights .ridder-section-label { display: none; }
.ridder-highlight-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-top: 0; }
.ridder-highlight { position: relative; min-height: 250px; padding: 42px 46px 50px 0; border-bottom: 1px solid var(--ridder-line); }
.ridder-highlight:nth-child(even) { padding-left: clamp(35px,5vw,85px); border-left: 1px solid var(--ridder-line); }
.ridder-highlight-number { margin: 0 0 25px; color: var(--ridder-coral); font-size: 14px; font-weight: 700; letter-spacing: .08em; }
.ridder-highlight h3 { margin: 0 0 18px; font-size: clamp(27px,2.1vw,38px); line-height: 1.06; letter-spacing: -.03em; }
.ridder-highlight p:last-child { margin-bottom: 0; font-family: "Newsreader", Georgia, serif; font-size: 21px; line-height: 1.35; }
.ridder-highlight:last-child { grid-column: 1/-1; max-width: calc(50% - 1px); }
.ridder-about-cta { margin-top: clamp(95px,11vw,175px); padding: clamp(55px,6vw,95px); background: var(--ridder-ink); color: var(--ridder-paper); }
.ridder-about-cta h2 { margin: 0 0 24px; font-size: clamp(48px,6vw,96px); line-height: .9; letter-spacing: -.05em; }
.ridder-about-cta p { max-width: 760px; font-family: "Newsreader", Georgia, serif; font-size: clamp(22px,1.7vw,31px); }
.ridder-about-cta a { display: inline-block; margin-top: 22px; padding-bottom: 9px; border-bottom: 2px solid var(--ridder-coral); color: var(--ridder-coral); font-weight: 700; text-decoration: none; }

@media (max-width: 1320px) and (min-width: 761px) {
  :root { --ridder-page: calc(100vw - 64px); }
  .ridder-highlight { padding-right: 30px; }
  .ridder-highlight:nth-child(even) { padding-left: 38px; }
  .ridder-service { padding-right: 34px; }
  .ridder-service:nth-child(even) { padding-left: 42px; }
  .ridder-blog-card { padding-right: 30px; }
  .ridder-blog-card:nth-child(even) { padding-left: 42px; }
}

@media (max-width: 1050px) {
  :root { --ridder-page: calc(100vw - 48px); }
  .ridder-header { min-height: 96px; }
  .ridder-home-stage { min-height: calc(100svh - 96px); }
  .ridder-brand { width: 220px; }
  .ridder-nav { gap: 25px; }
  .ridder-eyebrow-wide { display: none; }
  .ridder-eyebrow-compact { display: inline; }
  .ridder-hero { grid-template-columns: 1fr; min-height: auto; }
  .ridder-hero-copy { max-width: 650px; margin-top: 48px; }
  .ridder-insights { gap: 48px; }
  .ridder-video-feature { padding-left: 48px; }
  .ridder-about-intro { grid-template-columns: 1fr 1fr; gap: 45px; }
}

@media (max-width: 760px) {
  :root { --ridder-page: calc(100vw - 36px); }
  .ridder-header { min-height: 84px; }
  .ridder-brand { width: 182px; }
  .ridder-nav { max-width: 55%; gap: 8px 17px; flex-wrap: wrap; justify-content: flex-end; }
  .ridder-nav a { font-size: 12px; }
  .ridder-home-stage { min-height: 0; }
  .ridder-hero { padding-top: 38px; padding-bottom: 56px; }
  .ridder-eyebrow { max-width: 330px; margin-bottom: 25px; line-height: 1.65; }
  .ridder-hero h1 { font-size: clamp(53px,14.5vw,78px); line-height: .88; }
  .ridder-hero-copy { margin-top: 42px; }
  .ridder-hero-copy > p { font-size: 23px; }
  .ridder-experience { min-height: 0; padding: 25px 18px 27px; }
  .ridder-experience p { font-size: 20px; }
  .ridder-experience strong { margin-top: 9px; }
  .ridder-insights { padding: 72px 0; grid-template-columns: 1fr; gap: 70px; }
  .ridder-video-feature { padding: 70px 0 0; border-left: 0; border-top: 1px solid var(--ridder-line); }
  .ridder-latest-query h2 { font-size: 46px; }
  .ridder-footer { padding: 35px 0; align-items: flex-start; flex-direction: column; gap: 22px; }
  .ridder-about { padding-top: 55px; }
  .ridder-about-intro { grid-template-columns: 1fr; }
  .ridder-about-photo { margin-top: 8px; }
  .ridder-about-title { font-size: clamp(58px,18vw,88px); }
  .ridder-highlight-grid { grid-template-columns: 1fr; }
  .ridder-highlight, .ridder-highlight:nth-child(even) { min-height: 0; padding: 34px 0 40px; border-left: 0; }
  .ridder-highlight:last-child { grid-column: auto; max-width: none; }
  .ridder-about-cta { margin-left: -18px; margin-right: -18px; padding-left: 18px; padding-right: 18px; }
}


/* Tat & Werk */
.ridder-content:has(.ridder-services) { width: 100% !important; max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; padding-top: 0; padding-left: 0; padding-right: 0; box-sizing: border-box; }
.ridder-content:has(.ridder-services) > .wp-block-post-title { display: none; }
.ridder-content:has(.ridder-services) > .wp-block-post-content { width: 100%; max-width: none !important; margin: 0 !important; }
.ridder-services { width: var(--ridder-page); margin: 0 auto; padding: clamp(58px,6vw,95px) 0 clamp(95px,10vw,170px); }
.ridder-services-hero { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(320px,.8fr); gap: clamp(50px,8vw,150px); min-height: clamp(390px,34vw,560px); align-items: stretch; }
.ridder-services-hero > .wp-block-group { align-self: start; }
.ridder-services-hero > .ridder-services-lead { align-self: end; margin-bottom: 4px; }
.ridder-services-kicker { margin: 0 0 28px; font-size: 13px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.ridder-services-title { margin: 0; font-size: clamp(68px,8vw,145px); line-height: .86; letter-spacing: -.06em; }
.ridder-services-title::after { content: ""; display: inline-block; width: .15em; height: .15em; margin-left: .065em; background: var(--ridder-coral); vertical-align: -.015em; clip-path: polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%); }
.ridder-services-lead { margin: 0; font-family: "Newsreader", Georgia, serif; font-size: clamp(24px,2vw,36px); line-height: 1.24; letter-spacing: -.02em; }
.ridder-services-grid { margin-top: clamp(90px,11vw,175px); display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-top: 1px solid var(--ridder-ink); }
.ridder-service { padding: 44px 50px 54px 0; border-bottom: 1px solid var(--ridder-line); }
.ridder-service:nth-child(even) { padding-left: clamp(35px,5vw,85px); border-left: 1px solid var(--ridder-line); }
.ridder-service-number { margin: 0 0 24px; color: var(--ridder-coral); font-size: 14px; font-weight: 700; letter-spacing: .08em; }
.ridder-service h2 { margin: 0 0 20px; font-size: clamp(31px,2.7vw,50px); line-height: 1; letter-spacing: -.035em; }
.ridder-service p { margin: 0; font-family: "Newsreader", Georgia, serif; font-size: clamp(20px,1.4vw,26px); line-height: 1.38; }
.ridder-service p + p { margin-top: 1em; }
/* Werk – selected projects */
.ridder-work { margin-top: clamp(115px,13vw,210px); }
.ridder-work-intro { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(320px,.8fr); gap: clamp(50px,8vw,150px); min-height: clamp(330px,29vw,480px); align-items: stretch; margin-bottom: clamp(70px,8vw,125px); }
.ridder-work-intro > .wp-block-group { align-self: start; }
.ridder-work-intro > .ridder-work-lead { align-self: end; margin-bottom: 4px; }
.ridder-work-kicker { margin: 0 0 28px; font-size: 13px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.ridder-work-title { margin: 0; font-size: clamp(68px,8vw,145px); line-height: .86; letter-spacing: -.06em; }
.ridder-work-title::after { content: none; }
.ridder-work-stop { display: inline-block; width: .15em; height: .15em; margin: 0 .055em 0 .035em; background: var(--ridder-blue); vertical-align: -.015em; clip-path: polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%); }
.ridder-work-lead { margin: 0; font-family: "Newsreader", Georgia, serif; font-size: clamp(24px,2vw,36px); line-height: 1.24; letter-spacing: -.02em; }
.ridder-project-list { display: flex; flex-direction: column; gap: clamp(75px,9vw,145px); }
.ridder-project { display: grid; grid-template-columns: minmax(320px,.88fr) minmax(0,1.12fr); gap: clamp(45px,7vw,125px); align-items: center; }
.ridder-project:nth-child(even) { grid-template-columns: minmax(0,1.12fr) minmax(320px,.88fr); }
.ridder-project:nth-child(even) .ridder-project-image { order: 2; }
.ridder-project-image { margin: 0; min-height: clamp(280px,32vw,520px); background: var(--ridder-pale-blue); }
.ridder-project-image img { width: 100%; height: 100%; min-height: clamp(280px,32vw,520px); object-fit: cover; }
.ridder-project-copy { max-width: 760px; }
.ridder-project-client { margin: 0 0 22px; font-size: clamp(38px,4vw,70px); line-height: .98; letter-spacing: -.045em; }
.ridder-project-meta { margin: 0; padding: 0; list-style: none; font-family: "Newsreader", Georgia, serif; font-size: clamp(19px,1.3vw,24px); line-height: 1.45; }
.ridder-project-meta li { display: block; padding: 12px 0 14px; border-bottom: 1px solid var(--ridder-line); }
.ridder-project-meta li:first-child { display: none; }
.ridder-project-meta strong { display: block; margin-bottom: 4px; font-family: "Figtree", sans-serif; font-size: .72em; letter-spacing: .08em; text-transform: uppercase; }
.ridder-project-note { margin: 24px 0 0; font-family: "Newsreader", Georgia, serif; font-size: clamp(20px,1.4vw,26px); line-height: 1.4; }

/* 0.32 – explicit project-topic marks. These spans are visual labels only;
   the underlying wording remains ordinary running text for screen readers and
   search engines. Multiple labels may appear within one teaser sentence. */
.ridder-project-tag {
  display: inline;
  margin: 0 .18em;
  padding: .28em .48em .24em;
  border-radius: 2px;
  background: var(--ridder-coral);
  color: var(--ridder-paper) !important;
  font-family: "Figtree", sans-serif;
  font-size: .72em;
  line-height: 1;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  text-decoration: none;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.ridder-project-note > .ridder-project-tag:first-child,
.ridder-project .wp-element-caption > .ridder-project-tag:first-child { margin-left: 0; margin-right: .5em; }

/* Core-topic teasers in project examples. Keep them compact enough to sit
   naturally at the start of an image caption or project description. */
.ridder-project-note > strong:first-child,
.ridder-project-note > span:first-child > strong:first-child,
.ridder-project-note > a:first-child,
.ridder-project-note > a:first-child strong,
.ridder-project .wp-element-caption > strong:first-child,
.ridder-project .wp-element-caption > span:first-child > strong:first-child,
.ridder-project .wp-element-caption > a:first-child,
.ridder-project .wp-element-caption > a:first-child strong {
  display: inline;
  margin: 0 .5em 0 0;
  padding: .28em .48em .24em;
  border-radius: 2px;
  background: var(--ridder-coral);
  color: var(--ridder-paper) !important;
  font-family: "Figtree", sans-serif;
  font-size: .72em;
  line-height: 1;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  text-decoration: none;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.ridder-project-note > a:first-child,
.ridder-project-note > a:first-child strong,
.ridder-project .wp-element-caption > a:first-child,
.ridder-project .wp-element-caption > a:first-child strong { text-decoration: none; }
.ridder-project-note > a:first-child:hover,
.ridder-project-note > a:first-child:focus-visible,
.ridder-project-note > a:first-child:hover strong,
.ridder-project-note > a:first-child:focus-visible strong,
.ridder-project .wp-element-caption > a:first-child:hover,
.ridder-project .wp-element-caption > a:first-child:focus-visible,
.ridder-project .wp-element-caption > a:first-child:hover strong,
.ridder-project .wp-element-caption > a:first-child:focus-visible strong {
  background: var(--ridder-blue);
  color: white !important;
}
.ridder-project .wp-element-caption {
  margin-top: 10px;
  padding: 0;
  font-size: 14px;
  line-height: 1.45;
  text-align: left;
}


/* Wort & Wahn */
.ridder-content:has(.ridder-blog) { width: 100% !important; max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; padding-top: 0; padding-left: 0; padding-right: 0; box-sizing: border-box; }
.ridder-content:has(.ridder-blog) > .wp-block-post-title { display: none; }
.ridder-content:has(.ridder-blog) > .wp-block-post-content { width: 100%; max-width: none !important; margin: 0 !important; }
.ridder-blog { width: var(--ridder-page); margin: 0 auto; padding: clamp(58px,6vw,95px) 0 clamp(95px,10vw,170px); }
.ridder-blog-hero { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(320px,.8fr); gap: clamp(50px,8vw,150px); min-height: clamp(390px,34vw,560px); align-items: stretch; }
.ridder-blog-hero > .wp-block-group { align-self: start; }
.ridder-blog-hero > .ridder-blog-lead { align-self: end; margin-bottom: 4px; }
.ridder-blog-kicker { margin: 0 0 28px; font-size: 13px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.ridder-blog-title { margin: 0; font-size: clamp(68px,8vw,145px); line-height: .86; letter-spacing: -.06em; }
.ridder-blog-title::after { content: ""; display: inline-block; width: .15em; height: .15em; margin-left: .03em; background: var(--ridder-blue); vertical-align: -.015em; clip-path: polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%); }
.ridder-blog-lead { margin: 0; font-family: "Newsreader", Georgia, serif; font-size: clamp(24px,2vw,36px); line-height: 1.24; letter-spacing: -.02em; }
.ridder-blog-feature { margin-top: clamp(90px,11vw,165px); }
.ridder-blog-feature .wp-block-query-no-results, .ridder-blog-list .wp-block-query-no-results { font-family: "Newsreader", Georgia, serif; font-size: clamp(21px,1.4vw,28px); }
.ridder-blog-feature .wp-block-post { list-style: none; }
.ridder-blog-feature .wp-block-post-template, .ridder-blog-list .wp-block-post-template { margin: 0; padding: 0; }
.ridder-blog-feature-article { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(340px,.95fr); gap: clamp(45px,7vw,120px); align-items: end; }
.ridder-blog-feature-copy { min-width: 0; }
.ridder-blog-feature .wp-block-post-date, .ridder-blog-list .wp-block-post-date { display: block; margin: 0 0 16px; color: #64625e; font-size: 13px; letter-spacing: .03em; text-transform: uppercase; }
.ridder-blog-feature .wp-block-post-terms { margin: 0 0 18px; color: var(--ridder-coral); font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ridder-blog-feature .wp-block-post-title { margin: 0; font-size: clamp(48px,4.8vw,86px); line-height: .94; letter-spacing: -.05em; }
.ridder-blog-feature .wp-block-post-title a, .ridder-blog-list .wp-block-post-title a { color: var(--ridder-ink); text-decoration: none; }
.ridder-blog-feature .wp-block-post-excerpt { margin: 24px 0 0; font-family: "Newsreader", Georgia, serif; font-size: clamp(22px,1.6vw,30px); line-height: 1.34; }
.ridder-blog-feature .wp-block-post-excerpt__more-link, .ridder-blog-list .wp-block-read-more { display: inline-flex; margin-top: 24px; padding: 10px 0 8px; border-bottom: 2px solid var(--ridder-blue); color: var(--ridder-blue); font-family: "Figtree", sans-serif; font-size: 15px; font-weight: 700; text-decoration: none; }
.ridder-blog-feature .wp-block-post-featured-image, .ridder-blog-list .wp-block-post-featured-image { margin: 0; }
.ridder-blog-feature .wp-block-post-featured-image img { width: 100%; aspect-ratio: 4/5; object-fit: cover; background: var(--ridder-pale-blue); }
.ridder-blog-list { margin-top: clamp(95px,11vw,175px); }
.ridder-blog-list-header { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(320px,.95fr); gap: clamp(45px,7vw,120px); align-items: end; margin-bottom: clamp(50px,6vw,90px); }
.ridder-blog-list-title { margin: 0; font-size: clamp(64px,6vw,118px); line-height: .9; letter-spacing: -.05em; }
.ridder-blog-list-title::after { content: ""; display: inline-block; width: .14em; height: .14em; margin-left: .02em; background: var(--ridder-coral); vertical-align: -.01em; clip-path: polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%); }
.ridder-blog-list-lead { margin: 0; font-family: "Newsreader", Georgia, serif; font-size: clamp(22px,1.6vw,30px); line-height: 1.34; }
.ridder-blog-list-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-top: 1px solid var(--ridder-ink); }
.ridder-blog-card { padding: 34px 40px 44px 0; border-bottom: 1px solid var(--ridder-line); list-style: none; }
.ridder-blog-card:nth-child(even) { padding-left: clamp(35px,5vw,85px); border-left: 1px solid var(--ridder-line); }
.ridder-blog-card .wp-block-post-terms { margin: 0 0 12px; color: var(--ridder-coral); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ridder-blog-card .wp-block-post-title { margin: 0 0 16px; font-size: clamp(28px,2.3vw,44px); line-height: 1.02; letter-spacing: -.035em; }
.ridder-blog-card .wp-block-post-excerpt { margin: 0; font-family: "Newsreader", Georgia, serif; font-size: clamp(20px,1.4vw,25px); line-height: 1.38; }
.ridder-blog-card .wp-block-post-excerpt p { margin: 0; }
.ridder-blog-cta { margin-top: clamp(95px,11vw,175px); padding: clamp(55px,6vw,95px); background: var(--ridder-coral); color: white; }
.ridder-blog-cta h2 { margin: 0 0 24px; font-size: clamp(48px,6vw,96px); line-height: .9; letter-spacing: -.05em; }
.ridder-blog-cta p { max-width: 760px; font-family: "Newsreader", Georgia, serif; font-size: clamp(22px,1.7vw,31px); }
.ridder-blog-cta a { display: inline-block; margin-top: 22px; padding-bottom: 9px; border-bottom: 2px solid white; color: white; font-weight: 700; text-decoration: none; }

.ridder-services-cta { margin-top: clamp(95px,11vw,175px); padding: clamp(55px,6vw,95px); background: var(--ridder-blue); color: white; }
.ridder-services-cta h2 { margin: 0 0 24px; font-size: clamp(48px,6vw,96px); line-height: .9; letter-spacing: -.05em; }
.ridder-services-cta p { max-width: 760px; font-family: "Newsreader", Georgia, serif; font-size: clamp(22px,1.7vw,31px); }
.ridder-services-cta a { display: inline-block; margin-top: 22px; padding-bottom: 9px; border-bottom: 2px solid var(--ridder-coral); color: white; font-weight: 700; text-decoration: none; }
@media (max-width: 760px) {
  .ridder-services-hero, .ridder-services-grid, .ridder-work-intro, .ridder-project, .ridder-project:nth-child(even), .ridder-blog-hero, .ridder-blog-feature-article, .ridder-blog-list-header, .ridder-blog-list-grid { grid-template-columns: 1fr; }
  .ridder-services-hero, .ridder-work-intro, .ridder-blog-hero { min-height: 0; }
  .ridder-services-hero > .ridder-services-lead, .ridder-work-intro > .ridder-work-lead, .ridder-blog-hero > .ridder-blog-lead { align-self: auto; margin-bottom: 0; }
  .ridder-services-lead, .ridder-work-lead, .ridder-blog-lead, .ridder-blog-list-lead { margin-top: 42px; }
  .ridder-project:nth-child(even) .ridder-project-image { order: 0; }
  .ridder-service, .ridder-service:nth-child(even), .ridder-blog-card, .ridder-blog-card:nth-child(even) { padding: 34px 0 40px; border-left: 0; }
  .ridder-services-cta, .ridder-blog-cta { margin-left: -18px; margin-right: -18px; padding-left: 18px; padding-right: 18px; }
}


/* WordPress uses the Home template for the page assigned as "Posts page".
   This ensures Wort & Wahn works without inserting a page pattern. */
.ridder-blog-index {
  width: var(--ridder-page);
  max-width: none !important;
  margin: 0 auto;
  padding: clamp(58px,6vw,95px) 0 clamp(95px,10vw,170px);
  font-family: "Figtree", sans-serif;
}
.ridder-blog-index .ridder-blog {
  width: 100%;
  padding: 0;
}

/* KI-Investigativ-Interview */
.ridder-interview {
  max-width: 1180px;
}
.ridder-interview-kicker {
  margin: 0 0 24px;
  font-family: "Figtree", sans-serif;
  font-size: 13px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--ridder-coral);
}
.ridder-interview .ridder-interview-headline,
.ridder-interview > .wp-block-post-title {
  max-width: 1080px;
  margin: 0;
  font-size: clamp(54px,6.5vw,104px);
  line-height: .94;
  letter-spacing: -.052em;
}
.ridder-interview-lead,
.ridder-interview .wp-block-post-excerpt {
  max-width: 1100px;
  margin: clamp(30px,4vw,54px) 0 0;
  font-family: "Newsreader", Georgia, serif;
  font-size: clamp(23px,1.9vw,32px);
  line-height: 1.35;
}
.ridder-interview .wp-block-post-excerpt p { margin: 0; }
.ridder-interview-date {
  margin: 20px 0 clamp(58px,7vw,96px);
  color: #64625e;
  font-family: "Figtree", sans-serif;
  font-size: 13px;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.ridder-interview .wp-block-post-content {
  max-width: 960px;
  margin-left: 0 !important;
  margin-right: auto !important;
}
.ridder-interview-body { margin: 0; }
.ridder-interview-question {
  max-width: 930px;
  margin: clamp(66px,8vw,110px) 0 24px;
  color: #c9795f;
  font-family: Baskerville, "Baskerville Old Face", "Hoefler Text", "Newsreader", Georgia, serif;
  font-size: clamp(30px,3vw,48px);
  font-style: italic;
  font-weight: 400;
  line-height: 1.18;
  letter-spacing: -.018em;
}
.ridder-interview-question:first-child { margin-top: 0; }
.ridder-interview-answer {
  max-width: 860px;
  margin: 0 0 1.45em;
  font-family: "Newsreader", Georgia, serif;
  font-size: 22px;
  line-height: 1.55;
}
.ridder-interview-answer + .ridder-interview-answer { margin-top: -.45em; }
@media (max-width: 760px) {
  .ridder-interview { padding-top: 58px; }
  .ridder-interview-kicker { margin-bottom: 18px; }
  .ridder-interview-date { margin-bottom: 52px; }
  .ridder-interview-question {
    margin-top: 58px;
    margin-bottom: 20px;
    font-size: clamp(28px,8vw,38px);
    line-height: 1.2;
  }
  .ridder-interview-answer { font-size: 20px; }
}

/* 0.10 – Wort & Wahn intro: more room for the editorial lead */
@media (min-width: 761px) {
  .ridder-blog-hero {
    grid-template-columns: minmax(0,1.08fr) minmax(390px,.92fr);
    gap: clamp(42px,6vw,105px);
  }
  .ridder-blog-hero > .ridder-blog-lead,
  .ridder-blog-hero > .wp-block-shortcode {
    align-self: end;
    margin-bottom: 4px;
  }
  .ridder-blog-hero > .wp-block-shortcode .ridder-blog-lead {
    max-width: 590px;
  }
}

.ridder-blog-hero > .wp-block-shortcode {
  margin: 0;
}
.ridder-blog-hero > .wp-block-shortcode .ridder-blog-lead {
  margin: 0;
}


/* 0.11 – editorial post embeds, featured images and privacy-friendly sharing */

/* The lead article on Wort & Wahn uses the image when one exists;
   without an image the copy expands instead of leaving an empty column. */
.ridder-blog-feature-article {
  grid-template-columns: minmax(0,1.08fr) minmax(360px,.92fr);
  gap: clamp(42px,5.5vw,92px);
  align-items: start;
}
.ridder-blog-feature-article:not(:has(.wp-block-post-featured-image)) {
  grid-template-columns: minmax(0,980px);
  gap: 0;
}
.ridder-blog-feature-article:not(:has(.wp-block-post-featured-image)) .ridder-blog-feature-copy {
  max-width: 980px;
}
.ridder-blog-feature .wp-block-post-title {
  font-size: clamp(46px,4.15vw,76px);
  line-height: .96;
}
.ridder-blog-feature .wp-block-post-featured-image {
  align-self: start;
}
.ridder-blog-feature .wp-block-post-featured-image img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: var(--ridder-pale-blue);
}
.ridder-blog-feature .wp-block-post-excerpt {
  max-width: 760px;
}

/* Additional posts may carry an image too, but remain compact editorial cards. */
.ridder-blog-card-image {
  margin: 0 0 24px;
}
.ridder-blog-card-image img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  background: var(--ridder-pale-blue);
}

/* Featured image on individual articles. */
.ridder-single-image {
  margin-top: clamp(34px,5vw,64px);
  margin-bottom: clamp(46px,6vw,78px);
}
.ridder-single-image img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.ridder-interview-image {
  margin-top: 0;
}

/* Share area: intentionally plain links. No external social scripts are loaded. */
.ridder-share {
  width: 100%;
  max-width: 860px;
  margin: clamp(64px,8vw,110px) 0 0;
  padding-top: 24px;
  border-top: 1px solid var(--ridder-ink);
  font-family: "Figtree", sans-serif;
}
.ridder-share-label {
  margin: 0 0 16px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.ridder-share-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.ridder-share-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 9px 16px 8px;
  border: 1px solid var(--ridder-ink);
  color: var(--ridder-ink);
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}
.ridder-share-link:hover,
.ridder-share-link:focus-visible {
  border-color: var(--ridder-blue);
  background: var(--ridder-blue);
  color: white;
  text-decoration: none;
}

@media (max-width: 760px) {
  .ridder-blog-feature-article,
  .ridder-blog-feature-article:not(:has(.wp-block-post-featured-image)) {
    grid-template-columns: 1fr;
    gap: 34px;
  }
  .ridder-blog-feature .wp-block-post-featured-image {
    order: -1;
  }
  .ridder-blog-feature .wp-block-post-title {
    font-size: clamp(40px,11vw,58px);
  }
  .ridder-single-image img {
    aspect-ratio: 4 / 3;
  }
}

/* 0.13 – structural interview lead + persistent Wort & Wahn intro */
.ridder-interview {
  max-width: 1280px;
}
.ridder-interview .ridder-interview-headline,
.ridder-interview > .wp-block-post-title {
  max-width: 1160px;
}
/* The excerpt is intentionally not rendered in templates/interview.html.
   The first paragraph in the actual post content is the one and only lead. */
.ridder-interview .wp-block-post-content,
.ridder-interview .ridder-interview-content {
  width: 100%;
  max-width: 1160px;
  margin-left: 0 !important;
  margin-right: auto !important;
}
.ridder-interview .wp-block-post-content > p:first-child,
.ridder-interview .ridder-interview-content > p:first-child {
  max-width: 1120px;
  margin: 0 0 clamp(58px,7vw,92px);
  font-family: "Newsreader", Georgia, serif;
  font-size: clamp(24px,2vw,34px);
  line-height: 1.35;
  letter-spacing: -.012em;
}
/* Questions and answers keep their editorial reading width even though the
   lead above is deliberately wider. */
.ridder-interview .ridder-interview-body {
  max-width: 960px;
  margin-left: 0 !important;
  margin-right: auto !important;
}
.ridder-interview-question { max-width: 930px; }
.ridder-interview-answer { max-width: 860px; }

/* Give the Wort & Wahn intro visibly more room on desktop. */
@media (min-width: 900px) {
  .ridder-blog-hero {
    grid-template-columns: minmax(0,.92fr) minmax(500px,1.08fr);
    gap: clamp(46px,5vw,86px);
  }
  .ridder-blog-hero > .wp-block-shortcode .ridder-blog-lead {
    max-width: 720px;
  }
}

/* 0.14 – final blog architecture, subpage consistency and social metadata support */

/* Main subpages use one clean hero system without eyebrow/kicker lines.
   The front-page eyebrow remains untouched. */
.ridder-services-kicker,
.ridder-about-kicker,
.ridder-blog-kicker {
  display: none !important;
}

/* Custom editorial lead used on the blog overview; unlike the automatic
   WordPress excerpt, it never pulls copy from media captions. */
.ridder-post-lead {
  margin: 24px 0 0;
  max-width: 760px;
  font-family: "Newsreader", Georgia, serif;
  font-size: clamp(22px,1.6vw,30px);
  line-height: 1.34;
}
.ridder-post-lead p { margin: 0; }
.ridder-post-lead-more {
  display: inline-flex;
  margin-top: 24px;
  padding: 10px 0 8px;
  border-bottom: 2px solid var(--ridder-blue);
  color: var(--ridder-blue);
  font-family: "Figtree", sans-serif;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
}
.ridder-blog-card .ridder-post-lead {
  margin-top: 0;
  font-size: clamp(20px,1.4vw,25px);
  line-height: 1.38;
}
.ridder-blog-card .ridder-post-lead-more { margin-top: 18px; }

/* Visible caption from the featured image's Media Library caption field. */
.ridder-featured-caption {
  width: 100%;
  max-width: 1160px;
  margin: -54px 0 clamp(42px,5vw,66px);
  color: #6a6864;
  font-family: "Figtree", sans-serif;
  font-size: 13px;
  line-height: 1.45;
}
.ridder-interview .ridder-featured-caption {
  max-width: 1160px;
}

/* Author attribution strengthens both editorial context and page structure. */
.ridder-post-author {
  margin: -78px 0 clamp(54px,6vw,82px);
  color: #64625e;
  font-family: "Figtree", sans-serif;
  font-size: 13px;
  line-height: 1.45;
}
.ridder-post-author a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Slightly darker interview question tone for more reliable contrast while
   preserving the muted terracotta character. */
.ridder-interview-question {
  color: #bf6f56;
}

@media (max-width: 760px) {
  .ridder-featured-caption {
    margin-top: -56px;
    font-size: 12px;
  }
  .ridder-post-author {
    margin-top: -42px;
    margin-bottom: 42px;
  }
}

/* 0.19 – Sie & Ich, KI transparency and direct blog feedback */
.ridder-contact-page,
.ridder-policy-page {
  max-width: 1280px;
  padding-top: clamp(72px, 10vw, 145px);
  padding-bottom: clamp(88px, 11vw, 160px);
}
.ridder-contact-title,
.ridder-policy-page > h1 {
  max-width: 1100px;
  margin: 0 0 clamp(44px, 6vw, 76px);
  font-size: clamp(68px, 8vw, 145px);
  line-height: .86;
  letter-spacing: -.06em;
}
.ridder-contact-title::after {
  content: "";
  display: inline-block;
  width: .15em;
  height: .15em;
  margin-left: .04em;
  background: var(--ridder-coral);
  vertical-align: -.015em;
  clip-path: polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%);
}
.ridder-contact-lead,
.ridder-policy-lead {
  max-width: 970px;
  margin: 0 0 clamp(70px, 9vw, 124px);
  font-family: "Newsreader", Georgia, serif;
  font-size: clamp(28px, 3vw, 48px);
  line-height: 1.16;
  letter-spacing: -.022em;
}
.ridder-contact-options {
  max-width: 1050px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 0 clamp(46px, 6vw, 96px);
  border-top: 1px solid var(--ridder-ink);
}
.ridder-contact-option {
  padding: clamp(34px, 4vw, 54px) 0;
  border-bottom: 1px solid rgba(20,31,47,.35);
}
.ridder-contact-option h2,
.ridder-contact-direct h2 {
  margin: 0 0 18px;
  font-size: clamp(28px, 2.6vw, 42px);
  line-height: 1.03;
}
.ridder-contact-option p {
  max-width: 540px;
  margin: 0;
  font-size: clamp(18px, 1.45vw, 22px);
  line-height: 1.5;
}
.ridder-contact-feedback h2 { color: var(--ridder-coral); }
.ridder-contact-direct {
  max-width: 820px;
  margin-top: clamp(78px, 10vw, 138px);
}
.ridder-contact-direct p {
  margin: 0;
  font-family: "Newsreader", Georgia, serif;
  font-size: clamp(28px, 3.1vw, 46px);
  line-height: 1.35;
}
.ridder-contact-direct a {
  color: var(--ridder-ink);
  text-decoration-color: var(--ridder-blue);
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}
.ridder-contact-closing {
  max-width: 1020px;
  margin-top: clamp(78px, 10vw, 132px);
  padding-top: 30px;
  border-top: 5px solid var(--ridder-blue);
  font-family: "Newsreader", Georgia, serif;
  font-size: clamp(30px, 3.7vw, 58px);
  line-height: 1.08;
}

.ridder-policy-page > p:not(.ridder-policy-lead) {
  max-width: 880px;
  margin: 0 0 30px;
  font-size: clamp(19px, 1.5vw, 23px);
  line-height: 1.62;
}

.ridder-ai-support {
  width: 100%;
  max-width: 860px;
  margin: clamp(62px, 8vw, 108px) 0 0;
  padding: 24px 0 0;
  border-top: 1px solid rgba(20,31,47,.35);
}
.ridder-ai-support-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 11px;
  color: var(--ridder-blue);
  font-family: "Figtree", sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .11em;
  text-decoration: none;
}
.ridder-ai-support-label::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--ridder-blue);
}
.ridder-ai-support p {
  margin: 0;
  color: #575754;
  font-family: "Figtree", sans-serif;
  font-size: 14px;
  line-height: 1.55;
}
.ridder-ai-support + .ridder-share { margin-top: 38px; }
.ridder-blog-feedback {
  max-width: 860px;
  margin: 30px 0 0;
  font-family: "Figtree", sans-serif;
  font-size: 15px;
  line-height: 1.5;
}
.ridder-blog-feedback a {
  color: var(--ridder-blue);
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid var(--ridder-blue);
}

@media (max-width: 760px) {
  .ridder-contact-options { grid-template-columns: 1fr; }
  .ridder-contact-title,
  .ridder-policy-page > h1 { font-size: clamp(58px, 18vw, 88px); }
  .ridder-contact-lead,
  .ridder-policy-lead { font-size: clamp(26px, 8vw, 38px); }
}

/* 0.22 – work headline, aligned contact grid, AI teaser and topic jump links */
.ridder-work-line-two {
  display: inline-block;
  margin-left: .62em;
}

.ridder-contact-options {
  align-items: start;
}
.ridder-contact-options > .ridder-contact-option {
  margin-block-start: 0 !important;
  align-self: start;
}
.ridder-contact-options > .ridder-contact-option > h2:first-child {
  margin-top: 0 !important;
}

.ridder-eyebrow a {
  color: inherit;
  text-decoration: none;
  transition: color .18s ease;
}
.ridder-eyebrow a:hover,
.ridder-eyebrow a:focus-visible {
  color: var(--ridder-blue);
}

.ridder-ai-teaser {
  max-width: 650px;
  margin-top: 34px;
  padding-top: 22px;
  border-top: 1px solid var(--ridder-line);
}
.ridder-ai-teaser p {
  margin: 0 0 14px;
  font-family: "Newsreader", Georgia, serif;
  font-size: clamp(22px,1.75vw,34px);
  line-height: 1.38;
  letter-spacing: -.01em;
}
.ridder-ai-teaser a {
  color: var(--ridder-blue);
  font-size: 13px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: .02em;
  text-decoration: none;
  border-bottom: 2px solid currentColor;
  padding-bottom: 5px;
}
.ridder-ai-teaser a:hover,
.ridder-ai-teaser a:focus-visible {
  color: var(--ridder-coral);
}

@media (max-width: 720px) {
  .ridder-work-line-two { margin-left: .42em; }
  .ridder-ai-teaser { margin-top: 28px; padding-top: 18px; }
  .ridder-ai-teaser p { font-size: 23px; }
}

/* 0.23 – context-safe per-post editorial lead in blog query cards */


/* 0.24 – real-content blog hardening and final alignment pass */

/* Regular blog posts use the same left content axis as the rest of RIDDER PR.
   WordPress' constrained layout normally centers contentSize blocks; for the
   editorial article pages we deliberately anchor them to the left instead. */
.ridder-single {
  width: var(--ridder-page);
  max-width: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0;
  padding-right: 0;
  text-align: left;
}
.ridder-single > .wp-block-post-date,
.ridder-single > .wp-block-shortcode,
.ridder-single > .wp-block-post-title,
.ridder-single > .wp-block-post-featured-image,
.ridder-single > .wp-block-post-content {
  margin-left: 0 !important;
  margin-right: auto !important;
}
.ridder-single > .wp-block-post-title {
  max-width: 1160px;
}
.ridder-single > .wp-block-post-content {
  width: 100%;
  max-width: 960px !important;
}
.ridder-single > .wp-block-post-content > :where(p,h2,h3,h4,h5,h6,ul,ol,blockquote) {
  margin-left: 0 !important;
  margin-right: auto !important;
  text-align: left;
}
.ridder-single > .wp-block-post-content > .alignwide,
.ridder-single > .wp-block-post-content > .alignfull {
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* Archive/query cards must never inherit centered block alignment. */
.ridder-blog-feature-copy,
.ridder-blog-card,
.ridder-blog-card > *,
.ridder-blog-card .wp-block-post-excerpt,
.ridder-blog-card .wp-block-post-excerpt__excerpt,
.ridder-blog-card .wp-block-post-excerpt__more-text {
  text-align: left !important;
}
.ridder-blog-card > *,
.ridder-blog-card .wp-block-post-excerpt,
.ridder-blog-card .wp-block-post-excerpt__excerpt,
.ridder-blog-card .wp-block-post-excerpt__more-text {
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* Keep the visible homepage topic short while jumping to the fuller service
   heading "Redaktion & Corporate Media" on Tat & Werk. */
.ridder-eyebrow a[href*="#redaktion-corporate-media"] {
  white-space: nowrap;
}

/* Small-screen post alignment follows the normal page gutter. */
@media (max-width: 760px) {
  .ridder-single {
    width: calc(100vw - 36px);
  }
  .ridder-single > .wp-block-post-content {
    max-width: 100% !important;
  }
}

/* 0.25 – final standard article hierarchy: fixed author, controlled image, real lead */
.ridder-standard-post {
  padding-top: clamp(64px,7vw,112px);
}
.ridder-standard-post > .ridder-standard-date,
.ridder-standard-post > .ridder-author-slot,
.ridder-standard-post > .ridder-standard-title,
.ridder-standard-post > .ridder-caption-slot,
.ridder-standard-post > .ridder-standard-content {
  margin-left: 0 !important;
  margin-right: auto !important;
}
.ridder-standard-date {
  width: 100%;
  max-width: 920px;
  margin: 0 0 10px !important;
  color: #64625e;
  font-family: "Figtree", sans-serif;
  font-size: 13px;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.ridder-author-slot {
  width: 100%;
  max-width: 920px;
  margin: 0 0 clamp(28px,3vw,42px) !important;
}
.ridder-standard-post .ridder-post-author {
  margin: 0 !important;
  color: #64625e;
  font-family: "Figtree", sans-serif;
  font-size: 14px;
  line-height: 1.45;
  text-align: left;
}
.ridder-standard-title {
  width: 100%;
  max-width: 1050px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  font-size: clamp(54px,5.8vw,96px) !important;
  line-height: .95 !important;
  letter-spacing: -.05em !important;
  text-align: left;
}
.ridder-standard-image {
  width: 100%;
  max-width: 1040px !important;
  margin: clamp(38px,4.5vw,64px) 0 clamp(22px,3vw,36px) !important;
}
.ridder-standard-image img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 650px;
  object-fit: contain;
  object-position: left center;
  background: transparent;
}
.ridder-standard-post .ridder-caption-slot {
  width: 100%;
  max-width: 1040px;
}
.ridder-standard-post .ridder-featured-caption {
  max-width: 1040px;
  margin: -12px 0 clamp(34px,4vw,52px) !important;
  text-align: left;
}
.ridder-standard-content {
  width: 100%;
  max-width: 860px !important;
  margin-top: clamp(28px,3vw,46px) !important;
  font-family: "Newsreader", Georgia, serif;
  font-size: 21px !important;
  line-height: 1.55;
}
.ridder-standard-content > p:first-child {
  width: 100%;
  max-width: 980px;
  margin: 0 0 clamp(42px,5vw,66px) !important;
  font-family: "Newsreader", Georgia, serif;
  font-size: clamp(27px,2vw,34px) !important;
  line-height: 1.34;
  letter-spacing: -.015em;
}
.ridder-standard-content > p:not(:first-child) {
  margin-top: 0;
  margin-bottom: 1.35em;
}
.ridder-standard-content > h2 {
  margin-top: clamp(54px,6vw,82px) !important;
  margin-bottom: 20px !important;
  font-family: "Figtree", sans-serif;
  font-size: clamp(32px,2.8vw,48px) !important;
  line-height: 1.04;
  letter-spacing: -.035em;
}
.ridder-standard-content > h3 {
  margin-top: 44px !important;
  margin-bottom: 16px !important;
  font-family: "Figtree", sans-serif;
  font-size: clamp(26px,2.2vw,36px) !important;
  line-height: 1.08;
}
.ridder-standard-content > ul,
.ridder-standard-content > ol {
  padding-left: 1.35em;
  margin-top: 0;
  margin-bottom: 1.6em;
}
.ridder-standard-content li + li {
  margin-top: .7em;
}

/* Regular archive cards stay compact and never turn a featured image into a hero. */
.ridder-blog-card-image {
  width: 100%;
  max-width: 560px;
  margin: 0 0 24px !important;
}
.ridder-blog-card-image img {
  width: 100%;
  height: auto;
  aspect-ratio: auto;
  max-height: 360px;
  object-fit: contain;
  object-position: left center;
}

@media (max-width: 760px) {
  .ridder-standard-post {
    padding-top: 52px;
  }
  .ridder-standard-title {
    font-size: clamp(44px,12vw,62px) !important;
  }
  .ridder-standard-image,
  .ridder-standard-post .ridder-caption-slot,
  .ridder-standard-content,
  .ridder-standard-content > p:first-child {
    max-width: 100% !important;
  }
  .ridder-standard-image img {
    max-height: none;
  }
  .ridder-standard-content {
    font-size: 19px !important;
  }
  .ridder-standard-content > p:first-child {
    font-size: clamp(24px,7.2vw,31px) !important;
  }
  .ridder-blog-card-image {
    max-width: 100%;
  }
  .ridder-blog-card-image img {
    max-height: none;
  }
}

/* 0.26 – final blog-card rhythm and strict interview-template isolation */

/* Archive cards: same top edge, more breathing room, no taxonomy clutter. */
.ridder-blog-list-grid {
  align-items: start;
}
.ridder-blog-card,
.ridder-blog-card:nth-child(even) {
  padding-top: 42px !important;
  padding-bottom: 64px !important;
  align-self: start;
}
.ridder-blog-card .wp-block-post-featured-image,
.ridder-blog-card-image {
  margin-top: 0 !important;
  margin-bottom: 30px !important;
}
.ridder-blog-card .wp-block-post-featured-image img,
.ridder-blog-card-image img {
  display: block;
}
.ridder-blog-card .wp-block-post-terms {
  display: none !important;
}
.ridder-blog-card .wp-block-post-date {
  margin: 0 0 18px !important;
}
.ridder-blog-card .wp-block-post-title {
  margin: 0 0 22px !important;
  line-height: 1.05;
}
.ridder-blog-card .wp-block-post-excerpt,
.ridder-blog-card .ridder-post-lead {
  max-width: 690px;
  margin: 0 !important;
  font-size: clamp(20px,1.42vw,26px);
  line-height: 1.5;
}
.ridder-blog-card .wp-block-post-excerpt__more-text {
  margin-top: 24px !important;
}
.ridder-blog-card .wp-block-post-excerpt__more-link {
  margin-top: 0 !important;
}

/* Keep the featured article taxonomy quiet too; tags remain metadata, not UI. */
.ridder-blog-feature .wp-block-post-terms {
  display: none !important;
}

/* Interview is a deliberate special format. Do not let generic single-post
   alignment/image rules introduced for standard articles override it. */
.ridder-interview {
  width: min(1280px, calc(100vw - 80px));
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-top: clamp(68px,8vw,118px);
}
.ridder-interview > .ridder-interview-kicker,
.ridder-interview > .ridder-interview-headline,
.ridder-interview > .wp-block-post-title,
.ridder-interview > .ridder-interview-date,
.ridder-interview > .wp-block-post-date,
.ridder-interview > .wp-block-shortcode,
.ridder-interview > .wp-block-post-featured-image,
.ridder-interview > .wp-block-post-content {
  margin-left: 0 !important;
  margin-right: auto !important;
  text-align: left !important;
}
.ridder-interview .ridder-interview-headline,
.ridder-interview > .wp-block-post-title {
  width: 100%;
  max-width: 1080px !important;
  font-size: clamp(54px,6.1vw,96px) !important;
  line-height: .95 !important;
  letter-spacing: -.052em !important;
}
.ridder-interview-date,
.ridder-interview > .wp-block-post-date {
  margin-top: 20px !important;
  margin-bottom: 14px !important;
}
.ridder-interview > .wp-block-shortcode {
  width: 100%;
  max-width: 1160px;
}
.ridder-interview .ridder-post-author {
  width: 100%;
  max-width: 1160px;
  margin: 0 0 clamp(36px,4.5vw,58px) !important;
  text-align: left !important;
}
.ridder-interview .ridder-interview-image,
.ridder-interview > .wp-block-post-featured-image {
  width: 100%;
  max-width: 1160px !important;
  margin-top: 0 !important;
  margin-bottom: clamp(22px,3vw,36px) !important;
}
.ridder-interview .ridder-interview-image img,
.ridder-interview > .wp-block-post-featured-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: auto;
  object-fit: contain;
  object-position: left center;
}
.ridder-interview .ridder-featured-caption {
  max-width: 1160px;
  margin: 0 0 clamp(42px,5vw,66px) !important;
  text-align: left;
}
.ridder-interview .wp-block-post-content,
.ridder-interview .ridder-interview-content {
  width: 100%;
  max-width: 1160px !important;
  margin-top: 0 !important;
}
.ridder-interview .wp-block-post-content > p:first-child,
.ridder-interview .ridder-interview-content > p:first-child {
  max-width: 1080px;
  margin: 0 0 clamp(64px,7vw,96px) !important;
  font-size: clamp(25px,2vw,34px) !important;
  line-height: 1.4;
}
.ridder-interview .ridder-interview-body {
  max-width: 960px;
}

@media (max-width: 760px) {
  .ridder-blog-card,
  .ridder-blog-card:nth-child(even) {
    padding-top: 34px !important;
    padding-bottom: 48px !important;
  }
  .ridder-interview {
    width: calc(100vw - 36px);
    padding-top: 58px;
  }
  .ridder-interview .ridder-interview-headline,
  .ridder-interview > .wp-block-post-title {
    font-size: clamp(44px,12vw,62px) !important;
  }
  .ridder-interview .ridder-interview-image,
  .ridder-interview > .wp-block-post-featured-image,
  .ridder-interview .wp-block-post-content,
  .ridder-interview .ridder-interview-content,
  .ridder-interview .wp-block-post-content > p:first-child,
  .ridder-interview .ridder-interview-content > p:first-child {
    max-width: 100% !important;
  }
}


/* 0.27 – release candidate: verified final refinements */

/* The interview kicker stays subordinate to the headline, but must be readable. */
.ridder-interview-kicker {
  font-size: 15px !important;
  line-height: 1.25 !important;
  letter-spacing: .12em !important;
  margin-bottom: 28px !important;
}

/* Keep the second line intentional, with only a subtle visual indent. */
.ridder-work-line-two {
  margin-left: .52em !important;
}

/* Contact information belongs to the same left axis as the cards above it. */
.ridder-contact-direct {
  margin-left: 0 !important;
  margin-right: auto !important;
  margin-top: clamp(56px, 7vw, 92px) !important;
}
.ridder-contact-closing {
  margin-left: 0 !important;
  margin-right: auto !important;
  margin-top: clamp(58px, 7vw, 94px) !important;
}

/* Give standard editorial articles a little more breathing room without
   changing their established hierarchy. */
.ridder-standard-content {
  line-height: 1.62 !important;
}
.ridder-standard-content > p:not(:first-child) {
  margin-bottom: 1.55em !important;
}
.ridder-standard-content > h2 {
  margin-top: clamp(62px, 6.5vw, 90px) !important;
  margin-bottom: 24px !important;
}
.ridder-standard-content > h3 {
  margin-top: 50px !important;
  margin-bottom: 20px !important;
}

@media (max-width: 760px) {
  .ridder-interview-kicker {
    font-size: 13px !important;
    margin-bottom: 20px !important;
  }
  .ridder-work-line-two { margin-left: .36em !important; }
  .ridder-contact-direct { margin-top: 48px !important; }
  .ridder-contact-closing { margin-top: 52px !important; }
}


/* 0.28 – restore a consistent page gutter on Sie & Ich and legal pages. */
.ridder-contact-page {
  width: min(1280px, calc(100% - 64px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box;
}
.ridder-contact-page > .ridder-contact-direct,
.ridder-contact-page > .ridder-contact-closing {
  width: 100% !important;
  box-sizing: border-box;
}
.ridder-contact-direct {
  max-width: 820px !important;
}
.ridder-contact-closing {
  max-width: 1020px !important;
}

/* Generic legal pages: readable editorial column while content stays editable
   in WordPress and is never hard-coded into the theme. */
body .ridder-content {
  width: min(1280px, calc(100% - 64px));
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}
.ridder-content > .wp-block-post-title {
  max-width: 1000px;
  margin-top: clamp(72px, 9vw, 130px);
  margin-bottom: clamp(42px, 5vw, 70px);
}
.ridder-content > .wp-block-post-content {
  max-width: 860px;
  margin-left: 0;
  margin-right: auto;
  padding-bottom: clamp(80px, 10vw, 140px);
}
.ridder-content > .wp-block-post-content > :where(p,ul,ol,h2,h3,h4) {
  max-width: 860px;
}
.ridder-content > .wp-block-post-content p,
.ridder-content > .wp-block-post-content li {
  line-height: 1.6;
}

@media (max-width: 760px) {
  .ridder-contact-page,
  body .ridder-content {
    width: calc(100% - 36px) !important;
  }
}

/* 0.34 – mobile preflight, taller Stirb & Werde portrait and calmer small-screen rhythm */
.ridder-about-intro {
  align-items: stretch;
}
.ridder-about-photo {
  align-self: stretch;
  display: flex;
  min-height: 0;
}
.ridder-about-photo img {
  width: 100%;
  height: 100%;
  min-height: clamp(570px, 45vw, 760px);
  max-height: 820px;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center 8%;
}

@media (max-width: 1050px) and (min-width: 761px) {
  .ridder-about-photo img {
    min-height: clamp(520px, 58vw, 700px);
  }
}

@media (max-width: 760px) {
  .ridder-eyebrow-wide { display: none !important; }
  .ridder-eyebrow-compact {
    display: flex !important;
    flex-wrap: wrap;
    column-gap: .15em;
    row-gap: .32em;
    max-width: 100%;
  }
  .ridder-eyebrow-compact a,
  .ridder-eyebrow-compact i { white-space: nowrap; }
  .ridder-eyebrow {
    max-width: none;
    margin-bottom: 22px;
    font-size: 10.5px;
    line-height: 1.45;
    letter-spacing: .105em;
  }
  .ridder-hero {
    padding-top: 30px;
    padding-bottom: 48px;
  }
  .ridder-hero h1 {
    font-size: clamp(50px, 14vw, 70px);
    line-height: .9;
  }
  .ridder-hero-copy { margin-top: 34px; }
  .ridder-hero-copy > p {
    font-size: 21px;
    line-height: 1.3;
  }
  .ridder-actions {
    margin-top: 30px;
    gap: 14px 24px;
  }
  .ridder-action {
    min-width: min(150px, 44vw);
    font-size: 14px;
  }
  .ridder-ai-teaser {
    margin-top: 26px;
    padding-top: 18px;
  }
  .ridder-ai-teaser p {
    font-size: 20px;
    line-height: 1.36;
  }
  .ridder-hero-marker {
    width: 210px;
    right: -116px;
    top: 18%;
    opacity: .085;
  }
  .ridder-experience { padding: 23px 18px 25px; }
  .ridder-experience p {
    font-size: 18px;
    line-height: 1.23;
  }
  .ridder-insights {
    padding: 64px 0 72px;
    gap: 58px;
  }
  .ridder-latest-query h2 {
    font-size: clamp(38px, 11.5vw, 48px);
    line-height: 1;
  }
  .ridder-latest-query .wp-block-post-excerpt,
  .ridder-home-editorial-lead {
    font-size: 20px !important;
    line-height: 1.38 !important;
  }
  .ridder-video-feature { padding-top: 54px; }
  .ridder-video-poster { aspect-ratio: 16/9; }

  .ridder-about-intro { gap: 34px; }
  .ridder-about-photo { margin-top: 0; }
  .ridder-about-photo img {
    min-height: 0;
    max-height: none;
    height: auto;
    aspect-ratio: 3 / 4;
    object-position: center 8%;
  }

  .ridder-services { padding-top: 46px; }
  .ridder-services-hero { gap: 30px; }
  .ridder-services-title { font-size: clamp(56px, 17vw, 78px); }
  .ridder-services-lead,
  .ridder-work-lead { font-size: 21px; line-height: 1.34; }
  .ridder-services-grid { margin-top: 64px; }
  .ridder-service,
  .ridder-service:nth-child(even) {
    padding: 30px 0 36px;
  }
  .ridder-service h2 {
    font-size: clamp(29px, 8.5vw, 38px);
    margin-bottom: 16px;
  }
  .ridder-service p {
    font-size: 19px;
    line-height: 1.42;
  }
  .ridder-work { margin-top: 88px; }
  .ridder-work-intro { margin-bottom: 54px; gap: 28px; }
  .ridder-project { gap: 30px; margin-bottom: 74px; }
  .ridder-project-copy { padding-top: 0; }
  .ridder-project-image img { width: 100%; height: auto; }
  .ridder-footer nav {
    flex-wrap: wrap;
    gap: 14px 24px;
  }
}

/* 0.35 – Stirb & Werde portrait: align with lead and show the natural portrait crop */
@media (min-width: 761px) {
  .ridder-about-intro {
    align-items: start;
  }
  .ridder-about-photo {
    align-self: start;
    display: block;
    min-height: 0;
  }
  .ridder-about-photo img {
    display: block;
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    aspect-ratio: auto;
    object-fit: contain;
    object-position: center top;
  }
}

@media (max-width: 760px) {
  .ridder-about-photo {
    margin-top: 0 !important;
    display: block;
  }
  .ridder-about-photo img {
    display: block;
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    aspect-ratio: auto;
    object-fit: contain;
    object-position: center top;
  }
}

/* 0.36 – final Wort & Wahn typography and featured-image alignment */
/* Keep the editorial intro typographically identical to the lead systems on
   Tat & Werk and Stirb & Werde. */
.ridder-blog-lead,
.ridder-blog-hero > .wp-block-shortcode .ridder-blog-lead {
  font-family: "Newsreader", Georgia, serif;
  font-size: clamp(24px, 2vw, 36px);
  line-height: 1.24;
  letter-spacing: -.02em;
}

/* On desktop the current article image begins at the lead, not at the headline. */
@media (min-width: 761px) {
  .ridder-blog-feature .wp-block-post-featured-image {
    align-self: start;
  }
}

@media (max-width: 760px) {
  .ridder-blog-lead,
  .ridder-blog-hero > .wp-block-shortcode .ridder-blog-lead {
    font-size: 21px;
    line-height: 1.34;
    letter-spacing: -.01em;
  }
  .ridder-blog-feature .wp-block-post-featured-image {
    margin-top: 0 !important;
  }
}

/* 0.38 – short desktop viewports: keep the experience band visible as the visual
   end of the first screen without browser-specific hacks. Mobile/tablet rules
   remain untouched. */
@media (min-width: 1180px) and (max-height: 1000px) {
  .ridder-home-stage {
    min-height: calc(100dvh - 112px);
  }

  .ridder-hero {
    padding-top: clamp(26px, 3.2vh, 38px);
    padding-bottom: clamp(22px, 2.8vh, 34px);
    align-content: start;
  }

  .ridder-eyebrow {
    margin-bottom: 18px;
  }

  .ridder-hero h1 {
    font-size: clamp(72px, 7vw, 126px);
  }

  .ridder-hero-copy > p {
    font-size: clamp(21px, 1.45vw, 28px);
    line-height: 1.22;
  }

  .ridder-actions {
    margin-top: 22px;
  }

  .ridder-ai-teaser {
    margin-top: 16px;
    padding-top: 12px;
  }

  .ridder-ai-teaser p {
    margin-bottom: 10px;
    font-size: clamp(19px, 1.25vw, 24px);
    line-height: 1.25;
  }

  .ridder-experience {
    min-height: 94px;
    padding-top: 14px;
    padding-bottom: 14px;
  }

  .ridder-experience p {
    font-size: clamp(18px, 1.15vw, 23px);
  }
}

/* 0.39 – mobile hardening for KI & Transparenz and generic legal pages.
   Keep the content on the same 18px mobile gutter as the header and prevent
   long headings from being squeezed by WordPress' constrained-layout widths. */
@media (max-width: 760px) {
  .ridder-policy-page {
    width: calc(100% - 36px) !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-top: 56px;
    box-sizing: border-box;
  }

  .ridder-policy-page > h1 {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    font-size: clamp(50px, 14vw, 62px);
    line-height: .9;
    letter-spacing: -.055em;
    overflow-wrap: normal;
    word-break: normal;
  }

  .ridder-policy-page > p,
  .ridder-policy-page > .ridder-policy-lead {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body .ridder-content > .wp-block-post-title {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    font-size: clamp(46px, 13.5vw, 58px);
    line-height: .92;
    letter-spacing: -.05em;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: manual;
  }

  body .ridder-content > .wp-block-post-content {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body .ridder-content > .wp-block-post-content > * {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box;
  }

  body .ridder-content > .wp-block-post-content h2 {
    font-size: clamp(29px, 8.2vw, 34px);
    line-height: 1.05;
    letter-spacing: -.035em;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: manual;
  }

  body .ridder-content > .wp-block-post-content h3 {
    font-size: clamp(25px, 7.2vw, 30px);
    line-height: 1.08;
  }
}


/* 0.40 – wide desktop screens with limited vertical space.
   On 16:9 external displays the width-based type scale can make the hero
   taller than on a laptop, even though the available browser height is similar.
   Scale the first screen by viewport height as well, so the complete two-line
   experience band remains visible as the visual end of the first screen. */
@media (min-width: 1500px) and (max-height: 1000px) {
  .ridder-hero {
    padding-top: clamp(22px, 2.7vh, 30px);
    padding-bottom: clamp(14px, 1.8vh, 20px);
  }

  .ridder-eyebrow {
    margin-bottom: 14px;
  }

  .ridder-hero h1 {
    font-size: clamp(88px, 11.5vh, 112px);
  }

  .ridder-hero-copy > p {
    font-size: clamp(20px, 2.5vh, 25px);
    line-height: 1.2;
  }

  .ridder-actions {
    margin-top: 18px;
  }

  .ridder-ai-teaser {
    margin-top: 12px;
    padding-top: 10px;
  }

  .ridder-ai-teaser p {
    margin-bottom: 8px;
    font-size: clamp(18px, 2.15vh, 21px);
    line-height: 1.22;
  }

  .ridder-experience {
    min-height: 82px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .ridder-experience p {
    font-size: clamp(17px, 1.9vh, 20px);
    line-height: 1.12;
  }

  .ridder-experience strong {
    margin-top: .24em;
  }
}

/* 0.41 – final first-screen fit and consistent homepage teaser typography.
   The two editorial teasers on the right use exactly the same type system.
   On wide, short desktop viewports the first stage has a fixed viewport height,
   allowing the flexing hero to give way while the complete experience band stays visible. */
.ridder-hero-copy > p,
.ridder-ai-teaser p {
  font-family: "Newsreader", Georgia, serif;
  font-size: clamp(22px, 1.75vw, 34px);
  line-height: 1.25;
  letter-spacing: -.018em;
}

@media (max-width: 760px) {
  .ridder-hero-copy > p,
  .ridder-ai-teaser p {
    font-size: 21px;
    line-height: 1.3;
    letter-spacing: -.018em;
  }
}

@media (min-width: 1180px) and (max-height: 1000px) {
  .ridder-hero-copy > p,
  .ridder-ai-teaser p {
    font-size: clamp(19px, 1.25vw, 24px);
    line-height: 1.25;
    letter-spacing: -.018em;
  }
}

@media (min-width: 1500px) and (max-height: 1020px) {
  .ridder-home-stage {
    height: calc(100dvh - 113px);
    min-height: 0;
  }

  .ridder-hero {
    min-height: 0;
    padding-top: clamp(20px, 2.4vh, 27px);
    padding-bottom: 8px;
  }

  .ridder-hero-copy > p,
  .ridder-ai-teaser p {
    font-size: clamp(18px, 2.15vh, 21px);
    line-height: 1.22;
    letter-spacing: -.018em;
  }

  .ridder-ai-teaser {
    margin-top: 10px;
    padding-top: 8px;
  }

  .ridder-experience {
    flex: 0 0 auto;
    min-height: 0;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .ridder-experience p {
    font-size: clamp(16px, 1.8vh, 19px);
    line-height: 1.1;
  }

  .ridder-experience strong {
    margin-top: .2em;
  }
}

/* 0.42 – unified mobile reading system, larger blog body copy and long-page navigation. */

/* Standard blog articles: a more generous reading size across all posts. */
.ridder-standard-content {
  font-size: 23px !important;
}
.ridder-standard-content > p:not(:first-child),
.ridder-standard-content > ul,
.ridder-standard-content > ol,
.ridder-standard-content > blockquote,
.ridder-standard-content > ul li,
.ridder-standard-content > ol li {
  font-size: 1em !important;
}

/* Footer navigation: give long pages useful destinations at their natural end. */
.ridder-footer {
  gap: 30px;
  flex-wrap: wrap;
}
.ridder-footer-main,
.ridder-footer-legal {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px 28px;
}
.ridder-footer-main a {
  font-weight: 700;
  text-decoration: none;
}
.ridder-footer-main a:hover,
.ridder-footer-main a:focus-visible,
.ridder-footer-legal a:hover,
.ridder-footer-legal a:focus-visible {
  color: var(--ridder-blue);
}

/* Floating back-to-top control – appears only after meaningful scroll depth. */
.ridder-back-to-top {
  position: fixed;
  right: 22px;
  bottom: max(22px, calc(env(safe-area-inset-bottom) + 16px));
  z-index: 999;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid var(--ridder-ink);
  border-radius: 50%;
  background: rgba(246,243,236,.94);
  color: var(--ridder-ink);
  font: 700 23px/1 "Figtree", sans-serif;
  box-shadow: 0 8px 26px rgba(11,11,13,.12);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 160ms ease, transform 160ms ease, visibility 160ms ease, background 160ms ease;
}
.ridder-back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.ridder-back-to-top:hover,
.ridder-back-to-top:focus-visible {
  background: var(--ridder-blue);
  border-color: var(--ridder-blue);
  color: white;
}

@media (max-width: 760px) {
  :root {
    --ridder-page: calc(100vw - 44px);
  }

  /* One dependable 22px content gutter on all main page families. */
  body .ridder-content,
  .ridder-contact-page,
  .ridder-policy-page,
  .ridder-single {
    width: calc(100vw - 44px) !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box;
  }

  /* Long German compounds may hyphenate instead of escaping the viewport. */
  :where(.ridder-content, .ridder-about, .ridder-services, .ridder-blog, .ridder-contact-page)
    :where(h1,h2,h3,h4) {
    max-width: 100%;
    word-break: normal;
    overflow-wrap: break-word;
    -webkit-hyphens: auto;
    hyphens: auto;
  }

  /* Tat & Werk / Ins Werk gesetzt: mobile story order is copy first, clipping second. */
  .ridder-project,
  .ridder-project:nth-child(even) {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
  }
  .ridder-project-copy {
    order: 1 !important;
    width: 100%;
  }
  .ridder-project-image,
  .ridder-project:nth-child(even) .ridder-project-image {
    order: 2 !important;
    width: 100%;
    margin-top: 8px !important;
  }
  .ridder-project .wp-element-caption {
    margin-top: 9px;
    padding-left: 0;
    padding-right: 0;
  }

  /* Standard blog body copy: larger but still comfortably line-spaced. */
  .ridder-standard-content {
    font-size: 21px !important;
    line-height: 1.58 !important;
  }
  .ridder-standard-content > p:not(:first-child),
  .ridder-standard-content > ul,
  .ridder-standard-content > ol,
  .ridder-standard-content > blockquote,
  .ridder-standard-content > ul li,
  .ridder-standard-content > ol li {
    font-size: 1em !important;
    line-height: inherit;
  }
  .ridder-standard-content > p:first-child {
    font-size: clamp(25px, 6.9vw, 30px) !important;
    line-height: 1.36;
  }
  .ridder-standard-content > h2 {
    font-size: clamp(30px, 8.1vw, 36px) !important;
    line-height: 1.06;
  }
  .ridder-standard-content > h3 {
    font-size: clamp(26px, 7vw, 31px) !important;
  }

  /* Prevent page-level content blocks from reintroducing narrower/wider axes. */
  body .ridder-content > .wp-block-post-content,
  body .ridder-content > .wp-block-post-content > *,
  .ridder-single > .wp-block-post-content,
  .ridder-standard-content {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box;
  }

  .ridder-footer {
    width: calc(100vw - 44px);
    padding: 34px 0 calc(38px + env(safe-area-inset-bottom));
    gap: 24px;
  }
  .ridder-footer-main,
  .ridder-footer-legal {
    width: 100%;
    gap: 12px 22px;
  }
  .ridder-back-to-top {
    right: 18px;
    width: 46px;
    height: 46px;
  }
}

/* 0.43 – Tat & Werk mobile gutters and tighter project media/caption geometry. */

/* Give project visuals a little more presence on desktop, while keeping copy dominant. */
@media (min-width: 761px) {
  .ridder-project {
    grid-template-columns: minmax(360px,.98fr) minmax(0,1.02fr);
    gap: clamp(38px,5vw,82px);
  }
  .ridder-project:nth-child(even) {
    grid-template-columns: minmax(0,1.02fr) minmax(360px,.98fr);
  }

  /* The image itself defines the visible media box; pale blue belongs to the caption only. */
  .ridder-project-image {
    width: 100%;
    min-height: 0;
    background: transparent;
    align-self: start;
  }
  .ridder-project-image img {
    display: block;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-width: 100%;
    object-fit: contain;
  }
  .ridder-project .wp-element-caption {
    width: 100%;
    margin: 0;
    padding: 10px 12px 9px;
    box-sizing: border-box;
    background: var(--ridder-pale-blue);
  }
}

@media (max-width: 760px) {
  /* Put the gutter on the real page canvas, not on Gutenberg's outer wrapper. */
  body .ridder-content:has(.ridder-services) {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  body .ridder-content:has(.ridder-services) > .wp-block-post-content {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .ridder-services {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-left: max(22px, env(safe-area-inset-left)) !important;
    padding-right: max(22px, env(safe-area-inset-right)) !important;
    box-sizing: border-box !important;
  }
  .ridder-services > *,
  .ridder-work,
  .ridder-project-list,
  .ridder-project,
  .ridder-project-copy,
  .ridder-project-image {
    max-width: 100% !important;
    box-sizing: border-box;
  }
  .ridder-project-image {
    min-height: 0 !important;
    background: transparent !important;
  }
  .ridder-project-image img {
    display: block;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-width: 100% !important;
    object-fit: contain !important;
  }
  .ridder-project .wp-element-caption {
    width: 100%;
    margin: 0;
    padding: 9px 10px 8px;
    box-sizing: border-box;
    background: var(--ridder-pale-blue);
  }
  .ridder-services-cta {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Last-resort protection against a block creating horizontal page drift. */
  html, body {
    max-width: 100%;
    overflow-x: clip;
  }
}


/* 0.44 – isolate mobile gutters per page family and standardize project media widths. */

@media (max-width: 760px) {
  /* Stirb & Werde gets its own real canvas gutter, independent of the generic
     .ridder-content rule used by standard pages. This prevents the about hero
     and its oversized typography from being shifted outside the viewport. */
  body .ridder-content:has(.ridder-about) {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  body .ridder-content:has(.ridder-about) > .wp-block-post-content {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .ridder-about {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-left: max(22px, env(safe-area-inset-left)) !important;
    padding-right: max(22px, env(safe-area-inset-right)) !important;
    box-sizing: border-box !important;
  }
  .ridder-about > *,
  .ridder-about-intro,
  .ridder-about-copy,
  .ridder-highlight-grid,
  .ridder-highlight,
  .ridder-about-photo {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
  .ridder-about-cta {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

@media (min-width: 761px) {
  /* Give every project visual the same outer width. The actual screenshot fills
     this media frame and the blue caption is therefore exactly as wide as the image. */
  .ridder-project-image {
    width: min(100%, 560px) !important;
    max-width: 560px !important;
    justify-self: start;
  }
  .ridder-project:nth-child(even) .ridder-project-image {
    justify-self: end;
  }
  .ridder-project-image img {
    width: 100% !important;
    max-width: 100% !important;
  }
  .ridder-project .wp-element-caption {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* 0.45 – make project screenshots fill the full caption/media width on desktop. */
@media (min-width: 761px) {
  .ridder-project-image {
    display: flex !important;
    flex-direction: column;
    align-items: stretch !important;
  }
  .ridder-project-image > img,
  .ridder-project-image > a,
  .ridder-project-image > a > img {
    display: block !important;
    inline-size: 100% !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    object-fit: contain !important;
    box-sizing: border-box !important;
  }
  .ridder-project-image > a {
    align-self: stretch !important;
  }
  .ridder-project .wp-element-caption {
    align-self: stretch !important;
    inline-size: 100% !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
}


/* 0.46 – Wort & Wahn teaser images: keep 16:9 artwork fully visible, never crop,
   and constrain the media box to its grid column so it cannot intrude into copy. */
.ridder-blog-feature-article,
.ridder-blog-feature-copy,
.ridder-blog-feature .wp-block-post-featured-image {
  min-width: 0;
}
.ridder-blog-feature .wp-block-post-featured-image {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  box-sizing: border-box;
}
.ridder-blog-feature .wp-block-post-featured-image a {
  display: block;
  width: 100%;
  max-width: 100%;
}
.ridder-blog-feature .wp-block-post-featured-image img {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  object-fit: contain !important;
  object-position: center center;
  background: var(--ridder-pale-blue);
  box-sizing: border-box;
}