/* KEENE — Related Editorials 1.0.7
   Scoped color schemes; Forst/Qode still controls page and footer backgrounds.
   Uses Space Grotesk *when supplied locally by WordPress or the theme*.
   No external font or JavaScript requests. */
.keene-re {
  --keene-re-heading-font: "Space Grotesk", "Helvetica Neue", Arial, sans-serif;
  --keene-re-text: #ffffff;
  --keene-re-line: rgba(255,255,255,.38);
  --keene-re-frame-ratio: 5 / 6;
  color: var(--keene-re-text) !important;
  margin-block: clamp(1.5rem, 3.5vw, 3rem);
  font: inherit;
}
.keene-re, .keene-re *, .keene-re *::before, .keene-re *::after { box-sizing: border-box; }
.keene-re a, .keene-re a:visited { color: inherit !important; text-decoration: none; }
.keene-re a:hover, .keene-re a:focus-visible { text-decoration: underline; text-underline-offset: .2em; }
.keene-re .keene-re-head { margin: 0 0 clamp(1.5rem, 2.8vw, 2.5rem); }
.keene-re .keene-re-kicker {
  display: block; margin-bottom: .65rem;
  font-family: var(--keene-re-heading-font) !important; font-size: .65rem !important;
  font-weight: 600 !important; line-height: 1.4 !important;
  letter-spacing: .15em; text-transform: uppercase;
}
.keene-re .keene-re-title {
  color: inherit !important; margin: 0 0 .7rem !important; padding: 0;
  font-family: var(--keene-re-heading-font) !important; font-weight: 400 !important;
  font-size: clamp(2rem, 4.2vw, 3.6rem) !important;
  line-height: 1.04 !important; letter-spacing: -.04em !important;
  text-transform: uppercase;
}
.keene-re .keene-re-intro { margin: 0; max-width: 56rem; line-height: 1.6; opacity: .85; }
.keene-re .keene-re-grid {
  display: grid; grid-template-columns: repeat(var(--keene-re-columns, 2), minmax(0, 1fr));
  column-gap: clamp(18px, 2.4vw, 34px); row-gap: clamp(25px, 3vw, 42px);
  align-items: start;
}
.keene-re .keene-re-card { min-width: 0; border: 0; margin: 0; padding: 0; background: transparent; }
.keene-re .keene-re-image {
  display: block; overflow: hidden; width: 100%; aspect-ratio: var(--keene-re-frame-ratio);
  margin: 0 0 .65rem; line-height: 0;
  border: 1px solid var(--keene-re-line); background: rgba(127,127,127,.08);
}
.keene-re .keene-re-image img {
  display: block; width: 100%; height: 100%; max-width: none;
  object-fit: cover; object-position: center center;
  border: 0; margin: 0; padding: 0; aspect-ratio: auto;
}
.keene-re .keene-re-copy { color: inherit; }
.keene-re .keene-re-meta { margin: 0 0 .5rem; line-height: 1.15; }
.keene-re .keene-re-meta > span {
  display: inline-block; max-width: 100%; padding: .12rem .38rem .1rem;
  border: 1px solid currentColor; border-radius: 999px;
  font-family: var(--keene-re-heading-font) !important;
  font-weight: 500 !important; font-size: clamp(.57rem, .68vw, .67rem) !important;
  line-height: 1.2 !important; letter-spacing: .045em; text-transform: uppercase;
}

/* Brand spelling is case-sensitive even inside the uppercase metadata capsule. */
.keene-re .keene-re-meta .keene-re-brand-keeneonart {
  text-transform: none !important;
  font: inherit !important;
  letter-spacing: inherit !important;
}
.keene-re .keene-re-copy h3 {
  font-family: var(--keene-re-heading-font) !important;
  font-weight: 500 !important; font-size: clamp(.94rem, 1.3vw, 1.16rem) !important;
  line-height: 1.26 !important; letter-spacing: -.017em !important;
  color: inherit !important; margin: 0 !important; padding: 0;
  text-transform: uppercase;
}
.keene-re .keene-re-copy h3 a { font-family: inherit !important; font-weight: inherit !important; font-size: inherit !important; line-height: inherit !important; color: inherit !important; }
.keene-re .keene-re-excerpt { line-height: 1.55; opacity: .82; margin: .5rem 0 .55rem; }
.keene-re .keene-re-read {
  display: inline-block; font-family: var(--keene-re-heading-font) !important;
  font-weight: 600 !important; font-size: .75rem !important;
  line-height: 1.4 !important; letter-spacing: .04em; text-transform: uppercase;
  margin: .45rem 0;
}
.keene-re--expanded { --keene-re-frame-ratio: 2 / 3; }
.keene-re .keene-re-gallery {
  display: flex; justify-content: space-between; gap: 1rem; align-items: center;
  border-top: 1px solid var(--keene-re-line); border-bottom: 1px solid var(--keene-re-line);
  padding: 1rem 0; margin-top: 2rem;
}
.keene-re .keene-re-gallery > span { font-family: var(--keene-re-heading-font) !important; font-size: .73rem !important; font-weight: 600 !important; letter-spacing: .1em; }
.keene-re .keene-re-gallery > a { font-weight: 600; }
.keene-re .keene-re-social { border-top: 1px solid var(--keene-re-line); margin-top: 2rem; padding-top: 1rem; }
.keene-re .keene-re-social h3 { font-family: var(--keene-re-heading-font) !important; font-size: 1rem !important; font-weight: 600 !important; line-height: 1.3 !important; color: inherit !important; margin: .1rem 0 .7rem; }
.keene-re .keene-re-social p { margin: 0 0 .9rem; opacity: .8; }
.keene-re .keene-re-social ul { display: flex; flex-wrap: wrap; gap: .55rem 1.2rem; list-style: none; margin: 0; padding: 0; }
.keene-re .keene-re-social li { margin: 0; padding: 0; }
.keene-re .keene-re-social li a { display: inline-block; padding: .3rem 0; font-size: .85em; }
@media (max-width: 900px) {
  .keene-re .keene-re-cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .keene-re .keene-re-grid { grid-template-columns: minmax(0,1fr); }
  .keene-re .keene-re-gallery { align-items: flex-start; flex-direction: column; }
}

