/* ==========================================================================
   Sell (Page 6). This page's own stylesheet, under the Page 6 implementation
   authorization of 2026-10-08 (The Lit Wall; build with placeholders).
   Linked from the Sell page alone, after the shared stylesheet. Every rule
   begins with .page-sell, the page's body class. Colours come only from the
   palette; type only from the shared families.

   The Lit Wall: four works hang together on a graphite gallery wall. The page's
   script names the scene (open, w1 to w4, all); this sheet decides where the
   gallery light rests, which works stand in the gentler light, and which
   label the rail shows. On phones the wall is a vertical exhibition that
   scrolls normally; the light rests on the work in the middle of the screen
   and each label stays under its own work. Nothing on a phone holds still.

   October 11 owner-supplied upscaled architecture art: works 01 to 03 are
   editorial illustrations, not actual represented listings. Work 04 is
   native text with vertical gold accents. Lighting, gallery stage, geometry
   and scroll observer timing remain as locked in the earlier passes.
   ========================================================================== */

/* ---------- The opening: the page's headline, then the gallery ----------
   Refinement ruling of 2026-10-10 (next round): the page's one h1 opens Sell, before the Lit Wall; Shirin's
   positioning statement follows the wall; no rule or divider anywhere on the page. Display L on the page's own
   axis (the second column, where the statement and the closing note stand). Its reveal is the site's own float.
   As before, the opening names the wall's first scene ("open"); the script is unchanged. */

.page-sell .sell-opening {
  padding-block: var(--space-6) var(--space-5);
}

.page-sell .sell-opening__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--space-3);
}

.page-sell .sell-opening__title {
  grid-column: 2 / 12;
  margin: 0;
  max-width: 20ch;
}

/* ---------- The wall ---------- */

.page-sell .sell-wall {
  position: relative;
  --sell-wash: rgb(200 169 107 / 0.055);
}

.page-sell .sell-wall__stage {
  position: relative;
}

/* The wall itself: a little deeper than the page, so light can be seen on it; it eases in and out of the page.
   When the whole wall is lit, the travelling light gives way and this shade lifts evenly. */
.page-sell .sell-wall__stage::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(to bottom, rgb(200 169 107 / 0) 0%, var(--sell-wash) 12%, var(--sell-wash) 86%, rgb(200 169 107 / 0) 100%);
  pointer-events: none;
  transition: opacity 1400ms var(--ease-silk);
}

.page-sell .sell-wall[data-sell-live][data-scene="all"] .sell-wall__stage::before {
  opacity: 0.3;
}

/* Without the script, and on phones: the works hang in the page's flow, each label under its own work. */
.page-sell .sell-wall__hang {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--space-3);
  row-gap: var(--space-5);
  align-items: start;
  max-width: var(--wrap-max);
  margin-inline: auto;
  padding: var(--space-6) var(--gutter);
}

.page-sell .sell-wall__light,
.page-sell .sell-wall__steps,
.page-sell .sell-wall__end,
.page-sell .sell-work__marker,
.page-sell .sell-work__number {
  display: none;
}

.page-sell .sell-work {
  position: relative;
  z-index: 0;
  margin: 0;
}

.page-sell .sell-work--1 { --ratio: 4 / 3; grid-column: 1 / 6; margin-top: var(--space-6); }
.page-sell .sell-work--2 { --ratio: 5 / 4; grid-column: 7 / 13; }
.page-sell .sell-work--3 { --ratio: 3 / 4; grid-column: 2 / 6; }
.page-sell .sell-work--4 { --ratio: 1 / 1; grid-column: 8 / 12; margin-top: var(--space-6); }

/* A work: a print with a soft shadow, no frame line. The tone is the placeholder's; the photograph covers it. */
.page-sell .sell-work__frame {
  position: relative;
  aspect-ratio: var(--ratio);
  background-color: var(--ivory);
  background-image: linear-gradient(160deg, rgb(200 169 107 / 0.1), rgb(37 37 38 / 0.085));
  box-shadow:
    0 1.6rem 2.6rem -1.9rem rgb(37 37 38 / 0.42),
    0 0 0 1px rgb(37 37 38 / 0.04);
}

.page-sell .sell-work__image {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Work 04 is typography: one framed line of words, set in Bodoni italic when it arrives. */
/* (padding in rem: a percentage would be taken from the wall's width, not the work's) */
.page-sell .sell-work__frame--text {
  display: grid;
  place-items: center;
  min-height: 0;
  padding: clamp(1.5rem, 2vw, 2.25rem);
  background-image: none;
}

.page-sell .sell-work__frame--text::before {
  content: "";
  position: absolute;
  inset: 0.75rem;
  border: 1px solid rgb(37 37 38 / 0.16);
  pointer-events: none;
}

.page-sell .sell-work__editorial {
  position: relative;
  margin: 0;
  color: var(--graphite);
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(1.1rem, 1.5vw, 1.55rem);
  line-height: 1.35;
  text-align: center;
  text-wrap: balance;
}

.page-sell .sell-work__editorial [data-placeholder] {
  white-space: normal;
}

/* ---------- The labels ---------- */

.page-sell .sell-label {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: var(--space-2);
  row-gap: 0.6rem;
  align-items: baseline;
  max-width: 34rem;
  margin-top: var(--space-3);
}

.page-sell .sell-label__number {
  grid-row: 1 / span 2;
  color: var(--gold);
  font-family: var(--font-ui);
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.2em;
}

.page-sell .sell-label__title {
  grid-column: 2;
  line-height: 1;
}

.page-sell .sell-label__text {
  grid-column: 2;
  color: var(--ivory-72);
  font-family: var(--font-ui);
  font-size: 0.9375rem;
  line-height: 1.6;
}

/* ---------- The light (with the script running) ---------- */

/* The works out of the light rest in a gentler light: a faint graphite veil, never enough to hide them. */
.page-sell .sell-wall[data-sell-live] .sell-work__frame::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: rgb(37 37 38 / 0.44);
  pointer-events: none;
  transition: opacity 1200ms var(--ease-silk);
}

.page-sell .sell-wall[data-sell-live][data-scene="w1"] .sell-work--1 .sell-work__frame::after,
.page-sell .sell-wall[data-sell-live][data-scene="w2"] .sell-work--2 .sell-work__frame::after,
.page-sell .sell-wall[data-sell-live][data-scene="w3"] .sell-work--3 .sell-work__frame::after,
.page-sell .sell-wall[data-sell-live][data-scene="w4"] .sell-work--4 .sell-work__frame::after,
.page-sell .sell-wall[data-sell-live][data-scene="all"] .sell-work__frame::after {
  opacity: 0;
}

/* ---------- Tablets and desktops: the whole wall holds still while the light moves ---------- */

