/*
Theme Name: KDX26
Description: Kodex editorial website with featured stories, references, articles and responsive image controls.
Version: 2.5.47
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: kodex
*/
@font-face {
  font-family:"ABC Areal";
  src:url("assets/fonts/ABCAreal-Regular.woff2") format("woff2");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}

:root {
  --margin:10px;
  --sans:"ABC Areal",sans-serif;
  --serif:"Times New Roman",Times,serif;
  --small:14px;
  --body:14px;
  --headline:50px;
  --paper:#fff;
  --ink:#000;
  --gray:#e7e7e7;
  --red:#ff3600;
  --columns:8.333fr 25fr 33.333fr 16.667fr 8.333fr 8.334fr;
}

* {
  box-sizing:border-box;
}

body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:400 var(--small)/1.2 var(--sans);
}

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

a:hover {
  text-decoration:underline;
}

a:focus-visible,
button:focus-visible {
  outline:2px solid var(--red);
  outline-offset:4px;
}

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

.skip-link {
  position:fixed;
  top:-100px;
  left:var(--margin);
  z-index:100;
  background:#fff;
  padding:10px;
}

.skip-link:focus {
  top:10px;
}

.site-header {
  padding:10px var(--margin);
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:30px;
}

.brand img {
  display:block;
  width:auto;
  max-height:24px;
}

.menu {
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap:50px;
}

.site-header .menu li {
  position:relative;
}

.menu .sub-menu {
  list-style:none;
  background:#fff;
  position:absolute;
  right:0;
  min-width:160px;
  padding:12px;
  display:none;
  z-index:20;
}

.menu li:hover>.sub-menu,
.menu li:focus-within>.sub-menu {
  display:block;
}

.menu .sub-menu li+li {
  margin-top:10px;
}

.intro {
  padding:50px var(--margin) 70px;
}

.intro h1 {
  font:400 var(--headline)/1.03 var(--serif);
  text-align:center;
  max-width:80vw;
  margin:0 auto;
  letter-spacing:-.02em;
}

.site-footer {
  height:33.333333vh;
  height:33.333333dvh;
  margin:55px var(--margin) var(--margin);
  display:flex;
  flex-direction:column;
  gap:12px;
}

.footer-top {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:30px;
  flex-shrink:0;
}

.footer-top p {
  margin:0;
}

.footer-menus {
  display:flex;
  gap:50px;
}

.footer-menus .menu {
  gap:50px;
}

.footer-art {
  flex:1;
  min-height:0;
  overflow:hidden;
}

.footer-art img {
  display:block;
  width:100%;
  height:100%;
  object-fit:fill;
}

.footer-placeholder {
  height:100%;
  background:#000;
}

.content-page {
  margin:60px auto 100px;
  padding:0 var(--margin);
  max-width:1000px;
}

.content-page h1 {
  font:400 var(--headline)/1.03 var(--serif);
  margin:0 0 40px;
}

.content-body {
  font:400 var(--body)/1.4 var(--serif);
}

.content-body h2,
.content-body h3 {
  font-weight:400;
}

.content-body a {
  text-decoration:underline;
}

.content-body>* {
  max-width:100%;
}

.case-page {
  max-width:1450px;
}

.entry-meta {
  margin-bottom:25px;
}

.pagination {
  padding:20px 0;
  display:flex;
  gap:20px;
}

.screen-reader-text {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(1px,1px,1px,1px);
}

.site-header nav a:hover,
.site-header nav a:focus-visible {
  text-decoration:underline;
}

