:root {
  --archive-content: 1380px;
  --archive-reading: 760px;
  --archive-gutter: clamp(24px, 5vw, 80px);
  --archive-section-space: clamp(76px, 9vw, 138px);
  --archive-media-gap: clamp(16px, 2.2vw, 34px);
  --archive-border: rgba(241, 238, 231, .15);
  --archive-muted: rgba(241, 238, 231, .64);
  --archive-soft: rgba(241, 238, 231, .48);
  --archive-surface: #0b0b0a;
}

.studio-archive-entry,
.studio-archive-index {
  background: #070707;
  color: var(--ivory);
}

.studio-archive-entry main,
.studio-archive-index main {
  overflow: hidden;
}

/* Shared Studio Archive article frame */
.archive-entry {
  margin: 0 auto;
  max-width: var(--archive-content);
  padding: clamp(158px, 14vw, 214px) var(--archive-gutter) var(--archive-section-space);
}

.archive-entry__header {
  border-bottom: 1px solid var(--archive-border);
  margin-bottom: var(--archive-section-space);
  padding-bottom: clamp(52px, 7vw, 94px);
}

.archive-entry__date,
.archive-entry__eyebrow {
  color: var(--archive-soft);
  font: 400 9px/1.45 "DM Mono", monospace;
  letter-spacing: .17em;
  margin: 0 0 28px;
  text-transform: uppercase;
}

.archive-entry__title,
.archive-copy h2,
.archive-copy h3,
.archive-index__title,
.archive-index-card h2 {
  color: var(--ivory);
  font-family: "Playfair Display", Georgia, serif;
  font-weight: 500;
  letter-spacing: -.048em;
}

.archive-entry__title {
  font-size: clamp(58px, 7.2vw, 116px);
  line-height: .9;
  margin: 0;
  max-width: 12.5ch;
}

.archive-section {
  border-bottom: 1px solid var(--archive-border);
  display: grid;
  gap: clamp(34px, 5vw, 78px);
  grid-template-columns: minmax(0, 1.12fr) minmax(300px, .88fr);
  padding: var(--archive-section-space) 0;
}

.archive-section--reverse {
  grid-template-columns: minmax(300px, .88fr) minmax(0, 1.12fr);
}

.archive-section--reverse .archive-media,
.archive-section--reverse > .archive-media-pair,
.archive-section--reverse > .archive-media-grid,
.archive-section--reverse > .archive-gallery {
  order: 2;
}

.archive-section--reverse .archive-copy {
  order: 1;
}

.archive-section--reading,
.archive-section--wide {
  display: block;
}

.archive-section--wide > .archive-copy {
  margin-top: clamp(42px, 6vw, 82px);
}

.archive-section--opening {
  padding-top: 0;
}

.archive-section--closing {
  border-bottom: 0;
}

.archive-copy {
  align-self: center;
  max-width: var(--archive-reading);
}

.archive-copy--reading {
  margin: 0 auto;
}

.archive-copy h2 {
  font-size: clamp(38px, 4.4vw, 66px);
  line-height: 1;
  margin: 0 0 34px;
}

.archive-copy h3 {
  font-size: clamp(26px, 2.7vw, 40px);
  line-height: 1.08;
  margin: 42px 0 22px;
}

.archive-copy p,
.archive-copy li {
  color: var(--archive-muted);
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.82;
}

.archive-copy p {
  margin: 0 0 24px;
}

.archive-copy p:last-child {
  margin-bottom: 0;
}

.archive-copy__lead {
  color: var(--ivory) !important;
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(24px, 2.3vw, 36px) !important;
  line-height: 1.34 !important;
}

.archive-copy__statement {
  border-left: 1px solid rgba(241, 238, 231, .35);
  color: rgba(241, 238, 231, .86) !important;
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(21px, 2vw, 31px) !important;
  line-height: 1.48 !important;
  margin: 38px 0 !important;
  padding-left: clamp(24px, 3vw, 42px);
}

.archive-copy ul {
  display: grid;
  gap: 8px;
  list-style: none;
  margin: 22px 0 32px;
  padding: 0;
}

.archive-copy li {
  border-top: 1px solid rgba(241, 238, 231, .12);
  padding: 13px 0 4px 24px;
  position: relative;
}