@media (min-width: 720px) {
  .page-sell .sell-wall[data-sell-live] {
    --sell-top: var(--space-3);
    --sell-rail: 9rem;
  }

  .page-sell .sell-wall[data-sell-live] .sell-wall__stage {
    position: sticky;
    top: var(--nav-h);
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: calc(100vh - var(--nav-h));
    height: calc(100svh - var(--nav-h));
    overflow: hidden;
  }

  /* The hang keeps its proportions and fits the window, the rail's room below it. */
  .page-sell .sell-wall[data-sell-live] .sell-wall__hang {
    display: block;
    position: relative;
    flex: none;
    width: min(calc(100% - 2 * var(--gutter)), calc((100vh - var(--nav-h) - var(--sell-rail) - 2 * var(--sell-top)) * var(--sell-ratio)));
    width: min(calc(100% - 2 * var(--gutter)), calc((100svh - var(--nav-h) - var(--sell-rail) - 2 * var(--sell-top)) * var(--sell-ratio)));
    max-width: none;
    aspect-ratio: var(--sell-ratio);
    margin: 0 auto var(--sell-rail);
    padding: 0;
  }

  .page-sell .sell-wall[data-sell-live] .sell-work {
    position: static;
    margin: 0;
  }

  .page-sell .sell-wall[data-sell-live] .sell-work__frame {
    position: absolute;
    left: var(--x);
    top: var(--y);
    z-index: 1;
    width: var(--w);
  }

  /* One pool of warm light, twice the hang's size, travelling between the works by transform. */
  .page-sell .sell-wall[data-sell-live] .sell-wall__light {
    display: block;
    position: absolute;
    left: -50%;
    top: -50%;
    z-index: 0;
    width: 200%;
    height: 200%;
    background:
      radial-gradient(var(--sell-pool) at 50% 50%, rgb(200 169 107 / 0.24), rgb(200 169 107 / 0) 100%),
      radial-gradient(var(--sell-pool) at 50% 50%, rgb(243 239 233 / 0.20), rgb(243 239 233 / 0.06) 50%, rgb(243 239 233 / 0) 100%);
    opacity: 0;
    transform: translate(var(--lx, 0%), var(--ly, 0%)) scale(var(--ls, 1));
    pointer-events: none;
    transition:
      transform 1400ms var(--ease-silk),
      opacity 1200ms var(--ease-silk);
  }

  .page-sell .sell-wall[data-sell-live][data-scene^="w"] .sell-wall__light {
    opacity: 1;
  }

  /* Each work's number, under its corner, pairs it with the rail. */
  .page-sell .sell-wall[data-sell-live] .sell-work__number {
    display: block;
    position: absolute;
    left: 0;
    top: 100%;
    margin-top: 0.6rem;
    color: var(--ivory-72);
    font-family: var(--font-ui);
    font-size: 0.6875rem;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0.2em;
    transition: color 1200ms var(--ease-silk);
  }

  .page-sell .sell-wall[data-sell-live][data-scene="w1"] .sell-work--1 .sell-work__number,
  .page-sell .sell-wall[data-sell-live][data-scene="w2"] .sell-work--2 .sell-work__number,
  .page-sell .sell-wall[data-sell-live][data-scene="w3"] .sell-work--3 .sell-work__number,
  .page-sell .sell-wall[data-sell-live][data-scene="w4"] .sell-work--4 .sell-work__number {
    color: var(--gold);
  }

  /* The rail: every label waits in one place below the hang; the lit work's label is shown. */
  .page-sell .sell-wall[data-sell-live] .sell-label {
    position: absolute;
    left: var(--sell-rail-x);
    top: var(--sell-rail-y);
    width: min(var(--sell-rail-w), 36rem);
    margin-top: 0;
    opacity: 0;
    transform: translate3d(0, 8px, 0);
    transition:
      opacity 700ms var(--ease-silk),
      transform 700ms var(--ease-silk);
  }

  .page-sell .sell-wall[data-sell-live][data-scene="w1"] .sell-work--1 .sell-label,
  .page-sell .sell-wall[data-sell-live][data-scene="w2"] .sell-work--2 .sell-label,
  .page-sell .sell-wall[data-sell-live][data-scene="w3"] .sell-work--3 .sell-label,
  .page-sell .sell-wall[data-sell-live][data-scene="w4"] .sell-work--4 .sell-label {
    opacity: 1;
    transform: none;
    transition-delay: 300ms;
  }

  .page-sell .sell-wall[data-sell-live] .sell-wall__steps {
    display: block;
    position: relative;
    margin-top: calc(var(--nav-h) - 100vh);
    margin-top: calc(var(--nav-h) - 100svh);
    pointer-events: none;
  }

  .page-sell .sell-step {
    height: 70vh;
    height: 70svh;
  }

  .page-sell .sell-step--open {
    height: 50vh;
    height: 50svh;
  }

  /* The lit wall holds longer than a window, so it is reached while the wall still holds. */
  .page-sell .sell-step--all {
    height: 110vh;
    height: 110svh;
  }
}

/* ---------- Desktops: four works across the wall, the interior at the centre ---------- */

@media (min-width: 1024px) {
  .page-sell .sell-wall[data-sell-live] {
    --sell-ratio: 1.96;
    --sell-top: var(--space-4);
    --sell-rail: 0rem;
    --sell-rail-x: 5.4%;
    --sell-rail-y: 76%;
    --sell-rail-w: 40%;
    --sell-pool: 15% 22%;
  }

  /* Interior at the centre; the setting to its left, a little low; Shirin at work and the framed words stepped
     down the right, their right edges aligned. The rail sits under the first two, on the wall itself. */
  .page-sell .sell-wall[data-sell-live] .sell-work--1 { --x: 5.4%; --y: 25%; --w: 24%; }
  .page-sell .sell-wall[data-sell-live] .sell-work--2 { --x: 32.5%; --y: 8%; --w: 38.3%; }
  .page-sell .sell-wall[data-sell-live] .sell-work--3 { --x: 75.4%; --y: 0%; --w: 19.1%; }
  .page-sell .sell-wall[data-sell-live] .sell-work--4 { --x: 79.3%; --y: 57%; --w: 15.3%; }

  /* where the light rests: the work's centre, in halves of the hang (the pool is twice its size) */
  .page-sell .sell-wall[data-sell-live][data-scene="w1"] { --lx: -16.3%; --ly: -3.7%; --ls: 0.75; }
  .page-sell .sell-wall[data-sell-live][data-scene="w2"] { --lx: 0.8%; --ly: -6%; --ls: 1.05; }
  .page-sell .sell-wall[data-sell-live][data-scene="w3"] { --lx: 17.5%; --ly: -12.5%; --ls: 0.85; }
  .page-sell .sell-wall[data-sell-live][data-scene="w4"] { --lx: 18.5%; --ly: 11%; --ls: 0.6; }
  .page-sell .sell-wall[data-sell-live][data-scene="all"] { --lx: 0%; --ly: 0%; --ls: 1.6; }
}

/* ---------- Tablets held upright: the same four works, hung for a tall wall ---------- */

@media (min-width: 720px) and (max-width: 1023px) {
  .page-sell .sell-wall[data-sell-live] {
    --sell-ratio: 1.014;
    --sell-rail: 10rem;
    --sell-rail-x: 0%;
    --sell-rail-y: calc(100% + var(--space-3));
    --sell-rail-w: 100%;
    --sell-pool: 15% 13%;
  }

  .page-sell .sell-wall[data-sell-live] .sell-work--1 { --x: 0%; --y: 2.7%; --w: 44.6%; }
  .page-sell .sell-wall[data-sell-live] .sell-work--2 { --x: 50%; --y: 16.4%; --w: 50%; }
  .page-sell .sell-wall[data-sell-live] .sell-work--3 { --x: 8.1%; --y: 43.8%; --w: 33.8%; }
  .page-sell .sell-wall[data-sell-live] .sell-work--4 { --x: 54.1%; --y: 65.8%; --w: 31.1%; }

  .page-sell .sell-wall[data-sell-live][data-scene="w1"] { --lx: -13.9%; --ly: -15.2%; --ls: 0.85; }
  .page-sell .sell-wall[data-sell-live][data-scene="w2"] { --lx: 12.5%; --ly: -6.7%; --ls: 0.95; }
  .page-sell .sell-wall[data-sell-live][data-scene="w3"] { --lx: -12.5%; --ly: 8.3%; --ls: 0.85; }
  .page-sell .sell-wall[data-sell-live][data-scene="w4"] { --lx: 9.8%; --ly: 15.8%; --ls: 0.7; }
  .page-sell .sell-wall[data-sell-live][data-scene="all"] { --lx: 0%; --ly: 0%; --ls: 1.6; }
}

