/*
  Shared base for all Valuebiz case-study pages.
  Everything is scoped under .vb-case so this can be dropped into an
  existing WordPress page/theme without touching global element styles
  or colliding with the theme's own CSS custom properties.
*/

.vb-case {
    --vbcs-page-bg: #f5f5f5;
    --vbcs-sheet-bg: #ffffff;
    --vbcs-ink: #222222;
    --vbcs-text: #333333;
    --vbcs-muted: #555555;
    --vbcs-rule: #222222;
    --vbcs-accent: #f68220;
    --vbcs-accent-ink: #ffffff;
    --vbcs-navy: #1a4da8;

    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
    color: var(--vbcs-text);
    background: var(--vbcs-page-bg);
    line-height: 1.5;
    padding: 30px 16px 60px;
}

.vb-case *,
.vb-case *::before,
.vb-case *::after {
    box-sizing: border-box;
}

.vb-case img { max-width: 100%; }

.vb-case__toolbar {
    max-width: 1024px;
    margin: 0 auto 14px;
    display: flex;
    justify-content: flex-end;
}

.vb-case__download-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--vbcs-accent);
    color: var(--vbcs-accent-ink);
    text-decoration: none;
    font-size: 13.5px;
    font-weight: bold;
    padding: 10px 18px;
    border-radius: 4px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    transition: filter 0.15s ease;
}
.vb-case__download-btn:hover { filter: brightness(0.93); }
.vb-case__download-btn:focus-visible { outline: 3px solid var(--vbcs-ink); outline-offset: 2px; }
.vb-case__download-btn svg { width: 14px; height: 14px; flex: none; }

.vb-case__sheet {
    max-width: 1024px;
    margin: 0 auto;
    background: var(--vbcs-sheet-bg);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}

@media (max-width: 768px) {
    .vb-case__toolbar { justify-content: center; }
}