:root {
    --blog-max: var(--layout-max, 1440px);
    --blog-gutter: var(--layout-gutter, clamp(16px, 2.2vw, 32px));
    --blog-ease: cubic-bezier(.22, 1, .36, 1);
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    padding: 0;
    margin: 0;
    font-family: "Urbanist", sans-serif;
    font-weight: normal;
    background: #fff;
    overflow-x: hidden;
    font-size: 16px;
    color: #000;
}

.blog-browser {
    width: 100%;
}

.blog-browser__header {}

.blog-browser__header h2 {
    margin: 0 0 55px;
    font-size: 48px;
    line-height: 110%;
    color: #000000;
    text-wrap: balance;
}

.blog-filters {
    overflow-x: auto;
    scrollbar-width: none;
}

.blog-filters::-webkit-scrollbar {
    display: none;
}

.blog-filters__track {
    min-width: max-content;
    display: flex;
    align-items: flex-end;
    border-bottom: 1px solid #dedede;
}

.blog-filter {
    position: relative;
    min-width: 97px;
    min-height: 24px;
    padding: 0 14px 8px;
    border: 0;
    background: transparent;
    color: #000;
    cursor: pointer;
    font-family: "Urbanist", sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: .04em;
    text-align: center;
    text-transform: uppercase;
    opacity: .2;
    transition: opacity 160ms ease;
}

.blog-filter:first-child {
    min-width: 30px;
    /* padding-inline: 0; */
    text-align: left;
}

.blog-filter:hover {
    opacity: .6;
}

.blog-filter.is-active {
    opacity: 1;
    font-weight: 600;
}

.blog-filter.is-active::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 2px;
    background: #000;
}

.blog-filter:focus-visible,
.article-card__link:focus-visible,
.blog-header a:focus-visible {
    outline: 3px solid #d9f622;
    outline-offset: 3px;
}

.blog-results {
    position: relative;
    padding: 0px 0px 0px;
    outline: 0;
    margin-top: 80px;
    transition: opacity 150ms ease, transform 220ms var(--blog-ease);
}

.blog-results.is-all>.blog-results__title,
.blog-results.is-all>.blog-results__count,
.blog-results.is-all>.blog-grid-wrap,
.blog-results.is-all>.blog-results__actions {
    display: none;
}

.blog-grid[hidden] {
    display: none;
}

.all-sections[hidden] {
    display: none;
}

.blog-results__title {
    margin: 0 0 56px;
    font-size: 32px;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: -.025em;
}

.blog-results__count {
    position: absolute;
    top: 13px;
    right: 0;
    margin: 0;
    color: #555;
    font-size: 12px;
    letter-spacing: .04em;
    text-transform: uppercase;
    font-weight: 500;
}

.blog-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 56px 32px;
}

.article-card[hidden] {
    display: none;
}

.article-card {
    min-width: 0;
    transition: opacity 420ms var(--blog-ease), transform 520ms var(--blog-ease);
    transition-delay: var(--reveal-delay, 0ms);
}

.article-card.is-reveal-ready {
    opacity: 0;
    transform: translateY(12px);
}

.article-card.is-reveal-ready.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.article-card__link {
    display: flex;
    height: 100%;
    flex-direction: column;
    gap: 16px;
}

.article-card__media {
    margin: 0;
    overflow: hidden;
    background: #F6F6F6;
    border-radius: 10px;
    height: 174px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.article-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
    transition: opacity 180ms ease;
    object-position: top;
}

.article-card__body {
    display: grid;
    gap: 6px;
}