/* ---------- Phones: a vertical exhibition that scrolls normally ---------- */

@media (max-width: 719px) {
  .page-sell .sell-wall__hang {
    row-gap: var(--space-5);
    padding-bottom: 0;
  }

  .page-sell .sell-work--1 { grid-column: 1 / 11; margin-top: 0; }
  .page-sell .sell-work--2 { grid-column: 2 / 13; }
  .page-sell .sell-work--3 { grid-column: 1 / 9; }
  .page-sell .sell-work--4 { grid-column: 4 / 13; margin-top: 0; }

  /* Each work's own light: a soft pool on the wall around the work and its label, shown while it is lit. */
  .page-sell .sell-wall[data-sell-live] .sell-work::before {
    content: "";
    position: absolute;
    inset: -14% -18% -8%;
    z-index: -1;
    background:
      radial-gradient(closest-side, rgb(200 169 107 / 0.24), rgb(200 169 107 / 0) 100%),
      radial-gradient(closest-side, rgb(243 239 233 / 0.20), rgb(243 239 233 / 0.04) 55%, rgb(243 239 233 / 0) 100%);
    opacity: 0;
    pointer-events: none;
    transition: opacity 1200ms var(--ease-silk);
  }

  .page-sell .sell-wall[data-sell-live][data-scene="w1"] .sell-work--1::before,
  .page-sell .sell-wall[data-sell-live][data-scene="w2"] .sell-work--2::before,
  .page-sell .sell-wall[data-sell-live][data-scene="w3"] .sell-work--3::before,
  .page-sell .sell-wall[data-sell-live][data-scene="w4"] .sell-work--4::before,
  .page-sell .sell-wall[data-sell-live][data-scene="all"] .sell-work::before {
    opacity: 1;
  }

  /* what the script watches here: each work itself, then the wall's end */
  .page-sell .sell-work__marker {
    display: block;
    position: absolute;
    inset: 0;
    pointer-events: none;
  }

  .page-sell .sell-wall__end {
    display: block;
    height: var(--space-6);
  }
}

/* ---------- After the wall: Shirin's statement ----------
   Once all four works stand in the light, her positioning statement follows on Warm Ivory, as the
   exhibition's conclusion, on the page's axis and at Display S, the size it had as the opening line. No rule
   above it. Like the closing, it names the lit wall as its scene, so the wall is right when a visitor arrives
   here directly. */

.page-sell .sell-statement {
  padding-block: var(--space-5) 0;
}

.page-sell .sell-statement__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--space-3);
}

.page-sell .sell-statement__line {
  grid-column: 2 / 9;
  max-width: 30ch;
  margin: 0;
  color: var(--graphite);
}

@media (max-width: 1023px) {
  .page-sell .sell-opening__title {
    grid-column: 2 / -1;
  }
}

@media (max-width: 719px) {
  .page-sell .sell-opening {
    padding-top: var(--space-5);
  }

  .page-sell .sell-statement {
    padding-top: var(--space-5);
  }

  .page-sell .sell-opening__title,
  .page-sell .sell-statement__line {
    grid-column: 1 / -1;
  }
}

/* ---------- The closing ---------- */

.page-sell .sell-closing {
  padding-block: var(--space-5) var(--space-6);
}

.page-sell .sell-closing__inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--space-3);
  row-gap: var(--space-4);
  align-items: start;
}

.page-sell .sell-closing__note {
  grid-column: 2 / 9;
  margin: 0;
  color: var(--graphite);
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(1.4rem, 2.2vw, 2rem);
  line-height: 1.3;
}



/* Call Shirin, the second choice beside the way in (sitewide call ruling of 2026-10-10): one link under the
   button, the words in Display S over the number, which comes from the site's contact data. */
.page-sell .sell-closing__call {
  grid-column: 2 / 9;
  justify-self: start;
  display: inline-grid;
  gap: 0.2rem;
  min-height: 44px;
  color: var(--graphite);
  text-decoration: none;
  transition: color var(--dur-ui) var(--ease-silk);
}

.page-sell .sell-closing__call-words {
  line-height: 1.1;
}

.page-sell .sell-closing__call-number {
  font-family: var(--font-ui);
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  font-weight: 600;
  letter-spacing: 0.1em;
}

.page-sell .sell-closing__call:hover,
.page-sell .sell-closing__call:focus-visible {
  color: var(--aubergine);
}

.page-sell .sell-closing__pathway {
  grid-column: 2 / 9;
  margin: 0;
}

.page-sell .sell-closing__link {
  color: var(--graphite);
  text-decoration: underline;
  text-decoration-color: var(--gold);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.35em;
}

@media (max-width: 719px) {
  .page-sell .sell-closing__note,
  .page-sell .sell-closing__call,
  .page-sell .sell-closing__pathway {
    grid-column: 1 / -1;
  }

}

/* ---------- Reduced motion: the light changes place at once ---------- */

@media (prefers-reduced-motion: reduce) {
  .page-sell .sell-wall[data-sell-live] .sell-wall__light,
  .page-sell .sell-wall[data-sell-live] .sell-wall__stage::before,
  .page-sell .sell-wall[data-sell-live] .sell-work__frame::after,
  .page-sell .sell-wall[data-sell-live] .sell-work::before,
  .page-sell .sell-wall[data-sell-live] .sell-work__number,
  .page-sell .sell-wall[data-sell-live] .sell-label {
    transition-duration: 1ms;
    transition-delay: 0ms;
  }

  .page-sell .sell-wall[data-sell-live] .sell-label {
    transform: none;
  }

  .page-sell .sell-wall[data-sell-live][data-scene] .sell-work .sell-label {
    transition-delay: 0ms;
  }
}

/* October 11 owner direction: the Lit Wall is graphite between ivory opening and
   ivory statement. The color-only change preserves gallery coordinates, timing,
   scroll observers, four-work stage, typography scale and divider-free design. */


/* Final architectural artwork pass. Only the poster's typography is adjusted;
   no wall geometry, positioning, light trajectory or scene transition changes. */
.page-sell .sell-work__frame--text {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(0.35rem, 1vw, 0.85rem);
  background-color: var(--graphite);
  background-image: linear-gradient(148deg, rgb(200 169 107 / 0.08), rgb(37 37 38 / 0.02));
}

.page-sell .sell-work__frame--text::before {
  content: none;
}

.page-sell .sell-work__accent {
  position: relative;
  width: 1px;
  height: clamp(0.6rem, 2vw, 1.3rem);
  flex: none;
  background-color: var(--gold);
}

.page-sell .sell-work__editorial {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  width: 100%;
  color: var(--ivory);
  font-family: var(--font-display);
  font-style: normal;
  font-size: clamp(0.96rem, 1.55vw, 1.4rem);
  line-height: 1.05;
  overflow-wrap: anywhere;
}

.page-sell .sell-work__editorial em {
  font-style: italic;
  font-weight: 400;
  font-size: 0.84em;
  line-height: 1.18;
}

.page-sell .sell-work__editorial strong {
  font-weight: 500;
  text-transform: uppercase;
  font-size: 1.18em;
  letter-spacing: -0.02em;
  line-height: 1.08;
}

@media (max-width: 719px) {
  .page-sell .sell-work__editorial {
    font-size: clamp(1.05rem, 3.4vw, 1.35rem);
  }
}

/* October 11 readability refinement: keep the poster typography locked,
   and enlarge the wall label eyebrow/copy for easier reading without
   changing the gallery composition. */
