/* ── Thoughts Archive — Page Header ── */
.bsb-page-header {
    padding:    10rem 0 6rem;
    text-align: center;
}

.bsb-page-title {
    font-family:    var(--bsb-font-display);
    font-size:      clamp(1.5rem, 3.5vw, 3rem);
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    color:          var(--bsb-color-text);
    margin:         0 0 1.25rem;
    line-height:    1.1;
}

.bsb-page-subtitle {
    font-family: var(--bsb-font-primary);
    font-size:   clamp(0.9rem, 1.3vw, 1.25rem);
    font-weight: 600;
    line-height: 1.6;
    color:       var(--bsb-color-text);
    max-width:   800px;
    margin:      0 auto;
}

/* ── Thoughts Listing ── */
.bsb-thoughts-listing {
    padding-bottom: 6rem;
}

.bsb-thoughts-grid {
    display:       flex;
    align-items:   flex-start;
    gap:           30px;
    margin-bottom: 3rem;
}

.bsb-masonry-col {
    flex:           1;
    display:        flex;
    flex-direction: column;
    gap:            35px;
    min-width:      0;
}

/* ── Card (archive/listing context) ── */
.bsb-thoughts-listing .bsb-thought-card {
    display: block;
    /* opacity set by GSAP — no CSS initial state so cards stay visible if JS fails */
}

/* Image link */
.bsb-thoughts-listing .bsb-thought-image-link {
    display: block;
}

/* Image box */
.bsb-thoughts-listing .bsb-thought-image-box {
    width:         100%;
    border-radius: 12px;
    overflow:      hidden;
    margin-bottom: 1rem;
    background:    #f8f8f8;
}

.bsb-thoughts-listing .bsb-thought-image-placeholder {
    width:        100%;
    aspect-ratio: 3 / 2;
    background:   #e8e8e8;
}

.bsb-thoughts-listing .bsb-thought-image-box img {
    width:      100%;
    height:     auto;
    display:    block;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.bsb-thoughts-listing .bsb-thought-card:hover .bsb-thought-image-box img {
    transform: scale(1.04);
}

/* Tags list */
.bsb-thoughts-listing .bsb-thought-tags {
    list-style:    none;
    padding:       0;
    margin:        0 0 0.75rem;
    display:       flex;
    flex-wrap:     wrap;
    gap:           0.4rem;
}

.bsb-thoughts-listing .bsb-thought-tag {
    display:         inline-block;
    text-decoration: none;
    padding:         5px 12px;
    border:          1px solid var(--bsb-color-text);
    border-radius:   100px;
    font-family:     var(--bsb-font-primary);
    font-size:       0.625rem;
    font-weight:     700;
    text-transform:  uppercase;
    letter-spacing:  0.1em;
    color:           var(--bsb-color-text);
    transition:      background 0.25s ease, color 0.25s ease;
}

.bsb-thoughts-listing .bsb-thought-tag:hover {
    background: var(--bsb-color-text);
    color:      var(--bsb-color-bg);
}

/* Title link */
.bsb-thoughts-listing .bsb-thought-title-link {
    display:         block;
    text-decoration: none;
    color:           inherit;
}

.bsb-thoughts-listing .bsb-thought-title {
    font-family:    var(--bsb-font-display);
    font-size:      clamp(0.85rem, 1.1vw, 1.1rem);
    font-weight:    800;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    line-height:    1.25;
    color:          var(--bsb-color-text);
    margin:         0;
    transition:     opacity 0.25s ease;
}

.bsb-thoughts-listing .bsb-thought-card:hover .bsb-thought-title {
    opacity: 0.65;
}

/* ── AJAX page loader overlay ── */
.bsb-archive-loader {
    display:         none;
    position:        fixed;
    inset:           0;
    z-index:         9999;
    align-items:     center;
    justify-content: center;
    background:      rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(4px);
}

.bsb-archive-loader.is-active {
    display: flex;
}

.bsb-archive-loader__spinner {
    width:         44px;
    height:        44px;
    border:        3px solid rgba(0, 0, 0, 0.12);
    border-top-color: var(--bsb-color-text);
    border-radius: 50%;
    animation:     bsb-spin 0.7s linear infinite;
}

@keyframes bsb-spin {
    to { transform: rotate(360deg); }
}

/* ── Load More ── */
.bsb-thoughts-load-more {
    display:         flex;
    justify-content: center;
    padding-bottom:  5rem;
    margin-top:      1.5rem;
}

.bsb-load-more-btn {
    display:        inline-flex;
    flex-direction: column;
    align-items:    center;
    gap:            10px;
    background:     none;
    border:         none;
    cursor:         pointer;
    font-family:    var(--bsb-font-primary);
    font-size:      0.875rem;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color:          var(--bsb-color-text);
    transition:     opacity 0.3s ease;
    padding:        10px 20px;
}

.bsb-load-more-btn:hover {
    opacity: 0.55;
}

.bsb-load-more-btn svg {
    width:  clamp(30px, 4vw, 50px);
    height: clamp(30px, 4vw, 50px);
}

/* ── Responsive ── */
@media (max-width: 1024px) {
    .bsb-thoughts-grid  { gap: 24px; }
    .bsb-masonry-col    { gap: 28px; }
}

@media (max-width: 768px) {
    .bsb-page-header    { padding: 8rem 0 3rem; }
    .bsb-page-title     { font-size: clamp(1.5rem, 6vw, 2.5rem); }
    .bsb-thoughts-grid  { gap: 20px; }
    .bsb-masonry-col    { gap: 24px; }
}

@media (max-width: 480px) {
    .bsb-thoughts-grid  { flex-direction: column; }
}