.cdb-preview {
    --cdb-preview-gap: 24px;
    --cdb-preview-desktop-cols: 3;
    --cdb-preview-tablet-cols: 2;
    --cdb-preview-mobile-cols: 1;
    --cdb-preview-ratio: 16/10;
    --cdb-card-bg: #fff;
    --cdb-title-color: #1f1f1f;
    --cdb-excerpt-color: #333;
    --cdb-radius: 8px;
    --cdb-card-padding: 16px;
    --cdb-card-max-width: none;
    --cdb-card-min-height: 0px;
    --cdb-overlay-color: #000;
    --cdb-overlay-opacity: 0.5;
    --cdb-title-weight: 700;
    --cdb-title-clamp: 2;
    --cdb-category-color: #8a5a24;
    --cdb-button-color: #7b4215;
    --cdb-button-text: #fff;
    --cdb-animation-duration: 400ms;
    --cdb-animation-delay: 100ms;
}

.cdb-preview__track {
    display: grid;
    gap: var(--cdb-preview-gap);
}

.cdb-preview__viewport {
    position: relative;
}

.cdb-preview__item {
    background: var(--cdb-card-bg);
    border-radius: var(--cdb-radius);
    min-width: 0;
    overflow: hidden;
    padding: var(--cdb-card-padding);
    position: relative;
    max-width: var(--cdb-card-max-width);
    min-height: var(--cdb-card-min-height);
    transition: box-shadow 180ms ease, opacity 180ms ease, transform 180ms ease;
    width: 100%;
}

.cdb-preview--shadow-light .cdb-preview__item { box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08); }
.cdb-preview--shadow-medium .cdb-preview__item { box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12); }
.cdb-preview--shadow-strong .cdb-preview__item { box-shadow: 0 18px 46px rgba(0, 0, 0, 0.18); }
.cdb-preview--hover-elevate .cdb-preview__item:hover { box-shadow: 0 18px 46px rgba(0, 0, 0, 0.18); transform: translateY(-3px); }

.cdb-preview__image {
    aspect-ratio: var(--cdb-preview-ratio);
    background: #f1f1f1;
    border-radius: max(0px, calc(var(--cdb-radius) - 3px));
    display: block;
    margin: calc(var(--cdb-card-padding) * -1) calc(var(--cdb-card-padding) * -1) 14px;
    overflow: hidden;
    position: relative;
}

.cdb-preview__image img {
    display: block;
    height: 100%;
    object-fit: cover;
    transition: transform 180ms ease;
    width: 100%;
}

.cdb-preview__field-row {
    align-items: start;
    display: flex;
    flex-wrap: wrap;
    gap: 0 14px;
    min-width: 0;
}

.cdb-preview__field {
    min-width: 0;
}

.cdb-preview__field--auto { flex: 0 1 auto; }
.cdb-preview__field--quarter { flex: 0 1 calc(25% - 11px); }
.cdb-preview__field--third { flex: 0 1 calc(33.333% - 10px); }
.cdb-preview__field--half { flex: 0 1 calc(50% - 7px); }
.cdb-preview__field--two_thirds { flex: 0 1 calc(66.666% - 5px); }
.cdb-preview__field--full { flex: 1 1 100%; }

.cdb-preview__field--image {
    flex-basis: 100%;
}

.cdb-preview--hover-zoom .cdb-preview__image:hover img {
    transform: scale(1.04);
}

.cdb-preview__overlay {
    background: var(--cdb-overlay-color);
    inset: 0;
    opacity: 0;
    position: absolute;
    transition: opacity 180ms ease;
}

.cdb-preview--hover-overlay .cdb-preview__image:hover .cdb-preview__overlay {
    opacity: 1;
}

.cdb-preview__media-overlay {
    position: relative;
}

.cdb-preview__media-overlay .cdb-preview__image {
    margin-bottom: 0;
}

.cdb-preview__overlay-content {
    color: #fff;
    inset: 0;
    padding: var(--cdb-card-padding);
    position: absolute;
    z-index: 2;
}

.cdb-preview__media-overlay::after {
    background: linear-gradient(180deg, transparent, var(--cdb-overlay-color));
    content: "";
    inset: 0;
    opacity: var(--cdb-overlay-opacity);
    pointer-events: none;
    position: absolute;
    z-index: 1;
}

.cdb-preview--overlay-bottom .cdb-preview__overlay-content { align-items: flex-end; display: flex; flex-direction: column; justify-content: flex-end; }
.cdb-preview--overlay-center .cdb-preview__overlay-content { align-items: center; display: flex; flex-direction: column; justify-content: center; text-align: center; }
.cdb-preview--overlay-top .cdb-preview__overlay-content { align-items: flex-start; display: flex; flex-direction: column; justify-content: flex-start; }