.page-sell .sell-work__editorial {
  width: min(100%, 10.8em);
  margin-inline: auto;
  font-size: clamp(1.06rem, 1.72vw, 1.52rem);
  line-height: 1.01;
  text-align: center;
  overflow-wrap: normal;
  word-break: normal;
}

.page-sell .sell-work__editorial em,
.page-sell .sell-work__editorial strong {
  display: block;
  white-space: nowrap;
}

.page-sell .sell-work__editorial em {
  font-size: 0.86em;
  line-height: 1.14;
}

.page-sell .sell-work__editorial strong {
  font-size: 1.2em;
  line-height: 1.06;
}

.page-sell .sell-label {
  row-gap: 0.72rem;
}

.page-sell .sell-label__number {
  font-size: 0.975rem;
  line-height: 1.28;
}

.page-sell .sell-label__text {
  font-size: clamp(1.14rem, 1.08vw, 1.22rem);
  line-height: 1.55;
}

@media (min-width: 1024px) {
  .page-sell .sell-wall[data-sell-live] {
    --sell-rail-w: 44%;
  }
}

@media (max-width: 719px) {
  .page-sell .sell-work__editorial {
    width: min(100%, 10.2em);
    font-size: clamp(1.08rem, 3.55vw, 1.38rem);
  }

  .page-sell .sell-label__number {
    font-size: 0.9rem;
  }

  .page-sell .sell-label__text {
    font-size: 1.08rem;
  }
}


/* ---------- Client words: a quiet editorial interval after the Lit Wall ----------
   Three user-supplied five-star Google review excerpts. Individual ratings
   and names were supplied directly with their Google reviewer profile URLs. No decorative card
   boxes, slider, or new scroll controller. */
.page-sell .sell-testimonials {
  padding-block: var(--space-5) var(--space-5);
}

.page-sell .sell-testimonials__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--space-3);
  row-gap: var(--space-5);
}

.page-sell .sell-testimonials__intro {
  grid-column: 2 / 12;
  max-width: 49rem;
}

.page-sell .sell-testimonials__eyebrow {
  margin: 0 0 1rem;
  color: var(--aubergine);
  font-family: var(--font-ui);
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.page-sell .sell-testimonials__title {
  margin: 0;
  color: var(--graphite);
  font-style: italic;
  line-height: 1.12;
}

.page-sell .sell-testimonials__lede {
  max-width: 40ch;
  margin: var(--space-3) 0 0;
  font-family: var(--font-ui);
  font-size: clamp(1rem, 1.15vw, 1.15rem);
  line-height: 1.7;
}

.page-sell .sell-testimonial {
  margin: 0;
  min-width: 0;
}

.page-sell .sell-testimonial--lead {
  grid-column: 2 / 8;
  align-self: start;
}

.page-sell .sell-testimonials__secondary {
  grid-column: 9 / 13;
  display: grid;
  align-content: start;
  gap: var(--space-5);
}

.page-sell .sell-testimonial__quote {
  margin: 0;
  color: var(--graphite);
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2.15vw, 2.5rem);
  font-style: italic;
  font-weight: 400;
  line-height: 1.25;
  text-wrap: pretty;
}

.page-sell .sell-testimonial--lead .sell-testimonial__quote {
  max-width: 19ch;
  font-size: clamp(2rem, 3.1vw, 3.4rem);
  line-height: 1.18;
}

.page-sell .sell-testimonial__detail {
  margin: var(--space-2) 0 0;
  color: var(--graphite);
  font-family: var(--font-ui);
  font-size: 0.875rem;
  line-height: 1.65;
}

.page-sell .sell-testimonial__credit {
  display: grid;
  justify-items: start;
  gap: 0.3rem;
  margin-top: var(--space-3);
  font-family: var(--font-ui);
  line-height: 1.5;
}

.page-sell .sell-testimonial__stars {
  color: var(--gold);
  font-size: 0.9375rem;
  letter-spacing: 0.12em;
}

.page-sell .sell-testimonial__name {
  color: var(--graphite);
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.06em;
}

.page-sell .sell-testimonial__context {
  color: var(--graphite);
  font-size: 0.75rem;
  line-height: 1.5;
}

.page-sell .sell-testimonial__context a {
  color: var(--aubergine);
  text-decoration: underline;
  text-decoration-color: var(--gold);
  text-underline-offset: 0.25em;
}

.page-sell .sell-testimonial__context a:hover,
.page-sell .sell-testimonial__context a:focus-visible {
  color: var(--graphite);
}

@media (max-width: 1023px) {
  .page-sell .sell-testimonials__intro,
  .page-sell .sell-testimonial--lead,
  .page-sell .sell-testimonials__secondary {
    grid-column: 1 / -1;
  }

  .page-sell .sell-testimonials__secondary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-4);
  }
}

@media (max-width: 719px) {
  .page-sell .sell-testimonials__grid {
    row-gap: var(--space-4);
  }

  .page-sell .sell-testimonials__secondary {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-4);
  }

  .page-sell .sell-testimonial--lead .sell-testimonial__quote {
    font-size: clamp(1.85rem, 7.5vw, 2.6rem);
  }
}

/* Owner polish 2026-10-11; all prior styles retained. */
/* Balance the ivory hero within its frame, without changing Lit Wall scrolling. */
.page-sell .sell-opening {min-height:clamp(23rem,55svh,42rem);padding-block:clamp(3rem,8vh,6rem);display:flex;align-items:center;}
.page-sell .sell-opening__inner {width:100%;}
/* Accessible scale for the labels under the artworks, without enlarging the art itself. */
.page-sell .sell-label__number {font-size:clamp(1rem,1.25vw,1.2rem);}
.page-sell .sell-label__title {font-size:clamp(1.9rem,3vw,3rem);line-height:1.16;}
.page-sell .sell-label__text {font-size:clamp(1.3rem,1.8vw,1.75rem);line-height:1.43;}
.page-sell .sell-work__number {font-size:1rem;}
/* Five five-star source-backed quotations: lead plus four staggered columns. */
.page-sell .sell-testimonials {padding-block:clamp(4rem,8vw,8rem);}
.page-sell .sell-testimonials__eyebrow {font-size:1rem;}
.page-sell .sell-testimonials__lede {font-size:clamp(1.1rem,1.5vw,1.4rem);}
.page-sell .sell-testimonial__name {font-size:clamp(1.05rem,1.2vw,1.3rem);}
.page-sell .sell-testimonial__stars {font-size:clamp(1.2rem,1.4vw,1.5rem);letter-spacing:.2em;}
.page-sell .sell-testimonial__context {font-size:clamp(1rem,1.15vw,1.2rem);line-height:1.65;}
.page-sell .sell-testimonial__quote {font-size:clamp(1.85rem,2.55vw,3rem);line-height:1.24;}
@media(min-width:1024px){
 .page-sell .sell-testimonial--lead {grid-column:2 / 10;}
 .page-sell .sell-testimonials__secondary {grid-column:2 / 12;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(3rem,7vw,8rem);row-gap:clamp(3rem,5vw,6rem);}
 .page-sell .sell-testimonials__secondary .sell-testimonial:nth-child(even){transform:translateY(clamp(1rem,5vw,4.5rem));}
 .page-sell .sell-wall[data-sell-live] .sell-label {width:min(var(--sell-rail-w),45rem);}
}
@media(max-width:1023px){.page-sell .sell-testimonials__secondary {grid-template-columns:repeat(2,minmax(0,1fr));gap:3rem;}}
@media(max-width:719px){.page-sell .sell-opening{min-height:45svh;padding-block:4rem}.page-sell .sell-testimonials__secondary{grid-template-columns:1fr;gap:3.5rem}.page-sell .sell-label__title{font-size:clamp(1.7rem,6.2vw,2.35rem)}.page-sell .sell-label__text{font-size:clamp(1.18rem,4.5vw,1.42rem)}}
@media(prefers-reduced-motion:reduce){.page-sell .sell-testimonials [data-reveal]{transition:none}}

