.intro-split-icon {
    width: 3rem;
    height: 3rem;
}

/* Як TW: w-64 → sm:w-80 → lg:w-96 (одна шкала для обох фреймворків) */
.intro-split-thumb {
    width: 16rem;
    height: 16rem;
    flex-shrink: 0;
}

@media (min-width: 640px) {
    .intro-split-thumb {
        width: 20rem;
        height: 20rem;
    }
}

@media (min-width: 1024px) {
    .intro-split-thumb {
        width: 24rem;
        height: 24rem;
    }
}

/* Bootstrap: flex + gap (no .row negative margins; works with section overflow). Tailwind grid ignores flex on items. */
@media (min-width: 576px) {
    .intro-split-benefits__row > * {
        flex: 1 1 0%;
        min-width: 0;
    }
}

.content-grid-gap {
    gap: 2rem;
}

.content-heading-gap {
    margin-bottom: 2rem;
}

.content-section-pad {
    padding-top: 6rem;
    padding-bottom: 6rem;
}

.content-img-grows {
    display: block;
    width: 100%;
    height: 16rem;
    min-height: 16rem;
    flex-shrink: 0;
    object-fit: cover;
}
@media (min-width: 992px) {
    .content-img-grows {
        height: 20rem;
        min-height: 20rem;
    }
}

/* About v10 — tab visibility and active state (no palette in CSS) */

.guide-sq-8  { width: 2rem;   height: 2rem;   flex-shrink: 0; }
.guide-sq-12 { width: 3rem;   height: 3rem;   flex-shrink: 0; }
.guide-sq-16 { width: 4rem;   height: 4rem;   flex-shrink: 0; }
.guide-sq-20 { width: 5rem;   height: 5rem;   flex-shrink: 0; }

.guide-ab10-tab-panel.guide-ab10-tab-panel-hidden {
    display: none;
}

.guide-ab10-tab-btn.guide-ab10-tab-active {
    font-weight: 700;
    transform: translateY(-1px);
}

.guide-ab10-tab-btn.guide-ab10-tab-inactive {
    font-weight: 500;
    opacity: 0.9;
}

/* content gutter — bracket ticks share width */
.content-gutter__tick {
    width: 1px;
}

/* solo column: span full grid / row when second stack hidden */
.content-gutter__lead--span {
    grid-column: 1 / -1;
}

.gallery-hover-grid__card {
    transition: all 0.3s ease;
}
.gallery-hover-grid__card:hover {
    transform: scale(1.05);
}
.gallery-hover-grid__img {
    height: 16rem;
    transition: transform 0.3s ease;
}
.gallery-hover-grid__card:hover .gallery-hover-grid__img {
    transform: scale(1.10);
}
/* overlay + caption visibility: Tailwind group-hover on card (component) — без цветов здесь */


.copy-document__body-stack-gap {
    gap: 4rem;
}

.content-flow-gap {
    gap: 4rem;
}

.content-grid-gap {
    gap: 2rem;
}

.content-prose-measure {
    max-width: 48rem;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

.content-article-frame {
    max-width: 56rem;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

.content-cta__lift { transition: transform 150ms ease; }
.content-cta__lift:hover { transform: translateY(-2px); }

.content-col-grow {
    flex: 1 1 0%;
    min-width: 0;
}

.content-img-medium {
    display: block;
    width: 100%;
    height: 22rem;
    min-height: 22rem;
    flex-shrink: 0;
    object-fit: cover;
}
@media (min-width: 768px) {
    .content-img-medium {
        height: 28rem;
        min-height: 28rem;
    }
}

.content-thumb-height {
    display: block;
    width: 100%;
    height: 13rem;
    min-height: 13rem;
    flex-shrink: 0;
    object-fit: cover;
}

.content-index-sheet__shell {
    display: grid;
    grid-template-columns: minmax(14rem, 18rem) minmax(0, 1fr);
    width: 100%;
}

.content-index-sheet__shell .rounded-circle,
.content-index-sheet__shell [class*="rounded-full"] {
    flex-shrink: 0;
}

@media (max-width: 991.98px) {
    .content-index-sheet__shell {
        grid-template-columns: 1fr;
    }
}