@media (max-width:767px) {
.site-header {
  align-items:flex-start;
  gap:12px;
}

.site-header .menu {
  gap:12px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.site-header nav {
  max-width:260px;
}

.intro {
  padding:38px var(--margin) 45px;
}

.intro h1 {
  font-size:30px;
  line-height:1.05;
  max-width:100%;
  letter-spacing:-.02em;
}

.site-footer {
  margin-top:40px;
  gap:15px;
}

.footer-top {
  flex-direction:column;
  gap:15px;
}

.footer-top .menu,
.footer-menus {
  gap:20px;
  flex-wrap:wrap;
}

.footer-top p {
  font-size:14px;
  line-height:1.3;
}

.content-page {
  margin-top:35px;
}

.content-page h1 {
  font-size:30px;
}
}

@media (max-width:767px) {
.site-footer {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:15px;
}

.footer-top {
  display:contents;
}

.footer-top>p {
  grid-column:1;
  grid-row:3;
  margin:0;
}

.footer-menus,
.footer-top>nav {
  grid-column:1;
  grid-row:1;
}

.footer-art {
  grid-column:1;
  grid-row:2;
  min-height:0;
}
}

.header-navigation {
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  gap:35px;
  min-width:0;
}

.menu-toggle {
  order:2;
  flex-shrink:0;
  appearance:none;
  background:none;
  border:0;
  border-radius:0;
  padding:0;
  color:inherit;
  font:400 var(--small)/1.2 var(--sans);
  cursor:pointer;
}

.menu-toggle:hover {
  text-decoration:underline;
}

.header-navigation nav {
  order:1;
  min-width:0;
}

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

@media(max-width:767px) {
.header-navigation {
  gap:12px;
  flex:1;
}

.site-header .brand {
  flex-shrink:0;
}

.header-navigation nav {
  max-width:none;
}

.header-navigation .menu {
  column-gap:12px;
  row-gap:10px;
}
}

.menu-label-mobile {
  display:none;
}

@media(max-width:767px) {
.menu-label-desktop {
  display:none;
}

.menu-label-mobile {
  display:inline;
}
}

@media(max-width:767px) {
.header-navigation {
  flex:1;
  gap:12px;
}

.site-header .header-navigation nav {
  flex:1;
  max-width:none;
}

.site-header .header-navigation .menu {
  width:100%;
  justify-content:space-between;
  column-gap:8px;
}
}

@media(max-width:767px) {
.site-header.menu-open>.brand,
.site-header.menu-open>a {
  display:none;
}

.site-header.menu-open .header-navigation {
  width:100%;
  align-items:flex-start;
}

.site-header.menu-open .header-navigation nav {
  flex:1;
  max-width:none;
}

.site-header.menu-open .header-navigation .menu {
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  gap:16px;
  width:100%;
}

.site-header.menu-open .menu-toggle {
  margin-left:auto;
}

.site-header.menu-open .menu .sub-menu {
  position:static;
  padding:12px 0 0 15px;
}
}

@media(max-width:767px) {
.site-header .header-navigation nav .menu {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-auto-flow:row;
  gap:16px;
  justify-items:start;
}

.site-header .header-navigation nav .menu>li {
  display:block;
  width:100%;
}
}

@media(max-width:767px) {
.site-header.menu-open .header-navigation nav .menu {
  display:flex;
  flex-direction:row;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
}

.site-header .header-navigation nav .menu>li {
  display:block;
  width:auto;
  flex:0 0 auto;
  white-space:nowrap;
}

.site-header .header-navigation nav {
  overflow-x:auto;
  min-width:0;
}
}

@font-face {
  font-family:"ABC Areal";
  src:url("assets/fonts/ABCAreal-Bold.woff2") format("woff2");
  font-style:normal;
  font-weight:700;
  font-display:swap;
}

.article-intro h1 {
  width:80vw;
}

.article-title-spacer {
  display:none;
}

.kodex-article.has-fixed-title .article-intro h1 {
  position:fixed;
  top:var(--article-title-top);
  left:50%;
  transform:translateX(-50%);
  z-index:40;
  pointer-events:none;
  background:transparent;
  margin:0;
}

.kodex-article.has-fixed-title .article-title-spacer {
  display:block;
  height:var(--article-title-height);
}

.article-deck {
  text-align:center;
  max-width:760px;
  margin:0 auto;
  padding:0 var(--margin);
}

.article-subtitle {
  font:400 20px/1.2 var(--sans);
  margin:0 0 50px;
}

.article-byline {
  font:400 12px/1.4 var(--sans);
  margin:0;
}

.article-body,
.article-author-note {
  max-width:800px;
  margin:110px auto 0;
  padding:0 var(--margin);
  font:400 16px/1.25 var(--sans);
}

.article-body>p {
  margin:0 0 28px;
}

.article-body h2 {
  font:400 20px/1.2 var(--sans);
  margin:100px 0 28px;
}

.article-body h3 {
  font:700 16px/1.25 var(--sans);
  margin:48px 0 24px;
}

.article-body a {
  text-decoration:underline;
}

.article-body .is-style-kodex-indent {
  margin-left:25%;
}

.article-body .wp-block-pullquote {
  border:0;
  padding:0;
  margin:40px 0 100px;
  text-align:center;
  color:rgb(255,0,0);
  font:700 24px/1.2 var(--sans);
  -webkit-text-stroke:1px #000;
  letter-spacing:1px;
  paint-order:fill stroke;
}

.article-body .wp-block-pullquote blockquote {
  margin:0;
  padding:0;
  border:0;
}

.article-body .wp-block-pullquote p {
  font:inherit;
  margin:0;
}

.article-body .wp-block-pullquote cite {
  display:block;
  margin-top:12px;
  font:400 14px/1.3 var(--sans);
  -webkit-text-stroke:0;
}

.article-body figure {
  margin:30px 0;
}

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

.article-author-note {
  color:#808080;
  margin-top:65px;
  margin-bottom:70px;
}

@media(max-width:767px) {
.article-intro h1 {
  width:calc(100vw - 2 * var(--margin));
}

.article-body,
.article-author-note {
  margin-top:65px;
}

.article-body .is-style-kodex-indent {
  margin-left:0;
}

.article-body h2 {
  margin-top:65px;
}

.article-body .wp-block-pullquote {
  font-size:20px;
  margin:35px 0 65px;
}
}

.site-header {
  position:sticky;
  top:0;
  z-index:60;
  background:var(--paper);
}

body.admin-bar .site-header {
  top:32px;
}

@media(max-width:782px) {
body.admin-bar .site-header {
  top:46px;
}
}

@media(max-width:600px) {
body.admin-bar .site-header {
  top:0;
}
}

.article-intro {
  padding-top:50px;
  padding-bottom:50px;
}

.article-intro h1 {
  color:#000;
}

.article-body .wp-block-quote {
  border:0;
  padding:0;
  margin:40px 0 100px;
  text-align:center;
  color:rgb(255,0,0);
  font:700 24px/1.2 var(--sans);
  -webkit-text-stroke:1px #000;
  letter-spacing:1px;
  paint-order:fill stroke;
}

.article-body .wp-block-quote p {
  font:inherit;
  margin:0;
}

.article-body .wp-block-quote cite {
  display:block;
  margin-top:12px;
  font:400 14px/1.3 var(--sans);
  -webkit-text-stroke:0;
}

@media(max-width:767px) {
.article-body .wp-block-quote {
  font-size:20px;
  margin:35px 0 65px;
}
}



.gate-header {
  padding:10px var(--margin);
  font:400 14px/1.2 var(--sans);
}

.gate-main {
  min-height:calc(100vh - 37px);
  min-height:calc(100dvh - 37px);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:40px var(--margin) 100px;
  text-align:center;
}

.gate-main h1 {
  font:400 50px/1.03 var(--serif);
  color:rgb(255,0,0);
  margin:0 0 24px;
}

.gate-main>p {
  margin:0 0 30px;
}

.gate-main form {
  width:min(100%,360px);
}

.gate-controls {
  display:flex;
  border-bottom:1px solid #000;
  gap:12px;
  align-items:center;
}

.gate-controls input {
  min-width:0;
  flex:1;
  border:0;
  padding:12px 0;
  background:transparent;
  border-radius:0;
  font:400 14px/1.2 var(--sans);
  color:#000;
}

.gate-controls button {
  border:0;
  padding:12px 0;
  background:transparent;
  font:400 14px/1.2 var(--sans);
  white-space:nowrap;
  cursor:pointer;
}

.gate-controls button:hover {
  text-decoration:underline;
}

#gate-error {
  color:rgb(255,0,0);
  font-size:14px;
  text-align:left;
}

