/**
 * ============================================================================
 * ARTICLE PAGE LAYOUT - TWO-COLUMN LAYOUT FOR ARTICLE PAGES
 * ============================================================================
 * Similar to home-page-layout but for individual article pages.
 * ============================================================================
 */

/* ========================================================================== */
/* LAYOUT CONTAINER */
/* ========================================================================== */
.article-page-layout {
  display: flex; /* Two-column layout */
  max-width: 1400px; /* Maximum width */
  margin: 0 auto; /* Center horizontally */
  padding: 0 20px; /* Horizontal padding */
  gap: 40px; /* Space between columns */
}

/* MAIN CONTENT AREA */
.article-page-layout__main {
  flex: 1; /* Grow to fill space */
  max-width: calc(100% - 340px); /* Prevent overflow */
}

/* SIDEBAR */
.article-page-layout__sidebar {
  width: 300px; /* Fixed width */
  flex-shrink: 0; /* Don't shrink */
  display: flex; /* Vertical stacking */
  flex-direction: column; /* Stack widgets */
  gap: 0; /* No gap (widgets have own margins) */
}