/* PSO.EU brand overlay — dark green journal */
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,500&family=Noto+Sans+Arabic:wght@400;500;600;700&display=swap");

:root {
  --pso-accent: #1f4d2e;
  --pso-accent-dark: #143620;
  --pso-font-display: "Cormorant Garamond", "Georgia", "Times New Roman", serif;
  --pso-font-arabic: "Noto Sans Arabic", "Segoe UI", "Tahoma", sans-serif;
  --pso-prose-measure: min(70ch, 100%);
  --pso-prose-indent: 1.5rem;
  --pso-text-muted: #4a5648;
  --pso-text-scale: 1;
  --pso-body-size: 16px;
  --pso-float-w: clamp(180px, 26vw, 260px);
  /* Gutter strip — most of the image sits right of the text measure */
  --pso-float-bleed: calc(var(--pso-float-w) * 0.9);
  /* Air between wrapping text and image (left) */
  --pso-float-gap: 3.5em;
  /* Pull figure up so it bridges sections (not glued to one paragraph) */
  --pso-float-nudge-up: 4em;
  /* Extra air above the image vs. text (red-circle zone) */
  --pso-float-gap-top: 2em;
  --pso-float-shape-gap: 1.25em;
  /* Right hero — shrinks on mid desktops so prose/images keep room */
  --pso-hero-w: 480px;
  /* Shared soft corner — Up Next card + content figs 1–2 */
  --pso-card-radius: 8px;
}

html[data-pso-fs="sm"] { --pso-text-scale: 0.92; }
html[data-pso-fs="md"] { --pso-text-scale: 1; }
html[data-pso-fs="lg"] { --pso-text-scale: 1.12; }
html[data-pso-fs="xl"] { --pso-text-scale: 1.24; }

/* Mobile header: text-size controls (Aa + −/+) — hidden on desktop */
.pso-font-size {
  display: none;
}
.pso-font-size__legend {
  display: inline-flex;
  align-items: baseline;
  margin-inline-end: 2px;
  padding: 0 2px;
  font-family: var(--pso-font-display);
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.02em;
  color: #1f4d2e;
  user-select: none;
  pointer-events: none;
}
.pso-font-size__btn {
  appearance: none;
  -webkit-appearance: none;
  margin: 0;
  padding: 0;
  min-width: 40px;
  height: 40px;
  border: 1px solid #c5cec6;
  border-radius: 8px;
  background: #f4f6f4;
  color: #1a2218;
  font-family: var(--pso-font-display);
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}
.pso-font-size__btn + .pso-font-size__btn {
  margin-inline-start: 6px;
}
.pso-font-size__btn:hover,
.pso-font-size__btn:focus {
  background: #e8eee8;
  border-color: #1f4d2e;
  outline: none;
}
.pso-font-size__btn:focus-visible {
  box-shadow: 0 0 0 2px rgba(31, 77, 46, 0.35);
}
.pso-font-size__btn[disabled] {
  opacity: 0.4;
  cursor: default;
}

/* Header: journal tagline only (not the domain), display serif like H2/intro */
.qrt-brand-text {
  display: block;
  color: #141a12;
  text-decoration: none;
  font-size: inherit;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.12;
  white-space: normal;
}
.qrt-brand-tag {
  display: flex;
  flex-direction: column;
  gap: 0.05em;
  margin-top: 0;
  font-family: var(--pso-font-display);
  font-size: clamp(0.95rem, 1.15vw, 1.28rem);
  color: #141a12;
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.12;
  white-space: normal;
  min-width: 0;
  max-width: 100%;
}
.qrt-brand-tag__l1,
.qrt-brand-tag__l2 {
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}
.qrt-brand-tag__l2 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

/* Top-bar logo slot — never shove into nav */
.qrt-app .qrt-top-bar .qrt-logo {
  width: auto;
  max-width: min(260px, 22vw);
  margin-left: 14px;
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
}
/* Nav grows between brand and shop — items hug the shop button (right).
   Same gap between items and between last item → Shop button. */