@media(max-width:767px) {
.gate-main h1 {
  font-size:30px;
}
}

.site-footer {
  gap:5px;
}

@media(min-width:768px) {
.site-header a:hover,
.site-header nav a:focus-visible,
.menu-toggle:hover {
  font-style:italic;
  text-decoration:none;
}
}

@media(max-width:767px) {
.site-footer {
  gap:5px;
}
}

.about-copy {
  width:calc(100% - 2 * var(--margin));
  max-width:710px;
  margin:105px auto 80px;
  font:400 14px/1.3 var(--sans);
  text-align:justify;
}

.about-copy p {
  margin:0 0 20px;
}

.about-copy a {
  text-decoration:underline;
}

@media(max-width:767px) {
.about-copy {
  margin-top:45px;
  text-align:left;
}
}

body>main {
  min-height:100vh;
  min-height:100svh;
}

.imprint-page {
  padding:0 var(--margin);
}

.imprint-copy {
  width:50%;
  padding-top:0;
  font:400 14px/1.25 var(--sans);
  overflow-wrap:break-word;
}

.imprint-copy p {
  margin:0 0 20px;
}

.imprint-copy h2,
.imprint-copy h3 {
  font:700 14px/1.25 var(--sans);
  margin:24px 0 12px;
}

.imprint-copy a {
  text-decoration:underline;
}

