/* Local Kahlo pilot: contextual photography uses the site's responsive image pattern. */
/* Use the shared Picasso/Canvas title layout: heading left and breadcrumb
   right on desktop, centred and stacked below 768px. Long titles retain
   that alignment rather than triggering a separate Kahlo layout. */

#content .postcontent [id] {
  scroll-margin-top: 10rem;
}

#content .postcontent .kahlo-context-image img {
  max-width: 100%;
  height: auto;
}

#content .postcontent .kahlo-context-splash,
#content .postcontent .kahlo-context-lead {
  display: block;
  float: none;
  clear: both;
  width: 100%;
  max-width: 746px;
  margin: 0 0 1.8rem;
  padding: 0;
}

#content .postcontent .kahlo-context-splash img,
#content .postcontent .kahlo-context-lead img {
  display: block;
  width: 100%;
  max-width: 746px;
  height: auto;
}

#content .postcontent .kahlo-context-portrait img {
  width: auto;
  max-width: 100%;
  max-height: 640px;
  margin: 0 auto;
}

#content .postcontent .kahlo-context-splash figcaption,
#content .postcontent .kahlo-context-lead figcaption {
  margin-top: .55rem;
  color: #555;
  font-size: .88rem;
  line-height: 1.5;
}

#content .postcontent .kahlo-context-lead {
  margin-top: 1.2rem;
}

/* Sitewide flush fact list, with Picasso's responsive label/value alignment. */
#content .postcontent .kahlo-glance {
  margin: 0 0 30px;
}

#content .postcontent .kahlo-glance-row {
  display: grid !important;
  grid-template-columns: minmax(135px, 185px) minmax(0, 1fr);
  gap: .75rem;
  align-items: start !important;
  justify-content: initial !important;
  padding-top: .75rem;
  padding-bottom: .75rem;
  margin: 0;
  line-height: 1.5;
}

#content .postcontent .kahlo-glance-label {
  display: block;
  font-weight: 400;
}

#content .postcontent .kahlo-glance-value {
  display: block;
  min-width: 0;
  overflow-wrap: break-word;
}

#content .postcontent .kahlo-glance-row--long .kahlo-glance-value {
  max-width: 70ch;
}

@media (max-width: 575px) {
  #content .postcontent .kahlo-glance-row {
    grid-template-columns: minmax(0, 1fr);
    gap: .15rem;
  }

}

#content .postcontent .kahlo-related-paintings {clear:both;margin:2.75rem 0 2.25rem;padding:1.6rem;border:1px solid #e7e1da;background:#fbf9f6}
#content .postcontent .kahlo-related-heading {max-width:42rem;margin-bottom:1.2rem}
#content .postcontent .kahlo-related-eyebrow {margin:0 0 .4rem;color:#287486;font-size:.76rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
#content .postcontent .kahlo-related-heading h2 {margin:0 0 .45rem;font-size:clamp(1.4rem,2.4vw,1.9rem);line-height:1.2}
#content .postcontent .kahlo-related-heading>p:last-child {margin:0;color:#5d5751;line-height:1.5}
#content .postcontent .kahlo-related-list {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;list-style:none;margin:0;padding:0}
#content .postcontent .kahlo-related-list li {min-width:0;margin:0}
#content .postcontent .kahlo-related-list a {display:flex;gap:.85rem;height:100%;padding:.9rem 1rem;border:1px solid #e5ded5;background:#fff;color:#282725;text-decoration:none;transition:border-color .15s,background-color .15s}
#content .postcontent .kahlo-related-list a:hover,#content .postcontent .kahlo-related-list a:focus-visible {border-color:#287486;background:#eaf4f5;text-decoration:none}
#content .postcontent .kahlo-related-number {flex:none;padding-top:.1rem;color:#287486;font-size:.85rem;font-weight:700;font-variant-numeric:tabular-nums}
#content .postcontent .kahlo-related-copy {display:flex;flex-direction:column;gap:.3rem;min-width:0}
#content .postcontent .kahlo-related-copy strong {font-size:1rem;line-height:1.3}
#content .postcontent .kahlo-related-copy>span {color:#665f59;font-size:.8rem}
#content .postcontent .kahlo-related-all {margin:1.1rem 0 0}
#content .postcontent .kahlo-directory-qualification {display:block;margin-top:.35rem;color:#665f59;font-size:.85rem;line-height:1.45}
#kahlo-artworks-directory .thoa-directory-table {min-width:0;table-layout:fixed}
#kahlo-artworks-directory .thoa-directory-table th:first-child {width:60%}
#kahlo-artworks-directory .thoa-directory-table td {overflow-wrap:break-word}
#kahlo-artworks-directory .thoa-medium-pill {white-space:normal;line-height:1.4}
#content .postcontent [data-kahlo-faq] .accordion-header:focus-visible {outline:2px solid #287486;outline-offset:3px}
@media(max-width:575px) {#content .postcontent .kahlo-related-paintings {padding:1rem}#content .postcontent .kahlo-related-list {grid-template-columns:1fr}}

#page-menu .page-menu-title a,
#page-menu .page-menu-title a:hover,
#page-menu .page-menu-title a:focus {
  color: #fff;
}

