/**
 * The TDA Wellness Journal & Blog Styles
 * 
 * Extracted from home.php for modularity and performance
 */

/* Force full width and ivory background on Astra body */
body.blog,
body.page-template-page-blogs,
body.page-template-page-blog,
body.archive {
  background: #FAF8F5 !important;
}
.site-content,
#content,
.ast-container {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  background: #FAF8F5 !important;
}

.tda-journal-main {
  background: #FAF8F5 !important;
  color: #1A1A2E !important;
  font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  width: 100% !important;
  padding: 0 0 100px 0 !important;
  box-sizing: border-box !important;
}
.tda-journal-main * {
  box-sizing: border-box !important;
}

/* -------------------------------------------------------------
   MAGAZINE HERO BANNER (HUMAN-CRAFTED EDITORIAL LUXURY)
------------------------------------------------------------- */
.tda-journal-hero {
  background: #0E2419 !important;
  background: linear-gradient(180deg, #091710 0%, #0E2419 60%, #133324 100%) !important;
  color: #FFFFFF !important;
  padding: 60px 24px 75px !important;
  text-align: center !important;
  position: relative !important;
  overflow: hidden !important;
  border-bottom: 1px solid rgba(212, 165, 116, 0.2) !important;
}
.tda-journal-hero::before {
  content: "" !important;
  position: absolute !important;
  top: 0; left: 0; right: 0; bottom: 0 !important;
  background-image: radial-gradient(circle at 50% -20%, rgba(212, 165, 116, 0.18) 0%, transparent 70%) !important;
  pointer-events: none !important;
}
.tda-journal-hero-inner {
  max-width: 820px !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 2 !important;
}
.tda-journal-kicker {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 2.2px !important;
  color: #D4A574 !important;
  margin-bottom: 12px !important;
}
.tda-journal-kicker::before,
.tda-journal-kicker::after {
  content: "" !important;
  width: 24px !important;
  height: 1px !important;
  background: rgba(212, 165, 116, 0.4) !important;
}
.tda-journal-hero h1 {
  font-family: "Playfair Display", Georgia, serif !important;
  font-size: 42px !important;
  font-weight: 600 !important;
  color: #FFFFFF !important;
  line-height: 1.2 !important;
  margin: 0 0 12px 0 !important;
  letter-spacing: -0.5px !important;
}
.tda-journal-hero p {
  font-size: 15.5px !important;
  color: #C3D3CA !important;
  line-height: 1.6 !important;
  margin: 0 auto 14px !important;
  max-width: 620px !important;
  font-weight: 400 !important;
}

/* Inline Category Navigation Bar */
.tda-journal-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  margin-top: 10px !important;
  margin-bottom: 0 !important;
}
.tda-nav-pill {
  padding: 6px 18px !important;
  border-radius: 99px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: #D2DFD8 !important;
  text-decoration: none !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  transition: all 0.25s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}
.tda-nav-pill:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #FFFFFF !important;
  border-color: rgba(212, 165, 116, 0.5) !important;
}
.tda-nav-pill.active {
  background: #D4A574 !important;
  color: #0E2419 !important;
  border-color: #D4A574 !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 14px rgba(212, 165, 116, 0.3) !important;
}

/* -------------------------------------------------------------
   MAIN JOURNAL CONTAINER & GRID (Elevated to Red Line)
------------------------------------------------------------- */
.tda-journal-content {
  max-width: 1240px !important;
  margin: -60px auto 0 !important;
  padding: 0 24px !important;
  position: relative !important;
  z-index: 10 !important;
}

/* Section Title Bar */
.tda-feed-header {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  margin-bottom: 28px !important;
  padding-bottom: 14px !important;
  border-bottom: 1px solid #EAE5DE !important;
}
.tda-feed-header h2 {
  font-family: "Playfair Display", Georgia, serif !important;
  font-size: 24px !important;
  font-weight: 600 !important;
  color: #11281E !important;
  margin: 0 !important;
}
.tda-feed-header span {
  font-size: 13px !important;
  color: #718096 !important;
  font-weight: 500 !important;
}