/* Oct16: align the opening against Buy and Sold, no Lit Wall change. */
.page-sell .sell-opening{min-height:clamp(24rem,43svh,34rem);padding-block:clamp(4rem,7vh,6rem);display:block;}
.page-sell .sell-opening__inner{width:100%;}
.page-sell .sell-opening__title{grid-column:1 / 12;max-width:20ch;margin:0;font-size:clamp(3rem,6vw,7.25rem);line-height:1.03;letter-spacing:-.015em;}
@media(max-width:719px){.page-sell .sell-opening{min-height:clamp(22rem,40svh,28rem);padding-block:3.5rem;}.page-sell .sell-opening__title{font-size:clamp(3rem,10vw,4.5rem);}}
/* Testimonials: the spacing, stagger, quotes and Google attribution stay;
   the letterforms become legible Manrope italic rather than hairline Bodoni. */
.page-sell .sell-testimonial__quote{font-family:var(--font-ui);font-style:italic;font-weight:500;font-size:clamp(1.5rem,2vw,2.2rem);line-height:1.48;letter-spacing:-.012em;}
.page-sell .sell-testimonial--lead .sell-testimonial__quote{font-size:clamp(1.7rem,2.5vw,2.7rem);line-height:1.42;max-width:27ch;}
.page-sell .sell-testimonials__lede{max-width:52ch;line-height:1.62;}
.page-sell .sell-cta__pathway{margin-top:clamp(1.4rem,2.5vw,2.5rem);}

/* Oct16 shared editorial CTA geometry adapted to .page-sell, page-local only. */
.page-sell .sell-cta{min-height:clamp(38rem,85svh,58rem);padding-block:clamp(4rem,8vw,8rem);display:grid;align-items:center;}
.page-sell .sell-cta__inner{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);align-items:center;column-gap:clamp(2rem,5vw,6rem);}
.page-sell .sell-cta__copy{min-width:0;}
.page-sell .sell-cta__title{margin:0;max-width:14ch;color:var(--graphite);font-family:var(--font-display);font-size:clamp(3rem,5.5vw,6.5rem);font-weight:500;line-height:1.08;letter-spacing:-.012em;font-style:normal;}
.page-sell .sell-cta__actions{display:flex;flex-wrap:wrap;align-items:flex-start;gap:1.2rem 2.5rem;margin-top:clamp(2rem,5vh,4rem);}
.page-sell .sell-cta__call{display:inline-grid;align-content:center;justify-items:start;grid-column:auto;gap:.25rem;min-height:60px;color:var(--graphite);text-decoration:none;transition:color 220ms ease;}
.page-sell .sell-cta__call-words{font-family:var(--font-display);font-size:clamp(2.15rem,3.6vw,4.15rem);font-weight:500;line-height:1.1;}
.page-sell .sell-cta__call-number{font-family:var(--font-ui);font-size:clamp(1rem,1.3vw,1.3rem);font-weight:600;letter-spacing:.09em;line-height:1.5;}
.page-sell .sell-cta__call:hover,.page-sell .sell-cta__call:focus-visible{color:var(--aubergine);}


.page-sell .sell-cta__visual{justify-self:end;align-self:center;}
.page-sell .sell-cta__sign{font-size:clamp(.8rem,1.3vw,1.15rem);}
.page-sell .sell-cta__panel{animation:sell-cta-sign-flip 10s ease-in-out 1s infinite;}
@keyframes sell-cta-sign-flip{
 0%,24%{transform:rotateX(0deg);}
 36%,63%{transform:rotateX(180deg);}
 76%,100%{transform:rotateX(0deg);}
}
@media(max-width:900px){
 .page-sell .sell-cta__inner{grid-template-columns:minmax(0,1fr);row-gap:clamp(2rem,5vw,4rem);}
 .page-sell .sell-cta__visual{justify-self:center;}
 .page-sell .sell-cta__sign{font-size:clamp(.75rem,2.9vw,1rem);}
}
@media(prefers-reduced-motion:reduce){
 .page-sell .sell-cta__panel{animation:none;}
 .page-sell .sell-cta__call{transition:none;}
}

/* Oct16: five authentic reviews in a descending editorial zigzag, right to left.
   Credit stays directly with each quotation; small screens return to one column. */
@media (min-width:1024px) {
 .page-sell .sell-testimonial--lead {grid-column:7 / 13;justify-self:start;max-width:100%;}
 .page-sell .sell-testimonials__secondary {grid-column:2 / 13;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(2rem,5vw,5rem);row-gap:clamp(2rem,4vw,4rem);margin-top:clamp(-6rem,-5vw,-3rem);}
 .page-sell .sell-testimonials__secondary .sell-testimonial {grid-column:1 / 7;min-width:0;transform:none;}
 .page-sell .sell-testimonials__secondary .sell-testimonial:nth-child(2),
 .page-sell .sell-testimonials__secondary .sell-testimonial:nth-child(4) {grid-column:7 / 13;}
 .page-sell .sell-testimonials__secondary .sell-testimonial:nth-child(1){grid-row:1;}
 .page-sell .sell-testimonials__secondary .sell-testimonial:nth-child(2){grid-row:2;}
 .page-sell .sell-testimonials__secondary .sell-testimonial:nth-child(3){grid-row:3;}
 .page-sell .sell-testimonials__secondary .sell-testimonial:nth-child(4){grid-row:4;}
 .page-sell .sell-testimonials__secondary .sell-testimonial:not(:first-child){margin-top:clamp(-5rem,-4vw,-2rem);}
}
@media (max-width:1023px) {
 .page-sell .sell-testimonials__secondary {grid-template-columns:minmax(0,1fr);row-gap:clamp(2rem,5vw,4rem);}
 .page-sell .sell-testimonials__secondary .sell-testimonial {transform:none;}
}
/* Restore the intimate, deliberately three-line conversation invitation. */
.page-sell .sell-cta__title{max-width:19ch;font-size:clamp(2.75rem,4.7vw,5.6rem);line-height:1.08;}
@media(max-width:719px){.page-sell .sell-cta__title{font-size:clamp(2.5rem,9vw,4.3rem);}}

/* Oct 16: reduce the loose interval between the Sell positioning statement
   and the introduction to clients' words; keep the staggered review rhythm. */
.page-sell .sell-statement {padding-top:clamp(2.5rem,5vw,4.5rem);}
.page-sell .sell-testimonials {padding-top:clamp(1.5rem,3vw,3rem);}
@media (min-width:1024px) {
 .page-sell .sell-testimonials__secondary .sell-testimonial:nth-child(5) {grid-column:1 / 7;grid-row:5;}
}

