:root { --art-paper: #f5f0e7; --art-paper-light: #fbf9f4; --art-ink: #181714; --art-muted: #756d63; --art-gold: #9e6a42; }
.artworks-page { color: var(--art-ink); background: var(--art-paper); }
.artworks-page main { padding-top: 74px; }
.artworks-page .site-header,
.artworks-page .site-header.scrolled { color: var(--ink); background: rgba(251,250,247,.97); border-color: var(--line); }
.artworks-kicker { margin: 0; color: var(--art-gold); font-size: .72rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.artwork-reveal { opacity: 0; transform: translateY(26px); transition: opacity .85s ease, transform 1s cubic-bezier(.2,.72,.2,1); }
.artwork-reveal.is-visible { opacity: 1; transform: none; }

.editorial-intro { position: relative; max-width: 1600px; min-height: calc(88svh - 74px); margin: auto; display: grid; grid-template-columns: 1fr 3.2fr 1.25fr; gap: clamp(28px, 5vw, 82px); align-items: end; padding: clamp(86px, 10vw, 152px) clamp(24px, 6vw, 106px) clamp(72px, 8vw, 124px); }
.editorial-intro::before { content: ""; position: absolute; top: 11%; right: 6.5%; width: 1px; height: 18%; background: rgba(24,23,20,.16); }
.editorial-intro .artworks-kicker { align-self: start; padding-top: .65rem; }
.editorial-intro h1 { margin: 0; max-width: 1050px; font: 500 clamp(5.2rem, 9.2vw, 10.8rem)/.8 "Cormorant Garamond", Georgia, serif; letter-spacing: -.06em; }
.editorial-intro h1 em { color: var(--art-gold); font-weight: 400; }
.editorial-intro-copy { max-width: 390px; padding-bottom: 8px; }
.editorial-intro-copy p { margin: 0 0 2.2rem; color: var(--art-muted); font-size: 1rem; line-height: 1.8; }
.editorial-intro-copy a { display: inline-flex; gap: 18px; align-items: center; padding-bottom: 8px; color: var(--art-ink); border-bottom: 1px solid rgba(24,23,20,.55); text-decoration: none; font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.editorial-folio { position: absolute; right: clamp(24px, 6vw, 106px); top: clamp(44px, 6vw, 88px); margin: 0; color: rgba(24,23,20,.45); font-size: .7rem; line-height: 1.7; letter-spacing: .15em; text-align: right; text-transform: uppercase; }

.collection-index { max-width: 1420px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); padding: 0 clamp(22px, 5vw, 82px) clamp(90px, 9vw, 145px); }
.collection-index a { display: flex; min-height: 90px; gap: 18px; align-items: center; padding: 18px 20px; color: var(--art-ink); border-top: 1px solid rgba(24,23,20,.24); text-decoration: none; font: 500 clamp(1.25rem, 1.8vw, 1.8rem)/1.05 "Cormorant Garamond", Georgia, serif; transition: color .25s ease, background .25s ease; }
.collection-index a + a { border-left: 1px solid rgba(24,23,20,.13); }
.collection-index a:hover, .collection-index a:focus-visible { color: var(--art-gold); background: rgba(255,255,255,.34); }
.collection-index span { color: var(--art-gold); font: 600 .68rem/1 Manrope, sans-serif; letter-spacing: .12em; }

.curated-collections { background: var(--art-paper-light); }
.category-gallery { position: relative; padding: clamp(92px, 11vw, 170px) clamp(22px, 5vw, 82px) clamp(115px, 13vw, 205px); border-top: 1px solid rgba(24,23,20,.12); }
.category-gallery:nth-child(even) { background: #f1ebe1; }
.category-heading { max-width: 1420px; margin: 0 auto clamp(58px, 7vw, 104px); display: grid; grid-template-columns: 1.5fr .5fr; gap: 60px; align-items: end; }
.category-number { display: block; margin-bottom: 16px; color: var(--art-gold); font-size: .7rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }
.category-heading h2 { margin: 0; font: 500 clamp(4.5rem, 8.4vw, 9.2rem)/.8 "Cormorant Garamond", Georgia, serif; letter-spacing: -.058em; }
.category-heading h2 em { color: var(--art-gold); font-weight: 400; }
.category-heading p { max-width: 390px; margin: 0 0 6px auto; color: var(--art-muted); font-size: 1rem; line-height: 1.78; }

.art-carousel { max-width: 1420px; margin: auto; }
.carousel-stage { position: relative; min-height: clamp(500px, 66vw, 800px); display: grid; place-items: center; overflow: hidden; padding: clamp(20px, 3vw, 46px); border: 1px solid rgba(113,82,55,.25); background: #fffefa; box-shadow: 0 25px 70px rgba(60,43,29,.15), 0 3px 10px rgba(60,43,29,.08); }
.carousel-stage::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(120deg, rgba(255,255,255,.24), transparent 22%, transparent 69%, rgba(255,255,255,.09)); mix-blend-mode: screen; }
.carousel-image-button { width: 100%; height: 100%; display: grid; place-items: center; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.carousel-image { box-sizing: border-box; max-width: 100%; max-height: clamp(455px, 61vw, 715px); object-fit: contain; filter: brightness(1.095) contrast(1.055) saturate(1.095); opacity: 1; transform: scale(1); transition: opacity .32s ease, transform .65s cubic-bezier(.2,.72,.2,1), filter .45s ease; }
.art-carousel.is-changing .carousel-image { opacity: 0; transform: scale(.985); }
.carousel-image-button:hover .carousel-image, .carousel-image-button:focus-visible .carousel-image { filter: brightness(1.12) contrast(1.065) saturate(1.13); transform: scale(1.012); }
.art-carousel[data-frame="light"] .carousel-image { padding: 7px; border: 16px solid #f2ede3; outline: 1px solid #b9aa95; background: #fff; box-shadow: 0 20px 45px rgba(45,35,25,.2), inset 0 0 0 1px rgba(255,255,255,.9); }
.art-carousel[data-frame="champagne"] .carousel-image { padding: 6px; border: 13px solid #b99a63; outline: 1px solid #6e5432; background: #f7f0e1; box-shadow: 0 22px 48px rgba(57,40,23,.24), inset 0 0 0 2px rgba(255,238,199,.52); }
.art-carousel[data-frame="gold"] .carousel-image { padding: 5px; border: 12px solid #9f7538; outline: 2px ridge #d5b679; background: #33291d; box-shadow: 0 22px 50px rgba(44,30,16,.28), inset 0 0 0 2px #e0c38c; }
.art-carousel[data-frame="rose"] .carousel-image { padding: 7px; border: 13px solid #ae806f; outline: 1px solid #694d43; background: #f6eae4; box-shadow: 0 22px 48px rgba(59,37,31,.24), inset 0 0 0 2px rgba(255,226,214,.55); }
.art-carousel[data-frame="silver"] .carousel-image { padding: 6px; border: 13px solid #aca9a2; outline: 1px solid #66645f; background: #f3f1ed; box-shadow: 0 22px 48px rgba(37,37,35,.24), inset 0 0 0 2px rgba(255,255,255,.64); }
.art-carousel[data-frame="bronze"] .carousel-image { padding: 6px; border: 13px solid #74533a; outline: 2px ridge #b58b61; background: #2c251f; box-shadow: 0 22px 50px rgba(38,27,20,.3), inset 0 0 0 2px rgba(205,163,116,.42); }
.art-carousel[data-frame="dark"] .carousel-image { padding: 6px; border: 13px solid #3a3732; outline: 1px solid #171614; background: #d0b17c; box-shadow: 0 22px 50px rgba(24,22,19,.32), inset 0 0 0 2px rgba(211,177,120,.5); }
.art-carousel[data-frame="black"] .carousel-image { padding: 5px; border: 12px solid #171716; outline: 1px solid #55514b; background: #d5bd91; box-shadow: 0 24px 52px rgba(18,17,15,.34), inset 0 0 0 1px rgba(225,196,143,.5); }
.carousel-counter { position: absolute; z-index: 2; top: 24px; left: 26px; padding: 10px 14px; border: 1px solid rgba(24,23,20,.14); border-radius: 999px; color: var(--art-ink); background: rgba(255,254,250,.82); backdrop-filter: blur(8px); font-size: .72rem; font-weight: 600; letter-spacing: .08em; }
.carousel-zoom { position: absolute; z-index: 3; top: 20px; right: 22px; width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid rgba(24,23,20,.14); border-radius: 50%; color: var(--art-ink); background: rgba(255,254,250,.87); box-shadow: 0 8px 22px rgba(37,27,18,.12); font-size: 1.3rem; cursor: zoom-in; }
.carousel-arrow { position: absolute; z-index: 3; top: 50%; width: 56px; height: 56px; display: grid; place-items: center; border: 1px solid rgba(24,23,20,.14); border-radius: 50%; color: var(--art-ink); background: rgba(255,254,250,.9); box-shadow: 0 10px 28px rgba(37,27,18,.15); font: 400 2.4rem/1 Georgia, serif; cursor: pointer; transform: translateY(-50%); transition: color .25s ease, background .25s ease, transform .25s ease; }
.carousel-arrow:hover, .carousel-arrow:focus-visible { color: white; background: var(--art-gold); transform: translateY(-50%) scale(1.05); }
.carousel-prev { left: 22px; }
.carousel-next { right: 22px; }
.carousel-thumbnails { display: flex; gap: 12px; overflow-x: auto; padding: 18px 3px 8px; scrollbar-width: thin; scrollbar-color: rgba(158,106,66,.55) transparent; scroll-snap-type: x proximity; }
.carousel-thumb { flex: 0 0 92px; height: 72px; overflow: hidden; padding: 3px; border: 1px solid rgba(24,23,20,.16); background: #fffefa; cursor: pointer; scroll-snap-align: start; transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease; }
.carousel-thumb img { width: 100%; height: 100%; object-fit: cover; filter: brightness(1.07) contrast(1.045) saturate(1.08); }
.carousel-thumb[aria-current="true"] { border-color: var(--art-gold); box-shadow: 0 0 0 2px rgba(158,106,66,.24); transform: translateY(-3px); }
.carousel-caption { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 34px; padding-top: 24px; border-top: 1px solid rgba(24,23,20,.18); }
.carousel-caption h3 { margin: 0 0 8px; font: 500 clamp(2.2rem, 3.3vw, 3.7rem)/.95 "Cormorant Garamond", Georgia, serif; letter-spacing: -.035em; }
.carousel-caption p { max-width: 760px; margin: 0; color: var(--art-muted); font-size: 1rem; line-height: 1.7; }
.carousel-caption-meta { align-self: start; color: var(--art-gold); font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-align: right; text-transform: uppercase; }

.artworks-closing { padding: clamp(120px, 15vw, 225px) 24px; color: white; text-align: center; background: #1b1916; }
.artworks-closing .artworks-kicker { color: #d3aa80; }
.artworks-closing h2 { margin: .5rem 0 2.8rem; font: 500 clamp(4.5rem, 9vw, 9.5rem)/.82 "Cormorant Garamond", Georgia, serif; letter-spacing: -.055em; }
.artworks-closing h2 em { color: #dfc1a0; font-weight: 400; }
.artworks-closing .button-outline { color: white; border-color: rgba(255,255,255,.55); }

body.collection-lightbox-open { overflow: hidden; }
.collection-lightbox { position: fixed; z-index: 120; inset: 0; display: grid; grid-template-columns: clamp(58px, 8vw, 120px) minmax(0, 1fr) clamp(58px, 8vw, 120px); align-items: center; padding: 50px 0 26px; color: white; background: rgba(10,9,8,.97); opacity: 0; visibility: hidden; transition: opacity .35s ease, visibility .35s ease; }
.collection-lightbox[hidden] { display: none; }
.collection-lightbox.is-open { opacity: 1; visibility: visible; }
.collection-lightbox figure { grid-column: 2; display: grid; grid-template-rows: minmax(0, 1fr) auto; width: 100%; height: 100%; min-height: 0; margin: 0; }
.collection-lightbox figure img { align-self: center; justify-self: center; max-width: 100%; max-height: calc(100vh - 155px); object-fit: contain; opacity: 0; transform: scale(.975); filter: brightness(1.06) contrast(1.045) saturate(1.075); box-shadow: 0 24px 85px rgba(0,0,0,.5); transition: opacity .3s ease, transform .5s cubic-bezier(.2,.72,.2,1); }
.collection-lightbox.image-ready figure img { opacity: 1; transform: scale(1); }
.collection-lightbox figcaption { display: flex; justify-content: space-between; gap: 32px; padding-top: 15px; color: rgba(255,255,255,.76); }
.collection-lightbox figcaption > span:first-child { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.collection-lightbox figcaption strong { font: 500 1.35rem/1.1 "Cormorant Garamond", Georgia, serif; }
.collection-lightbox figcaption small { color: rgba(255,255,255,.52); font-size: .76rem; line-height: 1.5; }
.collection-lightbox figcaption > span:last-child { flex: 0 0 auto; font-size: .7rem; letter-spacing: .15em; text-transform: uppercase; }
.collection-lightbox-nav, .collection-lightbox-close { border: 0; color: white; background: transparent; cursor: pointer; transition: opacity .25s ease, transform .25s ease; }
.collection-lightbox-nav { align-self: center; width: 100%; min-height: 100px; font-family: Georgia, serif; font-size: 3.4rem; opacity: .7; }
.collection-lightbox-nav:hover, .collection-lightbox-nav:focus-visible { opacity: 1; transform: scale(1.08); }
.collection-lightbox-prev { grid-column: 1; grid-row: 1; }
.collection-lightbox-next { grid-column: 3; grid-row: 1; }
.collection-lightbox-close { position: absolute; top: 17px; right: 24px; width: 48px; height: 48px; font-size: 2rem; opacity: .82; }
.collection-lightbox-close:hover, .collection-lightbox-close:focus-visible { opacity: 1; transform: rotate(4deg); }

@media (max-width: 900px) {
  .editorial-intro { grid-template-columns: 1fr; min-height: auto; padding-top: 110px; }
  .editorial-intro .artworks-kicker { align-self: auto; }
  .editorial-intro-copy { max-width: 560px; }
  .collection-index { grid-template-columns: 1fr 1fr; }
  .collection-index a:nth-child(3) { border-left: 0; }
  .category-heading { grid-template-columns: 1fr; gap: 28px; }
  .category-heading p { margin-left: 0; }
}

@media (max-width: 620px) {
  .editorial-intro { padding-top: 92px; padding-bottom: 76px; }
  .editorial-intro h1 { font-size: clamp(4.3rem, 20vw, 6.8rem); }
  .editorial-folio { display: none; }
  .collection-index { grid-template-columns: 1fr; padding-bottom: 70px; }
  .collection-index a + a { border-left: 0; }
  .collection-index a { min-height: 70px; }
  .category-gallery { padding-right: 16px; padding-left: 16px; }
  .category-heading h2 { font-size: clamp(4.1rem, 18vw, 6.5rem); }
  .carousel-stage { min-height: 58svh; padding: 58px 12px 24px; }
  .carousel-image { max-height: 50svh; }
  .carousel-arrow { width: 44px; height: 44px; font-size: 1.9rem; }
  .carousel-prev { left: 9px; }
  .carousel-next { right: 9px; }
  .carousel-counter { top: 13px; left: 13px; }
  .carousel-zoom { top: 10px; right: 12px; width: 42px; height: 42px; }
  .carousel-thumb { flex-basis: 76px; height: 60px; }
  .carousel-caption { grid-template-columns: 1fr; gap: 14px; }
  .carousel-caption-meta { text-align: left; }
  .collection-lightbox { grid-template-columns: 44px minmax(0, 1fr) 44px; padding: 62px 0 18px; }
  .collection-lightbox-nav { font-size: 2.5rem; }
  .collection-lightbox figcaption { gap: 12px; }
  .collection-lightbox figcaption small { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .artwork-reveal { opacity: 1; transform: none; transition: none; }
  .carousel-image { transition: none; }
}