.cdb-preview__kicker {
    color: var(--cdb-category-color);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin-bottom: 6px;
    text-transform: uppercase;
}

.cdb-preview__title {
    color: var(--cdb-title-color);
    font-size: clamp(1.05rem, 1rem + 0.35vw, 1.35rem);
    line-height: 1.25;
    margin: 0 0 8px;
    display: -webkit-box;
    font-weight: var(--cdb-title-weight);
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--cdb-title-clamp);
}

.cdb-preview__title a {
    color: inherit;
    text-decoration: none;
}

.cdb-preview__title a:hover,
.cdb-preview__button:hover {
    text-decoration: underline;
}

.cdb-preview__meta {
    color: #676767;
    display: flex;
    flex-wrap: wrap;
    font-size: 0.86rem;
    gap: 8px;
    margin-bottom: 8px;
}

.cdb-preview__field .cdb-preview__meta,
.cdb-preview__field .cdb-preview__category,
.cdb-preview__field .cdb-preview__title {
    margin-bottom: 8px;
}

.cdb-preview__excerpt {
    color: var(--cdb-excerpt-color);
    line-height: 1.55;
}

.cdb-preview__button {
    color: var(--cdb-button-color);
    display: inline-flex;
    font-weight: 700;
    margin-top: 12px;
    text-decoration: none;
}

.cdb-preview__category {
    color: var(--cdb-category-color);
    display: inline-flex;
    gap: 4px;
    margin-bottom: 8px;
}

.cdb-preview__category--filled,
.cdb-preview__category--pill {
    background: var(--cdb-category-color);
    color: #fff;
    padding: 4px 8px;
}

.cdb-preview__category--outline {
    border: 1px solid var(--cdb-category-color);
    color: var(--cdb-category-color);
    padding: 3px 8px;
}

.cdb-preview__category--pill {
    border-radius: 999px;
}

.cdb-preview__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    left: 12px;
    position: absolute;
    top: 12px;
    z-index: 3;
}

.cdb-preview__badge {
    background: var(--cdb-badge-bg, #d63638);
    border-radius: 999px;
    color: #fff;
    font-size: 0.76rem;
    font-weight: 700;
    padding: 4px 8px;
}

.cdb-preview__card-link {
    inset: 0;
    position: absolute;
    z-index: 1;
}

.cdb-preview__button,
.cdb-preview__title a,
.cdb-preview__image {
    position: relative;
    z-index: 2;
}

.cdb-preview--button-filled .cdb-preview__button,
.cdb-preview--button-outline .cdb-preview__button,
.cdb-preview--button-ghost .cdb-preview__button {
    border: 1px solid var(--cdb-button-color);
    padding: 0.65em 1em;
}

.cdb-preview--button-filled .cdb-preview__button {
    background: var(--cdb-button-color);
    color: var(--cdb-button-text);
}

.cdb-preview--button-outline .cdb-preview__button {
    background: transparent;
}

.cdb-preview--button-ghost .cdb-preview__button {
    background: transparent;
    border-color: transparent;
}

.cdb-preview--button-link .cdb-preview__button {
    text-decoration: underline;
}

.cdb-preview--button-align-center .cdb-preview__button { margin-left: auto; margin-right: auto; }
.cdb-preview--button-align-right .cdb-preview__button { margin-left: auto; }
.cdb-preview--button-align-full .cdb-preview__button { display: flex; justify-content: center; width: 100%; }
.cdb-preview--button-size-small .cdb-preview__button { font-size: 0.86rem; }
.cdb-preview--button-size-large .cdb-preview__button { font-size: 1.08rem; padding: 0.85em 1.2em; }

.cdb-preview__counter {
    margin-bottom: var(--cdb-preview-gap);
}

.cdb-preview--animation-fade .cdb-preview__item,
.cdb-preview--animation-slide_up .cdb-preview__item,
.cdb-preview--animation-zoom .cdb-preview__item,
.cdb-preview--animation-slide_left .cdb-preview__item {
    opacity: 0;
    transition: opacity var(--cdb-animation-duration) ease, transform var(--cdb-animation-duration) ease;
}

.cdb-preview--animation-slide_up .cdb-preview__item { transform: translateY(24px); }
.cdb-preview--animation-zoom .cdb-preview__item { transform: scale(0.94); }
.cdb-preview--animation-slide_left .cdb-preview__item { transform: translateX(-24px); }
.cdb-preview .cdb-preview__item.cdb-animated {
    opacity: 1;
    transform: none;
}

.cdb-preview__notice {
    background: #fff5f5;
    border-left: 4px solid #d63638;
    padding: 12px;
}

.cdb-preview__filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: var(--cdb-preview-gap);
}

