@import url('/cbt/css/root-b4ad5577f1d3135a99b22c2782151139.css');

:root {
    --bg: #ffffff;
    --bg-2: #F7F7F8;
    --fg: #333333;
    --fg-2: #666666;
    --green: #3d8644;
    --green-deep: #2E7D32;
    --accent-text: #2E7D32;
    --border: #e9ecef;
    --paper: #ffffff;
    --wash: #e6f0e3;
    --wash-2: #f1f6ef;
    --highlight: #f4d35e;
    --on-green: #ffffff;
    --shadow: rgba(20, 40, 20, .18);
    --display: young-serif, Georgia, 'Times New Roman', serif;
    --body: 'Ubuntu', 'Segoe UI', system-ui, sans-serif;
    --mono: ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
}

[data-theme="dark"] {
    --bg: #1a1a1a;
    --bg-2: #2d2d2d;
    --fg: #e0e0e0;
    --fg-2: #b0b0b0;
    --accent-text: #3d8644;
    --border: #404040;
    --paper: #2d2d2d;
    --wash: #2d2d2d;
    --wash-2: #242424;
    --highlight: #8a7224;
    --shadow: rgba(0, 0, 0, .5);
}

body.gb-audience-page {
    margin: 0;
    background: var(--bg);
    color: var(--fg);
    font-family: var(--body);
    font-size: 16px;
    line-height: 1.55;
}

.gb-audience-page h1,
.gb-audience-page h2,
.gb-audience-page h3 {
    font-family: var(--display);
    font-weight: 400;
    letter-spacing: -.01em;
    text-wrap: balance;
    margin: 0;
    color: var(--fg);
}

.gb-audience-page img {
    max-width: 100%;
}

.gb-wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding-inline: 24px;
}

.gb-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 15px 26px;
    border-radius: 4px;
    background: var(--green);
    color: var(--on-green);
    font-weight: 700;
    font-size: 15px;
    text-decoration: none;
    border: 0;
    cursor: pointer;
    font-family: inherit;
    box-shadow: 4px 4px 0 var(--green-deep);
    transition: transform .15s ease, box-shadow .15s ease;
}

.gb-btn:hover {
    color: var(--on-green);
    transform: translate(-2px, -2px);
    box-shadow: 6px 6px 0 var(--green-deep);
}

.gb-link {
    color: var(--fg);
    font: inherit;
    font-weight: 500;
    text-decoration: underline;
    text-decoration-color: var(--green);
    text-decoration-thickness: 2px;
    text-underline-offset: 6px;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
}

.gb-link:hover {
    color: var(--green);
}

.gb-btn:focus-visible,
.gb-link:focus-visible,
.gb-audience-page button:focus-visible,
.gb-audience-page a:focus-visible {
    outline: 3px solid var(--highlight);
    outline-offset: 3px;
}

.gb-kicker {
    position: relative;
    display: inline-block;
    font-size: 15px;
    font-weight: 500;
    padding-bottom: 6px;
    color: var(--fg);
}

.gb-kicker::after {
    content: "";
    position: absolute;
    left: -2px;
    right: -4px;
    bottom: -2px;
    height: 9px;
    background: var(--green);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 10' preserveAspectRatio='none'%3E%3Cpath d='M2 7c40-5 90-6 140-3 20 1 38 2 56-1' fill='none' stroke='black' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 10' preserveAspectRatio='none'%3E%3Cpath d='M2 7c40-5 90-6 140-3 20 1 38 2 56-1' fill='none' stroke='black' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}

.gb-mark {
    background: linear-gradient(transparent 80%, var(--highlight) 80%, var(--highlight) 90%, transparent 90%);
    padding: 0 .06em;
    margin: 0 -.06em;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}

.gb-accent {
    color: var(--accent-text);
}

.gb-audiences {
    margin-top: 78px;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    background: var(--bg-2);
}

.gb-audiences .gb-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 22px;
    align-items: center;
    padding-block: 10px;
    font-size: 14px;
}

.gb-audiences span {
    color: var(--fg-2);
}

.gb-audiences a {
    text-decoration: none;
    color: var(--fg);
    font-weight: 500;
    padding: 4px 0;
    border-bottom: 2px solid transparent;
}

.gb-audiences a:hover {
    color: var(--green);
}

.gb-audiences a[aria-current="page"] {
    border-bottom-color: var(--green);
    color: var(--green);
}

.gb-reveal {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .6s ease, transform .6s ease;
}

.gb-reveal.in {
    opacity: 1;
    transform: none;
}

@media (max-width: 480px) {
    .gb-wrap {
        padding-inline: 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gb-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .gb-btn {
        transition: none;
    }
}
