/* ===== Blog detail — Categories chips ===== */ .blog-cats__list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; } /* scoped under .blog-cats so it outranks the global .post_div a { } color */ .blog-cats .blog-cats__chip { display: inline-flex; align-items: center; font-size: 14px; font-weight: 600; line-height: 1; color: #2d2d43; background: #f4f6fc; border: 1px solid #e5e9f4; border-radius: 999px; padding: 8px 14px; text-decoration: none; transition: all .18s ease; } /* higher specificity than the global .post_div a:hover (which turns text blue and would make it invisible on the blue chip background) */ .blog-cats .blog-cats__chip:hover { background: #1431cf; border-color: #1431cf; color: #fff; transform: translateY(-1px); } /* ===== Blog detail — Sidebar enquiry form ===== */ .sidebar-enquiry { background: #fff; border: 1px solid #e5e9f4; border-radius: 14px; overflow: hidden; box-shadow: 0 10px 30px -22px rgba(20, 28, 46, .45); } .sidebar-enquiry__head { background: linear-gradient(135deg, #1431cf, #2977f1); color: #fff; padding: 20px; } .sidebar-enquiry__head h3 { color: #fff; font-weight: 700; font-size: 20px; margin: 0 0 6px; } .sidebar-enquiry__head p { color: rgba(255, 255, 255, .9); font-size: 14px; line-height: 1.5; margin: 0; } /* keep head text white on hover (global .post_div p:hover turns it blue) */ .sidebar-enquiry__head h3:hover, .sidebar-enquiry__head p:hover { color: #fff; } .sidebar-enquiry__form { padding: 18px; } .sidebar-enquiry__form .form-control { border-radius: 8px; padding: 10px 13px; font-size: 14px; background: #f8fafc; border: 1px solid #e5e9f4; margin-bottom: 10px; width: 100%; } .sidebar-enquiry__form .form-control:focus { border-color: #1431cf; box-shadow: none; background: #fff; outline: none; } .sidebar-enquiry__form textarea.form-control { height: 80px; resize: none; } .sidebar-enquiry__btn { width: 100%; background: #1431cf; border: none; color: #fff; font-weight: 600; font-size: 15px; padding: 12px; border-radius: 8px; margin-top: 4px; transition: background .18s ease; } .sidebar-enquiry__btn:hover { background: #0f249e; } .sidebar-enquiry .error { color: #e23636; font-size: 12.5px; font-weight: 500; margin: -6px 0 9px; display: block; } .sidebar-enquiry .g-recaptcha { margin-bottom: 12px; } /* keep the 304px reCAPTCHA inside the narrow sidebar column */ @media (min-width: 992px) and (max-width: 1120px) { .sidebar-enquiry .g-recaptcha { transform: scale(.9); transform-origin: 0 0; } } /* ===== Keep the sticky sidebar from jumping when a Bootstrap modal opens ===== Bootstrap's .modal-open forces `overflow: hidden` on , which breaks position: sticky (and drops the scrollbar). `overflow: clip` still locks the background scroll but does NOT break sticky — matching how the page already uses overflow-x: clip for the sticky sidebar. Bootstrap's own padding-right compensation still prevents the horizontal shift. */ @media (min-width: 992px) { body.modal-open { overflow: clip !important; } }