/* Journal / Editorial page */
.journal {
  padding: calc(5rem + 20px) 0 var(--section-padding);
}

.journal .section-inner {
  padding-top: 0;
}

.journal__header {
  text-align: center;
  margin-bottom: var(--space-2xl);
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
}

.journal__title {
  font-family: var(--font-display);
  font-size: clamp(2rem, 5vw, 2.75rem);
  font-weight: 400;
  margin: 0 0 var(--space-sm);
  color: var(--text-dark);
}

.journal__intro {
  font-size: 1.05rem;
  color: var(--text-soft);
  margin: 0;
  line-height: 1.65;
}

.journal__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: var(--space-xl);
  list-style: none;
  margin: 0;
  padding: 0;
}

.journal-card {
  background: var(--white);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(45, 42, 38, 0.06);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  display: flex;
  flex-direction: column;
}

.journal-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 28px rgba(45, 42, 38, 0.1);
}

.journal-card__link {
  display: block;
  color: inherit;
  text-decoration: none;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.journal-card__img {
  height: 200px;
  background: linear-gradient(145deg, var(--pastel-mint) 0%, var(--pastel-aqua) 100%);
  flex-shrink: 0;
}

.journal-card__img--2 {
  background: linear-gradient(145deg, var(--accent-blush) 0%, var(--accent-coral) 100%);
}

.journal-card__img--3 {
  background: linear-gradient(145deg, var(--accent-peach) 0%, var(--pastel-mint) 100%);
}

.journal-card__img--4 {
  background: linear-gradient(145deg, var(--pastel-aqua) 0%, var(--accent-blush) 100%);
}

.journal-card__body {
  padding: var(--space-md);
  flex: 1;
  display: flex;
  flex-direction: column;
}

.journal-card__meta {
  font-size: 0.85rem;
  color: var(--text-soft);
  margin-bottom: var(--space-xs);
}

.journal-card__title {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 400;
  margin: 0 0 var(--space-sm);
  color: var(--text-dark);
  line-height: 1.3;
}

.journal-card__excerpt {
  font-size: 0.95rem;
  color: var(--text-soft);
  margin: 0 0 var(--space-sm);
  line-height: 1.55;
  flex: 1;
}

.journal-card__read {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--accent-coral);
  margin-top: auto;
}

.journal-card__read:hover {
  color: var(--text-dark);
}

.journal-card__link:hover .journal-card__read {
  text-decoration: underline;
}