.article-card__topic {
    margin: 0;
    color: #555;
    font-family: "Urbanist", sans-serif;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.article-card__title {
    margin: 0;
    font-family: "Urbanist", sans-serif;
    letter-spacing: 0;
    text-wrap: pretty;
    font-weight: 600;
    font-size: 20px;
    line-height: 130%;
}

.article-card__byline {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: auto;
}

.article-card__byline>img {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
}
.digital-lab-saturdays-cards figure.article-card__media {
    height: auto;
    border-radius: 0;
}
.digital-lab-saturdays-cards figure.article-card__media img {
    border-radius: 10px;
    border: 1px solid #000;
    height: auto;
}
.article-card__byline span {
    display: grid;
    gap: 2px;
}

.article-card__byline strong {
    font-size: 13px;
    font-weight: 600;
    line-height: 120%;
    color: #000000;
}

.article-card__byline time {
    font-weight: 500;
    font-size: 11px;
    line-height: 13px;
    color: #555555;
}

.article-card__link:hover .article-card__media img {
    opacity: .88;
}

.article-card__link:hover .article-card__title {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.blog-results__actions {
    display: flex;
    justify-content: center;
    padding-top: 64px;
}

.blog-show-more {
    cursor: pointer;
}

.blog-show-more[hidden] {
    display: none;
}

.all-sections {
    display: grid;
    min-width: 0;
}

.all-category {
    min-width: 0;
    padding-block: 60px;
    border-top: 1px solid #dedede;
    transition: opacity 440ms var(--blog-ease), transform 540ms var(--blog-ease);
}

.all-category.is-reveal-ready {
    opacity: 0;
    transform: translateY(16px);
}

.all-category.is-reveal-ready.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.all-category:first-child {
    padding-top: 0;
    border-top: 0;
}

.all-category:last-child {
    padding-bottom: 0;
}

.all-category__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 56px;
}

.all-category__title {
    margin: 0;
    letter-spacing: 0;
    font-weight: 400;
    font-size: 32px;
    line-height: 120%;
    color: #000000;
    letter-spacing: -.025em;
}

.all-category .blog-grid {
    display: grid !important;
}

.all-category__controls {
    display: none;
}

@media (max-width: 1023px) {
    .blog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .all-category .blog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .blog-browser__header h2 {
        margin: 0 0 45px;
        font-size: 34px;
    }

    .blog-results {
        margin-top: 60px;
    }

    .blog-results__title {
        margin: 0 0 35px;
        font-size: 28px;
    }

    .all-category {
        padding-block: 45px;
    }

    .all-category__header {
        margin-bottom: 37px;
    }

    .all-category__title {
        font-size: 28px;
    }
}

@media (max-width: 639px) {
    .blog-category-tabs-section {
        overflow: hidden;
    }

    .blog-browser__header h2 {
        margin-bottom: 37px;
        font-size: 28px;
    }

    .blog-filters {
        margin-right: calc(var(--blog-gutter) * -1);
        padding-right: var(--blog-gutter);
    }

    .blog-filter {
        min-height: 44px;
        padding-bottom: 15px;
    }

    .blog-results {
        padding-bottom: 10px;
    }

    .blog-results__title {
        margin-bottom: 40px;
        font-size: 28px;
    }

    .blog-results__count {
        position: static;
        margin: -30px 0 40px;
    }

    .blog-grid {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .all-category {
        padding-block: 35px;
    }

    .all-category__header {
        margin-bottom: 25px;
    }

    .all-category__title {
        font-size: 28px;
    }

    .all-category .blog-grid {
        display: flex !important;
        width: calc(100% + var(--blog-gutter));
        min-width: 0;
        gap: 16px;
        margin-right: calc(var(--blog-gutter) * -1);
        padding-right: var(--blog-gutter);
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scroll-padding-inline: 0 var(--blog-gutter);
        scroll-snap-type: inline mandatory;
        scrollbar-width: none;
        touch-action: pan-x pan-y;
    }

    .all-category .blog-grid::-webkit-scrollbar {
        display: none;
    }

    .all-category .article-card {
        flex: 0 0 min(72%, 320px);
        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    .all-category__controls {
        display: flex;
        justify-content: center;
        gap: 16px;
        padding-top: 40px;
    }

    .all-category__control {
        display: grid;
        width: 56px;
        height: 56px;
        padding: 0;
        place-items: center;
        border: 0;
        border-radius: 50%;
        background: #f3f3f3;
        color: #000;
        cursor: pointer;
        font-family: Arial, sans-serif;
        font-size: 28px;
        font-weight: 300;
        line-height: 1;
        transition: opacity 160ms ease, background-color 160ms ease;
    }

    .all-category__control span {
        display: block;
        width: 8px;
        height: 8px;
        border-top: 1.5px solid currentColor;
        border-right: 1.5px solid currentColor;
    }

    .all-category__control.prev span {
        transform: rotate(-135deg);
        margin-left: 3px;
    }

    .all-category__control.next span {
        transform: rotate(45deg);
        margin-right: 3px;
    }

    .all-category__control:hover {
        background: #e9e9e9;
    }

    .all-category__control:disabled {
        cursor: default;
        opacity: .34;
    }

    .all-category__control:focus-visible {
        outline: 3px solid #d9f622;
        outline-offset: 3px;
    }

    .all-category__title {
        font-size: 24px;
    }

    .digital-labs-video-content-wrap .testimonials-v2__grid {
        grid-template-columns: 1fr;
    }

    .digital-labs-video-content-wrap .testimonial-card-v2 {
        height: min(670px, 156vw);
        min-height: 520px;
    }
}


@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation: none !important;
        transition-duration: .01ms !important;
        transition-delay: 0ms !important;
    }

    .article-card.is-reveal-ready,
    .all-category.is-reveal-ready {
        opacity: 1;
        transform: none;
    }
}

@keyframes blog-intro {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Digital Lab "Videos" tab: video block (.testimonial-card-v2, unchanged from
   the site-wide video-card styling) plus a title below it, same gap as the
   other article cards' figure+body spacing. */
.video-card {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Non-self-hosted video cards (YouTube/Vimeo/Wistia/custom embed): the embed
   is injected on click, filling the same box the poster/video occupies. */
.dl-video-embed-target.is-active {
    position: absolute;
    inset: 0;
    z-index: 2;
}

.dl-video-embed-target.is-active iframe {
    width: 100%;
    height: 100%;
    border: 0;
}