/* Oct17 approved six-page CTA and review polish; page-scoped only. */
.page-sell .sell-testimonials{padding:0;background:var(--ivory)}.page-sell .sell-testimonials__intro-stage{padding:clamp(2.5rem,4vw,4.5rem) 0 clamp(3rem,6vw,5.5rem);background:var(--ivory)}.page-sell .sell-testimonials__intro-stage .sell-testimonials__intro{margin-inline-start:clamp(0rem,7vw,7rem)}.page-sell .sell-testimonials__review-stage{padding:clamp(4rem,7vw,7rem) 0 clamp(2.5rem,4vw,4rem);background:var(--graphite);color:var(--ivory)}.page-sell .sell-testimonials__review-stage .sell-testimonial__quote,.page-sell .sell-testimonials__review-stage .sell-testimonial__name{color:var(--ivory)}.page-sell .sell-testimonials__review-stage .sell-testimonial__context{color:var(--ivory-72)}.page-sell .sell-testimonials__review-stage .sell-testimonial__context a{color:var(--gold);text-decoration-color:var(--gold)}.page-sell .sell-testimonials__review-stage .sell-testimonial__context a:hover,.page-sell .sell-testimonials__review-stage .sell-testimonial__context a:focus-visible{color:var(--ivory)}@media(min-width:1024px){.page-sell .sell-testimonials__secondary .sell-testimonial:nth-child(3),.page-sell .sell-testimonials__secondary .sell-testimonial:nth-child(5){position:relative;top:clamp(.75rem,1.6vw,1.75rem)}}@media(max-width:1023px){.page-sell .sell-testimonials__intro-stage .sell-testimonials__intro{margin-inline-start:0}}.page-sell .sell-cta{padding-bottom:0;align-items:end}.page-sell .sell-cta__inner{align-items:end}.page-sell .sell-cta__copy{align-self:center;padding-bottom:clamp(2.5rem,6vh,5rem)}.page-sell .sell-cta__visual{align-self:end;line-height:0}.page-sell .sell-cta__sign{vertical-align:bottom;line-height:normal}@media(max-width:900px){.page-sell .sell-cta__copy{padding-bottom:0}}

/* Oct 17: one review type scale and a consistent one-at-a-time stagger. */
.page-sell .sell-testimonials__review-stage .sell-testimonial__quote,
.page-sell .sell-testimonials__review-stage .sell-testimonial--lead .sell-testimonial__quote {
  font-size:clamp(1.7rem,2.2vw,2.3rem);line-height:1.47;font-weight:500;
}
@media(min-width:1024px){
 .page-sell .sell-testimonials__secondary {row-gap:clamp(2.4rem,3.5vw,3.6rem);}
 .page-sell .sell-testimonials__secondary .sell-testimonial:not(:first-child){margin-top:0;}
 .page-sell .sell-testimonials__secondary .sell-testimonial:nth-child(3),
 .page-sell .sell-testimonials__secondary .sell-testimonial:nth-child(5){position:static;top:auto;}
}
@media(max-width:719px){
 .page-sell .sell-testimonials__review-stage .sell-testimonial__quote,
 .page-sell .sell-testimonials__review-stage .sell-testimonial--lead .sell-testimonial__quote {font-size:clamp(1.5rem,5vw,1.9rem);}
}
.page-sell .sell-cta {min-height:clamp(34rem,73svh,50rem);padding-top:clamp(2.5rem,4vw,4rem);}

/* Oct 17: universal CTA layout: same geometry on six page-scoped sheets. */
.page-sell .cta-unified{height:clamp(42rem,82svh,56rem);min-height:clamp(42rem,82svh,56rem);padding:0;display:block;overflow:hidden;}
.page-sell .cta-unified__inner{height:100%;min-height:100%;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);align-items:stretch;gap:clamp(2rem,5vw,6rem);}
.page-sell .cta-unified__copy{min-width:0;min-height:0;height:100%;position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;padding-top:clamp(5rem,11svh,8.5rem);padding-bottom:clamp(5.75rem,11svh,8.5rem);}
.page-sell .cta-unified__heading{grid-row:auto;grid-column:auto;max-width:18.5ch;margin:0;font-family:var(--font-display);font-weight:500;font-size:clamp(3rem,5.15vw,5.8rem);line-height:1.09;letter-spacing:-.012em;font-style:normal;font-optical-sizing:none;font-variation-settings:"opsz" 18;color:var(--graphite);}
.page-sell .cta-unified__actions{grid-row:auto;grid-column:auto;position:static;display:block;margin:0;padding:0;align-self:start;justify-self:start;}
.page-sell .cta-unified__call{display:inline-grid;gap:.18rem;align-content:start;justify-items:start;min-height:44px;margin:0;text-align:left;color:var(--graphite);text-decoration:none;}
.page-sell .cta-unified__call-words{font-family:var(--font-display);font-weight:500;font-size:clamp(2.2rem,3.5vw,4rem);line-height:1.1;font-optical-sizing:none;font-variation-settings:"opsz" 14;}
.page-sell .cta-unified__number{font-family:var(--font-ui);font-size:clamp(1rem,1.2vw,1.25rem);font-weight:600;line-height:1.5;letter-spacing:.09em;}
.page-sell .cta-unified__visual{grid-row:1;grid-column:2;justify-self:end;align-self:end;line-height:0;}
.page-sell .cta-unified__visual .sign{vertical-align:bottom;line-height:normal;}
@media(max-width:900px){
.page-sell .cta-unified{height:auto;min-height:0;padding-top:clamp(3.5rem,8vw,5rem);}
.page-sell .cta-unified__inner{height:auto;min-height:0;grid-template-columns:minmax(0,1fr);gap:clamp(2.5rem,5vw,4rem);}
.page-sell .cta-unified__copy{grid-row:1;grid-column:1;height:auto;min-height:0;gap:clamp(2.5rem,6vw,4.5rem);padding:0;}
.page-sell .cta-unified__heading{font-size:clamp(2.6rem,8.2vw,4.6rem);line-height:1.1;max-width:20ch;}
.page-sell .cta-unified__actions{margin:0;}
.page-sell .cta-unified__visual{grid-row:2;grid-column:1;justify-self:center;align-self:end;}
}
.page-sell .cta-unified__copy .sell-cta__pathway{position:absolute;bottom:clamp(1.8rem,4svh,3.25rem);margin:0;}
@media(max-width:900px){.page-sell .cta-unified__copy .sell-cta__pathway{position:static;margin-top:-1.5rem;}}
@media(min-width:1024px){.page-sell .sell-testimonials__secondary .sell-testimonial:nth-child(3),.page-sell .sell-testimonials__secondary .sell-testimonial:nth-child(5){position:relative;top:clamp(.75rem,1.2vw,1.5rem);}}
.page-sell .cta-unified__copy [hidden]{display:none!important;}

/* Only the positioning divider and the lead-in before the unchanged reviews. */
.page-sell .sell-statement {
  padding-block: 7.5rem;
  overflow-x: clip;
}
.page-sell .sell-statement__inner { display: block; }
.page-sell .sell-statement__line {
  max-width: 38ch;
  margin-inline: auto;
  text-align: center;
  font-size: clamp(2rem, 3.35vw, 3.75rem);
  line-height: 1.22;
  letter-spacing: 0;
}
.page-sell .sell-statement[data-statement-motion] .sell-statement__line {
  transform: translate3d(var(--statement-x, 0px), 0, 0);
  opacity: var(--statement-opacity, 1);
}
.page-sell .sell-testimonials__review-stage { padding-top: 7.5rem; }
.page-sell .sell-testimonials__review-stage .sell-testimonials__intro {
  margin-inline-start: 0;
  margin-bottom: 5rem;
}
.page-sell .sell-testimonials__review-stage .sell-testimonials__lede {
  margin: 0;
  color: var(--ivory);
}
@media (min-width: 1024px) {
  .page-sell .sell-testimonials__review-stage .sell-testimonials__intro {
    margin-inline-start: 0;
  }
}
@media (max-width: 719px) {
  .page-sell .sell-statement { padding-block: 5rem; }
  .page-sell .sell-statement__line { font-size: 2rem; line-height: 1.25; }
  .page-sell .sell-testimonials__review-stage { padding-top: 5rem; }
  .page-sell .sell-testimonials__review-stage .sell-testimonials__intro { margin-bottom: 4rem; }
}
@media (prefers-reduced-motion: reduce) {
  .page-sell .sell-statement[data-statement-motion] .sell-statement__line {
    transform: none;
    opacity: 1;
  }
}

