/* ImageAccordion — local gallery styling, based on Bencho's flex negotiation.
   Fixed available strip width. Opening an image shrinks its neighbours. */
.image-accordion-section {
  display: grid;
  grid-template-columns: minmax(0, .77fr) minmax(0, 1.23fr);
  align-items: center;
  column-gap: clamp(34px, 5.5vw, 84px);
  border-top: 1px solid var(--border-soft);
  padding-block: clamp(80px, 9vw, 126px);
}
.image-accordion-copy { min-width: 0; }
.image-accordion-copy h2 {
  margin: 0;
  font-size: clamp(44px, 4.5vw, 67px);
  font-weight: 750;
  letter-spacing: -.055em;
  line-height: 1.04;
}
.image-accordion-copy h2 span { color: var(--gold); }
.image-accordion-copy > p:not(.eyebrow, .image-accordion-hint) {
  margin: 24px 0 0;
  max-width: 390px;
  font-size: 16px;
  line-height: 1.7;
  color: var(--text2);
}
.image-accordion-selected {
  display: flex;
  align-items: baseline;
  gap: 15px;
  margin-top: 38px;
}
.image-accordion-selected span {
  color: var(--gold);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .15em;
  font-variant-numeric: tabular-nums;
}
.image-accordion-selected strong {
  color: var(--text);
  font-size: 21px;
  font-weight: 730;
  letter-spacing: -.035em;
}
.image-accordion-hint {
  margin: 14px 0 0;
  color: var(--muted);
  font-size: 12px;
}
.image-accordion-hint span { color: var(--gold); margin-right: 5px; }

/* Fixed total width. Flex-basis:0 keeps image intrinsic widths out of
   the negotiation, min-width:0 prevents any panel from overflowing. */
.image-accordion {
  position: relative;
  display: flex;
  width: 100%;
  height: clamp(330px, 38vw, 438px);
  gap: 9px;
  min-width: 0;
  overflow: hidden;
  border-radius: 9px;
  isolation: isolate;
  touch-action: pan-y;
  -webkit-user-select: none;
  user-select: none;
}
.image-accordion-cell {
  position: relative;
  flex-basis: 0;
  flex-shrink: 1;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: none;
  overflow: hidden;
  border-radius: 9px;
  background: var(--surface2);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.image-accordion-cell::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}
.image-accordion-cell img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
  -webkit-user-drag: none;
}
.image-accordion-cell:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: -3px;
  z-index: 2;
}
@media (max-width: 980px) {
  .image-accordion-section { grid-template-columns: 1fr; gap: 28px; padding-block: 78px; }
  .image-accordion-copy > p:not(.eyebrow,.image-accordion-hint) { max-width: 670px; }
  .image-accordion-selected { margin-top: 22px; }
  .image-accordion { height: clamp(300px, 50vw, 470px); }
}
@media (max-width: 680px) {
  .image-accordion-section { padding-block: 66px; gap: 26px; }
  .image-accordion-copy h2 { font-size: clamp(40px, 11vw, 52px); }
  .image-accordion-copy > p:not(.eyebrow,.image-accordion-hint) { font-size: 14px; margin-top: 18px; }
  .image-accordion { height: 320px; gap: 6px; border-radius: 7px; }
  .image-accordion-cell { border-radius: 6px; }
}