/* publications/article.php */

.article-hero {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: max-content;
  margin: 0 auto;
  padding: min(64px, calc(64vw / var(--resizer) * 100)) min(28px, calc(28vw / var(--resizer) * 100));
  gap: min(56px, calc(56vw / var(--resizer) * 100));
  flex-wrap: wrap;
  max-width: min(70%, 784px);
}
.article-hero__media { display: flex; justify-content: center; align-items: center; flex-direction: column; gap: min(18px, calc(18vw / var(--resizer) * 100)); flex: 1 1 320px; min-width: 300px; }
.article-hero__image {
  width: 100%;
  height: min(354px, calc(354vw / var(--resizer) * 100));
  border-radius: min(16px, calc(16vw / var(--resizer) * 100));
  object-fit: cover;
  box-shadow: 0 min(14px, calc(14vw / var(--resizer) * 100)) min(34px, calc(34vw / var(--resizer) * 100)) max(-16px, calc(-16vw / var(--resizer) * 100)) rgba(254, 254, 254, .2);
}
.article-hero__body { display: flex; justify-content: center; align-items: flex-start; flex-direction: column; gap: min(18px, calc(18vw / var(--resizer) * 100)); flex: 1 1 320px; min-width: 300px; text-align: left; }
.article-hero__intro { display: flex; justify-content: flex-start; align-items: flex-start; max-width: 100%; gap: min(15px, calc(15vw / var(--resizer) * 100)); flex-direction: column; text-align: left; width: min(500px, calc(500vw / var(--resizer) * 100)); }
.article-hero__title { font-size: clamp(min(48px, var(--type-min)), calc(48vw / var(--resizer) * 100), 48px); font-weight: 700; }
.article-hero__title-highlight { color: var(--color-accent); }
.article-hero__excerpt { font-family: 'Space Grotesk', system-ui, sans-serif; font-size: clamp(min(19px, var(--type-min)), calc(19vw / var(--resizer) * 100), 19px); font-weight: 400; line-height: clamp(min(24px, var(--type-min)), calc(24vw / var(--resizer) * 100), 24px); }
.article-hero__actions { display: flex; justify-content: flex-start; align-items: center; gap: min(10px, calc(10vw / var(--resizer) * 100)); flex-wrap: wrap; width: 100%; height: min(50px, calc(50vw / var(--resizer) * 100)); }

.article-section { display: flex; justify-content: center; align-items: center; width: 80%; flex-direction: column; gap: min(16px, calc(16vw / var(--resizer) * 100)); padding: min(50px, calc(50vw / var(--resizer) * 100)) 10%; }
.article-card {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 74%;
  padding: min(50px, calc(50vw / var(--resizer) * 100));
  max-width: 825px;
  gap: min(43px, calc(43vw / var(--resizer) * 100));
  border-radius: min(16px, calc(16vw / var(--resizer) * 100));
  border: min(1px, calc(1vw / var(--resizer) * 100)) solid var(--color-text);
  flex-wrap: wrap;
}
.article-meta { display: flex; justify-content: center; align-items: center; width: auto; gap: min(10px, calc(10vw / var(--resizer) * 100)); flex-direction: column; }
.article-meta__author, .article-meta__date {
  color: var(--color-text);
  font-size: clamp(min(20px, var(--type-min)), calc(20vw / var(--resizer) * 100), 20px);
  overflow-wrap: break-word;
  white-space: normal;
}
.article-body {
  font-family: 'Space Grotesk', system-ui, sans-serif;
  font-size: clamp(min(22px, var(--type-min)), calc(22vw / var(--resizer) * 100), 22px);
  font-weight: 400;
  text-align: left;
}
.article-body p { margin: 1em 0; }
