#fashion-projects #fashion-collection{grid-column:1/-1;min-width:0}
.collection-intro{max-width:670px;margin-bottom:22px}
.collection-intro h3{font-size:28px;font-weight:400;line-height:1.3;letter-spacing:-.5px;margin-bottom:8px}
.collection-category{font-size:11px;letter-spacing:1px;color:var(--gold);margin-bottom:10px}
.collection-description{font-size:14px;line-height:1.8;color:var(--muted);margin:0}
.collection-gallery{display:grid;grid-template-columns:minmax(0,2.3fr) minmax(0,1fr);gap:36px;align-items:center;width:100%;max-width:var(--gallery-max-width);margin-inline:auto;min-width:0}
.collection-stills{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr);gap:24px;align-items:center;min-width:0}
.collection-left{grid-column:1;grid-row:1/3;display:flex;flex-direction:column;align-items:flex-start;gap:24px;width:92%;min-width:0;justify-self:end}
.collection-photo{display:block;appearance:none;width:100%;min-width:0;padding:0;border:0;border-radius:0;background:transparent;color:inherit;cursor:zoom-in}
.collection-photo img{display:block;width:100%;height:auto;object-fit:contain}
.collection-blue{grid-column:2;grid-row:1/3}
.collection-white,.collection-pink{width:100%;position:static;margin:0;transform:none;align-self:auto}
.collection-white img,.collection-pink img{display:block;width:100%;height:auto}
.collection-motion{min-width:0;align-self:center}
.collection-play{appearance:none;display:block;min-width:0;width:100%;padding:0;border:0;background:transparent;color:var(--gold);cursor:pointer;text-align:left}
.collection-play video{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:contain;background:var(--panel);pointer-events:none}
.collection-play-label{display:flex;align-items:center;justify-content:space-between;font-size:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.collection-play-label span:first-child{font-size:10px;letter-spacing:1px}
.collection-photo:focus-visible,.collection-play:focus-visible{outline:2px solid var(--gold);outline-offset:5px}
body.collection-viewer-open{overflow:hidden}
@media(min-width:1051px){
  .collection-stills{container-type:inline-size}
  /* Keep the existing layout footprint so the blue frame and video stay put.
     The equal-width images retain natural height and may extend below it. */
  .collection-left{height:calc((100cqw - 24px) * .8 / 2.1 * .92 * 1.8 * (1 + 86 / 92) + 24px);gap:24px}
  .collection-left>.collection-photo{box-sizing:border-box;width:100%;max-width:none;min-width:0;flex:0 0 auto;padding:0}
}
@media(min-width:561px) and (max-width:1050px){.collection-gallery{gap:24px;grid-template-columns:minmax(0,2fr) minmax(0,1fr)}.collection-stills{gap:16px;grid-template-columns:minmax(0,.85fr) minmax(0,1.2fr)}}
@media(max-width:560px){.collection-intro h3{font-size:clamp(22px,5.5vw,26px)}.collection-description{font-size:13px}.collection-gallery{grid-template-columns:minmax(0,1fr);gap:28px}.collection-stills{gap:16px}.collection-motion{width:75%;max-width:280px;justify-self:center}}
/* Mobile editorial spread: three stills lead directly into the motion frame. */
@media(min-width:768px) and (max-width:1050px){.collection-left{gap:16px}}
@media(max-width:767px){
  .collection-gallery{grid-template-columns:repeat(12,minmax(0,1fr));gap:14px 8px;align-items:start}
  .collection-stills{display:contents}
  .collection-left{display:contents}
  .collection-white img{width:100%}
  .collection-white{grid-column:1/5;grid-row:1;width:100%;justify-self:stretch;align-self:start;margin-top:26px}
  .collection-blue{grid-column:5/10;grid-row:1;width:100%;align-self:start;margin:0}
  .collection-pink{grid-column:10/13;grid-row:1;width:100%;align-self:start;margin-top:50px}
  .collection-motion{grid-column:3/11;grid-row:2;width:100%;max-width:300px;justify-self:center;align-self:start}
  .collection-play-label{gap:8px;line-height:1.5;padding:10px 0}
}