/* ===== RESET ===== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

img {
  display: block;
  max-width: 100%;
}

/* ===== THEME ===== */
:root {
  --bg: #050505;

  --gold-strong: #f0d36b;
  --gold-main:   #d4af37;
  --gold-mid:    #caa24d;
  --gold-deep:   #b8962e;
  --gold-faint:  rgba(212,175,55,0.55);

  --text-strong: var(--gold-strong);
  --text:        var(--gold-main);
  --text-muted:  var(--gold-deep);
  --text-faint:  var(--gold-faint);

  --wrap: 1320px;
  --base: 18px;

  --frame-inset: 20px;
  --frame-thickness: 6px;
}

body {
  background: var(--bg);
  color: var(--text);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: var(--base);
  line-height: 1.6;
}

/* ===== FRAME ===== */
.frame {
  position: fixed;
  inset: var(--frame-inset);
  pointer-events: none;
  z-index: 1;
  border: var(--frame-thickness) solid var(--gold-main);
}

/* ===== LOGO ===== */
.logo-block {
  display: flex;
  justify-content: center;
  padding: 140px 0 64px;
}

.logo-block img {
  width: 760px;
  max-width: 92vw;
}

/* ===== HERO ===== */
.hero {
  padding-bottom: 96px;
  text-align: center;
}

.hero__inner {
  max-width: 980px;
  margin: 0 auto;
  padding: 0 28px;
}

.hero__kicker {
  font-size: 13px;
  letter-spacing: 0.36em;
  text-transform: uppercase;
  color: var(--text-faint);
  margin-bottom: 22px;
}

.hero__sub {
  font-size: 17px;
}

/* ===== GRID ===== */
.wrap {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 0 28px 160px;
}

.section__head {
  display: flex;
  justify-content: space-between;
  margin-bottom: 34px;
}

.section__title,
.section__meta {
  font-size: 13px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--text-faint);
}

.grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 34px;
}

/* ===== CARDS ===== */
.card {
  text-decoration: none;
  color: inherit;
}

.card__media {
  position: relative;
  border: 1px solid rgba(212,175,55,0.25);
}

.card__body {
  padding-top: 14px;
}

.card__row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}

.card__title {
  font-size: 14px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.card__price {
  font-size: 14px;
  color: var(--gold-mid);
}

.card__desc {
  font-size: 13px;
  color: var(--text-faint);
}

/* ===== SOLD STATE ===== */
.card--sold {
  pointer-events: none;
  opacity: 0.75;
}

.card__price--sold {
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--text-faint);
}

.card__sold {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--gold-main);
  background: rgba(5,5,5,0.55);
  backdrop-filter: blur(2px);
}

/* ===== FOOTER ===== */
.footer {
  border-top: 1px solid rgba(212,175,55,0.18);
  padding: 64px 28px;
  text-align: center;
}

.footer__label {
  font-size: 13px;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  margin-bottom: 20px;
  color: var(--text-faint);
}

.footer__links a {
  margin: 0 18px;
  font-size: 13px;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--text-muted);
  text-decoration: none;
}

.footer__links a:hover {
  color: var(--text-strong);
}

.footer__copy {
  margin-top: 34px;
  font-size: 13px;
  color: var(--text-faint);
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1100px) {
  .grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 800px) {
  .grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 520px) {
  .grid { grid-template-columns: 1fr; }
}

/* ===== COLLECTION SEPARATION (EXHIBITION SCALE) ===== */

.section--lower {
  margin-top: 220px;
  position: relative;
}

/* Optional: subtle editorial cue above lower section */
.section--lower::before {
  content: "";
  display: block;
  width: 160px;
  height: 1px;
  margin: 0 auto 120px;
  background: linear-gradient(
    to right,
    transparent,
    #bfa14a,
    transparent
  );
  opacity: 0.55;
}

/* ===== COLLECTION NOTE (PAUSE / BREATH) ===== */

.collection-note {
  max-width: 720px;
  margin: 160px auto 220px;
  text-align: center;
}

.collection-note::before {
  content: "";
  display: block;
  width: 120px;
  height: 1px;
  margin: 0 auto 60px;
  background: linear-gradient(
    to right,
    transparent,
    #bfa14a,
    transparent
  );
  opacity: 0.6;
}

.collection-note p {
  font-size: 13px;
  line-height: 1.7;
  letter-spacing: 0.04em;
  color: #bfa14a;
  opacity: 0.9;
}

/* ===== RESPONSIVE TUNING ===== */

@media (max-width: 768px) {
  .section--lower {
    margin-top: 160px;
  }

  .collection-note {
    margin: 120px auto 160px;
  }
}
/* ===== BIG DIVISION BETWEEN ALL COLLECTIONS ===== */
.section + .section {
  margin-top: 220px;
}

/* Optional: subtle divider line between collections */
.section + .section::before {
  content: "";
  display: block;
  width: 160px;
  height: 1px;
  margin: 0 auto 120px;
  background: linear-gradient(to right, transparent, #bfa14a, transparent);
  opacity: 0.55;
}

@media (max-width: 768px) {
  .section + .section {
    margin-top: 160px;
  }

  .section + .section::before {
    margin-bottom: 90px;
  }
}

/* ===== COLLAB HEADER: CENTERED LOGO (FULL COLOR, 1.5×) ===== */
.section__head--collab {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: start;
  margin-bottom: 40px; /* more breathing room for larger logo */
}

/* Left: COLLAB */
.section__head--collab .section__title {
  justify-self: start;
}

/* Center: Nessa’s Productions logo */
.section__head--collab .collab-logo {
  justify-self: center;
  height: 180px;        /* ~1.5× previous 105px */
  max-width: 450px;     /* scales proportionally */
  object-fit: contain;

  opacity: 1;           /* full color, no washout */
  filter: none;         /* remove grayscale */
}

/* Right: WITH NESSA'S PRODUCTIONS */
.section__head--collab .collab-meta-text {
  justify-self: end;
  text-align: right;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 900px) {
  .section__head--collab {
    grid-template-columns: 1fr;
    row-gap: 22px;
  }

  .section__head--collab .section__title,
  .section__head--collab .collab-meta-text {
    justify-self: start;
    text-align: left;
  }

  .section__head--collab .collab-logo {
    justify-self: start;
    height: 120px;      /* scaled down for mobile */
    max-width: 300px;
  }
}


/* ===== COLLAB: CENTER 2 CARDS WITHOUT SHRINKING ===== */
.grid--collab {
  grid-template-columns: repeat(2, minmax(280px, 360px));
  justify-content: center;
  column-gap: 64px;
}

/* Responsive: stack nicely */
@media (max-width: 800px) {
  .grid--collab {
    grid-template-columns: 1fr;
    justify-content: stretch;
    row-gap: 34px;
  }
}