.cdb-preview__filter,
.cdb-preview__load-more,
.cdb-preview__pagination a {
    background: #fff;
    border: 1px solid #d8d8d8;
    color: inherit;
    cursor: pointer;
    padding: 8px 12px;
    text-decoration: none;
}

.cdb-preview__filter.is-active,
.cdb-preview__pagination a.is-active {
    background: #1f1f1f;
    border-color: #1f1f1f;
    color: #fff;
}

.cdb-preview__item.is-filtered {
    opacity: 0;
    pointer-events: none;
    transform: scale(0.97);
}

.cdb-preview__pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: var(--cdb-preview-gap);
}

.cdb-preview__load-more {
    margin-top: var(--cdb-preview-gap);
}

.cdb-preview__scroll-arrow {
    align-items: center;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(0, 0, 0, 0.16);
    border-radius: 999px;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.16);
    color: #1f1f1f;
    cursor: pointer;
    display: none;
    height: 42px;
    justify-content: center;
    line-height: 1;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 42px;
    z-index: 5;
}

.cdb-preview__scroll-arrow span {
    font-size: 30px;
    margin-top: -2px;
}

.cdb-preview__scroll-arrow--prev { left: -21px; }
.cdb-preview__scroll-arrow--next { right: -21px; }
.cdb-preview__scroll-arrow:hover { background: #fff; }
.cdb-preview__scroll-arrow:disabled { cursor: default; opacity: 0.45; }

.cdb-preview--desktop-grid .cdb-preview__track { grid-template-columns: repeat(var(--cdb-preview-desktop-cols), minmax(0, 1fr)); }
.cdb-preview--desktop-column .cdb-preview__track { grid-template-columns: 1fr; }
.cdb-preview__track { justify-items: stretch; }
.cdb-preview__item--hero-full { grid-column: 1 / -1; }
.cdb-preview__item--hero-two_thirds { grid-column: span 2; }
.cdb-preview__item--hero-three_quarters { grid-column: span 3; }
.cdb-preview__item--hero-layout-image_left {
    align-items: stretch;
    display: grid;
    gap: var(--cdb-preview-gap);
    grid-template-columns: minmax(220px, 45%) 1fr;
}
.cdb-preview__item--hero-layout-image_left .cdb-preview__image {
    height: 100%;
    margin: calc(var(--cdb-card-padding) * -1) 0 calc(var(--cdb-card-padding) * -1) calc(var(--cdb-card-padding) * -1);
}
.cdb-preview__item--hero-layout-image_full_overlay {
    padding: 0;
}
.cdb-preview__item--hero-layout-image_full_overlay .cdb-preview__media-overlay .cdb-preview__image {
    margin: 0;
}
.cdb-preview--desktop-thumbnail .cdb-preview__item,
.cdb-preview--desktop-table .cdb-preview__item {
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(120px, 32%) 1fr;
}
.cdb-preview--desktop-thumbnail .cdb-preview__image,
.cdb-preview--desktop-table .cdb-preview__image {
    margin: 0;
}
.cdb-preview--desktop-table .cdb-preview__track { gap: 0; }
.cdb-preview--desktop-table .cdb-preview__item { border-bottom: 1px solid #ddd; border-radius: 0; }
.cdb-preview--desktop-masonry .cdb-preview__track { column-count: var(--cdb-preview-desktop-cols); column-gap: var(--cdb-preview-gap); display: block; }
.cdb-preview--desktop-masonry .cdb-preview__item { break-inside: avoid; margin-bottom: var(--cdb-preview-gap); }
.cdb-preview--desktop-horizontal .cdb-preview__track,
.cdb-preview--desktop-carousel .cdb-preview__track {
    display: flex;
    overflow-x: hidden;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
}
.cdb-preview--desktop-horizontal .cdb-preview__track::-webkit-scrollbar,
.cdb-preview--desktop-carousel .cdb-preview__track::-webkit-scrollbar {
    display: none;
}
.cdb-preview--desktop-horizontal .cdb-preview__item,
.cdb-preview--desktop-carousel .cdb-preview__item {
    flex: 0 0 calc((100% - (var(--cdb-preview-gap) * (var(--cdb-preview-desktop-cols) - 1))) / var(--cdb-preview-desktop-cols));
    scroll-snap-align: start;
}
.cdb-preview--desktop-horizontal .cdb-preview__scroll-arrow,
.cdb-preview--desktop-carousel .cdb-preview__scroll-arrow { display: inline-flex; }

@media (max-width: 980px) {
    .cdb-preview--tablet-grid .cdb-preview__track { display: grid; grid-template-columns: repeat(var(--cdb-preview-tablet-cols), minmax(0, 1fr)); }
    .cdb-preview--tablet-column .cdb-preview__track { display: grid; grid-template-columns: 1fr; }
    .cdb-preview--tablet-grid .cdb-preview__item,
    .cdb-preview--tablet-column .cdb-preview__item { display: block; }
    .cdb-preview--tablet-thumbnail .cdb-preview__item,
    .cdb-preview--tablet-table .cdb-preview__item { display: grid; gap: 16px; grid-template-columns: minmax(110px, 34%) 1fr; }
    .cdb-preview--tablet-thumbnail .cdb-preview__image,
    .cdb-preview--tablet-table .cdb-preview__image { margin: 0; }
    .cdb-preview--tablet-table .cdb-preview__track { display: grid; gap: 0; grid-template-columns: 1fr; }
    .cdb-preview--tablet-masonry .cdb-preview__track { column-count: var(--cdb-preview-tablet-cols); column-gap: var(--cdb-preview-gap); display: block; }
    .cdb-preview--tablet-horizontal .cdb-preview__track,
    .cdb-preview--tablet-carousel .cdb-preview__track { display: flex; overflow-x: hidden; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; }
    .cdb-preview--tablet-horizontal .cdb-preview__track::-webkit-scrollbar,
    .cdb-preview--tablet-carousel .cdb-preview__track::-webkit-scrollbar { display: none; }
    .cdb-preview--tablet-horizontal .cdb-preview__item,
    .cdb-preview--tablet-carousel .cdb-preview__item { flex: 0 0 calc((100% - (var(--cdb-preview-gap) * (var(--cdb-preview-tablet-cols) - 1))) / var(--cdb-preview-tablet-cols)); }
    .cdb-preview--tablet-horizontal .cdb-preview__scroll-arrow,
    .cdb-preview--tablet-carousel .cdb-preview__scroll-arrow { display: inline-flex; }
}

@media (max-width: 680px) {
    .cdb-preview__item--hero-two_thirds,
    .cdb-preview__item--hero-three_quarters,
    .cdb-preview__item--hero-full {
        grid-column: 1 / -1;
    }

    .cdb-preview__item--hero-layout-image_left {
        display: block;
    }

    .cdb-preview__item--hero-layout-image_left .cdb-preview__image {
        height: auto;
        margin: calc(var(--cdb-card-padding) * -1) calc(var(--cdb-card-padding) * -1) 14px;
    }

    .cdb-preview--mobile-grid .cdb-preview__track { display: grid; grid-template-columns: repeat(var(--cdb-preview-mobile-cols), minmax(0, 1fr)); }
    .cdb-preview--mobile-column .cdb-preview__track { display: grid; grid-template-columns: 1fr; }
    .cdb-preview--mobile-grid .cdb-preview__item,
    .cdb-preview--mobile-column .cdb-preview__item { display: block; }
    .cdb-preview--mobile-thumbnail .cdb-preview__item,
    .cdb-preview--mobile-table .cdb-preview__item { display: grid; gap: 12px; grid-template-columns: minmax(88px, 34%) 1fr; }
    .cdb-preview--mobile-thumbnail .cdb-preview__image,
    .cdb-preview--mobile-table .cdb-preview__image { margin: 0; }
    .cdb-preview--mobile-table .cdb-preview__track { display: grid; gap: 0; grid-template-columns: 1fr; }
    .cdb-preview--mobile-masonry .cdb-preview__track { column-count: var(--cdb-preview-mobile-cols); column-gap: var(--cdb-preview-gap); display: block; }
    .cdb-preview--mobile-horizontal .cdb-preview__track,
    .cdb-preview--mobile-carousel .cdb-preview__track { display: flex; overflow-x: hidden; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; }
    .cdb-preview--mobile-horizontal .cdb-preview__track::-webkit-scrollbar,
    .cdb-preview--mobile-carousel .cdb-preview__track::-webkit-scrollbar { display: none; }
    .cdb-preview--mobile-horizontal .cdb-preview__item,
    .cdb-preview--mobile-carousel .cdb-preview__item { flex: 0 0 calc((100% - (var(--cdb-preview-gap) * (var(--cdb-preview-mobile-cols) - 1))) / var(--cdb-preview-mobile-cols)); }
    .cdb-preview--mobile-horizontal .cdb-preview__scroll-arrow,
    .cdb-preview--mobile-carousel .cdb-preview__scroll-arrow { display: inline-flex; }

    .cdb-preview__scroll-arrow {
        height: 36px;
        width: 36px;
    }

    .cdb-preview__scroll-arrow--prev { left: 6px; }
    .cdb-preview__scroll-arrow--next { right: 6px; }

    .cdb-preview__field--quarter,
    .cdb-preview__field--third,
    .cdb-preview__field--half,
    .cdb-preview__field--two_thirds {
        flex-basis: 100%;
    }
}