/* Shared catalogue layouts for the preview and DSK Studio. */
.catalogue-cover {
  display:grid;
  grid-template-columns:minmax(0,.87fr) minmax(0,1.13fr);
  margin-block:clamp(20px,4vw,50px) 0;
  color:#20382e;
  border:1px solid #e1dfd5;
  background:#f1eee5;
}
.catalogue-cover-copy {
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  padding:clamp(24px,4.4vw,62px);
}
.catalogue-cover-copy .eyebrow { margin:0 0 16px; }
.catalogue-cover h1 {
  margin:0;
  color:#20382e;
  font-size:clamp(42px,4.85vw,76px);
  line-height:.99;
}
.catalogue-cover-copy > p:not(.eyebrow) { margin:20px 0 0; max-width:36ch; }
.catalogue-cover .btn { margin-top:24px; }
.catalogue-cover-visual { position:relative; display:grid; min-height:360px; margin:0; overflow:hidden; background:#e7e3d7; }
body main .catalogue-cover-visual > img, body.dsk-refined main .catalogue-cover-visual > img[data-media-kind] { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:right center; }
.catalogue-cover-styles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2px; align-items:end; padding:8% 3% 5%; }
.catalogue-cover-styles img { width:100%; height:auto; aspect-ratio:4/5; object-fit:contain; }
.catalogue-cover-visual figcaption {
  position:absolute; right:14px; bottom:14px; padding:6px 10px;
  color:#21382e; background:#f8f6ee; font-size:11px;
}
.catalogue-routes { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; margin-block:14px 12px; border:1px solid #e1dfd5; }
.catalogue-routes > a {
  display:flex; flex-direction:column; justify-content:center; gap:5px;
  min-height:68px; padding:11px 17px; color:#244437;
  border:0; border-inline-end:1px solid #e1dfd5; border-radius:0;
  font-size:14px; font-weight:700; text-decoration:none;
}
.catalogue-routes > a:last-child { border-inline-end:0; }
.catalogue-routes > a:is(:hover,[aria-current="page"]) { color:#fff; background:#234638; }
.catalogue-routes > a::before { content:attr(data-catalogue-step); font-size:10px; letter-spacing:.12em; opacity:.78; }
.catalogue-edits { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; padding-block:clamp(38px,6vw,84px); }
.catalogue-edit { display:grid; align-content:start; min-width:0; border:1px solid #e1dfd5; background:#f4f1ea; }
.catalogue-edit-media { display:block; height:clamp(200px,28vw,400px); background:#eeebe4; }
.catalogue-edit-media img { display:block; width:100%; height:100%; object-fit:contain; }
.catalogue-edit-copy { padding:clamp(18px,3vw,34px); }
.catalogue-edit-copy h2 { margin:0 0 10px; }
.catalogue-edit-copy p { margin:0 0 14px; }
.catalogue-page-content > :where(p,h2,h3) { width:min(90%,1280px); margin-inline:auto; }

.catalogue-breadcrumb { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin-block:22px 12px; font-size:12px; color:#50645a; }
.catalogue-detail.shell {
  display:grid; grid-template-columns:minmax(0,1.13fr) minmax(0,.87fr);
  align-items:start; gap:clamp(24px,5.5vw,84px);
  padding-block:14px clamp(50px,8vw,110px);
}
.catalogue-detail .catalogue-stage { min-width:0; margin:0; }
body main .catalogue-detail .catalogue-stage,
body.dsk-refined main .catalogue-detail .catalogue-stage { background:#ebe9e0; border:1px solid #e1dfd5; }
body main .catalogue-detail .catalogue-stage > img,
body.dsk-refined main .catalogue-detail .catalogue-stage > img[data-media-kind] {
  display:block; width:100%; height:auto; max-width:none; max-height:none;
  aspect-ratio:1/1; margin:0; padding:clamp(16px,3.2vw,52px);
  object-fit:contain; object-position:center; background:transparent;
}
.catalogue-stage figcaption { margin:0; padding:9px 14px; color:#4e6157; background:#f7f5ee; font-size:12px; }
.catalogue-detail .catalogue-views { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.catalogue-detail .catalogue-views button {
  display:flex; align-items:center; justify-content:flex-start; gap:8px;
  min-height:50px; padding:5px 9px; border:1px solid #dadfd7;
  color:#234638; background:#f8f7f2; cursor:pointer; font:inherit; font-size:12px;
}
.catalogue-detail .catalogue-views button[aria-pressed="true"] { border-color:#234638; background:#e9eee8; }
.catalogue-detail .catalogue-views button img { display:block; width:32px; height:36px; object-fit:contain; }
.catalogue-detail .catalogue-spec { padding-block:clamp(8px,2.5vw,32px) 0; }
.catalogue-detail .catalogue-spec h1 { margin:0; color:#20382e; font-size:clamp(36px,3.8vw,60px); line-height:1.02; text-wrap:balance; }
.catalogue-detail .catalogue-spec .eyebrow { margin:0 0 12px; }
.catalogue-detail .style-detail-tags { display:flex; flex-wrap:wrap; gap:7px; margin:18px 0; }
.catalogue-detail .catalogue-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin:22px 0 0; border-top:1px solid #d8ddd4; }
.catalogue-facts div { min-width:0; padding:12px 12px 12px 0; border-bottom:1px solid #d8ddd4; }
.catalogue-facts dt { font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.catalogue-facts dd { margin:4px 0 0; color:#40574d; font-size:14px; }
.catalogue-detail .catalogue-actions { display:flex; flex-wrap:wrap; gap:9px; margin-top:20px; }
.catalogue-detail .catalogue-actions :is(a,button) { text-align:center; }
.catalogue-detail .catalogue-actions .inquiry-add { margin:0; }
@media (max-width:760px) {
  .catalogue-cover, .catalogue-detail.shell, .catalogue-edits { grid-template-columns:minmax(0,1fr); }
  .catalogue-cover { margin-top:18px; }
  .catalogue-cover-visual { min-height:0; aspect-ratio:1.65; }
  .catalogue-cover-styles { padding:3% 8%; }
  .catalogue-routes { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .catalogue-routes > a { min-height:58px; padding:9px 12px; font-size:13px; }
  .catalogue-routes > a:nth-child(2) { border-inline-end:0; }
  .catalogue-routes > a:nth-child(-n+2) { border-block-end:1px solid #e1dfd5; }
  .catalogue-detail .catalogue-actions > * { flex:1 1 155px; }
}