.nokko-grid{width:100%;max-width:none;display:grid;grid-template-columns:repeat(var(--nk-cols),minmax(0,1fr));gap:var(--nk-gap);background:var(--nk-bg);color:var(--nk-color)}.nokko-card{min-width:0;margin:0;break-inside:avoid}.nokko-title{font-size:var(--nk-title);font-weight:500;line-height:1.25;color:inherit;margin:0 0 8px}.nokko-desc{font-size:var(--nk-desc);line-height:1.45;color:inherit;margin:0 0 10px}.nokko-media{overflow:hidden;width:100%;border-radius:var(--nk-radius,0px)}.nokko-media a{display:block}.nokko-media img{display:block;width:100%;height:auto;transition:transform .35s ease,opacity .35s ease}.nk-ratio-square .nokko-media img{aspect-ratio:1;object-fit:cover}.nk-ratio-portrait .nokko-media img{aspect-ratio:3/4;object-fit:cover}.nk-ratio-landscape .nokko-media img{aspect-ratio:4/3;object-fit:cover}.nk-hover-zoom .nokko-card:hover img{transform:scale(1.045)}.nk-hover-fade .nokko-card:hover img{opacity:.75}.nokko-placeholder{aspect-ratio:4/3;background:#e7e7e7}.nokko-masonry{display:block;columns:var(--nk-cols);column-gap:var(--nk-gap)}.nokko-masonry .nokko-card{display:inline-block;width:100%;margin-bottom:var(--nk-gap);vertical-align:top}@media(max-width:1024px){.nokko-grid{grid-template-columns:repeat(var(--nk-tab),minmax(0,1fr))}.nokko-masonry{columns:var(--nk-tab)}}@media(max-width:767px){.nokko-grid{grid-template-columns:repeat(var(--nk-mob),minmax(0,1fr))}.nokko-masonry{columns:var(--nk-mob)}}

/* Scope widths and defaults inside the shortcode, not the theme's row. */
.nokko-portfolio{width:100%;max-width:100%;background:var(--nk-bg);color:var(--nk-color)}
.nokko-portfolio .nokko-grid{background:transparent;color:inherit}
.nokko-portfolio .nokko-card[hidden]{display:none!important}
.nokko-portfolio .nokko-filters{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:0 0 28px}
.nokko-portfolio .nokko-filter{appearance:none;-webkit-appearance:none;cursor:pointer;border:1px solid var(--nk-filter-border);border-radius:var(--nk-filter-radius);background:transparent;color:inherit;font:inherit;font-size:var(--nk-filter-size);line-height:1.25;padding:10px 24px;white-space:nowrap;transition:border-color .2s ease,background-color .2s ease}
.nokko-portfolio .nokko-filter:hover,.nokko-portfolio .nokko-filter.is-active{border-color:var(--nk-filter-active)}
.nokko-portfolio .nokko-filter:focus-visible{outline:2px solid var(--nk-filter-active);outline-offset:3px}
/* CSS columns packs each card directly below the previous card in that column. */
.nokko-portfolio .nokko-masonry{display:block;column-count:var(--nk-cols);column-gap:var(--nk-gap)}
.nokko-portfolio .nokko-masonry .nokko-card{display:inline-block;width:100%;margin:0 0 var(--nk-gap);vertical-align:top;break-inside:avoid;-webkit-column-break-inside:avoid}
@media(max-width:1024px){.nokko-portfolio .nokko-masonry{column-count:var(--nk-tab)}}
@media(max-width:767px){.nokko-portfolio .nokko-masonry{column-count:var(--nk-mob)}.nokko-portfolio .nokko-filters{gap:8px;margin-bottom:20px}.nokko-portfolio .nokko-filter{padding:8px 14px}}

/* Alignment applies only to the filter navigation of each portfolio. */
.nokko-portfolio .nokko-filters-left{justify-content:flex-start}
.nokko-portfolio .nokko-filters-center{justify-content:center}
.nokko-portfolio .nokko-filters-right{justify-content:flex-end}
/* Original ratio plus masonry: vertically packed columns, no row heights. */
.nokko-portfolio .nokko-masonry.nk-ratio-auto{display:block;column-count:var(--nk-cols);column-gap:var(--nk-gap)}
.nokko-portfolio .nokko-masonry.nk-ratio-auto .nokko-card{display:inline-block;width:100%;break-inside:avoid;vertical-align:top;margin:0 0 var(--nk-gap)}
@media(max-width:1024px){.nokko-portfolio .nokko-masonry.nk-ratio-auto{column-count:var(--nk-tab)}}
@media(max-width:767px){.nokko-portfolio .nokko-masonry.nk-ratio-auto{column-count:var(--nk-mob)}}