/* About: real pack examples explain identity; all photographs keep their source. */
.fit-about__hero:has(.fit-about-examples) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; padding: 44px 44px 72px; }
.fit-about-examples { min-width: 0; }
.fit-about-examples > h2 { margin: 0 0 8px; color: var(--fit-surface); font-size: var(--fit-text-lg); line-height: 1.3; }
.fit-about-examples > p { margin: 0 0 18px; color: var(--fit-paper); font-size: var(--fit-text-sm); line-height: 1.6; }
.fit-about-examples__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; }
.fit-about-examples figure { margin: 0; min-width: 0; }
.fit-about-examples button { display: block; width: 100%; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: var(--fit-surface); font: inherit; text-align: left; cursor: pointer; }
.fit-about-examples button:disabled { opacity: 1; cursor: default; }
.fit-about-examples__photo { display: grid; place-items: center; height: 138px; background: var(--fit-surface); border-radius: var(--fit-radius-sm); overflow: hidden; }
.fit-about-examples__photo :is(picture,img) { display: block; width: 100%; height: 124px; object-fit: contain; }
.fit-about-examples__photo img { transition: transform 180ms ease; }
.fit-about-examples button:hover img { transform: scale(1.06); }
.fit-about-examples button[aria-pressed="true"] .fit-about-examples__photo { outline: 3px solid var(--fit-cta-surface); outline-offset: 3px; }
.fit-about-examples button:focus-visible { outline: 3px solid var(--fit-cta-surface); outline-offset: 6px; }
.fit-about-examples__pack { display: block; margin-top: 10px; font-size: var(--fit-text-base); font-weight: 700; }
.fit-about-examples__name { display: block; margin-top: 4px; font-size: var(--fit-text-sm); line-height: 1.4; overflow-wrap: anywhere; }
.fit-about-examples .fit-image-attribution { margin-top: 4px; color: var(--fit-paper); font-size: var(--fit-text-sm); line-height: 1.4; }
.fit-about-examples__notes { min-height: 100px; margin-top: 20px; }
.fit-about-examples__notes p { margin: 0 0 6px; font-size: var(--fit-text-sm); line-height: 1.5; color: var(--fit-paper); }
.fit-about-examples__notes a { display: inline-flex; align-items: center; min-height: 44px; color: var(--fit-cta-surface); text-underline-offset: 3px; }
.fit-about__why:has(#fit-about-responsibility-title) > div:last-child { max-width: 56ch; font-size: var(--fit-text-base); line-height: 1.75; }
.fit-about__rules { margin: 0; }
.fit-about__rules > div { display: grid; grid-template-columns: minmax(150px, .45fr) minmax(0, 1fr); gap: 12px 32px; margin-bottom: 28px; }
.fit-about__rules dt { font-size: var(--fit-text-md); font-weight: 700; }
.fit-about__rules dd { margin: 0; max-width: 62ch; color: var(--fit-color-text-muted); font-size: var(--fit-text-base); line-height: 1.65; }
.fit-about__quote { border: 0; background: transparent; }
.fit-about__live-dot { box-shadow: none; }
@media (max-width: 900px) { .fit-about__hero:has(.fit-about-examples) { grid-template-columns: minmax(0, 1fr); gap: 32px; padding: 36px 24px 64px; } }
@media (max-width: 600px) {
  .fit-about__hero:has(.fit-about-examples) { gap: 24px; padding: 28px 20px 56px; }
  .fit-about__lead { margin-top: 16px; font-size: var(--fit-text-md); line-height: 1.5; }
  .fit-about__actions { flex-direction: row; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
  .fit-about__button { width: auto; min-width: 0; padding: 10px 12px; font-size: var(--fit-text-sm); }
  .fit-about-examples__grid { gap: 14px; }
  .fit-about-examples__photo { height: 100px; }
  .fit-about-examples__photo :is(picture,img) { height: 90px; }
  .fit-about-examples__name { display: none; }
  .fit-about-examples__pack { margin-top: 8px; }
  .fit-about-examples__notes { min-height: 0; margin-top: 14px; }
  .fit-about__rules > div { grid-template-columns: minmax(0, 1fr); gap: 8px; }
}
@media (prefers-reduced-motion: reduce) { .fit-about-examples__photo img { transition: none; } }