/* IllumiWeb - GBP Posts Carousel & Grid (Swiper - minimal, proven) */
/* Do NOT set width/flex-basis/min-width/max-width/overflow on .swiper,
   .swiper-wrapper, or .swiper-slide. Swiper owns all of that. Only padding
   on .swiper (arrow room) and height:auto+flex on the slide. */
.iwc-gbp-posts {
    width: 100%;
    max-width: 1200px;
    min-width: 0;
    margin: 0 auto;
    overflow: hidden;
}
.iwc-gbp-posts .swiper {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 0 50px;
    box-sizing: border-box;
    overflow: hidden;
}
.iwc-gbp-posts .swiper-slide {
    height: auto;
    display: flex;          /* equal-height cards */
}

/* ---------- Card ---------- */
.iwc-gbp-post {
    display: flex; flex-direction: column; gap: 12px;
    width: 100%; padding: 18px; box-sizing: border-box;
    background: #fff; border: 1px solid #e6e8eb; border-radius: 14px;
    box-shadow: 0 1px 3px rgba(60,64,67,.12), 0 1px 2px rgba(60,64,67,.18);
}
.iwc-gbp-post__title { margin: 0; font-size: 18px; font-weight: 600; color: #1d2327; }
.iwc-gbp-post__date { font-size: 12px; color: #9ca3af; }
.iwc-gbp-post__summary { font-size: 14px; line-height: 1.6; color: #374151; }
.iwc-gbp-post__summary a { color: #4361EE; text-decoration: none; font-weight: 500; }
.iwc-gbp-post__summary a:hover { text-decoration: underline; }

/* Arrows + pagination: chevrons in the outer gutter, beside the cards. */
.iwc-gbp-posts .swiper-button-next,
.iwc-gbp-posts .swiper-button-prev {
    color: #4361EE;
    width: 32px;
    margin-top: 0;
    top: 50%;
    transform: translateY(-50%);
}
.iwc-gbp-posts .swiper-button-prev { left: 2px; }
.iwc-gbp-posts .swiper-button-next { right: 2px; }
.iwc-gbp-posts .swiper-pagination-bullet-active { background: #4361EE; }

/* ---------- Grid ---------- */
.iwc-gbp-posts--grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px;
}
.iwc-gbp-posts--grid .iwc-gbp-posts__item { display: block; }
.iwc-gbp-posts--grid .iwc-gbp-post { height: 100%; }

/* ---------- Mobile ---------- */
@media (max-width: 768px) {
    .iwc-gbp-posts .swiper { padding: 0 20px; }
    .iwc-gbp-posts .swiper-button-next,
    .iwc-gbp-posts .swiper-button-prev { width: 30px; height: 30px; }
    .iwc-gbp-posts .swiper-button-next:after,
    .iwc-gbp-posts .swiper-button-prev:after { font-size: 20px; }
}