@media(max-width:767px) {
.imprint-copy {
  width:100%;
}
}

.contact-page {
  width:calc(100% - 2 * var(--margin));
  max-width:920px;
  margin:170px auto 0;
  font:400 14px/1.25 var(--sans);
}

.contact-intro {
  margin-bottom:70px;
}

.contact-intro p {
  margin:0 0 20px;
}

.contact-form {
  display:flex;
  flex-direction:column;
  gap:18px;
}

.contact-row {
  display:grid;
  grid-template-columns:250px minmax(0,1fr);
  gap:24px;
}

.contact-row label {
  background:#b3b3b3;
  padding:17px 20px;
  min-height:52px;
}

.contact-row input,
.contact-row textarea {
  width:100%;
  min-width:0;
  border:1px solid #e7e7e7;
  border-radius:0;
  background:#f2f2f2;
  color:#000;
  padding:15px 18px;
  font:400 14px/1.3 var(--sans);
}

.contact-row textarea {
  min-height:210px;
  resize:vertical;
}

.contact-submit {
  align-self:flex-end;
  width:250px;
  background:#b3b3b3;
  color:#000;
  border:0;
  border-radius:0;
  padding:17px 20px;
  min-height:52px;
  text-align:left;
  font:400 14px/1.3 var(--sans);
  cursor:pointer;
}

.contact-submit:hover {
  font-style:italic;
}

.contact-row input:focus-visible,
.contact-row textarea:focus-visible {
  outline:2px solid rgb(255,0,0);
  outline-offset:2px;
}

.contact-honeypot {
  position:absolute;
  left:-10000px;
  width:1px;
  height:1px;
  overflow:hidden;
}

.contact-error {
  color:rgb(255,0,0);
}

@media(max-width:767px) {
.contact-page {
  margin-top:60px;
}

.contact-intro {
  margin-bottom:40px;
}

.contact-row {
  grid-template-columns:90px minmax(0,1fr);
  gap:10px;
}

.contact-row label {
  padding:16px 10px;
}

.contact-row input,
.contact-row textarea {
  padding:14px 10px;
}

.contact-submit {
  width:calc(100% - 100px);
}
}

.contact-row label,
.contact-row input,
.contact-row textarea {
  padding:10px;
}

.contact-row input,
.contact-row textarea {
  font-family:var(--serif);
  color:#555;
}

.capabilities-body {
  max-width:1200px;
  margin:35px auto 80px;
  padding:0 var(--margin);
  font:400 14px/1.4 var(--sans);
}

.capability-section {
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:70px;
  border-top:1px solid #000;
  padding:20px 0 0;
  margin:0 0 85px;
}

.capability-number {
  font:400 14px/1.2 var(--sans);
  margin:0 0 24px;
}

.capability-heading h2 {
  font:400 32px/1.05 var(--serif);
  margin:0;
  max-width:300px;
}

.capability-copy>p {
  margin:0 0 24px;
}

.capability-copy .capability-lead {
  font:400 20px/1.2 var(--sans);
  margin-bottom:25px;
}

.capability-services {
  list-style:none;
  padding:0;
  margin:35px 0 0;
}

