/* ---------------------------------------------------------------------
   pages.css
   Supplementary styles for pages that did not exist in the original
   static design (single article, author, contact, static page, 404).
   Kept in a separate file, on purpose, so style.css -- extracted
   directly from the original HTML -- stays untouched and pixel-exact.
   Reuses the same CSS custom properties defined in style.css (:root).
   --------------------------------------------------------------------- */

.page-section{
  padding: 30px 0 60px;
}

/* ---- Single article ---- */
.single-article .archive-title{ margin-bottom: 14px; }
.single-article .article-meta{
  font-family:'Inter', sans-serif;
  font-size: 13px;
  color: var(--meta);
  margin-bottom: 22px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items:center;
}
.single-article .article-figure{ margin-bottom: 24px; }
.single-article .article-figure img{
  width:100%;
  height:auto;
  display:block;
}
.single-article .article-figure figcaption{
  font-family:'Inter', sans-serif;
  font-size: 12.5px;
  color: var(--meta);
  padding-top: 8px;
}
.single-article .article-body{
  max-width: 760px;
  font-size: 17px;
  line-height: 1.7;
}
.single-article .article-body p{ margin-bottom: 18px; }

/* ---- Author page ---- */
.author-header{
  display:flex;
  align-items:center;
  gap: 20px;
  padding-bottom: 26px;
  border-bottom: 1px solid var(--rule);
  margin-bottom: 26px;
}
.author-header img{
  width: 84px; height: 84px;
  border-radius: 50%;
  object-fit: cover;
}
.author-header h1{
  font-family:'Playfair Display', serif;
  font-weight: 700;
  font-size: 26px;
}
.author-header .author-title{
  font-family:'Inter', sans-serif;
  font-size: 13px;
  color: var(--meta);
  margin-top: 4px;
}
.author-bio{ max-width: 640px; color: var(--ink-soft); }

/* ---- Static page / contact ---- */
.static-page .article-body{ max-width: 760px; font-size: 17px; line-height: 1.7; }
.contact-form{ max-width: 480px; display:flex; flex-direction:column; gap: 14px; margin-top: 20px; }
.contact-form label{ font-family:'Inter', sans-serif; font-size: 13px; font-weight:600; }
.contact-form input,
.contact-form textarea{
  font-family:'Inter', sans-serif;
  font-size: 14px;
  padding: 10px 12px;
  border: 1px solid var(--rule);
  background: #fff;
  color: var(--ink);
}
.contact-form textarea{ min-height: 140px; resize: vertical; }
.contact-form button{
  align-self:flex-start;
  background: var(--masthead-red);
  color: var(--paper);
  border: none;
  padding: 10px 22px;
  font-family:'Inter', sans-serif;
  font-weight:600;
  letter-spacing:0.03em;
  text-transform:uppercase;
  font-size: 12px;
  cursor:pointer;
}
.contact-form button:hover{ background:#8C1D19; }

/* ---- 404 ---- */
.error-page{
  text-align:center;
  padding: 90px 0 110px;
}
.error-page .error-code{
  font-family:'Playfair Display', serif;
  font-weight:900;
  font-size: clamp(64px, 12vw, 130px);
  color: var(--masthead-red);
  line-height:1;
}
.error-page h1{
  font-family:'Playfair Display', serif;
  font-weight:700;
  font-size: 24px;
  margin: 10px 0 16px;
}
.error-page p{ color: var(--ink-soft); margin-bottom: 26px; }
.error-page .btn-home{
  display:inline-block;
  background: var(--masthead-red);
  color: var(--paper);
  padding: 10px 22px;
  font-family:'Inter', sans-serif;
  font-weight:600;
  letter-spacing:0.03em;
  text-transform:uppercase;
  font-size: 12px;
}
.error-page .btn-home:hover{ background:#8C1D19; }

/* ---- Ad slot (used by components/advertisement.php when configured) ---- */
.ad-slot{ text-align:center; margin: 20px 0; }
.ad-slot img{ max-width:100%; height:auto; }
.ad-slot-label{
  display:block;
  font-family:'Inter', sans-serif;
  font-size: 10px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color: var(--meta);
  margin-top: 4px;
}

/* ---- Breaking news bar (used by components/breaking-news.php when configured) ---- */
.breaking-news-bar{
  background: var(--masthead-red);
  color: var(--paper);
}
.breaking-news-inner{
  display:flex;
  align-items:center;
  gap: 14px;
  height: 40px;
  font-family:'Inter', sans-serif;
  font-size: 13px;
}
.breaking-news-label{
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.05em;
  flex-shrink:0;
}
.breaking-news-list{ display:flex; gap: 24px; list-style:none; overflow-x:auto; }
.breaking-news-list a:hover{ text-decoration:underline; }

/* ---- Simple numbered pagination (used by components/pagination.php in future) ---- */
.pagination{
  display:flex;
  justify-content:center;
  gap: 8px;
  padding-top: 30px;
  font-family:'Inter', sans-serif;
  font-size: 13px;
}
.pagination-link{
  padding: 6px 12px;
  border: 1px solid var(--rule);
  color: var(--ink-soft);
}
.pagination-link.active{
  background: var(--ink);
  color: var(--paper);
  border-color: var(--ink);
}