/* Photography and small-screen refinements. Keep desktop layouts intact. */
.title-holder-hero .collection-hero__art img {
  /* Fade the photograph itself, including edges inside its contain box. */
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 100%;
  object-fit: contain;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 16%, #000 84%, transparent), linear-gradient(to bottom, transparent, #000 12%, #000 86%, transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent, #000 16%, #000 84%, transparent), linear-gradient(to bottom, transparent, #000 12%, #000 86%, transparent);
  mask-composite: intersect;
}
.title-holder-hero .collection-hero__art {
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 10%, #000 87%, transparent);
  mask-image: linear-gradient(to bottom, transparent, #000 10%, #000 87%, transparent);
}
@media (max-width: 900px) {
  .hero-image, .collection-hero__art {
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
  }
  .hero-image img, .collection-hero__art img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    filter: saturate(.92) contrast(1.08) brightness(.9);
    opacity: 1;
  }
  .hero-overlay, .collection-hero__shade {
    background: linear-gradient(180deg, rgba(6,6,6,.08) 0%, rgba(6,6,6,.32) 23%, rgba(6,6,6,.86) 46%, #060606 76%);
  }
  .hero-inner, .collection-hero__inner {
    display: block;
    min-height: 0;
    padding: 300px 28px 64px;
  }
  .hero-copy, .collection-hero__copy { position: relative; max-width: 680px; }
  .title-holder-hero .collection-hero__art {
    inset: 0; width: 100%; height: 650px; padding: 0; opacity: 1;
    align-items: flex-start;
  }
  .title-holder-hero .collection-hero__art img {
    width: auto; height: 650px; max-height: none; max-width: none;
    object-position: center top; filter: saturate(.95) contrast(1.08) brightness(.95);
  }
  .title-holder-hero .collection-hero__shade {
    background: linear-gradient(180deg, rgba(6,6,6,.04), rgba(6,6,6,.25) 25%, rgba(6,6,6,.88) 50%, #060606 76%);
  }
}
@media (max-width: 680px) {
  .hero, .collection-hero { min-height: 0; }
  .hero-image, .collection-hero__art { height: 640px; }
  .hero-inner, .collection-hero__inner { padding: 270px 22px 48px; }
  .hero-copy { padding-bottom: 0; }
  .hero h1, .collection-page:not(.entry-page) .collection-hero h1,
  .entry-page .collection-hero h1 {
    font-size: clamp(42px, 12vw, 64px); line-height: .98;
    overflow-wrap: normal;
  }
  .hero-copy .lede, .collection-lede { font-size: 20px; line-height: 1.45; }
  .hero-proof { margin-top: 28px; }
  .hero-actions { gap: 12px; }
  .hero-actions .button { width: 100%; box-sizing: border-box; min-height: 48px; white-space: normal; text-align: center; }
  .collection-hero__copy { text-shadow: 0 2px 16px rgba(0,0,0,.3); }
  .entry-page .collection-hero { display: block; position: relative; }
  .entry-page .collection-hero__art {
    position: absolute; inset: 0; width: 100%; height: 620px;
    max-width: none; margin: 0; opacity: 1; z-index: 0;
  }
  .entry-page .collection-hero__art img {
    width: 100%; height: 100%; aspect-ratio: auto;
    object-fit: contain; object-position: center top; filter: none;
  }
  .entry-page .collection-hero__shade {
    display: block; z-index: 1;
    background: linear-gradient(180deg, transparent 0%, rgba(6,6,6,.12) 22%, rgba(6,6,6,.88) 46%, #060606 70%);
  }
  .entry-page .collection-hero__inner { position: relative; z-index: 3; padding: 300px 22px 48px; }
  .title-request-page .hero-grid { position: relative; display: block; width: 100%; min-height: 0; }
  .title-request-page .hero-visual { position: absolute; inset: 0; height: 650px; min-height: 0; z-index: 0; }
  .title-request-page .hero-visual img { object-position: center top; }
  .title-request-page .hero-visual::before {
    box-shadow: none;
    background: linear-gradient(180deg, rgba(6,6,6,.04), rgba(6,6,6,.15) 25%, rgba(6,6,6,.92) 62%, var(--ink) 100%);
  }
  .title-request-page .hero-copy { position: relative; z-index: 2; padding: 300px 22px 44px; }
  .title-request-page h1 { font-size: clamp(42px,12vw,64px); line-height: 1; }
  input:not([type=checkbox]):not([type=radio]), select, textarea { font-size: 16px; max-width: 100%; }
  button, .button { min-height: 44px; }
  main, section, article, form { min-width: 0; }
  .collection-facts { margin-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}