.collections-page { min-height: 100vh; overflow: hidden; background: #030712; color: #f8fafc; }
.collections-shell { width: min(1180px, calc(100% - 2rem)); margin-inline: auto; }
.collections-hero { position: relative; overflow: hidden; border-bottom: 1px solid rgba(148, 163, 184, .12); background: radial-gradient(circle at 85% 15%, rgba(127, 29, 29, .26), transparent 32rem), linear-gradient(145deg, #111827, #030712 65%); }
.collections-hero-glow { position: absolute; inset: auto auto -12rem -8rem; width: 28rem; height: 28rem; border-radius: 50%; background: rgba(30, 64, 175, .16); filter: blur(90px); }
.collections-hero-layout { position: relative; display: grid; min-height: 34rem; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 3rem; padding-block: 10rem 5rem; }
.collections-hero-copy { max-width: 760px; }
.collections-kicker, .collection-detail-kicker { display: inline-flex; align-items: center; gap: .45rem; margin: 0; color: #fca5a5; font-size: .7rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.collections-hero h1 { max-width: 820px; margin: .9rem 0 0; color: #fff; font-family: "Playfair Display", serif; font-size: clamp(3.4rem, 9vw, 7.4rem); font-weight: 500; letter-spacing: -.055em; line-height: .93; text-wrap: balance; }
.collections-hero-copy > p:not(.collections-kicker) { max-width: 680px; margin: 1.35rem 0 0; color: #b7c2d2; font-size: clamp(1rem, 2vw, 1.15rem); line-height: 1.75; }
.collections-hero-link { display: inline-flex; align-items: center; gap: .45rem; margin-top: 1.75rem; color: #fecaca; font-size: .76rem; font-weight: 800; letter-spacing: .14em; text-decoration: none; text-transform: uppercase; transition: color .2s ease; }
.collections-hero-link:hover { color: #fff; }
.collections-overview { display: grid; gap: .65rem; width: min(100%, 15rem); }
.collections-overview div { display: grid; padding: 1rem 1.15rem; border: 1px solid rgba(248, 250, 252, .14); border-radius: 1rem; background: rgba(15, 23, 42, .58); backdrop-filter: blur(16px); }
.collections-overview strong { color: #fff; font-family: "Playfair Display", serif; font-size: 2.35rem; font-weight: 500; line-height: 1; }
.collections-overview span { margin-top: .42rem; color: #94a3b8; font-size: .67rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.collections-content { padding-block: 5.5rem; }
.collections-heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, 28rem); align-items: end; gap: 2rem; margin-bottom: 2rem; }
.collections-heading h2, .collections-footer-cta h2, .collection-detail-intro h2 { margin: .65rem 0 0; color: #fff; font-family: "Playfair Display", serif; font-size: clamp(2rem, 5vw, 3.4rem); font-weight: 500; letter-spacing: -.035em; line-height: 1.05; text-wrap: balance; }
.collections-heading > p, .collections-footer-cta p, .collection-detail-intro p { margin: 0; color: #94a3b8; font-size: .94rem; line-height: 1.75; }
.collections-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1rem; }
.collection-card { grid-column: span 4; min-height: 25rem; }
.collection-card.is-featured { grid-column: span 8; }
.collection-card > a { position: relative; display: grid; height: 100%; min-height: inherit; overflow: hidden; border: 1px solid rgba(148, 163, 184, .16); border-radius: 1.15rem; background: #111827; color: #fff; text-decoration: none; box-shadow: 0 18px 50px rgba(0, 0, 0, .22); transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease; }
.collection-card > a:hover { border-color: rgba(248, 113, 113, .46); box-shadow: 0 24px 65px rgba(0, 0, 0, .42); transform: translateY(-6px); }
.collection-card-media, .collection-card-media img, .collection-card-shade, .collection-card-placeholder { position: absolute; inset: 0; }
.collection-card-media img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.82); transition: filter .6s ease, transform .8s ease; }
.collection-card > a:hover img { filter: saturate(1); transform: scale(1.07); }
.collection-card-shade { background: linear-gradient(0deg, rgba(2, 6, 23, .98), rgba(2, 6, 23, .48) 48%, rgba(2, 6, 23, .08)); }
.collection-card-placeholder { display: grid; place-items: center; background: linear-gradient(145deg, #1e293b, #0f172a); color: #64748b; font-size: 3rem; }
.collection-card-index { position: absolute; top: 1rem; right: 1rem; color: rgba(255, 255, 255, .62); font-size: .7rem; font-weight: 800; letter-spacing: .16em; }
.collection-card-copy { position: relative; z-index: 1; display: flex; min-height: inherit; flex-direction: column; justify-content: end; padding: 1.35rem; }
.collection-card-meta, .collection-related-count { display: inline-flex; width: fit-content; align-items: center; gap: .32rem; margin-bottom: .6rem; color: #fca5a5; font-size: .66rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.collection-card-copy strong { max-width: 700px; color: #fff; font-family: "Playfair Display", serif; font-size: clamp(1.7rem, 4vw, 2.55rem); font-weight: 500; line-height: 1.02; text-wrap: balance; }
.collection-card-action { display: inline-flex; align-items: center; gap: .42rem; margin-top: .9rem; color: #cbd5e1; font-size: .7rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.collection-card-action i { color: #f87171; transition: transform .25s ease; }
.collection-card > a:hover .collection-card-action i { transform: translateX(.3rem); }
.collections-empty { display: grid; min-height: 18rem; place-items: center; align-content: center; gap: .8rem; border: 1px dashed rgba(148, 163, 184, .24); border-radius: 1.15rem; color: #64748b; text-align: center; }
.collections-empty i { color: #94a3b8; font-size: 2.6rem; }
.collections-footer-cta { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 2rem; margin-bottom: 5.5rem; padding: 2rem; border: 1px solid rgba(148, 163, 184, .14); border-radius: 1.25rem; background: linear-gradient(135deg, rgba(30, 41, 59, .7), rgba(15, 23, 42, .38)); }
.collections-footer-cta p:not(.collections-kicker) { max-width: 700px; margin-top: .8rem; }
.collections-footer-cta > a { display: inline-flex; align-items: center; gap: .45rem; border: 1px solid rgba(248, 113, 113, .38); border-radius: 999px; background: rgba(127, 29, 29, .18); padding: .78rem 1rem; color: #fecaca; font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-decoration: none; text-transform: uppercase; transition: .25s ease; }
.collections-footer-cta > a:hover { border-color: #f87171; background: rgba(185, 28, 28, .3); color: #fff; transform: translateY(-2px); }
.collection-detail-hero { background: #030712; }
.collection-detail-kicker { justify-content: center; margin-bottom: .75rem; }
.collection-detail-intro { display: grid; grid-template-columns: minmax(11rem, .45fr) minmax(0, 1fr); gap: 2rem; margin-bottom: 2rem; padding: 1.25rem 1.35rem; border: 1px solid rgba(148, 163, 184, .18); border-radius: 1.15rem; background: rgba(15, 23, 42, .9); box-shadow: 0 18px 48px rgba(0, 0, 0, .2); }
.collection-detail-intro h2 { margin-top: 0; font-size: clamp(1.55rem, 3vw, 2.35rem); }
.collection-detail-intro div > p { margin-top: .65rem; }
.collection-photo-card { border: 1px solid rgba(148, 163, 184, .12); }
.collection-photo-card:focus-visible { outline: 2px solid #f87171; outline-offset: 4px; }
.collection-photo-index { position: absolute; top: .7rem; right: .7rem; z-index: 21; padding: .28rem .38rem; border: 1px solid rgba(255, 255, 255, .16); border-radius: 999px; background: rgba(2, 6, 23, .46); color: rgba(255, 255, 255, .76); font-size: .6rem; font-weight: 800; letter-spacing: .1em; backdrop-filter: blur(8px); }
.collection-related-count { margin-bottom: .42rem; }
.collection-related-placeholder { display: grid; width: 100%; height: 100%; place-items: center; background: linear-gradient(145deg, #1e293b, #0f172a); color: #64748b; font-size: 2.4rem; }
.collection-lightbox-counter { margin-top: .55rem; color: #94a3b8; font-size: .68rem; font-weight: 800; letter-spacing: .16em; }
@media (max-width: 900px) {
  .collections-hero-layout, .collections-heading, .collections-footer-cta { grid-template-columns: 1fr; }
  .collections-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); width: min(100%, 28rem); }
  .collection-card, .collection-card.is-featured { grid-column: span 6; }
}
@media (max-width: 620px) {
  .collections-shell { width: min(100% - 1.2rem, 1180px); }
  .collections-hero-layout { min-height: auto; padding-block: 8rem 3.5rem; }
  .collections-hero h1 { font-size: clamp(3rem, 18vw, 5rem); }
  .collections-content { padding-block: 3.5rem; }
  .collections-heading { gap: .8rem; }
  .collection-card, .collection-card.is-featured { grid-column: 1 / -1; min-height: 21rem; }
  .collections-footer-cta { margin-bottom: 3.5rem; padding: 1.2rem; }
  .collection-detail-intro { grid-template-columns: 1fr; gap: .75rem; }
}