.archive-copy li::before {
  color: rgba(241, 238, 231, .45);
  content: "•";
  left: 0;
  position: absolute;
}

/* Reusable media wrappers */
.archive-media,
.archive-media-pair,
.archive-media-grid,
.archive-gallery {
  min-width: 0;
}

.archive-media {
  align-self: stretch;
  background: var(--archive-surface);
  overflow: hidden;
}

.archive-media--landscape { aspect-ratio: 16 / 10; }
.archive-media--portrait { aspect-ratio: 4 / 5; }
.archive-media--tall { aspect-ratio: 3 / 4; }
.archive-media--square { aspect-ratio: 1 / 1; }

.archive-media img,
.archive-media video,
.archive-media-pair img,
.archive-media-pair video,
.archive-media-grid img,
.archive-media-grid video,
.archive-gallery img {
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.archive-media video,
.archive-media-pair video,
.archive-media-grid video {
  background: #050505;
}

.archive-media-pair {
  display: grid;
  gap: var(--archive-media-gap);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.archive-media-pair > * {
  aspect-ratio: 4 / 5;
  background: var(--archive-surface);
  min-width: 0;
  overflow: hidden;
}

.archive-media-grid {
  display: grid;
  gap: var(--archive-media-gap);
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

.archive-media-grid > * {
  background: var(--archive-surface);
  min-width: 0;
  overflow: hidden;
}

.archive-media-grid__wide {
  aspect-ratio: 16 / 10;
  grid-column: span 7;
}

.archive-media-grid__portrait {
  aspect-ratio: 4 / 5;
  grid-column: span 5;
}

.archive-gallery {
  display: grid;
  gap: var(--archive-media-gap);
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.archive-gallery > * {
  aspect-ratio: 4 / 5;
  background: var(--archive-surface);
  min-width: 0;
  overflow: hidden;
}

.archive-gallery--four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.archive-gallery--four > * {
  aspect-ratio: 3 / 4;
}

.archive-related {
  align-items: center;
  border-top: 1px solid var(--archive-border);
  display: flex;
  flex-wrap: wrap;
  gap: 24px 48px;
  justify-content: space-between;
  margin-top: var(--archive-section-space);
  padding-top: 38px;
}

.archive-related .journal-link {
  min-height: 34px;
}

/* Article-specific image and video framing */
.archive-secret .media-lagoon-primary { object-position: 50% 50%; }
.archive-secret .media-lagoon-aerial { object-position: 50% 42%; }
.archive-secret .media-flower-tall { object-position: 50% 44%; }
.archive-secret .media-fringe { object-position: 50% 52%; }
.archive-secret .media-fringe-secondary { object-position: 50% 45%; }

.archive-bloom .media-bloom-board { object-position: 50% 45%; }
.archive-bloom .video-bloom-detail { object-position: 50% 50%; }

.archive-aurora .media-aurora-sky { object-position: 50% 50%; }
.archive-aurora .media-aurora-dance-01 { object-position: 50% 35%; }
.archive-aurora .media-aurora-dance-02 { object-position: 50% 28%; }
.archive-aurora .media-aurora-dance-03 { object-position: 50% 38%; }

.archive-magnetic .media-magnetic-detail { object-position: 50% 42%; }
.archive-magnetic .video-magnetic-studio { object-position: 50% 50%; }
.archive-magnetic .video-magnetic-performance { object-position: 50% 42%; }

.archive-gravity .media-gravity-opening { object-position: 50% 34%; }
.archive-gravity .media-gravity-cosmos { object-position: 50% 50%; }
.archive-gravity .media-velocity-cosmos { object-position: 50% 50%; }
.archive-gravity .media-gravity-gown { object-position: 50% 30%; }
.archive-gravity .media-velocity-gown { object-position: 50% 30%; }

.archive-blue-mirage .media-blue-opening { object-position: 50% 32%; }
.archive-blue-mirage .media-blue-inspiration { object-position: 50% 50%; }
.archive-blue-mirage .media-blue-butterfly { object-position: 50% 45%; }
.archive-blue-mirage .media-blue-dance { object-position: 50% 30%; }

.archive-burgundy .media-burgundy-performance { object-position: 50% 35%; }
.archive-burgundy .media-burgundy-mannequin { object-position: 50% 38%; }
.archive-burgundy .media-burgundy-flowers { object-position: 50% 50%; }
.archive-burgundy .media-burgundy-leather { object-position: 50% 50%; }
.archive-burgundy .media-burgundy-petals { object-position: 50% 48%; }

/* Studio Archive listing */
.archive-index {
  margin: 0 auto;
  max-width: var(--archive-content);
  padding: clamp(158px, 14vw, 214px) var(--archive-gutter) var(--archive-section-space);
}

.archive-index__header {
  border-bottom: 1px solid var(--archive-border);
  margin-bottom: clamp(58px, 8vw, 110px);
  padding-bottom: clamp(48px, 6vw, 84px);
}

.archive-index__title {
  font-size: clamp(68px, 9vw, 138px);
  line-height: .86;
  margin: 0;
}

.archive-index__intro {
  color: var(--archive-muted);
  font: 400 clamp(18px, 1.55vw, 25px)/1.55 "Playfair Display", Georgia, serif;
  margin: 34px 0 0;
  max-width: 720px;
}

.archive-index__grid {
  display: grid;
  gap: clamp(54px, 7vw, 100px) var(--archive-media-gap);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.archive-index-card {
  border-top: 1px solid var(--archive-border);
  display: grid;
  grid-template-rows: auto 1fr;
  padding-top: 18px;
}

.archive-index-card__media {
  aspect-ratio: 16 / 10;
  background: var(--archive-surface);
  display: block;
  overflow: hidden;
}

.archive-index-card__media img {
  display: block;
  height: 100%;
  object-fit: cover;
  transition: filter .7s ease, transform 1.2s cubic-bezier(.2, .75, .25, 1);
  width: 100%;
}

.archive-index-card:hover .archive-index-card__media img {
  filter: brightness(1.06);
  transform: scale(1.018);
}

.archive-preview-secret { object-position: 50% 50%; }
.archive-preview-bloom { object-position: 50% 47%; }
.archive-preview-aurora { object-position: 50% 36%; }
.archive-preview-magnetic { object-position: 50% 42%; }
.archive-preview-gravity { object-position: 50% 34%; }
.archive-preview-blue { object-position: 50% 31%; }
.archive-preview-burgundy { object-position: 50% 42%; }
.archive-preview-first-chapters { object-position: 50% 45%; }

.archive-index-card__copy {
  display: grid;
  padding-top: 26px;
}

.archive-index-card h2 {
  font-size: clamp(32px, 3.4vw, 54px);
  line-height: 1;
  margin: 18px 0 26px;
}

.archive-index-card .journal-card__link {
  margin-top: auto;
}

@media (max-width: 900px) {
  .archive-section,
  .archive-section--reverse {
    gap: 42px;
    grid-template-columns: 1fr;
  }

  .archive-section--reverse .archive-media,
  .archive-section--reverse > .archive-media-pair,
  .archive-section--reverse > .archive-media-grid,
  .archive-section--reverse > .archive-gallery,
  .archive-section--reverse .archive-copy {
    order: initial;
  }

  .archive-copy {
    max-width: 760px;
  }

  .archive-gallery--four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  :root {
    --archive-section-space: 68px;
    --archive-media-gap: 14px;
  }

  .archive-entry,
  .archive-index {
    padding-left: 24px;
    padding-right: 24px;
    padding-top: 136px;
  }

  .archive-entry__title {
    font-size: clamp(50px, 15vw, 72px);
  }

  .archive-copy h2 {
    font-size: clamp(36px, 11vw, 50px);
  }

  .archive-media-pair,
  .archive-gallery,
  .archive-gallery--four,
  .archive-index__grid {
    grid-template-columns: 1fr;
  }

  .archive-media-grid {
    grid-template-columns: 1fr;
  }

  .archive-media-grid__wide,
  .archive-media-grid__portrait {
    grid-column: auto;
  }

  .archive-media-pair > *,
  .archive-gallery > *,
  .archive-gallery--four > *,
  .archive-media-grid__portrait {
    aspect-ratio: 4 / 5;
  }

  .archive-media-grid__wide {
    aspect-ratio: 16 / 10;
  }

  .archive-related {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (prefers-reduced-motion: reduce) {
  .archive-index-card__media img {
    transition: none;
  }
}