.post-header { padding: 96px 0 40px; border-bottom: 1px solid var(--line); }
.post-meta-row { display: flex; gap: 16px; align-items: center; font-family: 'Bricolage Grotesque', sans-serif; font-size: 11px; color: var(--gray); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 18px; flex-wrap: wrap; }
.post-meta-row a { color: var(--sodium); }
.post-cat-pill { padding: 4px 10px; background: var(--sodium); color: var(--bg); border-radius: 4px; font-weight: 600; }
.post-title { font-size: clamp(32px, 4.6vw, 52px); letter-spacing: -0.025em; line-height: 1.08; margin-bottom: 20px; max-width: 800px; }
.post-deck { font-size: 17px; color: var(--bone-dim); max-width: 720px; line-height: 1.55; }
.post-body { padding: 64px 0; }
.prose { max-width: 720px; }
.prose p, .prose ul, .prose ol { font-size: 16.5px; line-height: 1.72; color: var(--bone-dim); margin-bottom: 18px; }
.prose ul, .prose ol { padding-left: 22px; }
.prose li { margin-bottom: 8px; }
.prose strong { color: var(--bone); font-weight: 600; }
.prose em { font-family: 'Instrument Serif', serif; font-style: italic; color: var(--sodium); font-weight: 400; }
.prose a { color: var(--sodium); border-bottom: 1px solid rgba(255,106,0,0.32); transition: border-color 0.18s ease; }
.prose a:hover { border-color: var(--sodium); }
.prose h2 { font-size: clamp(22px, 2.8vw, 30px); margin: 44px 0 16px; letter-spacing: -0.02em; }
.prose h3 { font-size: 19px; margin: 28px 0 10px; letter-spacing: -0.012em; }
.cta-inline { padding: 22px 24px; border: 1px solid rgba(255,106,0,0.32); border-radius: 14px; background: rgba(255,106,0,0.04); margin: 32px 0; display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.cta-inline strong { color: var(--bone); display: block; margin-bottom: 4px; font-size: 15px; }
.cta-inline span { color: var(--bone-dim); font-size: 13.5px; }
.cta-inline .btn-ghost { padding: 10px 18px; border: 1px solid var(--line-3); border-radius: 999px; color: var(--bone); font-size: 13.5px; transition: all 0.22s ease; }
.cta-inline .btn-ghost:hover { border-color: var(--sodium); color: var(--sodium); }
.cta-inline .btn-primary { padding: 10px 20px; background: var(--sodium); color: var(--bg) !important; border-radius: 999px; font-weight: 600; font-size: 13.5px; }
.callout { padding: 18px 22px; border-left: 3px solid var(--sodium); background: rgba(255,106,0,0.05); border-radius: 0 12px 12px 0; margin: 24px 0; font-size: 15.5px; color: var(--bone-dim); line-height: 1.65; }
.callout strong { color: var(--bone); }
.faq-section { padding: 56px 0; border-top: 1px solid var(--line); }
.faq-section h2 { font-size: 28px; margin-bottom: 28px; letter-spacing: -0.02em; }
.faq-item { border-bottom: 1px solid var(--line); padding: 20px 0; }
.faq-item:last-child { border-bottom: none; }
.faq-q { font-weight: 600; font-size: 17px; color: var(--bone); margin-bottom: 8px; }
.faq-a { font-size: 15.5px; color: var(--bone-dim); line-height: 1.65; }
.related { padding: 48px 0; border-top: 1px solid var(--line); }
.related h3 { font-size: 13px; margin-bottom: 16px; font-family: 'Bricolage Grotesque', sans-serif; color: var(--gray); letter-spacing: 0.12em; text-transform: uppercase; font-weight: 500; }
.related-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; max-width: 720px; }
.related-card { padding: 18px; border: 1px solid var(--line-2); border-radius: 12px; transition: all 0.22s ease; }
.related-card:hover { border-color: rgba(255,106,0,0.32); background: rgba(255,106,0,0.03); }
.related-card .label { font-family: 'Bricolage Grotesque', sans-serif; font-size: 10.5px; color: var(--sodium); letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 6px; }
.related-card .title { color: var(--bone); font-size: 15px; line-height: 1.35; }
.breadcrumbs { font-family: 'Bricolage Grotesque', sans-serif; font-size: 11px; color: var(--gray); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 14px; }
.breadcrumbs a { color: var(--sodium); }
.breadcrumbs span { margin: 0 8px; opacity: 0.5; }
@media (max-width: 600px) { .related-grid { grid-template-columns: 1fr; } }

