/* Compact Shared Details CSS (Used by both Blog Details & Service Details) */
.solar-details-area { padding: 70px 0 85px; background: #f6fafd; }
.solar-feature-img-box { width: 100%; height: 430px; border-radius: 20px; overflow: hidden; box-shadow: 0 15px 35px rgba(5,34,43,.12); border: 4px solid #fff; background: #05222b; position: relative; }
.solar-feature-img-box img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; transition: transform .5s ease; }
.solar-feature-img-box:hover img { transform: scale(1.03); }
.solar-meta-strip { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 16px; background: #fff; padding: 10px 20px; border-radius: 50px; box-shadow: 0 8px 20px rgba(5,34,43,.08); margin-bottom: 18px; border: 1px solid #e2eef3; font-size: 13.5px; font-weight: 600; color: #05222b; }
.solar-meta-strip span i { color: #00b4d8; margin-right: 6px; }

/* Sidebar Widget + Scrollable List + Direct Help Box */
.solar-sidebar-card { background: #fff; border-radius: 20px; padding: 26px 22px; box-shadow: 0 14px 34px rgba(5,34,43,.07); border: 1px solid rgba(0,180,216,.18); height: 430px; display: flex; flex-direction: column; }
.solar-widget-title { font-size: 20px; font-weight: 800; color: #05222b; padding-bottom: 14px; margin-bottom: 14px; border-bottom: 2px solid #eef5f8; position: relative; display: flex; align-items: center; gap: 9px; }
.solar-widget-title i { color: #00b4d8; }
.solar-widget-title::after { content: ""; position: absolute; bottom: -2px; left: 0; width: 65px; height: 2px; background: #00b4d8; }
.solar-sidebar-scroll { overflow-y: auto; flex-grow: 1; padding-right: 6px; }
.solar-sidebar-scroll::-webkit-scrollbar { width: 5px; }
.solar-sidebar-scroll::-webkit-scrollbar-track { background: #f1f7fa; border-radius: 10px; }
.solar-sidebar-scroll::-webkit-scrollbar-thumb { background: #00b4d8; border-radius: 10px; }
.solar-sidebar-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 9px; }
.solar-sidebar-list li a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 15px; border-radius: 12px; background: #f7fbfd; border: 1px solid #e5f0f5; color: #05222b; font-size: 14px; font-weight: 600; text-decoration: none; transition: all .25s ease; line-height: 1.4; }
.solar-sidebar-list li a i { color: #00b4d8; font-size: 13px; flex-shrink: 0; transition: transform .25s ease; }
.solar-sidebar-list li a:hover { background: linear-gradient(90deg, #05222b, #083c4f); color: #fff; border-color: #05222b; transform: translateX(4px); }
.solar-sidebar-list li a:hover i { color: #00e1ff; transform: translateX(3px); }

/* Rich Content Typography (h1, h2, h3, h4, p, ul, li, strong) */
.solar-rich-content { background: #fff; border-radius: 22px; padding: 42px 45px; box-shadow: 0 15px 40px rgba(5,34,43,.06); border: 1px solid #e5f0f5; margin-top: 10px; }
.solar-rich-content .main-article-heading { font-size: clamp(24px, 3vw, 34px); font-weight: 800; color: #05222b; line-height: 1.3; margin: 0 0 22px; padding-bottom: 18px; border-bottom: 2px solid #f0f6f9; }
.solar-rich-content h1, .solar-rich-content h2 { font-size: clamp(20px, 2.3vw, 25px); font-weight: 800; color: #05222b; margin: 32px 0 14px; padding-left: 14px; border-left: 4px solid #00b4d8; line-height: 1.35; }
.solar-rich-content h3, .solar-rich-content h4 { font-size: clamp(17px, 1.9vw, 20px); font-weight: 700; color: #083c4f; margin: 24px 0 10px; line-height: 1.4; }
.solar-rich-content p { font-size: 16px; line-height: 1.8; color: #44525a; margin-bottom: 18px; }
.solar-rich-content strong { color: #05222b; font-weight: 700; }
.solar-rich-content ul, .solar-rich-content ol { margin: 16px 0 24px; padding: 20px 24px 20px 26px; background: #f6fafd; border-radius: 16px; border: 1px solid #e1eff6; list-style: none; }
.solar-rich-content ul li, .solar-rich-content ol li { position: relative; padding-left: 28px; margin-bottom: 11px; font-size: 15.5px; line-height: 1.65; color: #2d3e46; }
.solar-rich-content ul li:last-child, .solar-rich-content ol li:last-child { margin-bottom: 0; }
.solar-rich-content ul li::before, .solar-rich-content ol li::before { content: "\f058"; font-family: "Font Awesome 6 Free", "Font Awesome 5 Free"; font-weight: 900; position: absolute; left: 0; top: 2px; color: #00b4d8; font-size: 16px; }
.solar-rich-content table { width: 100%; border-collapse: collapse; margin: 22px 0; border-radius: 12px; overflow: hidden; }
.solar-rich-content table th { background: #05222b; color: #fff; padding: 12px 16px; font-weight: 700; }
.solar-rich-content table td { padding: 12px 16px; border-bottom: 1px solid #e5f0f5; color: #444; }

/* Bottom Inline WhatsApp & Call Strip inside Article */
.solar-inline-cta { margin-top: 35px; background: linear-gradient(120deg, #04212b 0%, #083c4f 100%); border-radius: 18px; padding: 28px 32px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; border: 1px solid rgba(0,225,255,.35); }
.solar-inline-cta h4 { color: #fff; font-size: 21px; font-weight: 800; margin-bottom: 5px; }
.solar-inline-cta p { color: rgba(255,255,255,.82); font-size: 14.5px; margin-bottom: 0; }
.solar-inline-btns { display: flex; flex-wrap: wrap; gap: 12px; }
.btn-wa-sm, .btn-call-sm { display: inline-flex; align-items: center; gap: 8px; padding: 12px 22px; border-radius: 50px; font-size: 14.5px; font-weight: 700; text-decoration: none; transition: all .3s ease; }
.btn-wa-sm { background: #25D366; color: #fff !important; box-shadow: 0 8px 20px rgba(37,211,102,.3); }
.btn-wa-sm:hover { background: #1da851; transform: translateY(-2px); }
.btn-call-sm { background: #00e1ff; color: #04212b !important; }
.btn-call-sm:hover { background: #fff; transform: translateY(-2px); }

@media (max-width: 991.98px) {
    .solar-feature-img-box { height: 320px; }
    .solar-sidebar-card { height: auto; max-height: 380px; }
    .solar-rich-content { padding: 30px 24px; }
}
@media (max-width: 575.98px) {
    .solar-details-area { padding: 45px 0 60px; }
    .solar-feature-img-box { height: 240px; border-radius: 14px; }
    .solar-rich-content { padding: 24px 18px; border-radius: 16px; }
    .solar-inline-cta { padding: 22px 18px; text-align: center; justify-content: center; }
    .solar-inline-btns { width: 100%; flex-direction: column; }
    .btn-wa-sm, .btn-call-sm { justify-content: center; width: 100%; }
}