#page-menu .page-menu-item > a .icon-angle-down {display:none}
#page-menu .kahlo-subnav-toggle {
  display:block;position:absolute;top:0;right:0;z-index:2;
  width:2.75rem;height:2.75rem;border:0;
  color:#fff;background:transparent;font:inherit;font-size:14px;line-height:22px;cursor:pointer;
}
#page-menu .kahlo-subnav-heading {
  position:relative;width:100%;height:auto;text-align:left;padding:11px 14px;
  display:flex;align-items:center;justify-content:space-between;gap:8px;
}
#page-menu .page-menu-container > [data-kahlo-nav-group] > a {padding-right:3.25rem}
#page-menu .page-menu-item.current > .kahlo-subnav-heading,
#page-menu .kahlo-subnav-toggle:hover {background-color:rgba(0,0,0,.15)}
#page-menu .page-menu-item > .page-menu-sub-menu,
#page-menu .page-menu-item:hover > .page-menu-sub-menu {display:none}
#page-menu .page-menu-item.kahlo-submenu-open > .page-menu-sub-menu {display:block}
#page-menu .page-menu-sub-menu a {white-space:normal;overflow-wrap:break-word}
#page-menu-trigger:focus-visible,
#page-menu .kahlo-subnav-toggle:focus-visible,
#page-menu .page-menu-item > a:focus-visible {outline:2px solid #fff;outline-offset:-3px}
@media (min-width:992px) {
  #page-menu .kahlo-subnav-toggle {top:8px;right:4px;width:28px;height:30px;border-radius:14px}
  #page-menu .kahlo-subnav-heading {position:relative;top:0;right:0;width:auto;height:auto;margin:10px 4px;padding:3px 14px;border-radius:14px}
  #page-menu .page-menu-container > [data-kahlo-nav-group] > a {padding-right:34px}
  #page-menu .page-menu-sub-menu {width:330px;max-width:calc(100vw - 24px)}
  #page-menu [data-kahlo-nav-group="art-themes"] > .page-menu-sub-menu,
  #page-menu [data-kahlo-nav-group="places"] > .page-menu-sub-menu {right:0;left:auto}
}
@media (max-width:991px) {
  #page-menu .page-menu-nav {width:min(360px,calc(100vw - 24px));max-height:var(--kahlo-nav-height,calc(100dvh - 64px));overflow-y:auto;overscroll-behavior:contain}
}

#content .postcontent .kahlo-video-section,
#content .postcontent #book-recommendations {
  clear: both;
  margin: 2.2rem 0 2.8rem;
}

/* Copyright-safe homepage adaptation: essential works remain text-led. */
#content .postcontent .kahlo-text-essential .thoa-essential-work {
  display: block;
  min-height: 0;
  padding: 16px 18px;
}

#content .postcontent .kahlo-text-essential .thoa-essential-work-copy h3 {
  margin-bottom: 5px;
}

#content .postcontent .kahlo-text-essential .thoa-essential-work-copy p {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
}

/* Text-only directory: no artwork thumbnails or image derivatives. */
#content .postcontent .kahlo-work-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  list-style: none;
  padding: 0;
  margin: 20px 0 32px;
}
#content .postcontent .kahlo-work-grid-entry {
  border: 1px solid #dde3e8;
  border-radius: 4px;
  background: #f8fafb;
  padding: 12px 14px;
  line-height: 1.5;
  min-width: 0;
  overflow-wrap: anywhere;
  margin: 0;
}
#content .postcontent .kahlo-work-grid-entry > a {
  display: block;
  font-weight: 600;
}
#content .postcontent .kahlo-work-grid-entry > a:focus-visible {
  outline: 2px solid #337ab7;
  outline-offset: 3px;
}
@media (max-width: 991px) {
  #content .postcontent .kahlo-work-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
  #content .postcontent .kahlo-work-grid { grid-template-columns: 1fr; }
}