/* =========================================================
   COLOR + SHAPES — gallery wall page
   Wide screens: the wall exactly as Larry laid it out (PDF v2), scaling with the window.
   Narrow screens: the same hanging groups, stacked, two prints across.
   Everything is scoped to .cw-page so it cannot affect other pages.
   ========================================================= */
body.cf-splash-page { margin: 0; padding: 0; background: #fff; overflow-x: hidden; }
/* Squarespace wraps the Code block in rows with negative side margins; cancel them so the page can't scroll sideways */
body.cf-splash-page .sqs-row { margin-left: 0 !important; margin-right: 0 !important; }
body.cf-splash-page .sqs-block { padding-left: 0 !important; padding-right: 0 !important; }
.cw-page { color: #111; background: #fff; box-sizing: border-box;
  font-family: "Helvetica Neue", Helvetica, Inter, Arial, sans-serif; -webkit-font-smoothing: antialiased; }
.cw-page *, .cw-page *::before, .cw-page *::after { box-sizing: border-box; }
.cw-page { padding-inline: clamp(16px, 4vw, 64px); padding-block: clamp(18px, 2.4vw, 36px) clamp(40px, 6vw, 96px); }
.cw-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; margin: 0; }

.cw-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 6px 24px;
  font-weight: 700; font-size: 13px; letter-spacing: .01em; text-transform: uppercase;
  max-width: 1600px; margin: 0 auto clamp(24px, 3vw, 44px); }
.cw-head p { margin: 0; padding: 0; font: inherit; color: inherit; letter-spacing: inherit; text-transform: inherit; line-height: 1.3; }
.cw-sq { display: inline-block; width: .68em; height: .68em; background: #e84125; margin: 0 .5em; }
.cw-arrow { display: inline-block; width: .5em; height: .6em; background: #e84125; clip-path: polygon(0 0, 100% 50%, 0 100%); margin: 0 .25em; }

/* A print: Larry's file is the whole sheet (photo plus paper border); the page adds the shadow */
.cw-page a.cw-print { display: block; position: relative; aspect-ratio: var(--ar); background: #fff;
  margin: 0; padding: 0; border: 0; text-decoration: none;
  box-shadow: 4px 4px 7px rgba(0,0,0,.34);
  transition: transform .18s ease, box-shadow .18s ease; }
.cw-page a.cw-print img { display: block; width: 100%; height: 100%; max-width: none; object-fit: fill; margin: 0; padding: 0; border: 0; }
.cw-page a.cw-print:focus-visible { outline: 2px solid #e84125; outline-offset: 4px; }
@media (hover: hover) {
  .cw-page a.cw-print:hover { transform: translateY(-3px); box-shadow: 6px 9px 14px rgba(0,0,0,.3); }
}
@media (prefers-reduced-motion: reduce) { .cw-page a.cw-print { transition: none; } }

/* ---------- Narrow screens: stacked hanging groups ---------- */
.cw-wall { display: grid; gap: clamp(44px, 11vw, 80px); max-width: 620px; margin: 0 auto; }
.cw-group { display: grid; grid-template-columns: repeat(var(--cols), minmax(0, 1fr)); gap: clamp(12px, 3.6vw, 22px);
  align-items: center; width: var(--gw); margin-inline: auto; }

/* ---------- Wide screens: the wall as hung ---------- */
@media (min-width: 760px) {
  .cw-wall { display: block; position: relative; max-width: 1600px; aspect-ratio: var(--wall-ar); container-type: inline-size; }
  .cw-group { display: contents; }
  .cw-page a.cw-print { position: absolute; left: var(--x); top: var(--y); width: var(--w);
    box-shadow: .42cqw .42cqw .5cqw rgba(0,0,0,.36); }
}

/* A sold print gets a small red dot beside its lower right corner */
.cw-page a.cw-print.is-sold::after { content: ""; position: absolute; left: calc(100% + 5px); bottom: 0;
  width: 9px; height: 9px; border-radius: 50%; background: #e84125; }
@media (min-width: 760px) {
  .cw-page a.cw-print.is-sold::after { left: calc(100% + .36cqw); width: max(8px, .55cqw); height: max(8px, .55cqw); }
}