/* Keep the drag instruction below the moving cards at every carousel position. */
.portfolio-section {
  background: linear-gradient(to bottom, #171a20 0%, #171a20 68%, #111318 84%, #171a20 100%);
}
.portfolio-section .portfolio-drag-hint { z-index: 120; }
@media (max-width: 820px) {
  .portfolio-section .portfolio-orbit { height: 720px; }
  .portfolio-section .portfolio-card { top: calc(59% - 76.7px); }
  .portfolio-section .portfolio-drag-hint { bottom: 24px; }
}
@media (max-width: 600px) {
  .portfolio-section .portfolio-orbit { height: 700px; }
  .portfolio-section .portfolio-card { top: calc(60% - 78px); }
}

/* Keep the full price and currency together in the request summary. */
.selected-plan > span { min-width: 0; }
.selected-plan > b { flex-shrink: 0; white-space: nowrap; }
@media (max-width: 820px) {
  .final-section { grid-template-columns: minmax(0, 1fr); }
  .request-card { min-width: 0; }
}
@media (max-width: 360px) {
  .request-card h2 { font-size: clamp(27px, 8.5vw, 30px); white-space: nowrap; }
}

/* Match the light field around the painting to the adjacent copy. */
.nk-cross-promo--paintings .nk-cross-promo__media { background: #f7f7f5; }
.nk-cross-promo--paintings .nk-cross-promo__media img { mix-blend-mode: darken; }

/* Painting catalog: align card titles and the purchase controls within each row. */
.shop-painting-card { display: flex; flex-direction: column; min-width: 0; }
.shop-painting-card .shop-product-image { flex: none; }
.shop-painting-card .shop-product-image img { width: 100%; height: 100%; object-fit: contain; }
.shop-painting-card .shop-product-copy { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.shop-painting-card .shop-product-copy > a { display: block; flex: 1; }
.shop-painting-card .shop-product-copy > div { display: flex; flex-wrap: nowrap; align-items: flex-start; gap: 8px; }
.shop-painting-card .shop-card-prices { flex: 1; min-width: 0; }
.shop-painting-card .shop-card-prices strong { white-space: nowrap; }
.shop-painting-card .shop-add { flex: 0 0 32px; }
.shop-product-detail-image[role="button"] { cursor: zoom-in; }
.shop-product-detail-image[role="button"]:focus-visible { outline: 3px solid #f0141b; outline-offset: 3px; }
.nk-painting-viewer { width: min(96vw, 1400px); height: min(96dvh, 1100px); max-width: none; max-height: none; border: 0; padding: 12px; background: #171a20; color: white; }
.nk-painting-viewer::backdrop { background: rgba(0,0,0,.88); }
.nk-painting-viewer[open] { display: flex; flex-direction: column; gap: 10px; }
.nk-painting-viewer__controls { display: flex; justify-content: flex-end; align-items: center; gap: 20px; }
.nk-painting-viewer__controls a, .nk-painting-viewer__controls button { color: white; background: transparent; border: 0; font: inherit; font-size: 14px; cursor: pointer; }
.nk-painting-viewer__controls a { text-decoration: underline; }
.nk-painting-viewer__image { min-height: 0; flex: 1; width: 100%; object-fit: contain; }

/* Show portrait paintings without cropping and let the viewer zoom and pan. */
 .shop-product-detail-image[data-viewer-ready] { aspect-ratio: auto; height: auto; }
.shop-product-detail-image[data-viewer-ready] img { display: block; width: 100%; height: auto; max-height: none; }
.nk-painting-viewer__controls { flex-wrap: wrap; gap: 8px 12px; }
.nk-painting-viewer__controls button[aria-label] { width: 38px; height: 38px; border: 1px solid #999; font-size: 23px; }
.nk-painting-viewer__controls button:disabled { opacity: .45; }
.nk-painting-viewer__zoom-label { min-width: 42px; text-align: center; font-size: 13px; }
.nk-painting-viewer__viewport { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; }
.nk-painting-viewer__image { display: block; max-width: none; max-height: none; height: auto; margin: auto; }


.shop-product-detail-image[data-viewer-ready] { align-self: start; }

/* Draw the price arrow as an icon so iOS cannot substitute an emoji glyph. */
.price-increase-arrow {
  display: inline-block;
  width: 18px;
  height: 18px;
  font-size: 0;
  line-height: 1;
  vertical-align: -3px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e82127' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 19 19 5M8 5h11v11'/%3E%3C/svg%3E") center / contain no-repeat;
}
.price-increase-arrow { font-size: 0 !important; }
.price-increase-arrow { vertical-align: middle !important; }