/* ============ Single Post ============ */

/* Hero */
.be-article-hero{
  padding: clamp(4rem, 10vw, 7rem) 1rem 2rem;
  padding-top: 190px;
  background: linear-gradient(180deg, #111926, #1b2536 70%);
  color:#fff;
  position:relative;
}
.be-article-hero .cs-container{
  max-width:80rem; margin:0 auto;
}
.be-article-hero .be-back{
  color:#cfd3dc; text-decoration:none; display:block; margin-bottom:.75rem;
}
.be-article-hero .be-back:hover{ text-decoration:underline; }
.be-article-hero .cs-topper{
  color: var(--primary);
  letter-spacing:.08em; text-transform:uppercase; font-weight:700;
}
.be-article-hero .cs-title{
  font-family: "Lora", serif;
  font-weight: 700;
  color:#fff;
  margin:.35rem 0 1rem 0;
  font-size: clamp(1.9rem, 3.8vw, 3rem);
  line-height:1.2;
}
.be-article-meta{
  display:flex; align-items:center; gap:.5rem; color:#cfd3dc; flex-wrap:wrap;
}
.be-article-meta .be-cats a{ color:#cfd3dc; text-decoration:none; }
.be-article-meta .be-cats a:hover{ color:#fff; }
.be-article-meta .sep{ margin:0 .5rem; opacity:.5; }
.be-article-meta .be-dot{ opacity:.5; }
.be-article-meta .be-read{ opacity:.9; }

/* Article */
.be-article{
  padding: var(--sectionPadding);
  background:#fff;
}
.be-article .cs-container{
  max-width: 58rem; margin:0 auto;
}

/* Featured image */
.be-featured{
  margin:0 0 1.5rem 0; border-radius:1rem; overflow:hidden;
  box-shadow: 0 18px 50px rgba(26,26,26,.10);
  background:#f7f7f7;
}
.be-featured-img{ width:100%; height:auto; display:block; }
.be-cap{ font-size:.9rem; color:#6b7280; padding:.75rem 1rem; background:#fafbfc; }

/* Gutenberg/content defaults */
.be-article-content{
  color: var(--bodyTextColor);
  font-size: var(--bodyFontSize);
  line-height:1.75;
}
.be-article-content > * + *{ margin-top:1.2em; }
.be-article-content h2,
.be-article-content h3,
.be-article-content h4{
  font-family:"Lora", serif;
  color: var(--headerColor);
  margin: 1.6em 0 .5em;
  line-height:1.25;
}
.be-article-content h2{ font-size: clamp(1.5rem, 2.8vw, 2.1rem); }
.be-article-content h3{ font-size: clamp(1.25rem, 2.2vw, 1.5rem); }
.be-article-content h4{ font-size: 1.125rem; }

.be-article-content a{
  color: var(--primary); text-decoration:underline;
}
.be-article-content blockquote{
  margin:1.5rem 0; padding:1rem 1.25rem; background:#fffbef;
  border-left:6px solid var(--primary); border-radius:.25rem; color:#111926;
  font-style:italic;
}
.be-article-content code{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  background:#f3f4f6; padding:.15rem .35rem; border-radius:.25rem;
}
.be-article-content pre{
  background:#0f172a; color:#e5e7eb; padding:1rem; border-radius:.5rem; overflow:auto;
}
.be-article-content img{ max-width:100%; height:auto; border-radius:.5rem; }
.be-article-content figure{ margin:1.5rem 0; }
.be-article-content figcaption{ color:#6b7280; font-size:.9rem; text-align:center; }

/* Alignment helpers */
.be-article-content .alignwide{ max-width:72rem; margin-left:auto; margin-right:auto; }
.be-article-content .alignfull{
  width:100vw; position:relative; left:50%; right:50%;
  margin-left:-50vw; margin-right:-50vw;
}

/* Footer meta (tags & share) */
.be-article-footer{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:1rem; margin-top:2rem; padding-top:1.25rem; border-top:1px solid #e8e8e8;
}
.be-tags .label, .be-share .label{ font-weight:700; margin-right:.5rem; color:var(--headerColor); }
.be-tags a{
  display:inline-block; margin:.25rem .25rem 0 0; padding:.25rem .5rem;
  border:1px solid #e8e8e8; border-radius:.375rem; color:#374151; text-decoration:none;
}
.be-tags a:hover{ border-color: var(--primary); color: var(--primary); }
.be-share{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.be-share-link{ color: var(--primary); text-decoration:none; font-weight:700; }
.be-share-link:hover{ text-decoration:underline; }

/* Prev/Next nav */
.be-post-nav{
  display:flex; justify-content:space-between; align-items:center;
  gap:1rem; margin-top:2rem; padding-top:1rem; border-top:1px solid #e8e8e8;
}
.be-post-nav a{
  text-decoration:none; color: var(--headerColor);
}
.be-post-nav a:hover{ color: var(--primary); }

/* Comments (basic tidy) */
.be-comments{ margin-top:2.5rem; }
.be-comments h2, .be-comments h3{ font-family:"Lora", serif; }
.comment-list{ list-style:none; padding:0; }
.comment-list .comment{ margin-bottom:1.25rem; border-bottom:1px solid #ececec; padding-bottom:1rem; }
.comment-meta a{ color:#6b7280; text-decoration:none; }
.comment-content p{ margin: .75rem 0; }
.comment-reply-link{ color: var(--primary); text-decoration:none; }

/* Buttons inside comments */
input[type="submit"], .submit{
  appearance:none; border:none; border-radius:.5rem; cursor:pointer;
  line-height:3rem; padding:0 1.25rem; font-weight:700; color:#fff; background: var(--primary);
}
input[type="submit"]:hover{ filter:brightness(.92); }

/* Responsive container for hero text widths */
@media (min-width: 48rem){
  .be-article-hero .cs-container{ max-width:80rem; }
}