.wildlife-case {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  margin-bottom: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: #fff;
  box-shadow: var(--shadow-sm);
}
.wildlife-case-preview {
  position: relative;
  display: block;
  min-width: 0;
  padding: 0;
  border: 0;
  background: #0b2d24;
  cursor: zoom-in;
  overflow: hidden;
}
.wildlife-case-preview img {
  display: block;
  width: 100%;
  height: 100%;
  max-height: 680px;
  object-fit: cover;
  object-position: top;
}
.wildlife-preview-hint {
  position: absolute;
  inset: auto 20px 20px;
  display: flex;
  justify-content: space-between;
  padding: 12px 18px;
  border: 1px solid #ffffff40;
  border-radius: 8px;
  color: #fff;
  background: #06271eee;
  font-size: 13px;
}
.wildlife-case-copy { padding: clamp(24px, 3.5vw, 48px); align-self: center; }
.wildlife-case-copy h3 { margin: 0 0 20px; font-size: clamp(28px, 3vw, 42px); line-height: 1.3; }
.wildlife-case-copy h3 em { color: #148266; font-style: normal; }
.wildlife-case-intro { color: var(--muted); font-size: 15px; line-height: 1.9; }
.wildlife-case-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 28px 0; padding: 0; list-style: none; }
.wildlife-case-flow li { border-top: 2px solid #a8d6c7; padding-top: 12px; }
.wildlife-case-flow span { display: block; margin-bottom: 8px; color: #148266; font-size: 10px; letter-spacing: .04em; }
.wildlife-case-flow strong { font-size: 14px; }
.wildlife-case-flow p { margin: 6px 0 0; color: var(--muted); font-size: 12px; }
.wildlife-case-note { margin-bottom: 26px; padding: 18px 20px; border-left: 3px solid #148266; background: #f0f8f4; border-radius: 0 8px 8px 0; }
.wildlife-case-note strong { font-size: 15px; color: #135742; }
.wildlife-case-note p { margin: 6px 0 0; color: var(--muted); font-size: 13px; line-height: 1.8; }
.wildlife-case button:focus-visible { outline: 3px solid #2ba887; outline-offset: -4px; }
.wildlife-case-dialog { width: min(820px, calc(100vw - 32px)); max-height: 90vh; overflow-y: auto; overscroll-behavior: contain; }
.wildlife-dialog-bar { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 16px; background: #092c24; }
.wildlife-dialog-bar p { color: #fff; }
.wildlife-dialog-bar .lightbox-close { position: static; flex-shrink: 0; margin: 8px 12px 8px 0; }
.wildlife-case-dialog > img { display: block; width: 100%; height: auto; max-height: none; }
body:has(.wildlife-case-dialog[open]) { overflow: hidden; }
@media (max-width: 760px) {
  .wildlife-case { grid-template-columns: 1fr; }
  .wildlife-case-preview { height: 430px; }
  .wildlife-case-preview img { height: 100%; }
  .wildlife-case-flow { gap: 8px; }
  .wildlife-case-flow strong { font-size: 13px; }
  .wildlife-dialog-bar p { font-size: 11px; padding: 12px; }
}