/* =========================================================
   G&C CONTENT PAGES
   Shared mechanics for long-form Notebook, Test Kitchen,
   and Seen articles. Voice-specific styling stays in the
   page system that owns it.
   ========================================================= */

.content-post main{
  min-width:0;
}

.content-post :is(.post-article,.tk-post-article,.seen-article){
  overflow-wrap:anywhere;
}

.content-post :is(.post-article,.tk-post-article,.seen-article) img,
.content-post figure img{
  height:auto;
}

.content-post :is(.post-bottom-nav,.post-nav-bottom){
  min-width:0;
  width:min(720px,90%);
  margin:45px auto 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.content-post :is(.post-bottom-nav,.post-nav-bottom) a{
  min-width:0;
  text-underline-offset:4px;
}

.content-post :is(.post-bottom-nav,.post-nav-bottom) a:last-child{
  text-align:right;
}

@media(max-width:560px){
  .content-post :is(.post-bottom-nav,.post-nav-bottom){
    align-items:flex-start;
    gap:18px;
  }
}

@media (prefers-reduced-motion:reduce){
  .content-post *,
  .content-post *::before,
  .content-post *::after{
    scroll-behavior:auto !important;
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
  }
}


/* =========================================================
   ARTICLE CONVERSATION
   The website is the archive; social is where readers can talk.
   Facebook is intentionally the primary visual destination.
   ========================================================= */

.article-conversation {
  width:min(760px,90%);
  margin:72px auto 0;
  padding:32px 34px 34px;
  background:#11110f;
  color:#F6E6CF;
  border-top:3px solid #C8652C;
}

.article-conversation-kicker {
  display:block;
  margin-bottom:10px;
  color:#D7773F;
  font:800 9px/1 Arial,Helvetica,sans-serif;
  letter-spacing:2.4px;
}

.article-conversation h2 {
  margin:0 0 10px;
  color:#F6E6CF;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(27px,3vw,38px);
  font-weight:400;
  line-height:1.05;
}

.article-conversation p {
  max-width:620px;
  margin:0 0 22px;
  color:rgba(246,230,207,.82);
  font-family:Georgia,"Times New Roman",serif;
  font-size:15px;
  line-height:1.55;
}

.article-conversation-links {
  display:flex;
  align-items:stretch;
  gap:10px;
  flex-wrap:wrap;
}

.article-conversation-link {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:12px 16px;
  border:1px solid rgba(246,230,207,.42);
  color:#F6E6CF;
  font:800 9px/1.2 Arial,Helvetica,sans-serif;
  letter-spacing:1.45px;
  text-decoration:none;
}

.article-conversation-link:visited {
  color:#F6E6CF;
}

.article-conversation-link:hover,
.article-conversation-link:focus-visible {
  border-color:#D7773F;
  color:#D7773F;
}

.article-conversation-link-primary,
.article-conversation-link-primary:visited {
  flex:1 1 270px;
  background:#C8652C;
  border-color:#C8652C;
  color:#11110f;
}

.article-conversation-link-primary:hover,
.article-conversation-link-primary:focus-visible {
  background:#D7773F;
  border-color:#D7773F;
  color:#11110f;
}

@media(max-width:560px){
  .article-conversation{
    margin-top:56px;
    padding:28px 24px 30px;
  }

  .article-conversation-links{
    flex-direction:column;
  }

  .article-conversation-link,
  .article-conversation-link-primary{
    width:100%;
    flex:auto;
  }
}
