/* Blog Detail (single post) styles — OceanWP child theme
   Enqueued by single.php */

:root{
  --navy-deep:#0d4a5c;
  --teal:#4fb4c4;
  --teal-dark:#3a9aab;
  --teal-pale:#dcf0f2;
  --bg-light:#f4f6f7;
  --card-white:#ffffff;
  --text-dark:#16242b;
  --text-muted:#5b6b71;
  --link-blue:#1c6ea4;
}

/* Break the single-post content out of OceanWP's boxed container,
   same trick used on the blog listing template, so the page
   background and CTA banner can go full width if desired while
   the article text itself stays readable at a fixed max-width. */
.blt-breakout{
  background:var(--bg-light);
}

.post-wrap{
  max-width:960px;
  margin:0 auto;
  padding:56px 24px 20px;
  font-family:inherit;
  color:var(--text-dark);
  line-height:1.6;
}
.post-wrap a{text-decoration:none;}
.post-wrap img{max-width:100%; display:block;}

.post-tag{
  display:inline-block;
  font-size:0.78rem;
  font-weight:700;
  letter-spacing:0.6px;
  color:var(--link-blue);
  text-transform:uppercase;
  margin-bottom:18px;
}
.post-tag a{color:inherit;}

.post-title{
  font-size:clamp(1.9rem, 4vw, 2.6rem);
  font-weight:800;
  line-height:1.25;
  color:var(--text-dark);
  margin-bottom:22px;
  max-width:820px;
}

.post-excerpt{
  font-size:1.15rem;
  color:var(--text-muted);
  max-width:820px;
  margin-bottom:30px;
}

/* ===== META ROW ===== */
.post-meta{
  display:flex;
  align-items:center;
  gap:28px;
  flex-wrap:wrap;
  margin-bottom:28px;
}
.meta-author{
  display:flex;
  align-items:center;
  gap:12px;
}
.meta-avatar{
  width:44px;
  height:44px;
  border-radius:50%;
  object-fit:cover;
  flex-shrink:0;
}
.meta-author-name{
  font-weight:700;
  color:var(--link-blue);
  font-size:0.98rem;
}
.meta-item{
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--text-muted);
  font-size:0.92rem;
}
.meta-item svg{width:16px; height:16px; flex-shrink:0;}

/* ===== TAGS + SHARE ===== */
.post-taxrow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:16px;
  margin-bottom:34px;
}
.tag-list{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.tag-pill{
  background:var(--teal-pale);
  color:var(--navy-deep);
  font-size:0.85rem;
  font-weight:600;
  padding:8px 16px;
  border-radius:20px;
  display:inline-block;
}
.share-list{
  display:flex;
  gap:10px;
}
.share-btn{
  width:34px;
  height:34px;
  border-radius:50%;
  background:#16242b;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:background .15s ease;
}
.share-btn:hover{background:var(--teal-dark);}
.share-btn svg{width:15px; height:15px;}

/* ===== FEATURED IMAGE ===== */
.post-feature{
  width:100%;
  border-radius:16px;
  overflow:hidden;
  margin-bottom:40px;
  background:linear-gradient(150deg,#2b3540 0%, #47576a 55%, #364150 100%);
  position:relative;
}
.post-feature img{
  width:100%;
  height:auto;
  aspect-ratio:16/9.3;
  object-fit:cover;
}
.post-feature .fallback-icon{
  width:90px;
  height:90px;
  border-radius:50%;
  border:3px solid rgba(255,255,255,0.85);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-weight:800;
  font-size:44px;
  font-family:Georgia, serif;
  position:absolute;
  top:50%; left:50%;
  transform:translate(-50%,-50%);
}
.post-feature.is-fallback{
  aspect-ratio:16/9.3;
}

/* ===== ARTICLE BODY ===== */
.post-body{
  max-width:820px;
  color:var(--text-dark);
  font-size:1.05rem;
}
.post-body p{margin-bottom:26px;}
.post-body img{border-radius:12px; margin:10px 0 26px;}
.post-body h2,
.post-body h3{
  margin:34px 0 16px;
  font-weight:800;
  color:var(--text-dark);
}
.post-body a{color:var(--link-blue); text-decoration:underline;}
.post-body ul,
.post-body ol{margin:0 0 26px 22px;}
.post-body blockquote{
  border-left:4px solid var(--teal);
  padding:6px 0 6px 20px;
  margin:0 0 26px;
  color:var(--text-muted);
  font-style:italic;
}

/* ===== CTA BANNER ===== */
.cta-wrap{
  max-width:1600px;
  margin:60px auto 80px;
  padding:0 24px;
}
.cta-banner{
  background:linear-gradient(100deg, #0d4a5c 0%, #1a7288 100%);
  border-radius:16px;
  padding:44px 48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
  color:#fff;
}
.cta-text h3{
  font-size:1.5rem;
  font-weight:800;
  margin-bottom:10px;
}
.cta-text p{
  color:rgba(255,255,255,0.85);
  max-width:480px;
  font-size:0.98rem;
}
.cta-btn{
  background:var(--teal);
  color:#fff;
  font-weight:700;
  font-size:0.98rem;
  padding:14px 28px;
  border-radius:24px;
  border:none;
  white-space:nowrap;
  cursor:pointer;
  transition:background .15s ease;
  display:inline-block;
}
.cta-btn:hover{background:var(--teal-dark);}

@media (max-width:640px){
  .post-taxrow{flex-direction:column; align-items:flex-start;}
  .cta-banner{flex-direction:column; align-items:flex-start;}
}