/* v1.0.4: editorial-author filters and progressive automatic index. */
.keene-re [hidden] { display: none !important; }
.keene-re .keene-re-filters {
  display: flex; align-items: center; flex-wrap: wrap;
  gap: .5rem clamp(1rem, 2vw, 2rem);
  border-bottom: 1px solid var(--keene-re-line);
  margin: 0 0 clamp(1.5rem, 2.5vw, 2rem);
  padding: 0 0 .5rem;
}
.keene-re .keene-re-filter {
  display: inline-block; appearance: none; border: none; border-bottom: 2px solid transparent;
  border-radius: 0; background: transparent !important;
  box-shadow: none !important; padding: .4rem 0 .55rem; margin: 0;
  font-family: var(--keene-re-heading-font) !important;
  font-size: clamp(.7rem, .8vw, .83rem) !important;
  font-weight: 600 !important; letter-spacing: .075em;
  line-height: 1.35 !important; text-transform: none !important;
  color: inherit !important; cursor: pointer; opacity: .67;
}
.keene-re .keene-re-filter:hover,
.keene-re .keene-re-filter:focus-visible,
.keene-re .keene-re-filter.is-active { opacity: 1; }
.keene-re .keene-re-filter.is-active { border-bottom-color: currentColor; }
.keene-re .keene-re-filter:focus-visible,
.keene-re .keene-re-more:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.keene-re .keene-re-state { margin: 1.25rem 0; font-size: .9rem; opacity: .78; }
.keene-re .keene-re-more-wrap { text-align: center; margin: clamp(1.5rem, 3vw, 3rem) auto 0; }
.keene-re .keene-re-more {
  appearance: none; background: transparent !important;
  color: inherit !important; border: 1px solid currentColor;
  border-radius: 0; padding: .75rem 1.75rem;
  font-family: var(--keene-re-heading-font) !important;
  font-size: .8rem !important; font-weight: 600 !important;
  line-height: 1.3 !important; letter-spacing: .09em; text-transform: uppercase;
  cursor: pointer;
}
.keene-re .keene-re-more:disabled { cursor: progress; opacity: .45; }
@media (max-width: 600px) {
  .keene-re .keene-re-filters { gap: .2rem 1rem; }
}

/* v1.0.5: Color is owned by the collection, never by the Qode body or footer.
   Defaults to dark/white for the black KEENE editorial presentation.
   Theme-specific selectors sometimes set heading/link colors with !important,
   so every plugin-facing typography surface is explicitly scoped here. */
.keene-re.keene-re--dark {
  --keene-re-text: #ffffff;
  --keene-re-line: rgba(255,255,255,.38);
}
.keene-re.keene-re--light {
  --keene-re-text: #151515;
  --keene-re-line: rgba(0,0,0,.35);
}
.keene-re.keene-re--inherit {
  --keene-re-text: inherit;
  --keene-re-line: rgba(127,127,127,.45);
}
.keene-re:is(.keene-re--dark, .keene-re--light, .keene-re--inherit),
.keene-re:is(.keene-re--dark, .keene-re--light, .keene-re--inherit) :is(
  .keene-re-head, .keene-re-head *,
  .keene-re-filters, .keene-re-filters *,
  .keene-re-copy, .keene-re-copy *,
  .keene-re-gallery, .keene-re-gallery *,
  .keene-re-social, .keene-re-social *,
  .keene-re-state, .keene-re-more, .keene-re-more *
) {
  color: var(--keene-re-text) !important;
}

/* v1.0.7: independent editorial levels and an optional cross-artist introduction.
   Both remain inside the shortcode; nothing targets Qode body, header or footer. */
.keene-re--level-related { margin-block: clamp(1.2rem, 2.4vw, 2rem); }
.keene-re .keene-re-other-artist {
  border-top: 1px solid var(--keene-re-line);
  margin: clamp(2rem, 4vw, 3.5rem) 0 0;
  padding-top: clamp(1.1rem, 2vw, 1.7rem);
  max-width: 48rem;
  color: var(--keene-re-text) !important;
}
.keene-re .keene-re-other-kicker {
  display: block; margin: 0 0 .7rem;
  font-family: var(--keene-re-heading-font) !important;
  font-size: .7rem !important; font-weight: 600 !important;
  line-height: 1.3 !important; letter-spacing: .12em; color: inherit !important;
}
.keene-re .keene-re-other-artist h3 {
  margin: 0 0 .45rem !important; padding: 0; color: inherit !important;
  font-family: var(--keene-re-heading-font) !important;
  font-size: clamp(1.35rem, 2.8vw, 2rem) !important;
  font-weight: 500 !important; line-height: 1.15 !important;
}
.keene-re .keene-re-other-artist p {
  margin: .5rem 0 .8rem; color: inherit !important;
  opacity: .84; line-height: 1.55;
}
.keene-re .keene-re-other-artist a {
  display: inline-block; color: inherit !important;
  font-family: var(--keene-re-heading-font) !important;
  font-size: .78rem !important; font-weight: 600 !important;
  text-transform: none; letter-spacing: .02em;
}