/* -------------------------------------------------------------
   FEATURED LEAD STORY (HERO CARD)
------------------------------------------------------------- */
.tda-lead-story {
  background: #FFFFFF !important;
  border-radius: 20px !important;
  border: 1px solid #ECE7E0 !important;
  overflow: hidden !important;
  margin-bottom: 54px !important;
  box-shadow: 0 10px 30px rgba(17, 40, 30, 0.05) !important;
  display: grid !important;
  grid-template-columns: 1.15fr 1fr !important;
  transition: box-shadow 0.3s ease, transform 0.3s ease !important;
}
.tda-lead-story:hover {
  box-shadow: 0 16px 40px rgba(17, 40, 30, 0.09) !important;
  transform: translateY(-2px) !important;
}
.tda-lead-image-col {
  position: relative !important;
  overflow: hidden !important;
  min-height: 380px !important;
  background: #0E2419 !important;
}
.tda-lead-image-col img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1) !important;
}
.tda-lead-story:hover .tda-lead-image-col img {
  transform: scale(1.04) !important;
}
.tda-lead-badge {
  position: absolute !important;
  top: 20px !important;
  left: 20px !important;
  background: rgba(14, 36, 25, 0.85) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  color: #F8E2C8 !important;
  border: 1px solid rgba(212, 165, 116, 0.5) !important;
  padding: 6px 14px !important;
  border-radius: 99px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  z-index: 3 !important;
}
.tda-lead-content-col {
  padding: 44px 40px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}
.tda-lead-meta {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-size: 12.5px !important;
  color: #718096 !important;
  margin-bottom: 14px !important;
  font-weight: 500 !important;
}
.tda-lead-meta .tda-cat-tag {
  color: #B28352 !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.8px !important;
  font-size: 11.5px !important;
}
.tda-lead-title {
  font-family: "Playfair Display", Georgia, serif !important;
  font-size: 29px !important;
  font-weight: 600 !important;
  color: #11281E !important;
  line-height: 1.28 !important;
  margin: 0 0 16px 0 !important;
  letter-spacing: -0.3px !important;
}
.tda-lead-title a {
  color: #11281E !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}
.tda-lead-title a:hover {
  color: #1B4332 !important;
}
.tda-lead-excerpt {
  font-size: 15px !important;
  line-height: 1.7 !important;
  color: #4A5568 !important;
  margin: 0 0 28px 0 !important;
}
.tda-lead-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-top: 20px !important;
  border-top: 1px solid #F0ECE6 !important;
}
.tda-lead-author {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
.tda-author-avatar {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: #11281E !important;
  color: #D4A574 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 15px !important;
  border: 1px solid #D4A574 !important;
}
.tda-author-info {
  font-size: 12.5px !important;
  color: #2D3748 !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}
.tda-author-info span {
  display: block !important;
  font-size: 11px !important;
  color: #718096 !important;
  font-weight: 400 !important;
}
.tda-lead-btn {
  background: #11281E !important;
  color: #FAF8F5 !important;
  padding: 10px 22px !important;
  border-radius: 99px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  transition: all 0.25s ease !important;
  border: 1px solid #11281E !important;
}
.tda-lead-btn:hover {
  background: #1B4332 !important;
  border-color: #1B4332 !important;
  color: #D4A574 !important;
  transform: translateX(3px) !important;
}

/* -------------------------------------------------------------
   3-COLUMN MAGAZINE STORY GRID
------------------------------------------------------------- */
.tda-story-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 32px !important;
  margin-bottom: 50px !important;
}
.tda-story-card {
  background: #FFFFFF !important;
  border-radius: 16px !important;
  border: 1px solid #ECE7E0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  box-shadow: 0 4px 18px rgba(17, 40, 30, 0.04) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}
.tda-story-card:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 14px 34px rgba(17, 40, 30, 0.08) !important;
  border-color: #DFD7CD !important;
}
.tda-story-thumb {
  position: relative !important;
  aspect-ratio: 16 / 10 !important;
  overflow: hidden !important;
  background: #0E2419 !important;
}
.tda-story-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.5s ease !important;
}
.tda-story-card:hover .tda-story-thumb img {
  transform: scale(1.06) !important;
}
.tda-story-category-pill {
  position: absolute !important;
  top: 14px !important;
  left: 14px !important;
  background: rgba(14, 36, 25, 0.85) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  color: #F8E2C8 !important;
  padding: 4px 12px !important;
  border-radius: 99px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  z-index: 2 !important;
}
.tda-story-body {
  padding: 24px 22px 20px !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
}
.tda-story-meta {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 12px !important;
  color: #718096 !important;
  margin-bottom: 10px !important;
}
.tda-story-meta i {
  font-size: 13px !important;
  color: #A0AEC0 !important;
}
.tda-story-title {
  font-family: "Playfair Display", Georgia, serif !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  color: #11281E !important;
  line-height: 1.35 !important;
  margin: 0 0 10px 0 !important;
  letter-spacing: -0.2px !important;
}
.tda-story-title a {
  color: #11281E !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}
.tda-story-title a:hover {
  color: #1B4332 !important;
}
.tda-story-excerpt {
  font-size: 14px !important;
  line-height: 1.65 !important;
  color: #5A6B62 !important;
  margin: 0 0 20px 0 !important;
  flex: 1 !important;
}
.tda-story-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-top: 14px !important;
  border-top: 1px solid #F2EEE8 !important;
  font-size: 12.5px !important;
}
.tda-story-link {
  color: #1B4332 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  transition: all 0.2s ease !important;
}
.tda-story-card:hover .tda-story-link {
  color: #D4A574 !important;
  transform: translateX(2px) !important;
}

