.pikus-blog-grid{
  --pikus-blog-bg:#fafcf4;
  --pikus-blog-line:#e4e6da;
  --pikus-blog-ink:#0c0c0c;
  --pikus-blog-ink-2:#3a3a36;
  --pikus-blog-ink-dim:#6a6a62;
  --pikus-blog-ink-faint:#9a9a90;
  --pikus-blog-accent:#d6ff00;
  --pikus-blog-accent-deep:#acdd24;
  --pikus-blog-mono:"Fragment Mono",ui-monospace,monospace;
  --pikus-blog-text:"Inter Tight",system-ui,sans-serif;
  color:var(--pikus-blog-ink);
  font-family:var(--pikus-blog-text);
}

.pikus-blog-grid,
.pikus-blog-grid *{
  box-sizing:border-box;
}

.pikus-blog-grid a{
  color:inherit;
  text-decoration:none !important;
  box-shadow:none !important;
}

.pikus-blog-grid img{
  display:block;
  max-width:100%;
}

.pikus-blog-grid__items{
  display:grid;
  grid-template-columns:repeat(var(--pikus-blog-columns,3),minmax(0,1fr));
  gap:44px 36px;
}

.pikus-blog-grid--columns-1{--pikus-blog-columns:1;}
.pikus-blog-grid--columns-2{--pikus-blog-columns:2;}
.pikus-blog-grid--columns-3{--pikus-blog-columns:3;}
.pikus-blog-grid--columns-4{--pikus-blog-columns:4;}

.pikus-blog-grid--carousel .pikus-blog-grid__items{
  display:flex;
  gap:36px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
}

.pikus-blog-grid--carousel .pikus-blog-grid__card{
  flex:0 0 calc((100% - (36px * (var(--pikus-blog-columns,3) - 1))) / var(--pikus-blog-columns,3));
  scroll-snap-align:start;
}

.pikus-blog-grid--masonry .pikus-blog-grid__items{
  align-items:start;
}

.pikus-blog-grid__card{
  display:flex;
  min-width:0;
  flex-direction:column;
  color:var(--pikus-blog-ink);
  transition:transform .22s;
}

.pikus-blog-grid__card:hover{
  transform:translateY(-4px);
}

.pikus-blog-grid__media{
  position:relative;
  aspect-ratio:16/10;
  margin:0 0 20px;
  overflow:hidden;
  border-radius:0;
  background:#d7dccb;
}

.pikus-blog-grid__media img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .5s;
}

.pikus-blog-grid__fallback{
  width:100%;
  height:100%;
  background:linear-gradient(135deg,#d7dccb,#f1f3e9);
}

.pikus-blog-grid__card:hover .pikus-blog-grid__media img{
  transform:scale(1.05);
}

.pikus-blog-grid__body{
  min-width:0;
}

.pikus-blog-grid__date,
.pikus-blog-grid__read-time{
  margin:0 0 10px;
  color:var(--pikus-blog-ink-faint);
  font-family:var(--pikus-blog-mono);
  font-size:12px;
  line-height:1.4;
}

.pikus-blog-grid__cats{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 14px;
}

.pikus-blog-grid__pin{
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--pikus-blog-accent-deep);
  flex:0 0 auto;
}

.pikus-blog-grid__cat{
  color:var(--pikus-blog-ink-2);
  font-family:var(--pikus-blog-mono);
  font-size:11px;
  line-height:1.4;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.pikus-blog-grid__sep{
  color:var(--pikus-blog-line);
  font-family:var(--pikus-blog-mono);
  font-size:11px;
  line-height:1.4;
}

.pikus-blog-grid__title{
  margin:0;
  color:var(--pikus-blog-ink);
  font-family:"Inter Tight",system-ui,sans-serif !important;
  font-size:20px;
  font-weight:700;
  line-height:1.18;
  letter-spacing:0;
  text-transform:none !important;
  transition:color .2s;
}

.pikus-blog-grid__title span{
  font-family:"Inter Tight",system-ui,sans-serif !important;
  font-weight:700 !important;
  text-transform:none !important;
}

.pikus-blog-grid__card:hover .pikus-blog-grid__title{
  color:#000;
}

.pikus-blog-grid__card:hover .pikus-blog-grid__title span{
  box-shadow:inset 0 -3px 0 var(--pikus-blog-accent);
}

.pikus-blog-grid__excerpt{
  margin:14px 0 0;
  color:var(--pikus-blog-ink-dim);
  font-family:var(--pikus-blog-text);
  font-size:16px;
  line-height:1.55;
}

.pikus-blog-grid__read-more{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:18px;
  color:var(--pikus-blog-ink);
  font-family:var(--pikus-blog-mono);
  font-size:12px;
  line-height:1.4;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.pikus-blog-grid__bar{
  width:22px;
  height:1px;
  background:currentColor;
}

.pikus-blog-grid__arrow{
  display:inline-block;
  transition:transform .2s;
}

.pikus-blog-grid__card:hover .pikus-blog-grid__arrow{
  transform:translateX(3px);
}

.pikus-blog-grid--image-left .pikus-blog-grid__card,
.pikus-blog-grid--image-right .pikus-blog-grid__card{
  display:grid;
  grid-template-columns:minmax(120px,42%) minmax(0,1fr);
  gap:22px;
  align-items:start;
}

.pikus-blog-grid--image-right .pikus-blog-grid__media{
  order:2;
}

.pikus-blog-grid--image-left .pikus-blog-grid__media,
.pikus-blog-grid--image-right .pikus-blog-grid__media{
  margin:0;
}

.pikus-blog-grid--no-image .pikus-blog-grid__card{
  padding-top:0;
}

.pikus-blog-grid__empty{
  padding:40px 0;
  color:var(--pikus-blog-ink-dim);
  text-align:center;
}

.pikus-blog-grid__pagination{
  margin-top:44px;
}

.pikus-blog-grid__pagination ul{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
}

.pikus-blog-grid__pagination a,
.pikus-blog-grid__pagination span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:38px;
  min-height:38px;
  padding:9px 13px;
  border:1px solid var(--pikus-blog-ink);
  border-radius:999px;
  color:var(--pikus-blog-ink);
  font-family:var(--pikus-blog-mono);
  font-size:12px;
  line-height:1;
}

.pikus-blog-grid__pagination .current,
.pikus-blog-grid__pagination a:hover{
  background:var(--pikus-blog-ink);
  color:#fff;
}

@media(max-width:980px){
  .pikus-blog-grid--columns-3 .pikus-blog-grid__items,
  .pikus-blog-grid--columns-4 .pikus-blog-grid__items{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .pikus-blog-grid--carousel .pikus-blog-grid__card{
    flex-basis:calc((100% - 36px) / 2);
  }
}

@media(max-width:640px){
  .pikus-blog-grid__items{
    grid-template-columns:1fr;
    gap:36px;
  }

  .pikus-blog-grid--carousel .pikus-blog-grid__card{
    flex-basis:86%;
  }

  .pikus-blog-grid--image-left .pikus-blog-grid__card,
  .pikus-blog-grid--image-right .pikus-blog-grid__card{
    display:flex;
  }

  .pikus-blog-grid--image-right .pikus-blog-grid__media{
    order:0;
  }
}

@media(prefers-reduced-motion:reduce){
  .pikus-blog-grid *,
  .pikus-blog-grid *::before,
  .pikus-blog-grid *::after{
    transition:none !important;
    scroll-behavior:auto !important;
  }
}