/* STRENG Mosaïque — strict 3:4 geometry, zero gutters. */
.dsm-gallery {
  --dsm-ink: #101010;
  --dsm-muted: #6d6d6d;
  --dsm-line: #dbdbdb;
  --dsm-paper: #fff;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color: var(--dsm-ink);
  background: var(--dsm-paper);
  display: grid;
  grid-template-columns: minmax(225px, 26%) minmax(0, 1fr);
  gap: clamp(28px, 3.4vw, 70px);
  width: 100%;
  margin: 0 auto;
  min-height: 400px;
  text-align: left;
  box-sizing: border-box;
  isolation: isolate;
}
.dsm-gallery *, .dsm-gallery *::before, .dsm-gallery *::after {box-sizing: border-box;}
.dsm-gallery button, .dsm-gallery input, .dsm-gallery select {font: inherit;}
.dsm-gallery button {cursor: pointer;}
.dsm-gallery button:focus-visible, .dsm-gallery select:focus-visible, .dsm-gallery input:focus-visible {outline: 2px solid var(--dsm-ink); outline-offset: 3px;}
.dsm-gallery--wide {width: min(1690px, calc(100vw - clamp(24px, 3vw, 70px))); max-width: none; position: relative; left: 50%; transform: translateX(-50%); margin-left: 0; margin-right: 0;}
.dsm-sidebar {min-width: 0; display: flex; flex-direction: column; align-items: stretch; position: relative; padding-top: 5px;}
.dsm-brand {display: flex; flex-direction: column; padding-bottom: 40px; border-bottom: 2px solid var(--dsm-ink);}
.dsm-brand__name {font-size: clamp(42px, 4.8vw, 82px); font-weight: 900; letter-spacing: -.09em; line-height: .91; transform-origin: left center; white-space: nowrap;}
.dsm-brand__period {color: var(--dsm-muted);}
.dsm-brand__caption {font-size: 10px; letter-spacing: .15em; font-weight: 750; padding-top: 11px; line-height: 1.4;}
.dsm-heading {padding: clamp(32px, 4vw, 66px) 0 32px;}
.dsm-heading h2 {margin: 0; font-size: clamp(34px, 3.15vw, 56px); line-height: .97; font-weight: 850; letter-spacing: -.07em; hyphens: auto;}
.dsm-heading p {font-size: 13px; line-height: 1.4; margin: 14px 0 0; color: var(--dsm-muted);}
.dsm-filters {display: flex; flex-direction: column; gap: 21px; margin: 0;}
.dsm-field {display: flex; flex-direction: column; min-width: 0; gap: 7px;}
.dsm-field > span, .dsm-color-field legend {font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase;}
.dsm-field input, .dsm-field select {border: 0; border-bottom: 1px solid var(--dsm-line); border-radius: 0; background: transparent; width: 100%; color: var(--dsm-ink); min-height: 39px; padding: 6px 22px 8px 0; line-height: 1.4; font-size: 13px; outline-offset: 2px; appearance: auto; box-shadow: none;}
.dsm-field input::placeholder {color: #999;}
.dsm-field input:focus, .dsm-field select:focus {border-bottom-color: #111; box-shadow: none;}
.dsm-date-range {border-bottom: 1px solid var(--dsm-line); padding: 0 0 9px;}
.dsm-date-range summary {cursor: pointer; list-style: none; font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; display: flex; justify-content: space-between; align-items: center; padding: 8px 0;}
.dsm-date-range summary::-webkit-details-marker {display: none;}
.dsm-date-range[open] summary span {transform: rotate(45deg);}
.dsm-dates {display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 9px 0;}
.dsm-dates .dsm-field input {padding-right: 0; min-width: 0; font-size: 11px;}
.dsm-color-field {border: 0; padding: 0; margin: 0; min-width: 0;}
.dsm-color-field legend {padding: 0; margin-bottom: 12px;}
.dsm-colors {display: flex; gap: 9px; flex-wrap: wrap;}
.dsm-color {height: 23px; width: 23px; border: 1px solid rgba(0,0,0,.2); padding: 0; border-radius: 50%; background: #ddd; position: relative; box-shadow: none;}
.dsm-color--all {background: white; width: auto; min-width: 36px; border-radius: 0; height: 24px; font-size: 9px !important; font-weight: 800 !important; letter-spacing: .04em;}
.dsm-color[data-color='noir'] {background: #151515;}
.dsm-color[data-color='blanc'] {background: #f9f9f9;}
.dsm-color[data-color='gris'] {background: #939393;}
.dsm-color[data-color='rouge'] {background: #c62732;}
.dsm-color[data-color='orange'] {background: #e77119;}
.dsm-color[data-color='jaune'] {background: #f1c926;}
.dsm-color[data-color='vert'] {background: #3e8c55;}
.dsm-color[data-color='cyan'] {background: #35b9c1;}
.dsm-color[data-color='bleu'] {background: #245fa8;}
.dsm-color[data-color='violet'] {background: #6a4caa;}
.dsm-color[data-color='rose'] {background: #dd6196;}
.dsm-color[aria-pressed='true']::after {content: ''; position: absolute; border: 1.5px solid #111; inset: -4px; border-radius: inherit;}
.dsm-clear {padding: 13px 0; width: 100%; border: 0; border-top: 1px solid var(--dsm-line); border-bottom: 1px solid var(--dsm-line); display: flex; justify-content: space-between; align-items: center; background: transparent; text-align: left; font-size: 10px !important; font-weight: 800 !important; letter-spacing: .075em;}
.dsm-clear span {font-size: 16px;}
.dsm-clear:hover {color: #777;}
.dsm-sidebar__end {font-size: 10px; color: var(--dsm-muted); letter-spacing: .065em; margin-top: auto; padding-top: 58px;}
.dsm-mobile-toggle {display: none;}
.dsm-content {width: 100%; min-width: 0; scroll-margin-top: 14px;}
.dsm-toolbar {display: flex; justify-content: space-between; align-items: center; gap: 14px; min-height: 44px; border-bottom: 2px solid var(--dsm-ink); padding: 0 0 10px;}
.dsm-overline {font-size: 10px; letter-spacing: .09em; font-weight: 800; white-space: nowrap;}
.dsm-slash {color: #a4a4a4; padding: 0 3px;}
.dsm-toolbar__actions {display: flex; gap: 18px; align-items: center;}
.dsm-count {font-size: 11px; color: #626262; white-space: nowrap; font-variant-numeric: tabular-nums;}
.dsm-shuffle {background: transparent; color: #121212; border: 1px solid #d7d7d7; height: 29px; width: 29px; font-size: 19px !important; line-height: 1; padding: 0; display: grid; place-items: center; border-radius: 0;}
.dsm-shuffle:hover {background: #101010; color: white;}
.dsm-canvas {display: grid; grid-template-columns: repeat(var(--dsm-columns, 6), minmax(0,1fr)); grid-auto-rows: var(--dsm-row, 110px); gap: 0 !important; width: 100%; position: relative; background: #e4e4e4; align-content: start; min-width: 0; overflow: hidden;}
.dsm-canvas--loading {opacity: .42; transition: opacity .13s ease;}
.dsm-tile {min-width: 0; min-height: 0; display: block; position: relative; padding: 0 !important; margin: 0 !important; border: 0 !important; border-radius: 0 !important; background: var(--dsm-paper, #ddd); overflow: hidden; width: 100%; height: 100%; appearance: none; aspect-ratio: 1749 / 2481; text-align: left; isolation: isolate; box-shadow: none !important; animation: dsm-reveal .45s both ease; animation-delay: var(--dsm-delay,0ms);}
.dsm-tile::before {content: ''; position: absolute; inset: 0; background: #000; opacity: 0; z-index: 1; transition: opacity .24s ease;}
.dsm-tile img {position: absolute; display: block; width: 100%; height: 100%; object-fit: fill; object-position: center center; inset: 0; max-width: none; max-height: none; border: 0; border-radius: 0; padding: 0; margin: 0; filter: none; transform: none; transition: filter .25s ease;}
.dsm-tile__caption {position: absolute; inset: auto 0 0; color: white; z-index: 2; padding: clamp(12px, 1.5vw, 23px); display: flex; flex-direction: column; gap: 4px; opacity: 0; transform: translateY(8px); transition: opacity .23s, transform .25s; pointer-events: none;}
.dsm-tile__title {font-size: clamp(12px, 1.4vw, 21px); line-height: 1.08; letter-spacing: -.025em; font-weight: 800; overflow-wrap: anywhere;}
.dsm-tile__meta {font-size: 10px; font-weight: 600; line-height: 1.3;}
/* Artwork is never enlarged past its frame: even on hover all edges remain visible. */
.dsm-tile:hover img, .dsm-tile:focus-visible img {transform: none;}
.dsm-tile:hover::before, .dsm-tile:focus-visible::before {opacity: .48;}
.dsm-tile:hover .dsm-tile__caption, .dsm-tile:focus-visible .dsm-tile__caption {opacity: 1; transform: translateY(0);}
.dsm-feedback {margin: 0; color: #565656; font-size: 13px; line-height: 1.5;}
.dsm-feedback:not(:empty) {padding: 25px 0;}
.dsm-pager {display: flex; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--dsm-line); padding-top: 18px; margin-top: 0; min-height: 62px;}
.dsm-pager button {display: flex; align-items: center; gap: 10px; border: 0; border-radius: 0; background: transparent; color: #101010; padding: 12px 0; letter-spacing: .08em; font-size: 11px !important; font-weight: 800 !important;}
.dsm-pager button span {font-size: 19px; line-height: .5; font-weight: 400;}
.dsm-pager button:not(:disabled):hover {text-decoration: underline; text-underline-offset: 5px;}
.dsm-pager button:disabled {color: #aaa; cursor: default;}
.dsm-range {font-size: 11px; color: #666; font-variant-numeric: tabular-nums; white-space: nowrap;}
.dsm-lightbox {position: fixed; inset: 0; z-index: 100000; background: rgba(10,10,10,.97); display: none; align-items: center; justify-content: space-between; color: #fff; padding: 30px clamp(20px,4vw,80px);}
.dsm-lightbox--open {display: flex; animation: dsm-overlay-in .21s ease-out both;}
.dsm-lightbox button {flex: 0 0 auto; display: grid; place-items: center; color: #fff; background: transparent; border: 0; line-height: 1; padding: 8px;}
.dsm-lightbox__close {position: absolute; top: 13px; right: 23px; font-size: 36px !important; font-weight: 200 !important; z-index: 3;}
.dsm-lightbox__prev, .dsm-lightbox__next {font-size: 32px !important; z-index: 2;}
.dsm-lightbox button:disabled {opacity: .2; cursor: default;}
.dsm-lightbox__figure {display: flex; flex: 1 1 auto; margin: 0 auto; align-items: center; justify-content: center; flex-direction: column; min-width: 0; max-height: 100%; padding: 4px 16px; gap: 15px;}
.dsm-lightbox__figure img {display: block; width: auto; height: auto; max-width: min(100%, 1200px); max-height: calc(100dvh - 132px); object-fit: contain; border: 0; box-shadow: 0 8px 40px #0006;}
.dsm-lightbox__figure figcaption {width: min(100%, 900px); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 20px; align-items: baseline; line-height: 1.5;}
.dsm-lightbox__title {font-size: 15px; font-weight: 700;}
.dsm-lightbox__meta {font-size: 11px; color: #b3b3b3;}
@keyframes dsm-overlay-in {from {opacity: 0;} to {opacity: 1;}}
@keyframes dsm-reveal {from {opacity: .55; filter: brightness(.85);} to {opacity: 1; filter: brightness(1);}}
@media(max-width: 1000px) {
  .dsm-gallery {grid-template-columns: minmax(180px, 26%) minmax(0,1fr); gap: 24px;}
  .dsm-brand__name {font-size: clamp(42px, 5vw, 64px);}
  .dsm-heading h2 {font-size: clamp(30px, 3.5vw, 44px);}
}
@media(max-width: 740px) {
  .dsm-gallery {display: flex; flex-direction: column; gap: 17px;}
  .dsm-brand {padding-bottom: 16px; flex-direction: row; justify-content: space-between; align-items: end; gap: 12px;}
  .dsm-brand__name {font-size: 52px;}
  .dsm-brand__caption {font-size: 8px; text-align: right; max-width: 110px; padding: 0;}
  .dsm-heading {padding: 20px 0 14px;}
  .dsm-heading h2 {font-size: 40px;}
  .dsm-heading p {margin-top: 7px;}
  .dsm-mobile-toggle {display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 14px 0; background: #fff; border: 0; border-top: 1px solid #ddd; font-size: 11px !important; font-weight: 800 !important; letter-spacing: .08em;}
  .dsm-mobile-toggle span {font-size: 18px;}
  .dsm-filters {display: none; gap: 16px; padding-bottom: 14px;}
  .dsm-filters--expanded {display: flex;}
  .dsm-sidebar__end {display: none;}
  .dsm-toolbar {min-height: 42px;}
  .dsm-tile__caption {padding: 9px;}
  .dsm-tile__title {font-size: 12px;}
}
@media(max-width: 430px) {
  .dsm-gallery--wide {width: calc(100vw - 20px);}
  .dsm-brand__name {font-size: 46px;}
  .dsm-heading h2 {font-size: 36px;}
  .dsm-lightbox {padding: 40px 5px 25px;}
  .dsm-lightbox__figure {padding: 0 4px;}
  .dsm-lightbox__prev, .dsm-lightbox__next {font-size: 24px !important;}
  .dsm-lightbox__figure img {max-height: calc(100dvh - 160px);}
  .dsm-overline {font-size: 9px;}
  .dsm-toolbar__actions {gap: 10px;}
}
@media(prefers-reduced-motion: reduce) {
  .dsm-gallery *, .dsm-gallery *::before, .dsm-gallery *::after {animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important;}
}
