.website-showcase{width:100%;min-width:0;overflow:hidden;background:#fff;border:1px solid #d7dfdc;border-radius:8px;color:#0b1d3a;text-align:left;isolation:isolate}
.showcase-chrome{display:flex;align-items:center;gap:10px;min-height:56px;padding:5px 12px;background:#e9ede7;border-bottom:1px solid #d7dfdc;font:500 10px/1.2 Inter,Arial,sans-serif}
.showcase-dots{color:#8fa7a4;letter-spacing:2px;font-size:9px;white-space:nowrap}
.showcase-domain{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
.website-showcase .showcase-toggle{flex-shrink:0;margin:0;padding:8px;min-width:44px;min-height:44px;background:#fff;color:#0b1d3a;border:1px solid #bccbc7;border-radius:4px;font:600 14px/1.2 Inter,Arial,sans-serif;cursor:pointer}
.website-showcase .showcase-toggle[hidden]{display:none}
.website-showcase .showcase-toggle:focus-visible{outline:3px solid #007e78;outline-offset:2px}
.showcase-viewport{position:relative;overflow:hidden;aspect-ratio:16/10;background:#fff}
.website-showcase .showcase-image{display:block;width:100%;height:auto;max-width:none;max-height:none;object-fit:initial;object-position:top;transform:none;transition:none;border-radius:0;vertical-align:top}
.showcase-caption{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;font:500 10px/1.3 Inter,Arial,sans-serif;border-top:1px solid #d7dfdc;background:#f5f2e9;color:#48606a}
.website-showcase-large{box-shadow:0 20px 60px #0b1d3a14}
.website-showcase-large .showcase-viewport{aspect-ratio:16/10;max-height:580px}
.work-card>.website-showcase,.site-proof>.website-showcase{border:0;border-bottom:1px solid #d7dfdc;border-radius:0}
.work-card .work-copy,.site-proof .site-proof-copy{display:block;color:inherit;text-decoration:none}
.work-card:focus-within,.site-proof:focus-within{outline:2px solid #00b2a9;outline-offset:4px}
.card>.website-showcase{margin:0 0 20px}.card>.case-story-link{display:flex;flex:1;flex-direction:column;color:inherit;text-decoration:none}.case-story-link .go{margin-top:auto}
main>.website-showcase-large{margin:32px 0 40px;max-width:1000px}
@media(prefers-reduced-motion:reduce){.website-showcase .showcase-image{transform:none!important}.website-showcase .showcase-toggle{display:none!important}}

/* Use the homepage's taller browser window for every project card. The
   larger case-study hero previews keep their own presentation. The two IDs
   intentionally outrank older template-specific fixed-height rules. */
body #main#main [data-website-showcase]:not(.website-showcase-large) .showcase-viewport {
  height: auto;
  min-height: 0;
  max-height: none;
  flex: 0 0 auto;
  aspect-ratio: 4 / 3;
}
body #main#main [data-website-showcase]:not(.website-showcase-large) .showcase-chrome {
  height: 36px;
  min-height: 36px;
  padding: 5px 12px;
}
body #main#main .ai-evidence-grid {
  gap: 22px;
}
/* Two project cards should not each become another pair of narrow columns. */
body #main#main[data-dn-website-story] .wd-proof .site-proof-grid > .site-proof:not(:only-child) {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
body #main#main[data-dn-website-story] .wd-proof .site-proof-grid > .site-proof:not(:only-child) > .website-showcase {
  height: auto;
  flex: 0 0 auto;
  border-right: 0;
  border-bottom: 1px solid #d7dfdc;
}