/* ==========================================================================
   BLOG MODULES STYLESHEET
   Harmonized with Neerways Gold & Dark Navy Theme
   ========================================================================== */

/* Main Colors */
:root {
  --blog-navy: #0e1f38;
  --blog-navy-light: #162a4a;
  --blog-gold: #ffb703;
  --blog-gold-hover: #ffa000;
  --blog-light-bg: #f8f9fa;
  --blog-card-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  --blog-hover-shadow: 0 15px 35px rgba(255, 183, 3, 0.15);
  --blog-transition: all 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.blog-section {
  background-color: var(--blog-light-bg);
  font-family: 'Outfit', sans-serif;
}

.blog-title-highlight {
  color: var(--blog-gold);
}

/* --- Blog Cards --- */
.blog-card {
  background: #ffffff;
  transition: var(--blog-transition) !important;
  border: 1px solid rgba(0, 0, 0, 0.05) !important;
  position: relative;
  z-index: 1;
}

.blog-card-img {
  height: 230px;
  object-fit: cover;
  transition: var(--blog-transition);
}

.blog-card:hover .blog-card-img {
  transform: scale(1.06);
}

.blog-transition-hover:hover {
  transform: translateY(-8px);
  box-shadow: var(--blog-hover-shadow) !important;
  border-color: rgba(255, 183, 3, 0.25) !important;
}

.blog-date-badge {
  background-color: var(--blog-gold) !important;
  color: #000000 !important;
  font-family: 'Outfit', sans-serif;
  font-weight: 850 !important;
  letter-spacing: 0.5px;
  border-bottom-left-radius: 12px !important;
}

.blog-icon-primary {
  color: var(--blog-gold) !important;
}

.blog-title-link {
  color: var(--blog-navy) !important;
  font-weight: 800;
  transition: color 0.25s ease;
}

.blog-title-link:hover {
  color: var(--blog-gold) !important;
}

.blog-btn-primary {
  background-color: var(--blog-navy) !important;
  color: #ffffff !important;
  font-weight: 700;
  border: 1.5px solid var(--blog-navy) !important;
  transition: var(--blog-transition);
}

.blog-btn-primary:hover {
  background-color: var(--blog-gold) !important;
  border-color: var(--blog-gold) !important;
  color: #000000 !important;
  transform: scale(1.05);
}

/* --- Blog Details Page --- */
.blog-details-section {
  font-family: 'Outfit', sans-serif;
  background-color: var(--blog-light-bg);
}

.blog-details-img {
  max-height: 480px;
  width: 100%;
  object-fit: cover;
}

.blog-details-title {
  color: var(--blog-navy);
  font-size: clamp(24px, 4vw, 36px);
  font-weight: 850;
  line-height: 1.3;
}

.blog-content-wrapper {
  font-size: 16px;
  line-height: 1.55;
  color: #4a5568 !important;
  overflow-wrap: anywhere;
  min-width: 0;
}

.blog-content-wrapper > :first-child {
  margin-top: 0;
}

.blog-content-wrapper > :last-child {
  margin-bottom: 0;
}

.blog-content-wrapper h2,
.blog-content-wrapper h3,
.blog-content-wrapper h4 {
  color: var(--blog-navy);
  line-height: 1.3;
  margin: 1.25rem 0 0.6rem;
}

.blog-content-wrapper h2:first-child,
.blog-content-wrapper h3:first-child {
  margin-top: 0;
}

.blog-content-wrapper p {
  margin: 0 0 0.85rem;
}

.blog-content-wrapper ul,
.blog-content-wrapper ol {
  margin: 0 0 1rem;
  padding-left: 1.5rem;
}

.blog-content-wrapper li {
  margin-bottom: 0.25rem;
}

.blog-content-wrapper .table-responsive {
  margin: 0.75rem 0 1rem;
  overflow-x: auto;
}

.blog-content-wrapper table {
  width: 100%;
  margin: 0.75rem 0 1rem;
  border-collapse: collapse;
  font-size: 0.95rem;
}

.blog-content-wrapper th,
.blog-content-wrapper td {
  border: 1px solid #dee2e6;
  padding: 0.55rem 0.65rem;
  vertical-align: top;
}

.blog-content-wrapper th {
  background: #fff7df;
  color: var(--blog-navy);
  font-weight: 700;
}

/* Price-list content pasted from the blog editor. */
.blog-content-wrapper .nw-price-wrap {
  width: 100%;
  margin: 0.75rem 0 1rem;
  overflow-x: auto;
}

.blog-content-wrapper .nw-price-table {
  width: 100%;
  min-width: 560px;
  margin: 0;
  border: 1px solid #dfe5ee;
  border-collapse: collapse;
  background: #ffffff;
}

.blog-content-wrapper .nw-price-table th {
  background: linear-gradient(135deg, var(--blog-gold) 0%, var(--blog-gold-hover) 100%);
  color: var(--blog-navy);
  border-color: var(--blog-gold);
  text-align: left;
}

.blog-content-wrapper .nw-price-table tbody th {
  background: #fff7df;
  color: var(--blog-navy);
  border-color: #ead9a5;
}

.blog-content-wrapper .nw-price-table td {
  color: #4a5568;
  background: #ffffff;
}

.blog-content-wrapper .nw-price-table tbody tr:nth-child(even) td {
  background: #f8fafc;
}

.blog-content-wrapper .nw-price-table strong {
  color: var(--blog-navy);
}

.blog-content-wrapper .nw-blog {
  margin: 0;
}

.blog-content-wrapper .nw-blog > :first-child {
  margin-top: 0;
}

.blog-btn-share {
  background-color: transparent !important;
  border: 1.5px solid rgba(0, 0, 0, 0.15) !important;
  color: var(--blog-navy) !important;
  transition: var(--blog-transition);
}

.blog-btn-share:hover {
  background-color: var(--blog-gold) !important;
  border-color: var(--blog-gold) !important;
  color: #000000 !important;
}

/* --- Sidebar --- */
.blog-sidebar-sticky {
  top: 90px;
}

.blog-post-link-item {
  transition: var(--blog-transition);
  padding: 8px;
  border-radius: 10px;
}

.blog-post-link-item:hover {
  background-color: rgba(255, 183, 3, 0.06);
}

.blog-recent-post-img {
  width: 70px;
  height: 70px;
  object-fit: cover;
}

.blog-post-title {
  font-size: 14.5px;
  line-height: 1.4;
  color: var(--blog-navy) !important;
  transition: color 0.25s ease;
}

.blog-post-link-item:hover .blog-post-title {
  color: var(--blog-gold) !important;
}

.blog-icon-lg-primary {
  font-size: 44px;
  color: var(--blog-gold);
}

.blog-border-warning {
  border-top-color: var(--blog-gold) !important;
}

.blog-btn-quote {
  background: linear-gradient(135deg, var(--blog-navy) 0%, var(--blog-navy-light) 100%) !important;
  color: #ffffff !important;
  transition: var(--blog-transition) !important;
  border: none !important;
}

.blog-btn-quote:hover {
  background: var(--blog-gold) !important;
  color: #000000 !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 15px rgba(255, 183, 3, 0.3) !important;
}

/* Social Share Colors */
.blog-bg-fb { background-color: #3b5998 !important; }
.blog-bg-tw { background-color: #1da1f2 !important; }
.blog-bg-wa { background-color: #25d366 !important; }

.blog-bg-fb:hover, .blog-bg-tw:hover, .blog-bg-wa:hover {
  opacity: 0.9;
  transform: translateY(-2px);
}
