/* -- Button hover states -- */
.hero-btn-primary {
    transition: filter 0.2s ease, transform 0.15s ease;
}
.hero-btn-primary:hover,
.hero-btn-primary:focus {
    filter: brightness(1.12);
    transform: translateY(-1px);
}

.hero-btn-outline-secondary {
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}
.hero-btn-outline-secondary:hover,
.hero-btn-outline-secondary:focus {
    background-color: var(--bs-secondary) !important;
    color: #fff !important;
    border-color: var(--bs-secondary) !important;
    transform: translateY(-1px);
}

.hero-btn-outline-primary-light {
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}
.hero-btn-outline-primary-light:hover,
.hero-btn-outline-primary-light:focus {
    background-color: var(--bs-primary) !important;
    color: #fff !important;
    border-color: var(--bs-primary) !important;
    transform: translateY(-1px);
}
/* Card hover: scale */
.portfolio-item-hover {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.portfolio-item-hover:hover {
    transform: scale(1.05);
}

/* Overlay: fade in on card hover */
.portfolio-overlay-hover {
    opacity: 0;
    transition: opacity 0.3s ease;
}
.portfolio-item-hover:hover .portfolio-overlay-hover {
    opacity: 1;
}

.services-clauses__serif,
[data-serif] {
    font-family: Georgia, "Times New Roman", Times, serif;
}

.services-clauses__num {
    opacity: 0;
    transform: translateY(0.5rem);
    transition: opacity 500ms ease, transform 500ms ease;
}
.services-clauses__num.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.header-ui__box-11 {
    width: 2.75rem;
    height: 2.75rem;
    min-width: 2.75rem;
    min-height: 2.75rem;
    flex-shrink: 0;
}

/* min-width: 0 — довгий текст/флекс у колонці не роздуває рядок */
.content-col-grow {
    min-width: 0;
}

.content-stack-col--text {
    overflow-wrap: anywhere;
}

.content-stack-col--text > :first-child {
    width: 100%;
    max-width: 65ch;
    margin-inline: auto;
}

/* gap лише для Tailwind (grid). У Bootstrap — відступи через g-* у component (row-cols + g-3), без CSS gap на .row */
.content-grid-gap:not(.row) {
    gap: 1rem;
}

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

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

/* Третина рядка: стабільна висота прев’ю, без height:100% від сусіднього тексту */
.content-img-fullheight {
    display: block;
    width: 100%;
    max-width: min(100%, 28rem);
    margin-inline: auto;
    min-width: 0;
    aspect-ratio: 3 / 4;
    max-height: 28rem;
    height: auto;
    flex-shrink: 1;
    object-fit: cover;
    object-position: center;
}

.ledger-ruled__line { border-top-style: double; border-top-width: 3px; }
.ledger-ruled__img { object-fit: cover; min-height: 20rem; height: 100%; }
.ledger-ruled__bars { height: 8rem; }
.ledger-ruled__bar {
    display: block;
    flex: 1 1 0;
    min-width: 0;
    transform-origin: bottom center;
    animation: ledger-ruled-bar 2.8s ease-in-out infinite;
}
.ledger-ruled__bar--1 { height: 35%; opacity: 0.22; }
.ledger-ruled__bar--2 { height: 50%; opacity: 0.34; animation-delay: 0.2s; }
.ledger-ruled__bar--3 { height: 64%; opacity: 0.46; animation-delay: 0.4s; }
.ledger-ruled__bar--4 { height: 82%; opacity: 0.6; animation-delay: 0.6s; }
.ledger-ruled__bar--5 { height: 100%; opacity: 1; animation-delay: 0.8s; }
@keyframes ledger-ruled-bar {
    0%, 100% { transform: scaleY(0.45); }
    50% { transform: scaleY(1); }
}
.ledger-ruled__avatars { margin: 0; padding: 0; list-style: none; justify-content: center; }
.ledger-ruled__avatar { width: 2.75rem; height: 2.75rem; }
.ledger-ruled__avatar + .ledger-ruled__avatar { margin-left: -0.75rem; }
@media (prefers-reduced-motion: reduce) {
    .ledger-ruled__bar { animation: none; }
}