.qrt-app .qrt-top-bar {
  --pso-nav-gap: 40px;
}
.qrt-app .qrt-top-bar .qrt-menu {
  flex: 1 1 auto;
  min-width: 0;
  margin-left: 12px;
  margin-right: var(--pso-nav-gap);
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.qrt-app .qrt-top-bar .qrt-menu .qrt-dynamic-menu,
.qrt-app .qrt-top-bar .qrt-menu nav {
  max-width: 100%;
  margin-left: auto;
  margin-right: 0;
}
.qrt-app .qrt-top-bar .qrt-menu nav {
  overflow: hidden;
}
.qrt-app .qrt-top-bar .qrt-menu nav ul {
  justify-content: flex-end;
  flex-wrap: nowrap;
  gap: var(--pso-nav-gap);
}
.qrt-app .qrt-top-bar .qrt-menu nav ul > li {
  margin-left: 0;
  margin-right: 0;
}
.qrt-app .qrt-top-bar .qrt-symbol .pso-drop {
  width: 28px;
  height: 28px;
  object-fit: contain;
  object-position: center;
}

/* Preloader: centered journal title over progress bar */
.qrt-app .qrt-preloader .qrt-preloader-content {
  width: min(90vw, 380px);
  text-align: center;
}
.qrt-app .qrt-preloader .qrt-preloader-content .qrt-logo {
  width: 100%;
  max-width: none;
  margin: 0 auto 14px;
  text-align: center;
}
.qrt-app .qrt-preloader .pso-preloader-title {
  display: block;
  width: 100%;
  margin: 0;
  text-align: center;
  white-space: normal;
  font-family: var(--pso-font-display);
  font-size: clamp(1.15rem, 2.6vw, 1.5rem);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: 0.01em;
  color: #1a2218;
}

/*
  Accent surfaces were yellow (#ffd54f) with dark text.
  Now dark green (#1f4d2e) → text must be white everywhere on that fill.
*/
.qrt-btn.qrt-btn-color,
.qrt-btn.qrt-btn-color:hover,
.qrt-btn.qrt-btn-color:focus,
.qrt-btn.qrt-btn-color span,
.qrt-submit,
.qrt-submit:hover,
.qrt-app .qrt-left-bar .qrt-change-language .qrt-leng.qrt-active,
.qrt-app .qrt-top-bar .qrt-menu .qrt-change-language--menu .qrt-leng.qrt-active,
.qrt-app .qrt-top-bar .qrt-menu nav ul li ul,
.qrt-app .qrt-top-bar .qrt-menu nav ul li ul a,
.qrt-blog-pagination li a.qrt-active,
.qrt-blog-pagination li a.qrt-active:hover,
.qrt-contact-form .qrt-input.qrt-active + label,
.qrt-contact-form .qrt-input:focus + label,
blockquote {
  color: #fff !important;
}

/* Nav / buttons / left bar — Quarty default is 10px; bump for readability */
.qrt-app .qrt-top-bar .qrt-menu nav ul li a {
  font-size: 12px;
}
.qrt-btn,
.qrt-btn.qrt-btn-md,
.qrt-btn.qrt-btn-sm {
  font-size: 12px;
}
/*
  Left-bar mother label — Quarty template geometry (style.css):
  bottom: calc(100vh - 285px), 300×90, rotate(-90deg), flex-end.
  left:-111px centers the 300px box on the 80px strip; empty side is clipped
  by .qrt-app overflow, text sits on the flex-end side (below the logo).
*/
.qrt-app .qrt-left-bar {
  overflow: visible;
  z-index: 9;
}
.qrt-app .qrt-left-bar .qrt-current-page-title {
  pointer-events: auto;
  position: absolute;
  left: -111px !important;
  right: auto;
  width: 300px !important;
  max-width: none;
  height: 90px !important;
  max-height: none !important;
  top: auto !important;
  bottom: calc(100vh - 285px) !important; /* Quarty template */
  padding: 0 40px 0 0 !important; /* Quarty padding-right */
  margin: 0;
  overflow: visible !important;
  text-overflow: clip;
  white-space: nowrap;
  display: flex !important;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  writing-mode: horizontal-tb;
  transform: rotate(-90deg) !important;
  text-align: right;
  font-family: "Josefin Sans", sans-serif;
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 2px;
  z-index: 1;
}
.qrt-app .qrt-left-bar .qrt-current-page-title a {
  display: block !important;
  pointer-events: auto;
  color: #28292c;
  text-decoration: none;
  writing-mode: horizontal-tb;
  transform: none;
  white-space: nowrap;
  letter-spacing: inherit;
  line-height: 1;
  max-height: none;
  overflow: visible;
}
.qrt-app .qrt-left-bar .qrt-current-page-title a:hover,
.qrt-app .qrt-left-bar .qrt-current-page-title a:focus {
  color: #1f4d2e;
}
.qrt-app .qrt-left-bar .qrt-change-language {
  z-index: 2;
  bottom: 24px;
  overflow: visible;
}
.qrt-app .qrt-left-bar .qrt-change-language .qrt-leng {
  font-size: 10px;
  width: 26px;
  height: 26px;
  margin-bottom: 6px;
  letter-spacing: 1px;
  box-sizing: border-box;
  border: 1px solid transparent;
  text-decoration: none;
  position: relative;
}

/*
  Desktop: full language name replaces the ISO chip in place (pill, not side tooltip).
*/
@media (hover: hover) and (pointer: fine) {
  .qrt-app .qrt-left-bar .qrt-change-language .qrt-leng[data-lang-full]::after {
    content: attr(data-lang-full);
    position: absolute;
    left: 0;
    top: 0;
    height: 26px;
    min-width: 26px;
    width: max-content;
    padding: 0 12px;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    white-space: nowrap;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: none;
    font-family: "Josefin Sans", sans-serif;
    line-height: 1;
    color: #fff;
    background-color: #28292c;
    border-radius: 999px; /* Pill */
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    -webkit-transition: opacity 0.15s ease, visibility 0.15s ease;
            transition: opacity 0.15s ease, visibility 0.15s ease;
    z-index: 40;
    box-shadow: 0 2px 8px rgba(40, 41, 44, 0.22);
  }
  .qrt-app .qrt-left-bar .qrt-change-language .qrt-leng[data-lang-full]:hover,
  .qrt-app .qrt-left-bar .qrt-change-language .qrt-leng[data-lang-full]:focus-visible {
    color: transparent; /* ISO-Kürzel unsichtbar, Pill übernimmt */
    border-color: transparent;
    background-color: transparent !important;
    box-shadow: none !important;
    z-index: 41;
  }
  .qrt-app .qrt-left-bar .qrt-change-language .qrt-leng[data-lang-full]:hover::after,
  .qrt-app .qrt-left-bar .qrt-change-language .qrt-leng[data-lang-full]:focus-visible::after {
    opacity: 1;
    visibility: visible;
  }
}

.pso-stub-note { opacity: .75; font-style: italic; }
.pso-disclaimer {
  background: #e4eee6;
  border-left: 3px solid #1f4d2e;
  padding: 14px 16px;
  margin: 0 0 24px;
}

/*
  Magazine reading (Hochglanz):
  1 Serif display titles
  2 Reading measure (~70ch) — white space left of text, tight to hero
  3 Lead intro after H1
  4 H1/H2 hierarchy
  5 Airy paragraph rhythm
  6 Drop cap after divider
*/
.qrt-app .qrt-half-content-frame .qrt-left p,
.qrt-app .qrt-half-content-frame .qrt-left .qrt-text,
.qrt-app .qrt-half-content-frame .qrt-left ul,
.qrt-app .qrt-half-content-frame .qrt-left ol,
.qrt-app .qrt-half-content-frame .qrt-left .pso-disclaimer,
.qrt-app .qrt-half-content-frame .qrt-left .pso-sitemap-list {
  max-width: var(--pso-prose-measure);
  line-height: 1.78;
}
.qrt-app .qrt-half-content-frame .qrt-left p {
  margin: 0 0 1.45em;
  font-size: calc(var(--pso-body-size) * var(--pso-text-scale));
  color: #2a3228;
  letter-spacing: 0.01em;
}
.qrt-app .qrt-half-content-frame .qrt-left p:last-child {
  margin-bottom: 0;
}
.qrt-app .qrt-half-content-frame .qrt-left h2 ~ p,
.qrt-app .qrt-half-content-frame .qrt-left h2 ~ ul,
.qrt-app .qrt-half-content-frame .qrt-left h2 ~ ol,
.qrt-app .qrt-half-content-frame .qrt-left h2 ~ .qrt-text,
.qrt-app .qrt-half-content-frame .qrt-left h2 ~ .pso-disclaimer {
  margin-left: var(--pso-prose-indent);
  max-width: min(70ch, calc(100% - var(--pso-prose-indent)));
}
/* Clip sideways bleed so floats/bands never paint under the fixed hero */
.qrt-app .qrt-content .qrt-half-content-frame {
  overflow: visible;
}
.qrt-app .qrt-content .qrt-half-content-frame .qrt-left {
  padding-right: 28px;
  overflow-x: hidden !important; /* fallback */
  overflow-x: clip !important;
  overflow-y: visible !important;
  box-sizing: border-box;
}
.qrt-app .qrt-content .qrt-half-content-frame .qrt-right {
  width: var(--pso-hero-w);
  z-index: 4;
  flex: 0 0 var(--pso-hero-w);
}

/* Flow = text measure + gutter strip; text stays on measure, images use the strip */
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow {
  max-width: min(100%, calc(var(--pso-prose-measure) + var(--pso-float-bleed)));
  overflow: visible;
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow > .qrt-mb-40 {
  max-width: none;
}
/* Keep body copy on the reading measure — do not fill the gutter strip */
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow p,
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow .qrt-text,
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow ul,
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow ol,
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow .pso-disclaimer,
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow .pso-sitemap-list {
  max-width: var(--pso-prose-measure);
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow h2 ~ p,
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow h2 ~ ul,
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow h2 ~ ol,
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow h2 ~ .qrt-text,
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow h2 ~ .pso-disclaimer {
  max-width: min(70ch, calc(100% - var(--pso-prose-indent)));
}
@media (min-width: 1200px) {
  .qrt-app .qrt-content .qrt-half-content-frame .qrt-left {
    width: calc(100% - var(--pso-hero-w));
    padding-left: 48px;
    padding-right: 28px;
  }
}
/* Mid desktop: fixed 480px hero eats too much of ~1200–1500 CSS px */
@media (min-width: 1200px) and (max-width: 1499px) {
  :root {
    --pso-hero-w: clamp(300px, 32vw, 400px);
    --pso-float-w: clamp(150px, 20vw, 220px);
    --pso-float-bleed: calc(var(--pso-float-w) * 0.7);
  }
  .qrt-app .qrt-half-content-frame .qrt-left h1.pso-display-title {
    font-size: clamp(2.1rem, 3.6vw, 3.4rem);
  }
  .qrt-app .qrt-top-bar .qrt-logo {
    max-width: min(200px, 18vw);
  }
  .qrt-brand-tag {
    font-size: clamp(0.88rem, 1vw, 1.1rem);
  }
}
@media (min-width: 1500px) {
  :root {
    --pso-hero-w: 480px;
  }
}
@media (min-width: 1400px) {
  :root {
    --pso-prose-indent: 1.75rem;
  }
  .qrt-app .qrt-content .qrt-half-content-frame .qrt-left {
    padding-left: 72px;
    padding-right: 24px;
  }
}
@media (min-width: 1800px) {
  .qrt-app .qrt-content .qrt-half-content-frame .qrt-left {
    padding-left: 96px;
    padding-right: 20px;
  }
}
/* Hamburger visible ≤1200: match info dots to same box + optical height */
@media (max-width: 1200px) {
  .qrt-app .qrt-top-bar .qrt-buttons {
    align-items: center;
  }
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn,
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn {
    width: 42px;
    height: 42px;
    padding: 0;
    margin: 0;
    margin-top: 0;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn span,
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn span:after,
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn span:before {
    width: 22px;
    height: 2.5px;
    border-radius: 1px;
  }
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn span {
    margin: 0 !important;
    position: relative;
    top: 0;
  }
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn span:before {
    top: -8px;
  }
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn span:after {
    top: 8px;
  }
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn.qrt-active span:before {
    transform: translate(0, 8px) rotate(-90deg);
  }
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn.qrt-active span:after {
    transform: translate(0, -8px) rotate(-90deg);
  }
  /* Info dots: same vertical span (±8px) and visual weight as hamburger */
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn {
    padding: 0;
  }
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn span,
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn span:before,
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn span:after {
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
  }
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn span {
    margin: 0 !important;
    position: relative;
    top: 0;
  }
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn span:before {
    top: -8px;
  }
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn span:after {
    top: 8px;
  }
  /* Active info: same X as hamburger (bars, not a diagonal slash of dots) */
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn.qrt-active span,
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn.qrt-active span:before,
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn.qrt-active span:after {
    width: 22px !important;
    height: 2.5px !important;
    border-radius: 1px !important;
  }
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn.qrt-active span:before {
    transform: translate(0, 8px) rotate(-90deg);
  }
  .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn.qrt-active span:after {
    transform: translate(0, -8px) rotate(-90deg);
  }
}
@media (max-width: 768px) {
  :root {
    --pso-prose-indent: 0;
    --pso-body-size: 18px;
  }
  .qrt-app .qrt-half-content-frame .qrt-left p {
    font-size: calc(var(--pso-body-size) * var(--pso-text-scale));
    line-height: 1.75;
  }
  /* Equal side gutters — Quarty had L/R 20px, then padding-right:inherit wiped the right */
  .qrt-app .qrt-content .qrt-half-content-frame .qrt-left {
    padding: 44px 20px 36px !important; /* more air under stacked hero → H1 */
    box-sizing: border-box;
    width: 100%;
  }
  /* Logo slot empty on mobile — text-size controls on the far right */
  .qrt-app .qrt-top-bar .qrt-logo {
    display: none !important;
  }
  .pso-font-size {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    position: absolute;
    top: 50%;
    left: auto;
    right: 14px;
    transform: translateY(-50%);
    z-index: 6;
  }
  [dir="rtl"] .pso-font-size {
    right: auto;
    left: 14px;
  }
  /* 100vw + scrollbar = horizontal bleed; clip page, keep gutters */
  .qrt-app,
  .qrt-app .qrt-content {
    max-width: 100%;
    overflow-x: clip;
  }
}

/* 1 + 4 · Serif H1 / magazine hierarchy */
.qrt-app .qrt-half-content-frame .qrt-left h1,
.qrt-app .qrt-half-content-frame .qrt-left h1.pso-display-title {
  font-family: var(--pso-font-display);
  font-weight: 600;
  letter-spacing: -0.015em;
  color: #141a12;
  text-shadow: none;
}
.qrt-app .qrt-half-content-frame .qrt-left h1.pso-display-title {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.04em;
  margin: 0 0 1.15rem;
  max-width: 100%;
  font-size: clamp(2.55rem, 4.6vw, 4.5rem);
  line-height: 1.02;
  text-wrap: balance;
}
.qrt-app .qrt-half-content-frame .qrt-left h1.pso-display-title .pso-display-title__line {
  display: block;
  max-width: 100%;
}
.qrt-app .qrt-half-content-frame .qrt-left h1:not(.pso-display-title) {
  margin: 0 0 1.15rem;
  max-width: 100%;
  font-size: clamp(2.4rem, 4.2vw, 4.1rem);
  line-height: 1.05;
  text-wrap: balance;
}
@media (min-width: 769px) {
  /* Long FR/DE phrases must wrap — nowrap pushed H1 into the hero */
  .qrt-app .qrt-half-content-frame .qrt-left h1.pso-display-title .pso-display-title__line--phrase {
    white-space: normal;
    overflow-wrap: anywhere;
    max-width: 100%;
  }
}
@media (max-width: 768px) {
  .qrt-app .qrt-half-content-frame .qrt-left h1.pso-display-title,
  .qrt-app .qrt-half-content-frame .qrt-left h1:not(.pso-display-title) {
    font-size: calc(clamp(2.55rem, 10.5vw, 3.65rem) * var(--pso-text-scale));
    margin-top: 0.15rem;
  }
  .qrt-app .qrt-half-content-frame .qrt-left h1 + .qrt-text,
  .qrt-app .qrt-half-content-frame .qrt-left h1.pso-display-title + .qrt-text {
    font-size: calc(1.2rem * var(--pso-text-scale));
    line-height: 1.55;
  }
  .qrt-app .qrt-half-content-frame .qrt-left h2 {
    font-size: calc(clamp(1.7rem, 5.5vw, 2.15rem) * var(--pso-text-scale));
  }
}

/* 3 · Lead intro (first .qrt-text after H1) */
.qrt-app .qrt-half-content-frame .qrt-left h1 + .qrt-text,
.qrt-app .qrt-half-content-frame .qrt-left h1.pso-display-title + .qrt-text {
  max-width: min(58ch, 100%);
  margin: 0 0 1.75rem;
  font-size: clamp(1.15rem, 1.55vw, 1.38rem);
  line-height: 1.55;
  font-weight: 400;
  letter-spacing: 0.01em;
  color: var(--pso-text-muted);
}

/* Divider breathing room */
.qrt-app .qrt-half-content-frame .qrt-left .qrt-divider {
  margin-top: 0.5rem;
  margin-bottom: 2.25rem;
  opacity: 0.55;
}

/* 4 · H2: smaller than H1, clear air above; wide enough for “Section: Short Title” */
.qrt-app .qrt-half-content-frame .qrt-left h2 {
  font-family: var(--pso-font-display);
  font-weight: 600;
  font-size: clamp(1.55rem, 2.2vw, 2.05rem);
  line-height: 1.18;
  letter-spacing: -0.01em;
  color: #171d15;
  clear: both;
  max-width: min(44ch, 100%);
  margin: 2.85rem 0 1.05rem;
  text-wrap: balance;
  text-shadow: none;
}
/* Last section title next to Up next — wrap beside the card, do not clear below it */
.qrt-app .qrt-half-content-frame .qrt-left h2.pso-h2--beside-up-next {
  clear: none;
}
.qrt-app .qrt-half-content-frame .qrt-left .qrt-divider + h2,
.qrt-app .qrt-half-content-frame .qrt-left h1 + h2 {
  margin-top: 1.5rem;
}

/* Home section hubs: icon + plain title, browse CTA after intro */
.qrt-app .qrt-half-content-frame .qrt-left h2.pso-section-hub__title {
  display: flex;
  align-items: baseline;
  gap: 0.55rem;
  max-width: min(48ch, 100%);
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-section-hub__icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.15em;
  color: var(--pso-accent);
  font-size: 0.72em;
  line-height: 1;
  transform: translateY(-0.06em);
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-section-hub__text {
  flex: 1 1 auto;
  min-width: 0;
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-section-hub__cta {
  clear: both;
  margin: 0.35rem 0 0.5rem;
  margin-left: var(--pso-prose-indent);
  max-width: min(70ch, calc(100% - var(--pso-prose-indent)));
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-section-hub__btn {
  background-color: transparent;
  border: 2px solid var(--pso-accent);
  color: var(--pso-accent);
  box-shadow: none;
  text-decoration: none;
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-section-hub__btn span {
  color: var(--pso-accent);
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-section-hub__btn:hover,
.qrt-app .qrt-half-content-frame .qrt-left .pso-section-hub__btn:focus {
  background-color: var(--pso-accent);
  border-color: var(--pso-accent);
  color: #fff;
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-section-hub__btn:hover span,
.qrt-app .qrt-half-content-frame .qrt-left .pso-section-hub__btn:focus span {
  color: #fff;
}
@media (max-width: 991px) {
  .qrt-app .qrt-half-content-frame .qrt-left .pso-section-hub__cta {
    margin-left: 0;
    max-width: 100%;
  }
}

/* 6 · Drop cap on first body paragraph after divider */
.qrt-app .qrt-half-content-frame .qrt-left .qrt-divider + p::first-letter {
  font-family: var(--pso-font-display);
  float: left;
  font-size: 3.55em;
  line-height: 0.82;
  font-weight: 600;
  padding: 0.06em 0.1em 0 0;
  margin: 0.04em 0.02em 0 0;
  color: #141a12;
}

/*
  Hero overlay (right column = 480px fixed, ~400px after padding).
  Brand + claim on two lines; fluid size so long journal brand never clips.
*/
.qrt-half-banner .qrt-overlay {
  box-sizing: border-box;
}
.qrt-half-banner .qrt-overlay .qrt-banner-title {
  max-width: 100%;
  min-width: 0;
}
.qrt-half-banner .pso-banner-title {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.2em;
  margin: 0 0 10px;
  max-width: 100%;
  font-size: clamp(1.25rem, 3.2vw, 1.85rem);
  line-height: 1.15;
  font-weight: 700;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.qrt-half-banner.qrt-left-align .pso-banner-title {
  align-items: flex-start;
  text-align: left;
}
.qrt-half-banner .pso-banner-title__brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.08em;
  letter-spacing: 0.02em;
  max-width: 100%;
}
.qrt-half-banner .pso-banner-title__brand:empty {
  display: none;
}
.qrt-half-banner .pso-banner-title__brand-line {
  display: block;
  max-width: 100%;
}
.qrt-half-banner .pso-banner-title__claim {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.12em;
  font-size: 0.72em;
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.25;
  max-width: 100%;
  opacity: 0.95;
  text-wrap: balance;
}
/* Fallback: if brand empty, claim still reads as large title */
.qrt-half-banner .pso-banner-title__brand:empty + .pso-banner-title__claim {
  font-size: 1em;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.15;
  gap: 0.08em;
}
.qrt-half-banner .pso-banner-title__claim:empty {
  display: none;
}
.qrt-half-banner .pso-banner-title__claim-line {
  display: block;
  max-width: 100%;
}
@media (max-width: 1200px) {
  .qrt-half-banner .pso-banner-title {
    align-items: center;
    text-align: center;
    font-size: calc(clamp(1.35rem, 4.6vw, 1.95rem) * var(--pso-text-scale));
  }
  .qrt-half-banner .pso-banner-title__claim {
    align-items: center;
    text-align: center;
  }
  .qrt-half-banner .qrt-overlay .qrt-banner-title .qrt-text {
    font-size: calc(15px * var(--pso-text-scale));
    line-height: 1.5;
  }
  /* Stacked hero: grow with overlay instead of clipping at fixed 300px */
  .qrt-app .qrt-content .qrt-half-content-frame .qrt-right {
    height: auto !important;
    min-height: 0;
    max-width: 100%;
    width: 100%;
    flex: none;
    overflow: hidden; /* clip Ken-Burns zoom bleed */
  }
  .qrt-half-banner {
    height: auto;
    min-height: 360px;
    max-width: 100%;
    width: 100%;
    overflow: hidden; /* was visible — zoomed image leaked below overlay */
  }
  .qrt-half-banner .qrt-image-frame {
    overflow: hidden;
  }
  /*
    Mobile: dark overlay must zoom in sync with the image, otherwise scale(1.1)
    leaves a bright strip under the static overlay. Text is counter-scaled so it
    stays optically steady.
  */
  .qrt-half-banner.qrt-animated-zoom .qrt-overlay {
    -webkit-animation: zoom 20s linear infinite;
            animation: zoom 20s linear infinite;
    -webkit-transform-origin: center center;
            transform-origin: center center;
  }
  .qrt-half-banner.qrt-animated-zoom .qrt-overlay > * {
    -webkit-animation: pso-zoom-counter 20s linear infinite;
            animation: pso-zoom-counter 20s linear infinite;
    -webkit-transform-origin: center center;
            transform-origin: center center;
  }
  .qrt-half-banner .qrt-overlay {
    height: auto;
    min-height: 360px;
    width: 100%;
    max-width: 100%;
    padding: 36px 28px 36px; /* more air around hero title */
    box-sizing: border-box;
    overflow: visible;
  }
  .qrt-half-banner .qrt-overlay .qrt-banner-title,
  .qrt-half-banner .pso-banner-title,
  .qrt-half-banner .qrt-overlay .qrt-banner-title .qrt-text,
  .qrt-half-banner .pso-hero-links {
    min-width: 0;
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
  }
  .qrt-half-banner .qrt-overlay .qrt-banner-title .qrt-text {
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
  }
  .qrt-half-banner .pso-hero-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 12px;
    margin: 0 0 16px;
    padding: 0;
  }
  .qrt-half-banner .pso-hero-links a {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    max-width: 100%;
    text-align: center;
  }
}
@media (max-width: 768px) {
  .qrt-half-banner {
    min-height: 400px;
  }
  .qrt-half-banner .qrt-overlay {
    min-height: 400px;
    padding: 40px 24px 36px;
  }
  .qrt-half-banner .pso-banner-title {
    font-size: calc(clamp(1.15rem, 5vw, 1.45rem) * var(--pso-text-scale));
    margin: 10px 0 18px;
    padding: 0 4px;
    line-height: 1.25;
    max-width: 100%;
  }
  .qrt-half-banner .qrt-overlay .qrt-banner-title {
    max-width: 100%;
    padding: 0;
    box-sizing: border-box;
  }
  .qrt-half-banner .qrt-overlay .qrt-banner-title .qrt-divider-2 {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  .qrt-half-banner .qrt-overlay .qrt-banner-title .qrt-text {
    font-size: calc(13.5px * var(--pso-text-scale));
    line-height: 1.45;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 14px;
    padding: 0;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .pso-hero-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 10px;
    margin: 0 0 14px;
    padding: 0;
    max-width: 100%;
  }
  .pso-hero-links a {
    font-size: 11px;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
    white-space: normal;
  }
  .qrt-half-banner .qrt-overlay .qrt-btn {
    max-width: 100%;
    box-sizing: border-box;
  }
}

/* Inline gallery rhythm: 1 band (full) → 2 float right → 3 float left */
.qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig {
  margin: 0;
  padding: 0;
  position: relative;
  z-index: 1;
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig__link {
  display: block;
  overflow: hidden;
  border-radius: 2px;
  background: #e8ebe8;
  box-shadow: 0 10px 28px rgba(20, 28, 18, 0.12);
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig__link picture,
.qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig__link img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--dummy .pso-inline-fig__link {
  opacity: 0.88;
  filter: saturate(0.85);
}

/* Fig 1: full-width band after lead */
.qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--band {
  float: none;
  clear: both;
  display: block;
  width: 100%;
  max-width: none;
  margin: 1.85em 0 2.35em;
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--band .pso-inline-fig__link {
  aspect-ratio: 16 / 10;
  border-radius: var(--pso-card-radius);
}

/* Fig 2: float right into gutter — below H2, beside prose only */
.qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--right {
  float: right;
  clear: right;
  width: var(--pso-float-w);
  max-width: 48%;
  margin: 0.35em 0 1.85em var(--pso-float-gap);
  shape-outside: margin-box;
  shape-margin: var(--pso-float-shape-gap);
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--right .pso-inline-fig__link {
  aspect-ratio: 1 / 1;
  border-radius: var(--pso-card-radius);
}

/* Fig 3: float left — portrait 3:4 under H2, prose beside
   Edge: Serie-M Opt. 8 dry-brush ink mask (canonical: /img/masks/fig3-ink.png = fig3-ink-m08.png) */
.qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--left {
  float: left;
  clear: left;
  width: calc(var(--pso-float-w) * 0.92);
  max-width: 42%;
  margin: 0.35em var(--pso-float-gap) 1.85em 0;
  shape-outside: url("/img/masks/fig3-ink.png");
  shape-margin: var(--pso-float-shape-gap);
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--left .pso-inline-fig__link {
  aspect-ratio: 3 / 4;
  border-radius: 0;
  overflow: visible;
  background: transparent;
  box-shadow: none;
  filter: drop-shadow(0 10px 22px rgba(20, 28, 18, 0.14));
  -webkit-mask-image: url("/img/masks/fig3-ink.png");
  mask-image: url("/img/masks/fig3-ink.png");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-mode: alpha;
  mask-mode: alpha;
}

@media (max-width: 992px) {
  .qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow {
    max-width: 100%;
  }
  .qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--right,
  .qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--left {
    max-width: 42%;
  }
}
@media (max-width: 768px) {
  .qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--band {
    margin: 1.35em 0 1.75em;
  }
  .qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--band .pso-inline-fig__link {
    aspect-ratio: 4 / 3;
  }
  .qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--right,
  .qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--left {
    float: none;
    clear: both;
    /* Zwischen Desktop-Float (~180px) und voller Spaltenbreite */
    width: min(78%, 360px);
    max-width: 85%;
    margin: 1.25em auto 1.5em;
    shape-outside: none;
    shape-margin: 0;
  }
}

/* Legacy bottom grid (unused after inline figures; keep harmless) */
.pso-gallery {
  display: none;
}

/* Site footer (end of left column — Quarty Half has no built-in footer) */
.pso-site-footer {
  margin: 48px 0 24px;
  padding-top: 20px;
  border-top: 1px solid #d5ddd6;
}
.pso-site-footer__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-bottom: 10px;
}
.pso-site-footer__nav a {
  color: #1f4d2e;
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
}
.pso-site-footer__nav a:hover,
.pso-site-footer__nav a:focus {
  text-decoration: underline;
}
.pso-site-footer__meta {
  margin: 0;
  font-size: 12px;
  color: #5a6656;
  line-height: 1.45;
}
.pso-site-footer__meta p {
  margin: 0;
}
.pso-site-footer__shop {
  margin-top: 0.35em;
}
.pso-site-footer__meta a {
  color: #1f4d2e;
}

/* Shop CTA — left aligns with indented prose; right aligns with Up-next float */
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow > .row {
  clear: both;
  max-width: none;
  width: calc(100% - var(--pso-prose-indent));
  margin-top: 28px;
  margin-bottom: 0;
  margin-left: var(--pso-prose-indent);
  margin-right: 0;
  box-sizing: border-box;
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow > .row > [class*="col-"] {
  padding-left: 0;
  padding-right: 0;
}
.qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow .qrt-call-to-action {
  width: 100%;
  box-sizing: border-box;
}

/* Mid-essay “Up next” — Variant B: float right like fig 2, 4:3 card.
   Desktop: JS sets margin-top so the card bottom aligns with the last wrapping
   paragraph; earlier prose wraps around the float when the card sits higher.
   Mobile (≤768px): JS moves the card after the essay text (before CTA); no float. */
.qrt-app .qrt-half-content-frame .qrt-left .pso-up-next {
  float: right;
  clear: right;
  width: var(--pso-float-w);
  max-width: 48%;
  margin: 0.35em 0 1.85em var(--pso-float-gap);
  shape-outside: margin-box;
  shape-margin: var(--pso-float-shape-gap);
  box-sizing: border-box;
}
.pso-up-next__card {
  display: block;
  text-decoration: none;
  color: inherit;
  background: #eef2ef;
  border: 1px solid #d5ddd6;
  border-radius: var(--pso-card-radius);
  overflow: hidden;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.pso-up-next__card:hover,
.pso-up-next__card:focus {
  border-color: #1f4d2e;
  background: #e6ece7;
  text-decoration: none;
}
.pso-up-next__media {
  display: block;
  width: 100%;
}
.pso-up-next__media picture,
.pso-up-next__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 4 / 3;
}
.pso-up-next__body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 12px 12px 14px;
}
.pso-up-next__eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #1f4d2e;
}
.pso-up-next__hook {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  color: #243228;
}
.pso-up-next__cta {
  font-size: 13px;
  font-weight: 700;
  color: #1f4d2e;
  margin-top: 2px;
}
.pso-up-next__cta::after {
  content: " \2192";
}
@media (max-width: 992px) {
  .qrt-app .qrt-half-content-frame .qrt-left .pso-up-next {
    max-width: 42%;
  }
}
@media (max-width: 768px) {
  /* Stacked after prose (DOM order set by pso-site.js), centered card */
  .qrt-app .qrt-half-content-frame .qrt-left .pso-up-next {
    float: none;
    clear: both;
    width: min(var(--pso-float-w), 78%);
    max-width: 280px;
    margin: 1.75em auto 1.75em;
    shape-outside: none;
    shape-margin: 0;
  }
}

/* Section hub: Start here + topic chips + article index */
.qrt-app .qrt-half-content-frame .qrt-left .pso-section-hub {
  max-width: var(--pso-prose-measure);
  margin: 28px 0 40px;
  margin-left: var(--pso-prose-indent);
  box-sizing: border-box;
}
.pso-section-hub__heading {
  margin: 0 0 14px;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #1f4d2e;
  clear: both;
  max-width: none;
}
.pso-section-hub__start {
  margin-bottom: 28px;
}
.pso-section-hub__doors {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
@media (min-width: 720px) {
  .pso-section-hub__doors {
    grid-template-columns: repeat(3, 1fr);
  }
}
.pso-section-hub__door {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 14px 16px;
  background: #eef2ef;
  border: 1px solid #d5ddd6;
  border-radius: 8px;
  text-decoration: none;
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.pso-section-hub__door:hover,
.pso-section-hub__door:focus {
  border-color: #1f4d2e;
  background: #e6ece7;
  text-decoration: none;
}
/* Browse-Toggle: Schalter statt Link — nur gestrichelter Rahmen (kein zweiter Schatten-Rand) */
.pso-section-hub__door--toggle {
  background: #fff;
  border: 1px dashed #a8b8ab;
  box-shadow: inset 0 1px 2px rgba(31, 77, 46, 0.05);
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.2s ease;
}
.pso-section-hub__door--toggle:hover,
.pso-section-hub__door--toggle:focus {
  background: #fafcfb;
  border-color: #1f4d2e;
  box-shadow: inset 0 1px 2px rgba(31, 77, 46, 0.07);
}
.pso-section-hub__door--toggle[aria-expanded="true"] {
  border-style: dashed;
  border-color: #1f4d2e;
  background: #fff;
  box-shadow: inset 0 1px 2px rgba(31, 77, 46, 0.05);
}
.pso-section-hub__door--toggle .pso-section-hub__door-title {
  display: inline-flex;
  align-items: flex-start; /* Icon/Chevron auf erster Zeile, auch wenn Titel umbricht */
  gap: 0.5em;
}
/* Listen-Icon vor dem Titel — optisch mittig in Zeile 1 */
.pso-section-hub__door--toggle .pso-section-hub__door-title::before {
  content: "";
  display: inline-block;
  width: 0.82em;
  height: 0.72em;
  flex-shrink: 0;
  margin-top: 0.29em; /* (line-height 1.3 − icon 0.72) / 2 */
  background:
    linear-gradient(currentColor, currentColor) 0 0 / 100% 2px no-repeat,
    linear-gradient(currentColor, currentColor) 0 50% / 100% 2px no-repeat,
    linear-gradient(currentColor, currentColor) 0 100% / 68% 2px no-repeat;
  opacity: 0.88;
}
/* Disclosure-Chevron: nach unten (zu) / nach oben (offen) */
.pso-section-hub__door--toggle .pso-section-hub__door-title::after {
  content: "";
  display: inline-block;
  width: 0.42em;
  height: 0.42em;
  margin-top: 0.35em; /* erste Zeile, nicht Gesamtblock */
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform 0.2s ease, margin-top 0.2s ease;
  flex-shrink: 0;
}
.pso-section-hub__door--toggle[aria-expanded="true"] .pso-section-hub__door-title::after {
  margin-top: 0.55em;
  transform: rotate(-135deg);
}
.pso-section-hub__door-title {
  font-weight: 700;
  font-size: 15px;
  color: #1f4d2e;
  line-height: 1.3;
}
.pso-section-hub__door-text {
  font-size: 13px;
  line-height: 1.45;
  color: #3d4a40;
}
.pso-section-hub__browse {
  padding-top: 20px;
  margin-top: 4px;
  border-top: 1px solid #d5ddd6;
  transition: border-color 0.2s ease, margin-top 0.2s ease, padding-top 0.2s ease;
}
/* Offen: weicher Anschluss an den Browse-Bereich (kein harter Falz) */
.pso-section-hub.is-browse-open .pso-section-hub__browse {
  margin-top: 12px;
  padding: 18px 16px 8px;
  border: 1px dashed #a8b8ab;
  border-radius: 8px;
  background: #fff;
  box-shadow: inset 0 1px 2px rgba(31, 77, 46, 0.04);
}
.pso-section-hub__browse.is-collapsed,
.pso-section-hub__browse[hidden] {
  display: none;
}
.pso-section-hub__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}
.pso-section-hub__chip {
  appearance: none;
  border: 1px solid #b8c4ba;
  background: #fff;
  color: #1f4d2e;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
}
.pso-section-hub__chip:hover,
.pso-section-hub__chip:focus {
  border-color: #1f4d2e;
}
.pso-section-hub__chip.is-active {
  background: #1f4d2e;
  border-color: #1f4d2e;
  color: #fff;
}
.pso-section-hub__index {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid #d5ddd6;
}
.pso-section-hub__item {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 12px;
  padding: 10px 0;
  border-bottom: 1px solid #e4ebe5;
}
.pso-section-hub__item.is-hidden {
  display: none;
}
.pso-section-hub__item a {
  color: #1f4d2e;
  font-weight: 600;
  text-decoration: none;
  font-size: 15px;
}
.pso-section-hub__item a:hover,
.pso-section-hub__item a:focus {
  text-decoration: underline;
}
.pso-section-hub__meta {
  font-size: 12px;
  color: #6a776e;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.pso-section-hub__empty {
  display: none;
  margin: 10px 0 0;
  font-size: 13px;
  color: #6a776e;
}
.pso-section-hub__empty.is-visible {
  display: block;
}

/* Hero overlay internal links (right column) */
.pso-hero-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin: 0 0 18px;
  max-width: 100%;
}
.pso-hero-links a {
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.45);
  padding-bottom: 1px;
  line-height: 1.3;
}
.pso-hero-links a:hover,
.pso-hero-links a:focus {
  border-bottom-color: #fff;
}
@media (max-width: 1200px) {
  .pso-hero-links {
    justify-content: center;
  }
}

/* Scroll-down hint: locale label from data-scroll-label (chrome.scrollHintShortLabel) */
.qrt-scroll-hint span:before {
  content: attr(data-scroll-label);
  text-transform: none;
  /* Quarty default bottom:-75px — pull label closer to the mouse button */
  bottom: -42px;
  right: -38px;
  letter-spacing: 1px;
}
.qrt-half-banner .qrt-scroll-hint {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  cursor: pointer;
  z-index: 2;
}
.qrt-half-banner .qrt-scroll-hint:focus {
  outline: 2px solid #fff;
  outline-offset: 4px;
}
.qrt-half-banner .qrt-scroll-hint:focus:not(:focus-visible) {
  outline: none;
}
.qrt-half-banner .qrt-scroll-hint:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 4px;
}

/* In-content section links + HTML sitemap */
.qrt-app .qrt-half-content-frame .qrt-left h2 a {
  color: inherit;
  text-decoration: none;
}
.qrt-app .qrt-half-content-frame .qrt-left h2 a:hover,
.qrt-app .qrt-half-content-frame .qrt-left h2 a:focus {
  color: #1f4d2e;
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 0.18em;
}
/* Body links: dotted underline (magazine, not web-default) */
.qrt-app .qrt-half-content-frame .qrt-left p a,
.qrt-app .qrt-half-content-frame .qrt-left li a,
.qrt-app .qrt-half-content-frame .qrt-left .qrt-text a {
  color: #1f4d2e;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-style: dotted;
  text-decoration-thickness: from-font;
  text-underline-offset: 0.28em;
  text-decoration-color: rgba(31, 77, 46, 0.55);
}
.qrt-app .qrt-half-content-frame .qrt-left p a:hover,
.qrt-app .qrt-half-content-frame .qrt-left li a:hover,
.qrt-app .qrt-half-content-frame .qrt-left .qrt-text a:hover,
.qrt-app .qrt-half-content-frame .qrt-left p a:focus,
.qrt-app .qrt-half-content-frame .qrt-left li a:focus,
.qrt-app .qrt-half-content-frame .qrt-left .qrt-text a:focus {
  text-decoration-style: dotted;
  text-decoration-color: #1f4d2e;
  text-decoration-thickness: 1.5px;
}
.pso-sitemap-list {
  margin: 0;
  padding-left: 1.1rem;
  line-height: 1.7;
}
.pso-sitemap-group h2 {
  font-size: 22px;
  margin-bottom: 10px;
}

/* Info slider: brand row without left label — full width */
.qrt-app .qrt-top-bar .qrt-info .qrt-table li.pso-info-brand {
  display: block;
  margin-bottom: 16px;
}
.qrt-app .qrt-top-bar .qrt-info .qrt-table li.pso-info-brand span {
  display: block;
  width: 100%;
  color: #1a2218;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0.01em;
  transform: none;
}

/* Legal block: own wrap — separated from shop rows */
.qrt-app .qrt-top-bar .qrt-info .pso-info-legal-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.55rem;
  margin-top: 1rem;
  padding: 0.85rem 0.95rem 0.95rem;
  box-sizing: border-box;
  width: 100%;
  border: 1px solid rgba(32, 58, 29, 0.14);
  border-radius: var(--pso-card-radius);
  background: linear-gradient(165deg, rgba(31, 77, 46, 0.06), rgba(248, 246, 241, 0.9));
}
.qrt-app .qrt-top-bar .qrt-info .pso-info-legal-wrap__title {
  margin: 0;
  width: 100%;
  color: #1f4d2e;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.qrt-app .qrt-top-bar .qrt-info .pso-info-legal-wrap .pso-info-legal__links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.9rem;
  width: 100%;
}
.qrt-app .qrt-top-bar .qrt-info .pso-info-legal-wrap .pso-info-legal__links a {
  color: #3d453a;
  font-size: 13px;
  line-height: 1.35;
  text-decoration: none;
  border-bottom: 1px solid rgba(61, 69, 58, 0.28);
  padding-bottom: 1px;
}
.qrt-app .qrt-top-bar .qrt-info .pso-info-legal-wrap .pso-info-legal__links a:hover,
.qrt-app .qrt-top-bar .qrt-info .pso-info-legal-wrap .pso-info-legal__links a:focus {
  color: #141a12;
  border-bottom-color: #141a12;
}
.qrt-app .qrt-top-bar .qrt-info .pso-info-legal-wrap .pso-info-legal__ai {
  margin: 0.15rem 0 0;
  max-width: 22rem;
  font-size: 11px;
  line-height: 1.4;
  font-weight: 400;
  color: #5a6656;
  opacity: 0.85;
}

/* Info slider: copyright only under divider */
.qrt-app .qrt-top-bar .qrt-info .qrt-copy {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

/* --- RTL / Arabic --- */
body[dir="rtl"],
html[dir="rtl"] body {
  font-family: var(--pso-font-arabic);
  direction: rtl;
  text-align: right;
}
body[dir="rtl"] .qrt-brand-tag,
body[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left h1,
body[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left h2,
body[dir="rtl"] .pso-up-next__eyebrow,
body[dir="rtl"] .pso-section-hub__door-title {
  font-family: var(--pso-font-arabic);
}

/*
  Chrome stays LTR (language bar left, hero right) — same as DE/EN.
  Body dir=rtl would reverse .qrt-app flex and park the language menu on the right.
*/
[dir="rtl"] .qrt-app {
  direction: ltr;
}
[dir="rtl"] .pso-font-size__legend {
  font-family: var(--pso-font-arabic);
}
/* margin-inline-start on .pso-font-size__btn already mirrors in RTL */

/*
  Half-layout geometry stays LTR (text column left, fixed hero right).
  Body dir=rtl alone reverses flex → text sits under the hero on the right.
*/
[dir="rtl"] .qrt-app .qrt-content .qrt-half-content-frame {
  direction: ltr;
}
[dir="rtl"] .qrt-app .qrt-content .qrt-half-content-frame .qrt-left {
  direction: rtl;
  text-align: right;
  /* Keep air toward the hero (physical right) — do not zero padding-right */
  padding-left: 12px;
  padding-right: 28px;
  box-sizing: border-box;
}
@media (min-width: 1200px) {
  [dir="rtl"] .qrt-app .qrt-content .qrt-half-content-frame .qrt-left {
    width: calc(100% - var(--pso-hero-w));
    padding-left: 48px;
    padding-right: 28px;
  }
}
@media (min-width: 1400px) {
  [dir="rtl"] .qrt-app .qrt-content .qrt-half-content-frame .qrt-left {
    padding-left: 72px;
    padding-right: 24px;
  }
}
@media (min-width: 1800px) {
  [dir="rtl"] .qrt-app .qrt-content .qrt-half-content-frame .qrt-left {
    padding-left: 96px;
    padding-right: 20px;
  }
}
@media (max-width: 1200px) {
  [dir="rtl"] .qrt-app .qrt-content .qrt-half-content-frame .qrt-right {
    right: auto;
    left: 0;
    margin-left: 0;
    width: 100%;
  }
}

/*
  RTL text direction alone packs max-width blocks to the right (toward the hero).
  Pin reading measure + CTAs to the physical left — same air to hero as LTR.
*/
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow,
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left h1,
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left h2,
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left > p,
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left > .qrt-text,
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left > .pso-disclaimer,
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left > .qrt-divider {
  margin-left: 0;
  margin-right: auto;
}
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left h2 ~ p,
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left h2 ~ ul,
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left h2 ~ ol,
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left h2 ~ .qrt-text,
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left h2 ~ .pso-disclaimer {
  margin-left: var(--pso-prose-indent);
  margin-right: auto;
}
[dir="rtl"] .pso-disclaimer {
  border-left: 0;
  border-right: 3px solid #1f4d2e;
}
[dir="rtl"] .pso-sitemap-list {
  padding-left: 0;
  padding-right: 1.1rem;
}

[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left .pso-section-hub,
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left .pso-section-hub__cta,
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left .pso-article-flow > .row {
  margin-left: var(--pso-prose-indent);
  margin-right: auto;
  text-align: right;
}
[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left .pso-section-hub__cta {
  /* override LTR-only clear/max-width sibling; keep left indent */
  max-width: min(70ch, calc(100% - var(--pso-prose-indent)));
}
[dir="rtl"] .pso-section-hub__door {
  text-align: right;
}
[dir="rtl"] .pso-section-hub__door--toggle .pso-section-hub__door-title::before {
  margin-right: 0;
  margin-left: 0.4em;
}
[dir="rtl"] .pso-section-hub__chips {
  /* physical left under the left-pinned hub (match LTR chip start) */
  justify-content: flex-start;
  direction: ltr;
}
[dir="rtl"] .pso-section-hub__chips > * {
  direction: rtl;
}

[dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left .pso-up-next {
  text-align: right;
}
[dir="rtl"] .pso-up-next__card {
  text-align: right;
}
[dir="rtl"] .pso-up-next__cta::after {
  content: " ←";
}

/* Header Shop/info: a bit more air over the hero column */
[dir="rtl"] .qrt-app .qrt-top-bar {
  padding-right: 40px;
}
[dir="rtl"] .qrt-app .qrt-top-bar .qrt-menu {
  margin-right: calc(var(--pso-nav-gap, 40px) + 8px);
}

/*
  RTL: mirror float sides for content images 2+3
  (LTR: fig2 right / fig3 left → RTL: fig2 left / fig3 right of text).
  Desktop only — mobile keeps stacked floats-none.
*/
@media (min-width: 769px) {
  [dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--right {
    float: left;
    clear: left;
    margin: 0.35em var(--pso-float-gap) 1.85em 0;
  }
  [dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left .pso-inline-fig--left {
    float: right;
    clear: right;
    /* Extra air toward prose — Arabic feels denser next to the portrait */
    margin: 0.35em 0 1.85em calc(var(--pso-float-gap) + 0.75em);
    /*
      LTR fig3 uses shape-outside: ink-mask (soft edge faces text).
      That mask is not mirrored for RTL, so wrap hugged the hard edge.
      margin-box makes the real margin the wrap contour.
    */
    shape-outside: margin-box;
    shape-margin: var(--pso-float-shape-gap);
  }
  [dir="rtl"] .qrt-app .qrt-half-content-frame .qrt-left .pso-up-next {
    float: left;
    clear: left;
    margin: 0.35em var(--pso-float-gap) 1.85em 0;
  }
}

/*
  Mobile: language ISO column on the physical left of the dark menu slider.
  Desktop keeps langs in .qrt-left-bar only.
*/
.qrt-app .qrt-top-bar .qrt-menu .qrt-change-language--menu {
  display: none;
}

@media (max-width: 768px) {
  .qrt-app .qrt-top-bar .qrt-menu .qrt-change-language--menu {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    position: absolute;
    left: 16px;
    top: 40px;
    z-index: 2;
    width: 36px;
  }
  .qrt-app .qrt-top-bar .qrt-menu .qrt-change-language--menu .qrt-leng {
    width: 30px;
    height: 30px;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-size: 10px;
    padding-left: 2px;
    padding-top: 2px;
    font-family: "Josefin Sans", sans-serif;
    letter-spacing: 2px;
    font-weight: 800;
    border-radius: 50%;
    color: #fff;
    text-decoration: none;
    transition: 0.4s ease-in-out;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .qrt-app .qrt-top-bar .qrt-menu .qrt-change-language--menu .qrt-leng:last-child {
    margin-bottom: 0;
  }
  .qrt-app .qrt-top-bar .qrt-menu .qrt-change-language--menu .qrt-leng.qrt-active {
    background-color: #1f4d2e;
    color: #fff;
    box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1);
  }
  /* Nav column: air from right panel edge (Quarty had 20px; still felt tight) */
  .qrt-app .qrt-top-bar .qrt-menu {
    padding-right: 28px;
  }
  .qrt-app .qrt-top-bar .qrt-menu .qrt-dynamic-menu {
    width: 100%;
    padding-left: 52px;
    padding-right: 4px;
    box-sizing: border-box;
  }
  .qrt-app .qrt-top-bar .qrt-menu nav ul {
    align-items: flex-end;
  }
  .qrt-app .qrt-top-bar .qrt-menu nav ul > li {
    align-items: flex-end;
  }
}

/* Custom Quarty mouse follower off — reads like an edit/overwrite caret */
.qrt-app .qrt-cursor {
  display: none !important;
}

/* No blinking text caret on click outside real form fields */
.qrt-app,
.qrt-app .scrollbar-content,
.qrt-app .scrollbar-track {
  caret-color: transparent;
}
.qrt-app input,
.qrt-app textarea,
.qrt-app [contenteditable="true"] {
  caret-color: auto;
}

/* Inverse of Quarty `zoom` (scale 1 → 1.1 → 1) so overlay children stay optically still */
@-webkit-keyframes pso-zoom-counter {
  0% { -webkit-transform: scale(1); transform: scale(1); }
  50% { -webkit-transform: scale(0.90909); transform: scale(0.90909); }
  100% { -webkit-transform: scale(1); transform: scale(1); }
}
@keyframes pso-zoom-counter {
  0% { transform: scale(1); }
  50% { transform: scale(0.90909); }
  100% { transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .qrt-half-banner.qrt-animated-zoom .qrt-image-frame,
  .qrt-half-banner.qrt-animated-zoom .qrt-overlay,
  .qrt-half-banner.qrt-animated-zoom .qrt-overlay > * {
    -webkit-animation: none !important;
            animation: none !important;
  }
}

/* --- Nav Hub Overlay (slide-down) --- */
html.pso-nav-hub-open,
html.pso-nav-hub-open body {
  overflow: hidden;
}

.pso-nav-hub {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  z-index: 40;
  pointer-events: none;
}

.pso-nav-hub:not([hidden]) {
  pointer-events: auto;
}

/* Below top bar so main nav stays clickable while hub is open (switch sections). */
.pso-nav-hub__backdrop {
  position: fixed;
  left: 0;
  right: 0;
  top: 80px;
  bottom: 0;
  background: rgba(17, 28, 20, 0.35);
  z-index: 0;
}

/* Keep brand / nav / shop above the dimmed backdrop (do not override existing position). */
html.pso-nav-hub-open .qrt-app .qrt-top-bar .qrt-menu,
html.pso-nav-hub-open .qrt-app .qrt-top-bar .qrt-buttons,
html.pso-nav-hub-open .qrt-app .qrt-top-bar .pso-font-size {
  z-index: 70;
}
html.pso-nav-hub-open .qrt-app .qrt-top-bar .qrt-buttons,
html.pso-nav-hub-open .qrt-app .qrt-top-bar .pso-font-size {
  position: relative;
}

.pso-nav-hub__frame {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  max-width: 920px;
  max-height: min(78vh, 720px);
  overflow: auto;
  background: #f7f9f7;
  border: 1px solid #d5ddd6;
  border-top: 0;
  box-shadow: 0 12px 32px rgba(17, 28, 20, 0.18);
  padding: 20px 22px 24px;
  box-sizing: border-box;
}

.pso-nav-hub__close {
  position: absolute;
  top: 10px;
  right: 12px;
  appearance: none;
  border: 0;
  background: transparent;
  color: #1f4d2e;
  font-size: 28px;
  line-height: 1;
  width: 40px;
  height: 40px;
  cursor: pointer;
  z-index: 2;
}

[dir="rtl"] .pso-nav-hub__close {
  right: auto;
  left: 12px;
}

.pso-nav-hub__panel[hidden] {
  display: none !important;
}

.pso-nav-hub__featured {
  display: grid;
  gap: 10px;
  margin: 0 36px 18px 0;
}

[dir="rtl"] .pso-nav-hub__featured {
  margin: 0 0 18px 36px;
}

.pso-nav-hub__featured-link {
  display: flex;
  flex-direction: column;
  gap: 6px;
  text-decoration: none;
  color: inherit;
  padding: 14px 16px;
  border-radius: 8px;
  border: 1px solid #d5ddd6;
  background: #fff;
}

.pso-nav-hub__featured-link:hover,
.pso-nav-hub__featured-link:focus {
  border-color: #1f4d2e;
}

.pso-nav-hub__featured-title {
  font-size: 1.35rem;
  font-weight: 700;
  color: #1f4d2e;
  line-height: 1.25;
}

.pso-nav-hub__featured-text {
  font-size: 0.95rem;
  line-height: 1.45;
  color: #3a4a3e;
}

.pso-nav-hub__featured-cta {
  margin-top: 4px;
  font-size: 0.85rem;
  font-weight: 700;
  color: #1f4d2e;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.pso-nav-hub__heading {
  margin: 8px 0 10px;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #1f4d2e;
}

.pso-nav-hub__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
}

.pso-nav-hub__chip {
  appearance: none;
  border: 1px solid #b8c4ba;
  background: #fff;
  color: #1f4d2e;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
}

.pso-nav-hub__chip:hover,
.pso-nav-hub__chip:focus {
  border-color: #1f4d2e;
}

.pso-nav-hub__chip.is-active {
  background: #1f4d2e;
  border-color: #1f4d2e;
  color: #fff;
}

.pso-nav-hub__index {
  margin: 0 0 12px;
  padding: 0;
  list-style: none;
  border-top: 1px solid #d5ddd6;
}

.pso-nav-hub__item {
  padding: 10px 0;
  border-bottom: 1px solid #e4ebe5;
}

.pso-nav-hub__item.is-hidden {
  display: none;
}

.pso-nav-hub__item a {
  color: #1f4d2e;
  text-decoration: none;
  font-weight: 600;
  font-size: 1.05rem;
  line-height: 1.35;
}

.pso-nav-hub__item a:hover,
.pso-nav-hub__item a:focus {
  text-decoration: underline;
}

.pso-nav-hub__empty {
  margin: 0 0 12px;
  color: #5a6b5e;
  font-size: 0.95rem;
}

.pso-nav-hub__empty[hidden] {
  display: none !important;
}

.pso-nav-hub__more {
  display: inline-block;
  margin-top: 4px;
  font-weight: 700;
  color: #1f4d2e;
  text-decoration: none;
}

.pso-nav-hub__more:hover,
.pso-nav-hub__more:focus {
  text-decoration: underline;
}

/*
  Nav hub positions against .qrt-top-bar.
  Do NOT set position:relative here — Quarty needs position:absolute
  so the top bar overlays the frame instead of becoming a flex column
  that pushes .qrt-dynamic-content sideways.
*/

@media (max-width: 768px) {
  .pso-nav-hub {
    position: fixed;
    left: 0;
    right: 0;
    top: 80px;
    bottom: 0;
    z-index: 60;
  }

  .pso-nav-hub__frame {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    max-width: none;
    max-height: none;
    border: 0;
    border-radius: 0;
    padding: 20px 18px 28px;
    box-shadow: none;
  }

  .pso-nav-hub__close {
    top: 12px;
    right: 10px;
  }

  .pso-nav-hub__featured {
    margin-right: 0;
  }

  [dir="rtl"] .pso-nav-hub__featured {
    margin-left: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pso-nav-hub__frame {
    scroll-behavior: auto;
  }
}