Homepage: show two current series side by side as compact cards; v2.9.4

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

src/App.css

@@ -1134,6 +1134,48 @@
   opacity: 0.9;
 }
 
+/* Two series running at once: side-by-side compact cards instead of two stacked wide ones */
+.series-grid--two {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 1.75rem;
+  align-items: stretch;
+  max-width: 1040px;
+  margin: 0 auto;
+}
+.series-grid--two .series-card {
+  grid-template-columns: 1fr;
+  gap: 1.25rem;
+  max-width: none;
+  padding: 1.75rem;
+  align-content: start;
+  text-align: center;
+}
+.series-grid--two .series-art {
+  max-width: 200px;
+  margin: 0 auto;
+}
+.series-grid--two .series-info h3 {
+  font-size: clamp(1.25rem, 2vw, 1.5rem);
+  margin-bottom: 0.6rem;
+}
+.series-grid--two .series-info p {
+  font-size: 1rem;
+  line-height: 1.55;
+  margin-bottom: 1.25rem;
+  display: -webkit-box;
+  -webkit-line-clamp: 4;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+.series-grid--two .series-info .btn-primary,
+.series-grid--two .series-info .btn-secondary {
+  margin: 0.25rem 0.3rem;
+}
+@media (max-width: 860px) {
+  .series-grid--two { grid-template-columns: 1fr; }
+}
+
 .section-archive-series {
   background: #0b0b0b;
   border-top: 1px solid rgba(201, 168, 76, 0.12);

src/App.tsx

@@ -1341,7 +1341,7 @@ function LandingPage({ content }: { content: SiteContent }) {
             <span className="ornament">✦</span> Current Series{' '}
             <span className="ornament">✦</span>
           </h2>
-          <div className="series-grid">
+          <div className={`series-grid${content.secondSeries?.title?.trim() ? ' series-grid--two' : ''}`}>
             {[
               {
                 key: 'primary',