/* Scoped equivalents of Flooring's three wd_vc_portfolio layouts. */
.kbu-portfolio { --kbu-accent: var(--primary-color, #ce966b); }
.kbu-portfolio *, .kbu-portfolio *::before, .kbu-portfolio *::after { box-sizing: border-box; }
.kbu-portfolio-grid { display: grid; grid-template-columns: repeat(var(--kbu-mobile), minmax(0, 1fr)); gap: 30px; }
.kbu-portfolio-card { min-width: 0; margin: 0; }
.kbu-portfolio .kbu-portfolio-link { display: block; position: relative; overflow: hidden; height: 100%; color: inherit; text-decoration: none; background: #fff; }
.kbu-portfolio .kbu-portfolio-image, .kbu-portfolio-placeholder { display: block; width: 100%; aspect-ratio: 760 / 500; object-fit: cover; margin: 0; }
.kbu-portfolio-placeholder { background: linear-gradient(135deg, #dbd6ca, #a8a393); }
.kbu-portfolio .kbu-portfolio-content { padding: 16px 10px 19px; text-align: center; }
.kbu-portfolio .kbu-portfolio-content h3 { margin: 0; padding: 0; font-size: 19px; line-height: 1.3; color: inherit; overflow-wrap: anywhere; }
.kbu-portfolio .kbu-portfolio-content p { margin: 4px 0 0; padding: 0; font-size: 13px; }
.kbu-portfolio-style-1 .kbu-portfolio-link::after { content: ''; position: absolute; bottom: 0; left: 50%; right: 50%; height: 4px; background: var(--kbu-accent); transition: left .3s, right .3s; }
.kbu-portfolio-style-1 .kbu-portfolio-link:hover::after, .kbu-portfolio-style-1 .kbu-portfolio-link:focus-visible::after { left: 0; right: 0; }
.kbu-portfolio-style-2 .kbu-portfolio-image { transition: transform .3s ease-in-out; }
.kbu-portfolio-style-2 .kbu-portfolio-content { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 0; background: #ddd9d0 url(portfolio-hover.jpg) center / cover; transform: translateX(-110%); transition: transform .4s ease-in-out; }
.kbu-portfolio-style-2 .kbu-portfolio-content h3 { width: 100%; padding: 12px; font-size: 1.8rem; background: rgba(255,255,255,.7); color: #000; }
.kbu-portfolio-style-2 .kbu-portfolio-link:hover .kbu-portfolio-content, .kbu-portfolio-style-2 .kbu-portfolio-link:focus-visible .kbu-portfolio-content { transform: translateX(0); }
.kbu-portfolio-style-2 .kbu-portfolio-link:hover .kbu-portfolio-image, .kbu-portfolio-style-2 .kbu-portfolio-link:focus-visible .kbu-portfolio-image { transform: translateX(80%); }
.kbu-portfolio-style-3 .kbu-portfolio-grid { gap: 0; }
.kbu-portfolio-style-3 .kbu-portfolio-link { height: 500px; background: #77756c; }
.kbu-portfolio-style-3 .kbu-portfolio-image, .kbu-portfolio-style-3 .kbu-portfolio-placeholder { height: 100%; }
.kbu-portfolio-style-3 .kbu-portfolio-link::before { content: ''; position: absolute; z-index: 1; inset: 70% 0 0; background: linear-gradient(0deg, rgba(0,0,0,.57), transparent); transition: all .45s ease-out; }
.kbu-portfolio-style-3 .kbu-portfolio-link::after { content: ''; position: absolute; z-index: 2; inset: 3%; border: 1px solid #fff; opacity: 0; transform: scale(.01); transition: all .35s ease-out; pointer-events: none; }
.kbu-portfolio-style-3 .kbu-portfolio-content { position: absolute; z-index: 3; inset: auto 0 0; padding: 30px; text-align: left; color: #fff; transition: transform .35s cubic-bezier(.69,-.04,.12,1.1); }
.kbu-portfolio-style-3 .kbu-portfolio-content h3 { font-size: 30px; }
.kbu-portfolio-style-3 .kbu-portfolio-content p { font-size: 16px; letter-spacing: .8px; }
.kbu-portfolio-style-3 .kbu-portfolio-link:hover::before, .kbu-portfolio-style-3 .kbu-portfolio-link:focus-visible::before { top: 0; background-color: rgba(0,0,0,.5); }
.kbu-portfolio-style-3 .kbu-portfolio-link:hover::after, .kbu-portfolio-style-3 .kbu-portfolio-link:focus-visible::after { opacity: 1; transform: scale(1); }
.kbu-portfolio-style-3 .kbu-portfolio-link:hover .kbu-portfolio-content, .kbu-portfolio-style-3 .kbu-portfolio-link:focus-visible .kbu-portfolio-content { transform: translateY(-120px); }
.kbu-portfolio .kbu-portfolio-link:focus-visible { outline: 3px solid var(--kbu-accent); outline-offset: 3px; }
.kbu-portfolio-pagination ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; list-style: none; margin: 30px 0; padding: 0; }
.kbu-portfolio-pagination a, .kbu-portfolio-pagination span { display: block; padding: 8px 14px; }
.kbu-portfolio-pagination .current { background: var(--kbu-accent); color: #fff; }
.kbu-portfolio-fadeIn .kbu-portfolio-card { animation: kbu-portfolio-in .6s both; }
.kbu-portfolio-fadeInUp .kbu-portfolio-card { animation: kbu-portfolio-up .6s both; }
@keyframes kbu-portfolio-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes kbu-portfolio-up { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }
@media (min-width: 640px) { .kbu-portfolio-grid { grid-template-columns: repeat(var(--kbu-tablet), minmax(0, 1fr)); } }
@media (min-width: 1024px) { .kbu-portfolio-grid { grid-template-columns: repeat(var(--kbu-desktop), minmax(0, 1fr)); } }
@media (hover: none) { .kbu-portfolio-style-2 .kbu-portfolio-content { inset: auto 0 0; transform: none; } }
@media (prefers-reduced-motion: reduce) { .kbu-portfolio *, .kbu-portfolio *::before, .kbu-portfolio *::after { animation: none !important; transition: none !important; } }
