/* 23 Oct 2026: refined, purpose-led poster gallery.
   Each specimen is an illustrative layout study, not a customer commission.
   Responsive type is sized to its poster container, not the viewport. */
.posters-page .poster-showcase--reworked {
  align-items: start;
  gap: clamp(22px, 2.8vw, 42px);
}
.posters-page .poster-showcase--reworked > .poster-showcase__item {
  min-width: 0;
  container-type: inline-size;
}
.posters-page .poster-showcase--reworked .poster-art--refined {
  width: 100%;
  aspect-ratio: 4 / 5;
  min-height: 0;
  padding: clamp(17px, 5.4cqi, 32px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(25, 20, 16, .15);
  box-shadow: 0 4px 0 rgba(41, 30, 23, .07);
}
.posters-page .poster-showcase--reworked .poster-art :is(strong,em) {
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}
.posters-page .poster-showcase--reworked .poster-art :is(p,span) {
  overflow-wrap: normal;
}

/* First study: rooted in place, with a deliberately hand-drawn visual path. */
.posters-page .poster-art--community.poster-art--refined {
  background: #173e2d;
  color: #f5ecd8;
}
.posters-page .poster-art__community-top,
.posters-page .poster-art__community-foot,
.posters-page .poster-art__business-top,
.posters-page .poster-art__business-foot,
.posters-page .poster-art__event-header,
.posters-page .poster-art__event-footer {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  position: relative;
  z-index: 2;
  font: 800 clamp(9px, 2.05cqi, 12px)/1.45 var(--p-body);
  letter-spacing: .09em;
}
.posters-page .poster-art__community-top {
  padding-bottom: 14px;
  border-bottom: 1px solid #87a08a;
}
.posters-page .poster-art__community-heading {
  position: relative;
  z-index: 2;
  margin-top: 8%;
  margin-bottom: auto;
  max-width: 100%;
}
.posters-page .poster-art__community-heading p {
  margin: 0 0 clamp(13px, 3.1cqi, 20px);
  color: #e3c388;
  font: 800 clamp(11px, 2.8cqi, 16px)/1.4 var(--p-body);
  letter-spacing: .16em;
}
.posters-page .poster-art__community-heading strong {
  display: block;
  max-width: 100%;
  color: #fff5e4;
  font: 800 clamp(31px, 8.3cqi, 53px)/1.02 var(--p-display);
  letter-spacing: -.055em;
}
.posters-page .poster-art__community-heading em {
  display: block;
  margin-top: clamp(12px, 3cqi, 21px);
  font: italic 500 clamp(17px, 4.1cqi, 27px)/1.2 Georgia, serif;
  color: #e7c58a;
}
.posters-page .poster-art__landscape {
  flex: none;
  width: calc(100% + clamp(34px, 10.8cqi, 64px));
  height: 37%;
  margin-inline: calc(-1 * clamp(17px, 5.4cqi, 32px));
  margin-bottom: -1px;
  display: block;
  position: absolute;
  bottom: 8%;
  left: 0;
  z-index: 1;
}
.posters-page .poster-art__community-foot {
  margin-top: auto;
  border-top: 1px solid #b8b49a;
  padding-top: 14px;
  color: #e9dcc3;
  font-size: clamp(8px, 1.8cqi, 11px);
}

/* Second study: a practical product-led promotion, not oversized cropped text. */
.posters-page .poster-art--business.poster-art--refined {
  background: #bd4a2b;
  color: #211d1a;
}
.posters-page .poster-art__business-top {
  color: #201a17;
  padding-bottom: 12px;
}
.posters-page .poster-art__business-poster {
  flex: 1;
  min-height: 0;
  margin-block: clamp(8px, 2cqi, 14px);
  padding: clamp(16px, 4.5cqi, 31px);
  background: #f1e5d1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
}
.posters-page .poster-art__business-poster p {
  margin: 0 0 10px;
  font: 800 clamp(9px, 2.2cqi, 13px)/1.35 var(--p-body);
  letter-spacing: .095em;
}
.posters-page .poster-art__business-poster strong {
  flex: none;
  font: 800 clamp(27px, 7.8cqi, 49px)/.99 var(--p-display);
  letter-spacing: -.05em;
}
.posters-page .poster-art__business-poster strong i {
  font-style: normal;
  color: #b44527;
}
.posters-page .poster-art__coffee {
  display: block;
  flex: 1 1 auto;
  align-self: center;
  width: min(100%, 260px);
  max-height: 47%;
  min-height: 105px;
  margin-top: 10px;
}
.posters-page .poster-art__business-foot {
  color: #271d19;
  padding-top: 8px;
  border-top: 1px solid #492e21;
  font-size: clamp(8px, 1.8cqi, 11px);
}

/* Third study: letterpress-like invitation with useful detail placeholders. */
.posters-page .poster-art--event.poster-art--refined {
  background: #eadccb;
  color: #3b2724;
  border: 1px solid #c6b5a0;
}
.posters-page .poster-art__event-header {
  border-bottom: 1px solid #b8a68f;
  padding-bottom: 13px;
  color: #7c4032;
}
.posters-page .poster-art__event-decoration {
  position: absolute;
  top: 12%;
  right: 4%;
  width: 38%;
  z-index: 1;
  opacity: .8;
  transform: rotate(-9deg);
}
.posters-page .poster-art__event-decoration svg {
  width: 100%;
  height: auto;
}
.posters-page .poster-art__event-heading {
  position: relative;
  z-index: 2;
  margin-top: auto;
  margin-bottom: auto;
}
.posters-page .poster-art__event-heading > span {
  display: block;
  margin-bottom: clamp(13px, 3.2cqi, 22px);
  color: #804a39;
  font: 800 clamp(9px, 2.1cqi, 13px)/1.4 var(--p-body);
  letter-spacing: .15em;
}
.posters-page .poster-art__event-heading strong {
  display: block;
  font: 500 clamp(40px, 9.4cqi, 66px)/.99 Georgia, 'Times New Roman', serif;
  letter-spacing: -.035em;
  color: #3e2824;
}
.posters-page .poster-art__event-heading strong em {
  font-style: italic;
  color: #9d452b;
}
.posters-page .poster-art__event-heading > p {
  margin: clamp(17px, 3.7cqi, 25px) 0 0;
  font: 500 clamp(15px, 3.6cqi, 21px)/1.45 Georgia,serif;
}
.posters-page .poster-art__event-details {
  position: relative;
  z-index: 2;
  margin-bottom: clamp(14px, 3.1cqi, 22px);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-block: 1px solid #a78e7a;
}
.posters-page .poster-art__event-details > div {
  padding: clamp(9px, 2.5cqi, 16px) 4px;
  min-width: 0;
}
.posters-page .poster-art__event-details > div + div {
  border-left: 1px solid #a78e7a;
  padding-left: clamp(11px, 3cqi, 20px);
}
.posters-page .poster-art__event-details span {
  display: block;
  margin-bottom: 4px;
  font: 800 clamp(8px, 1.8cqi, 11px)/1.35 var(--p-body);
  color: #814d3f;
  letter-spacing: .14em;
}
.posters-page .poster-art__event-details strong {
  font: 700 clamp(11px, 2.7cqi, 16px)/1.3 var(--p-body);
}
.posters-page .poster-art__event-footer {
  color: #76483b;
  font-size: clamp(8px, 1.75cqi, 10px);
}
.posters-page .poster-showcase--reworked .poster-showcase__description {
  padding: clamp(17px, 3cqi, 24px) 1px 0;
}
.posters-page .poster-showcase--reworked .poster-showcase__description h3 {
  font-size: clamp(1.2rem, 4.6cqi, 1.6rem);
  margin: 10px 0 12px;
}
.posters-page .poster-showcase--reworked .poster-showcase__description p {
  max-width: 43ch;
}
@media (max-width: 490px) {
  .posters-page .poster-showcase--reworked .poster-art--refined {
    max-width: none;
    padding: clamp(19px, 5.4cqi, 28px);
  }
  .posters-page .poster-showcase--reworked .poster-art__community-heading strong {
    font-size: 8.3cqi;
  }
  .posters-page .poster-showcase--reworked .poster-art__business-poster strong {
    font-size: 7.8cqi;
  }
}

/* Keep the middle breakpoint spacious: two studies, not three cramped thumbnails. */
@media (max-width: 1080px) {
  .posters-page .poster-showcase--reworked {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 650px) {
  .posters-page .poster-showcase--reworked {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* The existing page hero also needs container-relative lettering.
   This prevents the large WHO / WHAT / WHEN specimen clipping at narrower widths. */
.posters-page .poster-hero__specimen {
  container-type: inline-size;
}
.posters-page .poster-hero__specimen > strong {
  max-width: 100%;
  font: 800 clamp(2.1rem, 11cqi, 3.6rem)/1.05 var(--p-display);
  letter-spacing: -.06em;
}
.posters-page .poster-hero__specimen > p {
  max-width: calc(100% - 68px);
}
@media (max-width: 500px) {
  .posters-page .poster-hero__specimen > strong {
    font-size: clamp(2.1rem, 12cqi, 3.3rem);
  }
  .posters-page .poster-hero__specimen-index { right: 22px; bottom: 22px; }
}

.posters-page .poster-gallery__next {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px 24px;
  margin-top: clamp(30px, 4vw, 48px);
  padding: 20px 0;
  border-top: 1px solid var(--p-border);
}
.posters-page .poster-gallery__next p {
  margin: 0;
  font: 800 clamp(1.05rem, 1.8vw, 1.32rem)/1.35 var(--p-display);
  color: var(--p-ink);
}
.posters-page .poster-gallery__next a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 9px;
  color: #873418;
  text-decoration: underline;
  text-underline-offset: 5px;
  font: 800 .96rem/1.4 var(--p-body);
}
.posters-page .poster-gallery__next a:focus-visible {
  outline: 3px solid #a93d1c;
  outline-offset: 4px;
}
.posters-page .poster-gallery__disclaimer { border-top: 0; padding-top: 0; margin-top: 2px; }
