/* ── Pagination ── */

.browse-pagination .browse-page-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    border: 1px solid #dce1e6 !important;
    border-radius: 4px !important;
    font-family: inherit;
    font-size: 13px;
    line-height: normal;
    color: #22313f !important;
    text-decoration: none !important;
    background: #fff !important;
    transition: background 150ms, border-color 150ms;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    box-sizing: border-box;
}
.browse-pagination .browse-page-btn:visited { color: #22313f !important; }
.browse-pagination .browse-page-btn:hover { background: #f0f4f8; color: #22313f !important; text-decoration: none !important; }
.browse-pagination .browse-page-btn--active { background: #1a6bab !important; border-color: #1a6bab; color: #fff !important; font-weight: 600; }
.browse-pagination .browse-page-btn--active:hover { background: #1a6bab !important; color: #fff !important; }
.browse-pagination .browse-page-nav-btn { width: 36px; height: 36px; min-width: 36px; padding: 0; border-radius: 4px !important; border: 1px solid #dce1e6 !important; background: #fff !important; color: #6b7a86 !important; cursor: pointer; }
.browse-pagination .browse-page-nav-btn:hover { background: #f0f4f8 !important; color: #22313f !important; }
.browse-pagination .browse-page-nav-btn svg.browse-page-nav-icon { display: block; width: 5px; height: 9px; flex-shrink: 0; }
.browse-pagination .browse-page-nav-btn svg.browse-page-nav-icon--double { width: 10px; }
.browse-pagination .browse-page-nav-btn--ghost { background: #fff !important; border-color: #e8ecef !important; color: #ACB7BE !important; cursor: default; pointer-events: none; opacity: 0.45; }

@media (max-width: 767px) {
    .browse-pagination .browse-page-nav-btn--edge { display: none; }
    .browse-pagination .browse-page-btn--far { display: none; }
    .explore-browse-grid { margin-top: 12px; }
    #browse-mobile-bar { margin-left: 0; margin-right: 0; }
}

/* ── Layout ── */

#browse-sidebar-container { align-self: stretch; }

.explore-below-grid-outer {
    max-width: 1200px;
    margin: 0 auto;
    padding: 32px 16px 0;
}

@media (max-width: 767px) {
    .explore-below-grid-outer { padding: 20px 16px 0; }
}

/* ── Hero ── */

.explore-hero-sort-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}
.explore-page-hero {
    display: flex;
    align-items: flex-end;
    gap: 16px;
    flex: 1;
    min-width: 0;
}
.explore-page-hero-img {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 8px;
    flex-shrink: 0;
}
.explore-page-hero-text {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding-right: 24px;
}
.explore-page-hero-text .browse-heading { margin: 0 0 6px; color: #09283A; font-size: 24px; font-weight: 600; }
.explore-page-hero-subtitle {
    margin: 0;
    font-size: 14px;
    color: #09283A;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.explore-sort-inline { flex-shrink: 0; }

/* ── Below-grid sections ── */

.explore-below-section { margin-bottom: 36px; }

@media (max-width: 767px) {
    .explore-below-section { margin-bottom: 20px; }
}

.explore-below-section-heading { font-size: 20px; font-weight: 700; color: #22313f; margin: 0 0 14px; }

/* ── Subcategory pills ── */

.explore-subcategories-grid { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-start; width: 100%; }
.explore-subcategory-pill {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    border: 1.5px solid #1F1F1C;
    border-radius: 100px;
    font-size: 14px;
    color: #1F1F1C;
    text-decoration: none;
    text-align: center;
    background: #fff;
    transition: border-color 150ms, background 150ms;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.explore-subcategory-pill:hover { border-color: #1a6bab; color: #1a6bab; background: #f0f6fc; }

/* ── Sibling category cards ── */

.explore-siblings-grid { display: flex; flex-wrap: wrap; gap: 10px; }
.explore-sibling-card {
    position: relative;
    flex: 0 0 calc((100% - 20px) / 3);
    aspect-ratio: 4/3;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    overflow: hidden;
    text-decoration: none;
    background-color: #F3F5F6;
}
.explore-sibling-card-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: brightness(.66);
    transition: filter 150ms;
}
.explore-sibling-card:hover .explore-sibling-card-img { filter: brightness(1); }
.explore-sibling-card-label {
    position: relative;
    z-index: 1;
    background: #fff;
    border-radius: 100px;
    padding: 5px 14px;
    font-size: 13px;
    font-weight: 700;
    color: #22313f;
    white-space: nowrap;
    max-width: 90%;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    transition: background 150ms, color 150ms;
}
.explore-sibling-card:hover .explore-sibling-card-label { background: #2E9DE1; color: #fff; }

@media (min-width: 576px) {
    .explore-sibling-card { flex: 0 0 calc((100% - 30px) / 4); }
}
@media (min-width: 992px) {
    .explore-sibling-card { flex: 0 0 calc((100% - 50px) / 6); }
}

/* ── Misc ── */

.explore-faq { margin-top: 48px; }
.browse-apps-wrapper { margin-top: 48px; }

/* ── Breadcrumbs ── */

.explore-breadcrumbs { display: flex; align-items: center; gap: 6px; font-size: 14px; color: #6b7a86; margin-bottom: 8px; flex-wrap: wrap; }
.explore-breadcrumb-link { color: #1a6bab; text-decoration: none; font-size: 14px; }
.explore-breadcrumb-link:hover { text-decoration: underline; }
.explore-breadcrumb-sep { color: #9aa5ae; font-size: 14px; line-height: 1; }
.explore-breadcrumb-current { color: #22313f; font-size: 14px; font-weight: 600; }