.capability-services li {
  padding:12px 15px;
  background:var(--gray);
  margin-bottom:8px;
}

.capability-services strong {
  font-weight:700;
}

@media(max-width:767px) {
.capabilities-body {
  margin-top:10px;
}

.capability-section {
  grid-template-columns:1fr;
  gap:25px;
  margin-bottom:55px;
  padding-top:15px;
}

.capability-heading {
  display:flex;
  gap:20px;
  align-items:baseline;
}

.capability-number {
  margin:0;
}

.capability-heading h2 {
  font-size:28px;
}

.capability-copy .capability-lead {
  font-size:18px;
}
}

.capability-section {
  border-top:0;
}

.capability-number {
  font-size:32px;
  line-height:1.05;
}

@media(max-width:767px) {
.capability-number {
  font-size:28px;
}
}

.capability-number {
  display:none;
}

.capability-heading h2 {
  font-size:var(--headline);
  line-height:1.03;
  max-width:none;
}

@media(max-width:767px) {
.capability-heading h2 {
  font-size:30px;
}
}

.article-intro h1 {
  width:66vw;
  max-width:66vw;
}

.site-header a:hover,
.site-header nav a:hover,
.site-header nav a:focus-visible,
.menu-toggle:hover,
.menu-toggle:focus-visible {
  font-style:italic;
  text-decoration:none;
}

.article-body .wp-block-quote cite,
.article-body .wp-block-pullquote cite {
  letter-spacing:normal;
}

.article-cta {
  max-width:1000px;
  margin:70px auto 90px;
  padding:0 var(--margin);
}

.article-cta h2 {
  font:400 32px/1.1 var(--serif);
  margin:0 0 20px;
}

.article-cta a {
  font:400 16px/1.3 var(--sans);
  color:rgb(255,0,0);
}

.article-cta a:hover {
  font-style:italic;
  text-decoration:none;
}

@media(max-width:767px) {
.article-cta h2 {
  font-size:28px;
}
}

.intro-mobile {
  display:none;
}

.site-footer {
  display:flex;
  flex-direction:column;
  gap:5px;
}

.site-footer .footer-top {
  display:flex;
  flex-direction:row;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
}

.site-footer .footer-top>p {
  order:2;
  text-align:right;
  margin:0;
  max-width:60%;
}

.site-footer .footer-menus,
.site-footer .footer-top>nav {
  order:1;
  text-align:left;
}

@media(max-width:767px) {
.intro-desktop {
  display:none;
}

.intro-mobile {
  display:inline;
}

.site-footer .footer-top {
  gap:15px;
}

.site-footer .footer-top>p {
  max-width:55%;
}

.site-footer .footer-menus {
  gap:10px;
}

.site-footer .menu {
  gap:10px;
  flex-wrap:wrap;
}
}