/* Oct 23: prominent review heading, site font and color retained. */
.page-sell .sell-testimonials__review-stage { padding-top: clamp(4.5rem, 6vw, 6rem); }
.page-sell .sell-testimonials__review-stage .sell-testimonials__intro { margin-bottom: clamp(3.5rem, 5vw, 5rem); }
.page-sell .sell-testimonials__review-stage .sell-testimonials__lede { font-size: clamp(2rem, 3.4vw, 3.5rem); line-height: 1.15; max-width: 22ch; }
@media (max-width: 719px) {
  .page-sell .sell-testimonials__review-stage { padding-top: 4rem; }
  .page-sell .sell-testimonials__review-stage .sell-testimonials__intro { margin-bottom: 3rem; }
}


/* Oct 26 phone Sell Lit Wall: the approved desktop gallery's sticky scene
   progression on a compact portrait screen. Reuses existing sell.js scene
   markers and lighting; no change to desktop/tablet, other pages or no-JS flow. */
@media (max-width: 719px) and (orientation: portrait) {
  .page-sell .sell-wall[data-sell-live] {
    --sell-rail: clamp(8rem, 19svh, 10rem);
    --sell-pool: 17% 16%;
  }

  .page-sell .sell-wall[data-sell-live] .sell-wall__stage {
    position: sticky;
    top: var(--nav-h);
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: calc(100svh - var(--nav-h));
    overflow: hidden;
  }

  .page-sell .sell-wall[data-sell-live] .sell-wall__hang {
    display: block;
    position: relative;
    flex: none;
    width: min(
      calc(100% - 2 * var(--gutter)),
      calc((100svh - var(--nav-h) - var(--sell-rail) - 2rem) * 0.90)
    );
    max-width: 26rem;
    aspect-ratio: 0.96;
    margin: 0 auto var(--sell-rail);
    padding: 0;
  }

  .page-sell .sell-wall[data-sell-live] .sell-work {
    position: static;
    margin: 0;
  }
  .page-sell .sell-wall[data-sell-live] .sell-work__frame {
    position: absolute;
    left: var(--x);
    top: var(--y);
    width: var(--w);
    z-index: 1;
  }

  /* Four familiar works, arranged for a tall screen, all visible throughout
     the sequence. Numbers remain in the shared active caption below. */
  .page-sell .sell-wall[data-sell-live] .sell-work--1 { --x: 0%; --y: 8%; --w: 45%; }
  .page-sell .sell-wall[data-sell-live] .sell-work--2 { --x: 52%; --y: 18%; --w: 45%; }
  .page-sell .sell-wall[data-sell-live] .sell-work--3 { --x: 7%; --y: 51%; --w: 37%; }
  .page-sell .sell-wall[data-sell-live] .sell-work--4 { --x: 59%; --y: 64%; --w: 35%; }
  .page-sell .sell-wall[data-sell-live] .sell-work::before { display: none; }

  .page-sell .sell-wall[data-sell-live] .sell-work__frame--text {
    padding: 0.45rem;
    gap: 0.24rem;
  }
  .page-sell .sell-wall[data-sell-live] .sell-work__frame--text .sell-work__editorial {
    font-size: clamp(0.7rem, 2.6vw, 1rem);
    width: 100%;
  }
  .page-sell .sell-wall[data-sell-live] .sell-work__accent {
    height: 0.55rem;
  }

  /* Same warm travelling light and fade used by the desktop version. */
  .page-sell .sell-wall[data-sell-live] .sell-wall__light {
    display: block;
    position: absolute;
    left: -50%;
    top: -50%;
    z-index: 0;
    width: 200%;
    height: 200%;
    background:
      radial-gradient(var(--sell-pool) at 50% 50%, rgb(200 169 107 / 0.24), rgb(200 169 107 / 0) 100%),
      radial-gradient(var(--sell-pool) at 50% 50%, rgb(243 239 233 / 0.20), rgb(243 239 233 / 0.06) 50%, rgb(243 239 233 / 0) 100%);
    opacity: 0;
    transform: translate(var(--lx, 0%), var(--ly, 0%)) scale(var(--ls, 1));
    pointer-events: none;
    transition: transform 1400ms var(--ease-silk), opacity 1200ms var(--ease-silk);
  }
  .page-sell .sell-wall[data-sell-live][data-scene^="w"] .sell-wall__light {
    opacity: 1;
  }
  .page-sell .sell-wall[data-sell-live][data-scene="w1"] { --lx: -14%; --ly: -13%; --ls: .8; }
  .page-sell .sell-wall[data-sell-live][data-scene="w2"] { --lx: 12%; --ly: -7%; --ls: .85; }
  .page-sell .sell-wall[data-sell-live][data-scene="w3"] { --lx: -12%; --ly: 12%; --ls: .8; }
  .page-sell .sell-wall[data-sell-live][data-scene="w4"] { --lx: 13%; --ly: 15%; --ls: .75; }
  .page-sell .sell-wall[data-sell-live][data-scene="all"] { --lx: 0%; --ly: 0%; --ls: 1.6; }

  /* One stationary readable caption, swapped by the existing scene states. */
  .page-sell .sell-wall[data-sell-live] .sell-label {
    position: absolute;
    left: 0;
    top: calc(100% + .65rem);
    width: 100%;
    max-width: none;
    margin: 0;
    opacity: 0;
    transform: translate3d(0, 8px, 0);
    transition: opacity 700ms var(--ease-silk), transform 700ms var(--ease-silk);
  }
  .page-sell .sell-wall[data-sell-live] .sell-label__title {
    font-size: clamp(1.45rem, 5.3vw, 1.85rem);
    line-height: 1.12;
  }
  .page-sell .sell-wall[data-sell-live] .sell-label__text {
    font-size: clamp(.95rem, 3.5vw, 1.125rem);
    line-height: 1.42;
  }
  .page-sell .sell-wall[data-sell-live][data-scene="w1"] .sell-work--1 .sell-label,
  .page-sell .sell-wall[data-sell-live][data-scene="w2"] .sell-work--2 .sell-label,
  .page-sell .sell-wall[data-sell-live][data-scene="w3"] .sell-work--3 .sell-label,
  .page-sell .sell-wall[data-sell-live][data-scene="w4"] .sell-work--4 .sell-label {
    opacity: 1;
    transform: none;
    transition-delay: 300ms;
  }

  /* The desktop scene-step system becomes active on portrait phones.
     Hide the old in-flow markers to avoid two competing active scenes. */
  .page-sell .sell-wall[data-sell-live] .sell-work__marker,
  .page-sell .sell-wall[data-sell-live] .sell-wall__end { display: none; }
  .page-sell .sell-wall[data-sell-live] .sell-wall__steps {
    display: block;
    position: relative;
    margin-top: calc(var(--nav-h) - 100svh);
    pointer-events: none;
  }
  .page-sell .sell-wall[data-sell-live] .sell-step { height: 62svh; }
  .page-sell .sell-wall[data-sell-live] .sell-step--open { height: 32svh; }
  .page-sell .sell-wall[data-sell-live] .sell-step--all { height: 90svh; }
}

/* Match the existing site's accessibility contract; do not add motion when
   the visitor requests reduced motion. */