/* -------------------------------------------------------------
   EDITORIAL APOTHECARY NEWSLETTER CALLOUT BANNER
------------------------------------------------------------- */
.tda-editorial-newsletter {
  background: #0E2419 !important;
  border-radius: 20px !important;
  padding: 48px 40px !important;
  color: #FFFFFF !important;
  margin: 50px 0 !important;
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(212, 165, 116, 0.3) !important;
  display: grid !important;
  grid-template-columns: 1.2fr 1fr !important;
  gap: 32px !important;
  align-items: center !important;
}
.tda-editorial-newsletter::before {
  content: "" !important;
  position: absolute !important;
  top: -50px; right: -50px;
  width: 250px; height: 250px;
  background: radial-gradient(circle, rgba(212, 165, 116, 0.15) 0%, transparent 70%) !important;
  pointer-events: none !important;
}
.tda-nl-left h3 {
  font-family: "Playfair Display", Georgia, serif !important;
  font-size: 28px !important;
  font-weight: 600 !important;
  color: #FFFFFF !important;
  margin: 0 0 10px 0 !important;
  line-height: 1.25 !important;
}
.tda-nl-left p {
  font-size: 14.5px !important;
  color: #C3D3CA !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}
.tda-nl-form {
  display: flex !important;
  gap: 10px !important;
}
.tda-nl-input {
  flex: 1 !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 99px !important;
  padding: 13px 20px !important;
  color: #FFFFFF !important;
  font-size: 13.5px !important;
  outline: none !important;
  transition: all 0.2s ease !important;
}
.tda-nl-input:focus {
  border-color: #D4A574 !important;
  background: rgba(255, 255, 255, 0.14) !important;
}
.tda-nl-input::placeholder {
  color: #8CA397 !important;
}
.tda-nl-btn {
  background: #D4A574 !important;
  color: #0E2419 !important;
  font-weight: 700 !important;
  border: none !important;
  border-radius: 99px !important;
  padding: 13px 26px !important;
  font-size: 13.5px !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: all 0.2s ease !important;
}
.tda-nl-btn:hover {
  background: #E2B98E !important;
  transform: translateY(-2px) !important;
}

/* -------------------------------------------------------------
   PAGINATION
------------------------------------------------------------- */
.tda-pagination-wrap {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 60px !important;
}
.tda-pagination-wrap .page-numbers {
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #11281E !important;
  background: #FFFFFF !important;
  border: 1px solid #ECE7E0 !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}
.tda-pagination-wrap .page-numbers:hover {
  background: #F0ECE6 !important;
  border-color: #D4A574 !important;
}
.tda-pagination-wrap .page-numbers.current {
  background: #11281E !important;
  color: #F8E2C8 !important;
  border-color: #11281E !important;
}
.tda-pagination-wrap .next,
.tda-pagination-wrap .prev {
  width: auto !important;
  padding: 0 18px !important;
  border-radius: 99px !important;
}

/* -------------------------------------------------------------
   RESPONSIVE BREAKPOINTS
------------------------------------------------------------- */
@media (max-width: 992px) {
  .tda-lead-story { grid-template-columns: 1fr !important; }
  .tda-lead-image-col { min-height: 280px !important; }
  .tda-story-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 24px !important; }
  .tda-editorial-newsletter { grid-template-columns: 1fr !important; padding: 36px 24px !important; }
}
@media (max-width: 640px) {
  .tda-journal-hero { padding: 50px 18px 55px !important; }
  .tda-journal-hero h1 { font-size: 32px !important; }
  .tda-journal-content { margin: -30px auto 0 !important; padding: 0 16px !important; }
  .tda-lead-content-col { padding: 28px 20px !important; }
  .tda-lead-title { font-size: 22px !important; }
  .tda-story-grid { grid-template-columns: 1fr !important; gap: 20px !important; }
  .tda-nl-form { flex-direction: column !important; }
  .tda-nl-btn { width: 100% !important; }
}