.nav-brand-stack { display: inline-flex; flex-direction: column; line-height: 1.05; }
.nav-brand-sub { font-family: 'Bricolage Grotesque', sans-serif; font-size: 10.5px; color: var(--bone-dim); letter-spacing: 0.16em; text-transform: uppercase; font-weight: 500; margin-top: 1px; }
.footer-brand-stack { display: inline-flex; flex-direction: column; line-height: 1.1; vertical-align: middle; }
.footer-brand-sub { font-family: 'Bricolage Grotesque', sans-serif; font-size: 11px; color: var(--bone-dim); letter-spacing: 0.16em; text-transform: uppercase; font-weight: 500; margin-top: 2px; }
.nav-employers { padding: 6px 14px; border: 1px solid var(--line-3); border-radius: 999px; font-size: 12.5px; letter-spacing: 0.04em; color: var(--bone) !important; transition: all 0.22s var(--easing); }
.nav-employers:hover { border-color: var(--sodium); color: var(--sodium) !important; transform: translateY(-1px); }
.nav-mobile-divider { height: 1px; background: var(--line-2); margin: 18px 14px; }


.nav-browse-jobs { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; color: var(--bone-dim); transition: color 0.22s ease; }
.nav-browse-jobs:hover { color: var(--sodium); }
.nav-browse-jobs span { font-size: 12px; }


/* ============== JOBS TRAFFIC BOOST · TOP BANNER + JOBS FLOATER + PULSE ============== */
.jobs-banner { position: sticky; top: 0; display: flex; align-items: center; justify-content: center; gap: 0; background: linear-gradient(90deg, #FF6A00 0%, #FF8533 50%, #FF6A00 100%); color: #0A0908; padding: 0 56px 0 0; min-height: 38px; font-family: 'Bricolage Grotesque', sans-serif; font-size: 12.5px; font-weight: 500; letter-spacing: 0.04em; z-index: 100; }
.jobs-banner.is-hidden { display: none; }
.jobs-banner-link { display: flex; align-items: center; gap: 14px; padding: 9px 24px; color: #0A0908 !important; text-decoration: none; flex: 1; justify-content: center; transition: opacity 0.22s ease; }
.jobs-banner-link:hover { opacity: 0.85; }
.jobs-banner-dot { width: 8px; height: 8px; border-radius: 50%; background: #0A0908; flex-shrink: 0; }
.jobs-banner-label { font-weight: 700; letter-spacing: 0.16em; }
.jobs-banner-text { font-weight: 400; }
.jobs-banner-text strong { font-weight: 700; }
.jobs-banner-cta { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; padding: 4px 12px; background: rgba(10,9,8,0.10); border-radius: 999px; transition: background 0.22s ease, gap 0.22s ease; }
.jobs-banner-link:hover .jobs-banner-cta { background: rgba(10,9,8,0.18); gap: 8px; }
.jobs-banner-close { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); background: transparent; border: none; color: #0A0908; font-size: 22px; line-height: 1; cursor: pointer; padding: 6px 10px; opacity: 0.65; transition: opacity 0.22s ease; font-family: inherit; }
.jobs-banner-close:hover { opacity: 1; }
@media (max-width: 640px) {
  .jobs-banner-link { gap: 8px; padding: 9px 16px; font-size: 11.5px; }
  .jobs-banner-label { display: none; }
  .jobs-banner-text { font-size: 11.5px; }
  .jobs-banner-text strong { color: #0A0908; }
}
@media (max-width: 480px) {
  .jobs-banner-cta { display: none; }
}


/* When banner is visible, nav sticks BELOW it (not at top: 0) */
body:not(.jobs-banner-dismissed) .nav { top: 38px; }
@media (max-width: 640px) { body:not(.jobs-banner-dismissed) .nav { top: 38px; } }
body.jobs-banner-dismissed .nav { top: 0; }

/* ============== JOBS FLOATER (bottom-left, mirror of employer floater) ============== */
.jobs-floater { display: none; position: fixed; bottom: 28px; left: 28px; z-index: 99; padding: 13px 22px; background: var(--sodium); border: 1px solid var(--sodium); color: var(--bg) !important; font-family: 'Bricolage Grotesque', sans-serif; font-weight: 600; font-size: 14px; border-radius: 999px; box-shadow: 0 12px 32px rgba(255,106,0,0.42), 0 2px 8px rgba(0,0,0,0.32); transform: translateY(180%); opacity: 0; transition: transform 0.42s var(--easing), opacity 0.32s ease, background 0.22s ease; align-items: center; gap: 8px; text-decoration: none; }
.jobs-floater.is-visible { transform: translateY(0); opacity: 1; }
.jobs-floater:hover { background: var(--bone); color: var(--sodium) !important; transform: translateY(-2px); }
.jobs-floater .arrow { font-size: 15px; transition: transform 0.25s ease; }
.jobs-floater:hover .arrow { transform: translateX(4px); }
@media (min-width: 768px) { .jobs-floater { display: inline-flex; } }
@media (max-width: 767px) { .jobs-floater { display: none !important; } }
