.blog-post-page
{
background:#000;
color:#fff;
min-height:100vh;
}

.blog-progress-bar
{
position:fixed;
top:0;
left:0;
width:100%;
height:3px;
z-index:1200;
background:rgba(255,255,255,0.06);
}

.blog-progress-bar-fill
{
width:0%;
height:100%;
background:linear-gradient(90deg,#a88627,#d4af37,#f0d77a);
box-shadow:0 0 12px rgba(212,175,55,0.45);
transition:width 0.08s linear;
}

.blog-post-hero
{
padding:96px 5% 48px;
text-align:center;
border-bottom:1px solid rgba(212,175,55,0.3);
}

.blog-post-hero-inner
{
max-width:820px;
margin:auto;
}

.post-category
{
color:#d4af37;
letter-spacing:0.12em;
text-transform:uppercase;
font-size:13px;
margin-bottom:16px;
}

.post-title
{
font-size:clamp(2rem,4vw,3.5rem);
line-height:1.2;
margin-bottom:20px;
}

.post-meta
{
color:rgba(255,255,255,0.6);
font-size:14px;
}

.post-meta-link
{
color:#d4af37;
text-decoration:none;
border-bottom:1px solid rgba(212,175,55,0.35);
transition:color 0.25s ease, border-color 0.25s ease, text-shadow 0.25s ease;
}

.post-meta-link:hover,
.post-meta-link:focus-visible
{
color:#f0d77a;
border-bottom-color:rgba(240,215,122,0.85);
text-shadow:0 0 10px rgba(212,175,55,0.22);
outline:none;
}

.blog-post-container
{
padding:var(--section-spacing-desktop) 5%;
}

.blog-post-content
{
max-width:760px;
margin:auto;
font-size:1.1rem;
line-height:1.8;
}

.blog-tldr-box
{
margin:0 0 34px 0;
padding:26px 26px 22px;
border:1px solid rgba(212,175,55,0.28);
border-radius:18px;
background:linear-gradient(180deg, rgba(212,175,55,0.08), rgba(255,255,255,0.02));
box-shadow:0 14px 30px rgba(0,0,0,0.22);
}

.blog-tldr-label
{
margin:0 0 14px 0;
color:#d4af37;
letter-spacing:0.12em;
text-transform:uppercase;
font-size:13px;
font-weight:700;
}

.blog-tldr-list
{
margin:0;
padding-left:20px;
}

.blog-tldr-list li
{
margin-bottom:10px;
color:rgba(255,255,255,0.9);
line-height:1.7;
}

.blog-tldr-list li:last-child
{
margin-bottom:0;
}

.blog-post-feature-image {
  display: block;
  width: 100%;
  max-width: 700px;
  height: auto;
  margin: 32px auto;
  border-radius: 12px;
}

.blog-post-content h2
{
margin-top:36px;
margin-bottom:16px;
font-size:1.8rem;
}

.blog-post-content h3
{
margin-top:28px;
margin-bottom:14px;
font-size:1.35rem;
}

.blog-post-content p
{
margin-bottom:22px;
color:rgba(255,255,255,0.85);
}

/* Themed inline links inside blog content */
.blog-post-content a
{
color:#d4af37;
text-decoration:none;
border-bottom:1px solid rgba(212,175,55,0.35);
transition:color 0.25s ease, border-color 0.25s ease, text-shadow 0.25s ease;
}

.blog-post-content a:hover,
.blog-post-content a:focus-visible
{
color:#f0d77a;
border-bottom-color:rgba(240,215,122,0.85);
text-shadow:0 0 10px rgba(212,175,55,0.22);
outline:none;
}

.blog-post-content a:visited
{
color:#c9a94a;
}

.author-box
{
margin-top:38px;
padding:24px;
border:1px solid rgba(212,175,55,0.2);
border-radius:16px;
background:rgba(255,255,255,0.02);
}

.author-box-label
{
margin:0 0 10px 0;
color:#d4af37;
letter-spacing:0.12em;
text-transform:uppercase;
font-size:12px;
font-weight:700;
}

.author-box h3
{
margin:0 0 10px 0;
font-size:1.35rem;
}

.author-box h3 a
{
color:#fff;
text-decoration:none;
border-bottom:1px solid transparent;
transition:color 0.25s ease, border-color 0.25s ease, text-shadow 0.25s ease;
}

.author-box h3 a:hover,
.author-box h3 a:focus-visible
{
color:#d4af37;
border-bottom-color:rgba(212,175,55,0.6);
text-shadow:0 0 10px rgba(212,175,55,0.2);
outline:none;
}

.author-box p
{
margin:0;
color:rgba(255,255,255,0.8);
}

.blog-inline-links
{
margin-top:28px;
padding-top:8px;
}

.blog-inline-links p
{
margin-bottom:10px;
}

.blog-inline-links ul
{
margin:0;
padding-left:20px;
}

.blog-inline-links li
{
margin-bottom:8px;
}

.blog-inline-links a
{
color:#d4af37;
text-decoration:none;
border-bottom:1px solid rgba(212,175,55,0.35);
transition:color 0.25s ease, border-color 0.25s ease, text-shadow 0.25s ease;
}

.blog-inline-links a:hover,
.blog-inline-links a:focus-visible
{
color:#f0d77a;
border-bottom-color:rgba(240,215,122,0.85);
text-shadow:0 0 10px rgba(212,175,55,0.22);
outline:none;
}

.blog-inline-links a:visited
{
color:#c9a94a;
}

.blog-post-cta
{
padding:76px 5%;
}

.blog-post-cta-inner
{
max-width:800px;
margin:auto;
text-align:center;
border:1px solid rgba(212,175,55,0.3);
padding:40px 32px;
border-radius:20px;
}

.blog-post-cta-inner h2
{
font-size:2rem;
margin-bottom:15px;
}

.blog-post-cta-inner p
{
margin-bottom:25px;
color:rgba(255,255,255,0.8);
}

@media (max-width:768px)
{
.blog-progress-bar
{
height:3px;
}

.blog-post-hero
{
padding:84px 5% 40px;
}

.blog-post-container
{
padding:var(--mobile-section-spacing) 5%;
}

.blog-post-content
{
font-size:1rem;
line-height:1.75;
}

.blog-tldr-box
{
padding:22px 20px 18px;
margin-bottom:28px;
}

.blog-tldr-list
{
padding-left:18px;
}

.blog-post-feature-image
{
margin-bottom:28px;
}

.blog-post-content h2
{
font-size:1.5rem;
margin-top:32px;
}

.blog-post-content h3
{
font-size:1.2rem;
}

.author-box
{
padding:20px;
margin-top:34px;
}

.blog-post-cta
{
padding:56px 5%;
}

.blog-post-cta-inner
{
padding:30px 22px;
}

.blog-post-cta-inner h2
{
font-size:1.7rem;
}
}