@media (max-width: 719px) and (orientation: portrait) and (prefers-reduced-motion: reduce) {
  .page-sell .sell-wall[data-sell-live] .sell-wall__light,
  .page-sell .sell-wall[data-sell-live] .sell-label {
    transition-duration: 1ms;
    transition-delay: 0ms;
  }
}


/* Oct 26 mobile Sell Lit Wall R3: one cinematic image at a time.
   Same four existing observer scenes and desktop pacing mechanism. No phone
   thumbnail pile, no detached light, no change to desktop, About or other pages.
   Initial/open shows The First Impression immediately; "all" holds the final
   art until the wall releases. Without JS the vertical gallery remains intact. */
@media (max-width: 719px) and (orientation: portrait) {
  .page-sell .sell-wall[data-sell-live] {
    --sell-rail: clamp(8rem, 18svh, 10rem);
  }
  .page-sell .sell-wall[data-sell-live] .sell-wall__hang {
    width: min(calc(100% - 2 * var(--gutter)), 27rem);
    max-width: 27rem;
    height: calc(100svh - var(--nav-h) - var(--sell-rail) - clamp(3rem, 7svh, 4rem));
    aspect-ratio: auto;
    margin: 0 auto var(--sell-rail);
  }

  /* Only one artwork has visibility in any active scene. No previews of
     neighboring images can protrude behind the active frame. */
  .page-sell .sell-wall[data-sell-live] .sell-work__frame {
    position: absolute;
    left: 50%;
    top: 58%;
    width: 100%;
    z-index: 1;
    opacity: 0;
    visibility: hidden;
    transform: translate3d(-50%, -46%, 0) scale(.92);
    transform-origin: center;
    transition:
      opacity 650ms var(--ease-silk),
      transform 800ms var(--ease-silk),
      visibility 0s linear 650ms,
      box-shadow 800ms var(--ease-silk);
  }

  /* The glow lives on the image, not at yesterday's gallery coordinates.
     When scenes change it moves with the image. */
  .page-sell .sell-wall[data-sell-live] .sell-wall__light {
    display: none;
  }
  .page-sell .sell-wall[data-sell-live][data-scene="open"] .sell-work--1 .sell-work__frame,
  .page-sell .sell-wall[data-sell-live][data-scene="w1"] .sell-work--1 .sell-work__frame,
  .page-sell .sell-wall[data-sell-live][data-scene="w2"] .sell-work--2 .sell-work__frame,
  .page-sell .sell-wall[data-sell-live][data-scene="w3"] .sell-work--3 .sell-work__frame,
  .page-sell .sell-wall[data-sell-live][data-scene="w4"] .sell-work--4 .sell-work__frame,
  .page-sell .sell-wall[data-sell-live][data-scene="all"] .sell-work--4 .sell-work__frame {
    z-index: 5;
    opacity: 1;
    visibility: visible;
    transform: translate3d(-50%, -50%, 0) scale(1);
    transition:
      opacity 700ms var(--ease-silk),
      transform 800ms var(--ease-silk),
      visibility 0s,
      box-shadow 800ms var(--ease-silk);
    box-shadow:
      0 0 2.6rem .3rem rgb(200 169 107 / .23),
      0 0 5rem .8rem rgb(200 169 107 / .09),
      0 1.6rem 3rem -1rem rgb(0 0 0 / .52);
  }

  /* Keep all three photographs framed in the same landscape proportions.
     Photo 03 is displayed through a centered crop, preserving its original
     artwork file while eliminating the jarring portrait-size jump. */
  .page-sell .sell-wall[data-sell-live] .sell-work--1 .sell-work__frame,
  .page-sell .sell-wall[data-sell-live] .sell-work--2 .sell-work__frame,
  .page-sell .sell-wall[data-sell-live] .sell-work--3 .sell-work__frame {
    width: 100%;
    aspect-ratio: 4 / 3;
  }
  .page-sell .sell-wall[data-sell-live] .sell-work--3 .sell-work__image {
    object-fit: cover;
    object-position: 50% 52%;
  }
  /* Fourth work stays square; significantly enlarge its editorial wording
     so the title and vertical gold accents occupy the focal panel. */
  .page-sell .sell-wall[data-sell-live] .sell-work--4 .sell-work__frame {
    width: 77%;
  }
  .page-sell .sell-wall[data-sell-live] .sell-work--4 .sell-work__frame--text {
    padding: clamp(.5rem, 1.8vw, .75rem);
    gap: clamp(.55rem, 2.1vw, .85rem);
  }
  .page-sell .sell-wall[data-sell-live] .sell-work--4 .sell-work__editorial {
    font-size: clamp(1.35rem, 7.5vw, 2.15rem);
    line-height: 1.08;
    width: 100%;
  }
  .page-sell .sell-wall[data-sell-live] .sell-work--4 .sell-work__editorial strong {
    font-size: 1.12em;
    letter-spacing: -.035em;
  }
  .page-sell .sell-wall[data-sell-live] .sell-work--4 .sell-work__accent {
    height: clamp(1.35rem, 4.5vw, 1.8rem);
  }

  /* Each caption occupies the same stable reading rail directly beneath
     the framed artwork. Scene transitions change the entire pair together. */
  .page-sell .sell-wall[data-sell-live] .sell-label {
    opacity: 0;
    visibility: hidden;
    transform: translate3d(0, 8px, 0);
    transition:
      opacity 500ms var(--ease-silk),
      transform 650ms var(--ease-silk),
      visibility 0s linear 500ms;
  }
  .page-sell .sell-wall[data-sell-live][data-scene="open"] .sell-work--1 .sell-label,
  .page-sell .sell-wall[data-sell-live][data-scene="w1"] .sell-work--1 .sell-label,
  .page-sell .sell-wall[data-sell-live][data-scene="w2"] .sell-work--2 .sell-label,
  .page-sell .sell-wall[data-sell-live][data-scene="w3"] .sell-work--3 .sell-label,
  .page-sell .sell-wall[data-sell-live][data-scene="w4"] .sell-work--4 .sell-label,
  .page-sell .sell-wall[data-sell-live][data-scene="all"] .sell-work--4 .sell-label {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition:
      opacity 600ms var(--ease-silk),
      transform 650ms var(--ease-silk),
      visibility 0s;
  }
  /* Open and all should be completely illuminated like their focused scenes. */
  .page-sell .sell-wall[data-sell-live][data-scene="open"] .sell-work--1 .sell-work__frame::after,
  .page-sell .sell-wall[data-sell-live][data-scene="all"] .sell-work--4 .sell-work__frame::after {
    opacity: 0;
  }

  /* A middle-ground opening dwell: shorter than the previous 270svh hold,
     but with enough room for the first photograph and its caption to settle.
     Subsequent scenes and observer timing remain unchanged. */
  .page-sell .sell-wall[data-sell-live] .sell-step--open { height: 55svh; }
  .page-sell .sell-wall[data-sell-live] .sell-step--w1 { height: 125svh; }
  .page-sell .sell-wall[data-sell-live] .sell-step--w2,
  .page-sell .sell-wall[data-sell-live] .sell-step--w3,
  .page-sell .sell-wall[data-sell-live] .sell-step--w4 { height: 105svh; }
  .page-sell .sell-wall[data-sell-live] .sell-step--all { height: 90svh; }
}

/* If motion is reduced, the selected artwork and label still remain readable. */
@media (max-width: 719px) and (orientation: portrait) and (prefers-reduced-motion: reduce) {
  .page-sell .sell-wall[data-sell-live] .sell-work__frame,
  .page-sell .sell-wall[data-sell-live] .sell-label {
    transition-duration: 1ms;
    transition-delay: 0ms;
  }
}