/* INKstinct extends the established Fine Art typography and palette. */
.ink-page { --series-line: #3b3b3b; }
.ink-page .ink-intro { display: grid; grid-template-columns: 1.05fr 1fr; align-items: center; gap: clamp(32px, 5vw, 86px); padding: 48px 0 110px; }
.ink-intro-copy { max-width: 580px; }
.ink-link { display: inline-block; padding: 10px 0; border-bottom: 1px solid var(--orange); font-size: 14px; transition: border-color 180ms ease; }
.ink-link:hover { border-color: var(--ink); }
.ink-back { color: #b5b2ac; border-bottom-color: var(--series-line); font-size: 12px; }
.ink-intro h1 { margin: 34px 0 24px; font-size: clamp(62px, 7.2vw, 112px); font-weight: 400; line-height: .98; letter-spacing: -.04em; }
.ink-deck { margin: 0; font-size: clamp(25px, 2.8vw, 42px); line-height: 1.18; letter-spacing: -.025em; }
.ink-description { max-width: 430px; color: #b5b2ac; font-size: 16px; line-height: 1.65; margin: 26px 0 24px; }
.ink-lead { margin: 0; width: min(100%, max(280px, calc((100svh - 250px) * 2 / 3))); justify-self: end; }
.ink-image { position: relative; display: block; overflow: hidden; background: #eae7dd; cursor: zoom-in; }
.ink-image img { display: block; width: 100%; height: auto; transition: transform 550ms cubic-bezier(.16,1,.3,1); }
.ink-image-action { position: absolute; right: 16px; bottom: 16px; padding: 10px 14px; background: #070707; color: var(--ink); font-size: 12px; opacity: 0; transition: opacity 180ms ease; }
.ink-image:focus-visible .ink-image-action { opacity: 1; }
.ink-lead figcaption, .ink-work figcaption { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--series-line); }
.ink-lead figcaption h2, .ink-work h3 { font-size: 16px; font-weight: 400; margin: 0; line-height: 1.4; }
.ink-lead figcaption span, .ink-work figcaption span { color: #b5b2ac; font-size: 12px; }
.ink-collection { border-top: 1px solid var(--series-line); padding: 50px 0 110px; scroll-margin-top: 160px; }
.ink-collection-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 32px; margin-bottom: 64px; }
.ink-collection-heading h2, .ink-more h2 { margin: 0; font-size: clamp(28px, 3.4vw, 48px); line-height: 1.1; font-weight: 400; letter-spacing: -.025em; }
.ink-collection-heading p { color: #b5b2ac; line-height: 1.6; font-size: 15px; margin: 0; }
.ink-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: 80px clamp(36px, 7vw, 120px); }
.ink-work { margin: 0; min-width: 0; }
.ink-work:nth-child(even) { margin-top: 110px; }
.ink-more { border-top: 1px solid var(--series-line); padding: 70px 0 100px; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px, 7vw, 120px); }
.ink-more p { max-width: 390px; color: #b5b2ac; line-height: 1.6; margin: 22px 0 0; }
.ink-resources { border-top: 1px solid var(--series-line); }
.ink-resources a { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 0; font-size: 14px; border-bottom: 1px solid var(--series-line); text-decoration: underline; text-underline-offset: 5px; text-decoration-color: transparent; transition: text-decoration-color 180ms ease; }
.ink-resources a span { color: #b5b2ac; font-size: 12px; white-space: nowrap; }
.ink-resources a:hover, .ink-resources a:focus-visible { text-decoration-color: var(--orange); }
.ink-viewer { position: fixed; inset: 0; margin: 0; border: 0; padding: 0; width: 100vw; height: 100dvh; max-width: none; max-height: none; color: var(--ink); background: #070707; }
.ink-viewer::backdrop { background: #070707; }
.ink-viewer-inner { height: 100%; padding: 64px 84px 26px; }
.ink-viewer figure { height: 100%; margin: 0; display: grid; grid-template-rows: minmax(0,1fr) auto; gap: 18px; }
.ink-viewer-image { width: 100%; height: 100%; object-fit: contain; }
.ink-viewer[data-loading] .ink-viewer-image { opacity: 0; }
.ink-viewer[data-loading]::before { content: "Loading artwork…"; position: absolute; top: 48%; left: 0; width: 100%; text-align: center; color: #b5b2ac; font-size: 14px; }
.ink-viewer figcaption { display: flex; justify-content: space-between; align-items: center; gap: 20px; font-size: 14px; }
.ink-counter { color: #b5b2ac; font-variant-numeric: tabular-nums; font-size: 12px; }
.ink-viewer button { position: absolute; border: 1px solid #656565; background: #070707; color: var(--ink); min-width: 48px; min-height: 48px; cursor: pointer; }
.ink-viewer button:hover { border-color: var(--orange); }
.ink-close { top: 12px; right: 18px; padding: 0 18px; font-size: 13px; }
.ink-previous, .ink-next { top: calc(50% - 24px); display: grid; place-items: center; }
.ink-previous { left: 18px; }
.ink-next { right: 18px; }
.ink-viewer svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.ink-viewer-error { position: absolute; inset: 42% 84px auto; text-align: center; line-height: 1.6; }
.ink-viewer-error a { text-decoration: underline; display: block; }
@media (hover: hover) and (pointer: fine) {
  .ink-image:hover img { transform: scale(1.012); }
  .ink-image:hover .ink-image-action { opacity: 1; }
}
@media (max-width: 1100px) {
  .ink-page .shell { width: calc(100% - 60px); }
  .ink-intro h1 { font-size: clamp(58px, 7.5vw, 88px); }
}
@media (max-width: 700px) {
  .ink-page .shell { width: calc(100% - 40px); }
  .ink-page nav a:nth-child(2) { display: inline; }
  .ink-page nav a:nth-child(3) { display: none; }
  .ink-page .ink-intro { display: grid; grid-template-columns: 1fr; gap: 0; padding: 24px 0 60px; }
  .ink-intro-copy { display: contents; }
  .ink-back { order: 0; justify-self: start; }
  .ink-intro h1 { order: 1; font-size: clamp(64px, 16vw, 92px); margin: 24px 0 30px; }
  .ink-lead { order: 2; width: min(100%, 460px); justify-self: center; min-width: 0; }
  .ink-deck { order: 3; margin-top: 36px; font-size: 29px; }
  .ink-description { order: 4; margin: 20px 0; }
  .ink-intro-copy > .ink-link:last-child { order: 5; justify-self: start; }
  .ink-collection { padding: 36px 0 65px; scroll-margin-top: 125px; }
  .ink-collection-heading { display: block; margin-bottom: 36px; }
  .ink-collection-heading p { margin-top: 18px; }
  .ink-grid { grid-template-columns: 1fr; gap: 48px; }
  .ink-work:nth-child(even) { margin-top: 0; }
  .ink-more { grid-template-columns: 1fr; gap: 32px; padding: 42px 0 60px; }
  .ink-viewer-inner { padding: 72px 14px 82px; }
  .ink-viewer figcaption { font-size: 13px; }
  .ink-previous, .ink-next { top: auto; bottom: 18px; }
  .ink-previous { left: 14px; }
  .ink-next { right: 14px; }
  .ink-viewer-error { left: 24px; right: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .ink-image img { transform: none !important; }
}
