/* Existing lightweight case pattern, scoped to the assembly-page case. */
#interior-door-wall-panel-photos {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--white);
  scroll-margin-top: 112px;
}
#interior-door-wall-panel-photos .case-heading { margin-bottom: 28px; }
#interior-door-wall-panel-photos .case-heading h2 { font-size: clamp(1.8rem, 3vw, 2.65rem); margin-bottom: 14px; }
#interior-door-wall-panel-photos .case-heading p { color: var(--slate); margin: 0; max-width: 65ch; }
#interior-door-wall-panel-photos .case-layout { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(260px, 1fr); gap: 22px 34px; align-items: center; grid-template-areas: "photo context" "thumbs thumbs"; }
#interior-door-wall-panel-photos .case-feature { grid-area: photo; margin: 0; min-width: 0; }
#interior-door-wall-panel-photos .case-stage { aspect-ratio: 4 / 3; background: var(--mist); border-radius: 12px; overflow: hidden; position: relative; }
#interior-door-wall-panel-photos .case-stage img { width: 100%; height: 100%; object-fit: contain; cursor: default; }
#interior-door-wall-panel-photos .case-context { grid-area: context; }
#interior-door-wall-panel-photos .case-context h3 { font: 700 clamp(1.35rem, 2vw, 1.8rem)/1.25 "Trebuchet MS", "Aptos Display", sans-serif; color: var(--navy); margin: 0 0 18px; }
#interior-door-wall-panel-photos .case-context p { color: var(--slate); margin-bottom: 24px; }
#interior-door-wall-panel-photos .case-context .button { width: 100%; text-align: center; }
#interior-door-wall-panel-photos .case-thumbs { grid-area: thumbs; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin-top: 0; }
#interior-door-wall-panel-photos .case-thumb { min-width: 0; padding: 0; border: 0; background: transparent; color: var(--navy); text-align: left; cursor: pointer; border-radius: 8px; }
#interior-door-wall-panel-photos .case-thumb img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; border: 2px solid transparent; border-radius: 8px; padding: 2px; transition: border-color .15s ease; }
#interior-door-wall-panel-photos .case-thumb span { display: block; padding: 8px 3px 0; font-size: .9rem; line-height: 1.4; font-weight: 600; }
#interior-door-wall-panel-photos .case-thumb:hover img { border-color: var(--line); }
#interior-door-wall-panel-photos .case-thumb[aria-pressed="true"] img { border-color: var(--eucalypt); }
#interior-door-wall-panel-photos .case-thumb:focus-visible { outline: 3px solid var(--action); outline-offset: 4px; }
#interior-door-wall-panel-photos .case-thumb:disabled { cursor: default; }
#interior-door-wall-panel-photos .case-status { position: absolute; inset: auto 10px 10px; margin: 0; padding: 8px 12px; background: var(--white); color: var(--navy); border: 1px solid var(--line); border-radius: 6px; font-size: .88rem; }
@media (max-width: 900px) {
  #interior-door-wall-panel-photos { width: 100%; left: auto; transform: none; }
  #interior-door-wall-panel-photos .case-layout { grid-template-columns: 1fr; grid-template-areas: "photo" "thumbs" "context"; gap: 20px; }
  #interior-door-wall-panel-photos .case-context h3 { margin: 0 0 14px; font-size: 1.25rem; }
  #interior-door-wall-panel-photos .case-thumbs { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; gap: 14px; }
  #interior-door-wall-panel-photos .case-context p { margin-bottom: 18px; }
  #interior-door-wall-panel-photos .case-thumb span { font-size: .86rem; line-height: 1.4; }
  #interior-door-wall-panel-photos .case-heading { margin-bottom: 20px; }
}
@media (max-width: 360px) { #interior-door-wall-panel-photos .case-thumbs { gap: 6px; } }
@media (prefers-reduced-motion: reduce) { #interior-door-wall-panel-photos .case-thumb img { transition: none; } }


@media (max-width: 550px) { #interior-door-wall-panel-photos { padding: 20px; } }
