.category-detail-hero{
  background:linear-gradient(135deg,#f3f7ff,#fff);
  padding:48px 0 65px
}
.category-breadcrumb{
  display:flex;flex-wrap:wrap;gap:10px;
  font-size:13px;margin-bottom:40px;color:#64748b
}
.category-breadcrumb a{color:#155eef;text-decoration:none}
.category-detail-heading{display:flex;align-items:center;gap:24px}
.category-detail-heading .category-icon{
  width:78px;height:78px;flex-shrink:0;margin:0
}
.category-detail-heading h1{
  font-size:clamp(30px,4vw,48px);
  margin:10px 0;color:#0f172a
}
.category-detail-heading p{margin:0;color:#64748b}
.category-detail-section-heading{margin:0 0 25px}
.category-detail-section-heading h2{
  font-size:26px;color:#0f172a;margin:0 0 8px
}
.category-detail-section-heading p{margin:0;color:#64748b}
.category-detail-subgrid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:15px;margin-bottom:65px
}
.category-detail-subcard{
  display:flex;align-items:center;gap:13px;
  padding:18px;border:1px solid #e7edf5;
  border-radius:14px;background:#fff;
  color:#0f172a;text-decoration:none;
  transition:transform .2s,border-color .2s
}
.category-detail-subcard:hover{
  transform:translateY(-3px);border-color:#155eef
}
.category-detail-subcard .category-icon{
  width:42px;height:42px;margin:0;flex-shrink:0
}
.category-detail-subcard span:nth-child(2){flex:1;font-weight:600;font-size:13px}
.category-detail-subcard span:last-child{color:#155eef}
.category-detail-empty{
  padding:55px 25px;text-align:center;
  border:1px solid #e7edf5;border-radius:20px;
  background:#f8fbff
}
.category-detail-empty .category-icon{margin:0 auto 18px}
.category-detail-empty h3{margin:0 0 10px;color:#0f172a}
.category-detail-empty p{color:#64748b}
.category-detail-empty a{display:inline-block;margin-top:15px;color:#155eef;font-weight:700}
.category-detail-businesses{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px
}
.category-detail-business{
  border:1px solid #e7edf5;border-radius:16px;padding:24px
}
.category-detail-business h3{margin:0 0 10px}
.category-card-link{display:block;text-decoration:none;color:inherit}
.category-card-link:hover{text-decoration:none}
.directory-card-heading h2 a{color:inherit;text-decoration:none}
.directory-card-heading h2 a:hover{color:#155eef}
.directory-subcategories a{color:inherit;text-decoration:none}
.directory-subcategories a:hover{color:#155eef}
@media(max-width:900px){
  .category-detail-subgrid,.category-detail-businesses{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}
@media(max-width:600px){
  .category-detail-heading{align-items:flex-start;flex-direction:column}
  .category-detail-subgrid,.category-detail-businesses{grid-template-columns:1fr}
}

/* STEP 112F: Premium category detail and related listing cards */

.category-detail-page {
    background:#f7f9fd;
    color:#172b49;
    min-height:65vh;
}

@media(min-width:1200px) {
    .category-detail-page .container {
        width:calc(100% - 240px);
        max-width:1440px;
        margin-left:auto;
        margin-right:auto;
        box-sizing:border-box;
    }
}

.category-detail-page .category-detail-hero {
    padding:55px 0 65px;
    background:
        radial-gradient(circle at 90% 12%,
            rgba(59,130,246,.13),transparent 35%),
        linear-gradient(125deg,#edf5ff,#f9fbff 62%,#eefbf9);
    border-bottom:1px solid #e1eaf5;
}

.category-detail-page .category-breadcrumb {
    margin-bottom:32px;
    font-weight:650;
    color:#64748b;
}

.category-detail-page .category-breadcrumb a {
    color:#2563eb;
}

.category-detail-page .category-detail-heading {
    padding:32px;
    border:1px solid #dfe8f4;
    border-radius:22px;
    background:rgba(255,255,255,.95);
    box-shadow:0 16px 42px rgba(20,43,75,.065);
}

.category-detail-page .category-detail-heading h1 {
    color:#102747;
    font-weight:850;
    letter-spacing:-1px;
    overflow-wrap:anywhere;
}

.category-detail-page .category-detail-heading p {
    color:#526781;
    line-height:1.8;
}

.category-detail-page .category-detail-heading .category-icon {
    border-radius:18px;
    background:linear-gradient(145deg,#e6f1ff,#d7e9ff);
    border:1px solid #d3e4fa;
}

.category-detail-page .section-space {
    padding-top:55px;
    padding-bottom:75px;
}

.category-detail-page .category-detail-section-heading h2 {
    color:#142b4b;
    font-size:clamp(23px,2.5vw,30px);
    font-weight:850;
    letter-spacing:-.6px;
}

.category-detail-page .category-detail-section-heading p {
    color:#60748d;
    line-height:1.7;
}

.category-detail-page .category-detail-subgrid {
    gap:20px;
    margin-bottom:60px;
}

.category-detail-page .category-detail-subcard {
    min-width:0;
    padding:22px;
    border:1px solid #dfe8f4;
    border-radius:17px;
    background:#fff;
    box-shadow:0 8px 25px rgba(20,43,75,.045);
    transition:transform .2s,border-color .2s,box-shadow .2s;
}

.category-detail-page .category-detail-subcard:hover {
    transform:translateY(-4px);
    border-color:#bad2f4;
    box-shadow:0 15px 34px rgba(20,43,75,.10);
}

.category-detail-page .category-detail-subcard .category-icon {
    border-radius:12px;
    background:#edf5ff;
}

.category-detail-page .category-detail-empty {
    background:#fff;
    border-color:#dfe8f4;
    box-shadow:0 12px 30px rgba(20,43,75,.045);
}

/* Related Businesses card structure and premium finishing */
.category-detail-page .category-detail-businesses {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:22px;
    align-items:stretch;
}

.category-detail-page .bd-related-item {
    min-width:0;
    padding:0 0 17px;
    border:1px solid #dfe8f4;
    border-radius:18px;
    background:#fff;
    box-shadow:
        0 5px 15px rgba(20,43,75,.035),
        0 14px 32px rgba(20,43,75,.05);
    transition:transform .22s,box-shadow .22s,border-color .22s;
}

.category-detail-page .bd-related-item:hover {
    transform:translateY(-4px);
    border-color:#bfd4f3;
    box-shadow:0 18px 40px rgba(20,43,75,.11);
}

.category-detail-page .bd-related-image {
    width:100%;
    height:210px;
    object-fit:contain;
    background:#fff;
}

.category-detail-page .bd-related-image-placeholder {
    min-height:210px;
}

.category-detail-page .bd-related-title {
    color:#172d4d;
    font-weight:800;
}

.category-detail-page .bd-related-item .bd-related-more {
    background:linear-gradient(120deg,#2563eb,#1754c4);
    color:#fff;
    border-radius:9px;
    box-shadow:0 5px 14px rgba(37,99,235,.13);
}

.category-detail-page .bd-related-item .bd-related-more:hover {
    background:#174db3;
    color:#fff;
}

.category-detail-page .bd-related-item:has(.bd-opening-widget[open]) {
    overflow:visible;
    position:relative;
    z-index:40;
}

.category-detail-page a:focus-visible,
.category-detail-page button:focus-visible,
.category-detail-page summary:focus-visible {
    outline:3px solid #60a5fa;
    outline-offset:3px;
}

@media(min-width:651px) and (max-width:1199px) {
    .category-detail-page .container {
        width:calc(100% - 40px);
        max-width:1180px;
    }
}

@media(max-width:900px) {
    .category-detail-page .category-detail-businesses,
    .category-detail-page .category-detail-subgrid {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:650px) {
    .category-detail-page .container {
        width:calc(100% - 28px);
    }

    .category-detail-page .category-detail-hero {
        padding:35px 0 45px;
    }

    .category-detail-page .category-detail-heading {
        padding:23px 19px;
        border-radius:17px;
    }

    .category-detail-page .section-space {
        padding-top:35px;
        padding-bottom:55px;
    }

    .category-detail-page .category-detail-businesses,
    .category-detail-page .category-detail-subgrid {
        grid-template-columns:minmax(0,1fr);
        gap:17px;
    }

    .category-detail-page .category-detail-subgrid {
        margin-bottom:45px;
    }
}

@media(prefers-reduced-motion:reduce) {
    .category-detail-page .bd-related-item,
    .category-detail-page .category-detail-subcard {
        transition:none;
    }

    .category-detail-page .bd-related-item:hover,
    .category-detail-page .category-detail-subcard:hover {
        transform:none;
    }
}