html {
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

@media(max-width:767px) {
.article-body,
.article-author-note,
.article-byline,
.article-body h3 {
  font-size:var(--small);
}

.kodex-article .article-intro h1,
.kodex-article.has-fixed-title .article-intro h1 {
  position:static;
  top:auto;
  left:auto;
  transform:none;
  margin:0 auto;
  pointer-events:auto;
}

.kodex-article .article-title-spacer,
.kodex-article.has-fixed-title .article-title-spacer {
  display:none;
  height:0;
}
}

.article-author-note {
  font-family:var(--serif);
  color:#000;
}

.article-hero {
  position:relative;
}

.article-featured {
  position:absolute;
  top:50px;
  bottom:0;
  left:var(--margin);
  width:13vw;
  margin:0;
}

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

.site-header {
  background:rgba(255,255,255,var(--header-opacity,0));
  transition:background-color .15s linear;
}

.brand-original[hidden],
.article-back[hidden] {
  display:none;
}

@media(max-width:767px) {
.article-featured {
  position:relative;
  top:auto;
  bottom:auto;
  left:auto;
  width:calc(100% - 2 * var(--margin));
  height:66.666667svh;
  margin:0 auto;
}

.article-featured img {
  height:100%;
  object-fit:cover;
}
}

@media(prefers-reduced-motion:reduce) {
.site-header {
  transition:none;
}
}

.article-body p,
.article-author-note p,
.content-body p,
.about-copy p,
.imprint-copy p,
.contact-intro p,
.capability-copy>p {
  text-align:justify;
}

.article-body .wp-block-quote p,
.article-body .wp-block-pullquote p {
  text-align:center;
}

.article-author-note {
  font-style:italic;
  margin-top:150px;
  margin-bottom:150px;
}

@media(min-width:768px) {
.site-header .menu {
  gap:60px;
}

.header-navigation {
  gap:60px;
}
}

.imprint-copy {
  margin-left:auto;
  margin-right:auto;
}

@media(max-width:767px) {
.article-intro h1 {
  width:100%;
  max-width:100%;
}
}

.article-body h2,
.article-body h3 {
  margin-bottom:10px;
}

.article-body .wp-block-quote,
.article-body .wp-block-pullquote {
  margin-top:4em;
  margin-bottom:4em;
}

@media(max-width:767px) {
.article-body .wp-block-quote,
.article-body .wp-block-pullquote {
  -webkit-text-stroke-width:.5px;
}
}

.article-body>p:not(.is-style-kodex-indent) {
  margin-left:0;
  margin-right:0;
}

.article-body p.is-style-kodex-indent {
  margin-left:25%;
  margin-right:0;
  width:75%;
}

@media(max-width:767px) {
.article-body p.is-style-kodex-indent {
  margin-left:0;
  width:100%;
}
}

.article-body p,
.article-author-note p,
.content-body p,
.about-copy p,
.imprint-copy p,
.contact-intro p,
.capability-copy>p {
  -webkit-hyphens:auto;
  hyphens:auto;
  hyphenate-limit-chars:6 3 3;
  overflow-wrap:break-word;
}

@media(max-width:767px) {
.site-footer {
  height:auto;
  min-height:0;
}

.site-footer .footer-art {
  flex:none;
  height:16.666667vh;
  height:16.666667svh;
}
}

html,
body,
body * {
  scrollbar-width:none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
body *::-webkit-scrollbar {
  display:none;
  width:0;
  height:0;
}

.related-thinking {
  margin:0 var(--margin) 80px;
}

.related-thinking>h2 {
  font:400 20px/1.2 var(--sans);
  text-align:center;
  margin:0 0 10px;
}

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

.related-card {
  background:#000;
  color:#fff;
  padding:10px;
  display:flex;
  flex-direction:column;
  min-width:0;
  font:400 14px/1.3 var(--sans);
}

.related-meta {
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}

.related-image {
  position:relative;
  aspect-ratio:5/4;
  background:var(--gray);
  color:#666;
  margin-bottom:10px;
  overflow:hidden;
  display:flex;
  justify-content:center;
  align-items:center;
}

.related-image img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

.related-card h3 {
  font:400 14px/1.3 var(--sans);
  margin:0;
}

.related-card p {
  font:400 15px/1.3 var(--serif);
  margin:0 0 10px;
  text-align:justify;
  hyphens:auto;
  -webkit-hyphens:auto;
  overflow-wrap:break-word;
}

.related-link {
  align-self:flex-end;
  margin-top:auto;
}

.related-card a:hover {
  font-style:italic;
  text-decoration:none;
}

.site-footer {
  height:20vh;
  height:20svh;
}

@media(max-width:767px) {
.related-grid {
  grid-template-columns:1fr;
}

.related-card p {
  font-style:italic;
}

.site-footer {
  height:auto;
}
}

.article-body p.is-style-kodex-indent-10,
.case-page .content-body p.is-style-kodex-indent-10 {
  margin-left:10%;
  margin-right:0;
  width:90%;
}

.article-body p.is-style-kodex-indent-15,
.case-page .content-body p.is-style-kodex-indent-15 {
  margin-left:15%;
  margin-right:0;
  width:85%;
}

.article-body p.is-style-kodex-indent-20,
.case-page .content-body p.is-style-kodex-indent-20 {
  margin-left:20%;
  margin-right:0;
  width:80%;
}

.case-page .content-body p.is-style-kodex-indent {
  margin-left:25%;
  margin-right:0;
  width:75%;
}

@media(max-width:767px) {
.article-body p[class*="is-style-kodex-indent"],
.case-page .content-body p[class*="is-style-kodex-indent"] {
  margin-left:0;
  width:100%;
}
}

@media(max-width:767px) {
.kodex-article,
.kodex-article+.related-thinking,
.about-page {
  --margin:20px;
}

.case-page {
  padding-left:20px;
  padding-right:20px;
}

.about-copy {
  width:calc(100% - 40px);
  max-width:70vw;
}
}

@media(max-width:767px) {
.kodex-article .article-featured {
  width:calc(100% - 20px);
  margin-left:auto;
  margin-right:auto;
}
}


@media (max-width:767px) {
  .intro h1 { font-size:31px; }
  .kodex-article + .related-thinking,.related-thinking { --margin:10px; margin-left:10px; margin-right:10px; }
  .related-card { padding:10px; }
  .related-card p { font-size:16px; }
  .related-link { font-style:italic; }
  .article-author-note { font-size:15px; }
}

.site-footer .footer-top { padding-left:2px; padding-right:2px; }


:root { --reading-container:800px; --reading-copy:calc(var(--reading-container) - 20px); }
.article-body,.article-author-note { max-width:var(--reading-container); }
.imprint-copy,.content-body { width:100%; max-width:var(--reading-copy); margin-left:auto; margin-right:auto; }
@media(max-width:767px) {
  :root { --reading-copy:calc(var(--reading-container) - 40px); }
  .imprint-page,.content-page { padding-left:20px; padding-right:20px; }
}


.related-grid { gap:30px; align-items:start; }
.related-card { display:block; padding:0; background:#fff; color:#404040; }
.related-card-link {
 display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr);
 grid-template-rows:auto minmax(20px,1fr) auto auto auto;
 gap:0 10px; min-height:0; padding:10px; color:inherit;
 font:400 16px/1.15 var(--serif); text-decoration:none;
}
.related-card .related-type { grid-column:1; grid-row:1; text-transform:uppercase; text-align:right; }
.related-card h3 { grid-column:1; grid-row:2; font:italic 16px/1.15 var(--serif); text-align:right; margin:0; }
.related-card .related-year { grid-column:1; grid-row:3; }
.related-card .related-image { grid-column:2; grid-row:1 / 5; margin:0; background:transparent; aspect-ratio:auto; height:120px; display:block; }
.related-card .related-image img { position:static; width:100%; height:100%; object-fit:contain; object-position:right top; }
.related-card .related-link { grid-column:1; grid-row:4; justify-self:end; margin:0; font:italic 16px/1.15 var(--serif); }
.related-card p { grid-column:1 / -1; grid-row:5; font:400 16px/1.15 var(--serif); margin:10px 0 0; text-align:left; }
.related-card a:hover { font-style:normal; text-decoration:none; }
.related-card-link:focus-visible { outline:2px solid var(--red); outline-offset:2px; }
@media(min-width:768px) and (hover:hover) and (pointer:fine) {
 .related-card-link:hover .related-link { color:var(--red); }
}
@media(max-width:767px) {
 body:has(.kodex-article) .site-header { background:#fff; transition:none; }
 .related-grid { gap:30px; }
 .related-card { padding:0; }
}



.related-card { background:#fafafa; }
.related-card .related-type,.related-card h3 { text-align:left; }
.related-card-link { grid-template-rows:auto minmax(20px,1fr) auto auto; }
.related-card .related-year { grid-column:1; grid-row:3; justify-self:start; }
.related-card .related-link { grid-column:1; grid-row:3; justify-self:end; }
.related-card .related-image { grid-row:1 / 4; }
.related-card p { grid-row:4; }

@media(max-width:767px) {
  .related-grid { row-gap:30px; }
  .related-thinking > h2 { text-align:left; margin-bottom:30px; }
}


.related-card-link { grid-template-columns:minmax(0,1fr) auto; column-gap:5px; }
.related-card .related-image { width:auto; height:auto; align-self:end; }
.related-card .related-image img {
  width:auto; height:auto; max-height:120px;
  max-width:min(180px,35vw); display:block;
}
.related-card .related-link { margin:0; padding:0; text-align:right; }

@media(max-width:767px) {
  .related-card h3 { font-style:normal; }
  .related-card p { font-style:italic; }
}