/* Conjurly WPGeoDirectory Enhancements — Single Listing
Layout and styles for GD single listing pages.
Version: 0.1.291 */
/* ── Single listing two-column layout ──────────────────────────────────────── */
.cnjrly-gd-single-layout {
display: grid;
grid-template-columns: minmax(0, 1fr) var(--cj-rail-width, 300px);
gap: var(--cj-gap-rail, 24px);
align-items: start;
width: 100%;
max-width: 1200px;
margin-left: auto;
margin-right: auto;
box-sizing: border-box;
}
.cnjrly-gd-single-main {
min-width: 0;
box-sizing: border-box;
}
.cnjrly-gd-single-rail--right {
position: sticky;
top: var(--cj-sticky-top, 80px);
min-width: 0;
box-sizing: border-box;
}
/* Empty rail — renders as empty space; the column track remains via the grid,
matching the archive rail behavior. */
.cnjrly-gd-single-rail--empty {
background: none;
border: none;
box-shadow: none;
}
@media (max-width: 767px) {
.cnjrly-gd-single-layout {
grid-template-columns: 1fr;
width: auto;
}
.cnjrly-gd-single-rail--right {
position: static;
}
}
/* Base rail widget card — mirrors archive rail so plain widgets (e.g. spacer)
display as cards; the modifiers below strip this for ads / no-card widgets */
.cnjrly-gd-single-rail .cj-widget,
.cnjrly-gd-single-rail .widget {
background: var(--cj-surface-primary, #fff);
border: 1px solid var(--cj-border-card, rgba(0, 0, 0, 0.08));
border-radius: var(--cj-radius-card, 14px);
box-shadow: var(--cj-shadow-card, 0 1px 4px rgba(0, 0, 0, 0.04));
padding: 1rem;
margin: 0 0 var(--cj-gap-card, 18px);
}
.cnjrly-gd-single-rail .cj-widget:last-child,
.cnjrly-gd-single-rail .widget:last-child {
margin-bottom: 0;
}
/* No-card modifier */
.cnjrly-gd-single-rail .cj-widget:has(.cnjrly-no-card) {
background: none !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
padding: 0 !important;
margin: 0 0 var(--cj-gap-card, 18px) !important;
}
/* Ad label modifier */
.cnjrly-gd-single-rail .cj-widget:has(.cnjrly-ad-label) {
background: none !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
padding: 0 !important;
margin: 0 0 10px !important;
font-size: 0.7rem;
text-transform: uppercase;
letter-spacing: 0.05em;
color: var(--cj-text-muted, #999);
}
.cnjrly-gd-single-rail .cj-widget:has(.cnjrly-ad-label) p {
margin: 0;
}
/* Rail widget titles — mirrors archive rail */
.cnjrly-gd-single-rail .cj-widget-title,
.cnjrly-gd-single-rail .widget-title {
margin: 0 0 0.75rem;
font-family: var(--cj-heading-font-family, "IBM Plex Sans Condensed", sans-serif);
font-size: 1.05rem;
font-weight: 500;
line-height: 1.15;
color: var(--cj-indigo, #4c187e);
}
/* Rail images — never overflow their column */
.cnjrly-gd-single-rail img {
max-width: 100% !important;
height: auto !important;
}
/* Single page card — enforce border-radius and overflow hidden so image clips flush */
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .elementor-section-boxed {
border-radius: 14px 14px 0 0;
overflow: hidden;
}
/* Hero image treatment is intentionally scoped to two known structures only:
1) GD's native linked Featured Image widget (`.elementor-widget-image > a`), and
2) the Elementor Cover Image widget when it immediately follows the Featured
Listing badge (`.elementor-widget-image > img`).
Ordinary Elementor images such as Profile Photo receive no sizing/layout
rules from this stylesheet, so Elementor retains full responsive control. */
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .elementor-widget-image:has(> a),
.cnjrly-gd-single-main [data-elementor-type="geodirectory"]
.elementor-widget-wp-widget-gd_post_badge:has([data-badge="featured"])
+ .elementor-widget-image:has(> img) {
position: relative !important;
overflow: hidden;
aspect-ratio: 16 / 9;
width: 100%;
background: var(--cj-border-light, #e6e7eb);
border-radius: 14px 14px 0 0;
transform: translateZ(0);
-webkit-transform: translateZ(0);
}
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .elementor-widget-image:has(> a) > .cnjrly-blur-bg,
.cnjrly-gd-single-main [data-elementor-type="geodirectory"]
.elementor-widget-wp-widget-gd_post_badge:has([data-badge="featured"])
+ .elementor-widget-image:has(> img) > .cnjrly-blur-bg {
position: absolute;
inset: -20px;
background-size: cover;
background-position: center;
filter: blur(18px);
opacity: 0.85;
z-index: 0;
}
/* Existing GD Featured Image path. */
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .elementor-widget-image:has(> a) > a {
position: absolute !important;
inset: 0;
width: 100%;
height: 100%;
margin-top: 10px;
display: flex;
align-items: center;
justify-content: center;
z-index: 1;
}
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .elementor-widget-image:has(> a) > a img {
position: relative;
z-index: 1;
display: block;
width: 100% !important;
height: auto !important;
max-height: 100% !important;
transition: none !important;
transform: none !important;
}
/* Featured badge present — no rounded top corners on GD Featured Image. */
.cnjrly-gd-single-main [data-elementor-type="geodirectory"].geodir-badge-featured .elementor-widget-image:has(> a) {
border-radius: 0;
}
/* Featured bar present — preserve the established GD Featured Image offset. */
.cnjrly-gd-single-main [data-elementor-type="geodirectory"].geodir-badge-featured .elementor-widget-image:has(> a) > a {
margin-top: -3px;
}
/* Elementor Cover Image path: direct ![]()
immediately after Featured badge. */
.cnjrly-gd-single-main [data-elementor-type="geodirectory"]
.elementor-widget-wp-widget-gd_post_badge:has([data-badge="featured"])
+ .elementor-widget-image:has(> img) {
margin-top: -20px !important;
border-radius: 0;
}
.cnjrly-gd-single-main [data-elementor-type="geodirectory"]
.elementor-widget-wp-widget-gd_post_badge:has([data-badge="featured"])
+ .elementor-widget-image:has(> img) > img {
position: absolute !important;
inset: 0;
z-index: 1;
display: block;
width: 100% !important;
height: 100% !important;
max-width: 100% !important;
max-height: 100% !important;
object-fit: contain !important;
object-position: center center !important;
margin: auto !important;
transition: none !important;
transform: none !important;
}
/* Logo image — mirrors the archive logo treatment. GD renders the logo via a
gd_post_images slider whose .embed-responsive forces a padding-based ratio
(ratio-16x9), ballooning a square logo. Constrain to a fixed 100px height,
left-aligned, contain. Scoped to the single's logo widget (23fe1e17) so it
does not affect the featured image or any other gd_post_images output. */
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .elementor-element-23fe1e17:has(img) {
height: 100px;
overflow: hidden;
}
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .elementor-element-23fe1e17 .geodir-post-slider,
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .elementor-element-23fe1e17 .geodir-image-container,
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .elementor-element-23fe1e17 .geodir-images,
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .elementor-element-23fe1e17 .carousel-item {
height: 100px !important;
}
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .elementor-element-23fe1e17 .embed-responsive {
height: 100px !important;
padding-bottom: 0 !important;
position: relative !important;
}
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .elementor-element-23fe1e17 img {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: auto !important;
max-width: 100% !important;
height: 100px !important;
max-height: 100% !important;
object-fit: contain !important;
object-position: left center !important;
}
/* Social icons — GD renders the with an href only when that network has a
link in the listing data; empty networks render an with no href. Hide
those grid items so only populated icons display. */
.cnjrly-gd-single-main .elementor-widget-social-icons .elementor-grid-item:not(:has(a[href])) {
display: none;
}
/* =========================================================
Single listing top bar — mirrors TEC single top bar
========================================================= */
.cnjrly-tec-top-bar {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0.4rem;
margin-top: 0;
margin-bottom: 35px;
padding: 0.65rem 0.75rem;
background: #fff;
border: 1px solid var(--cj-border-light, #e6e7eb);
border-radius: var(--cj-radius-card, 14px);
box-shadow: var(--cj-shadow-card, 0 1px 4px rgba(0,0,0,0.04));
font-family: "IBM Plex Sans", sans-serif;
font-size: 0.88rem;
}
.cnjrly-tec-bar__spacer {
flex: 1 1 0;
min-width: 0;
}
.cnjrly-tec-bar__btn {
display: inline-flex;
align-items: center;
height: 2rem;
padding: 0 0.7rem;
border: 1px solid var(--cj-border-light, #e6e7eb);
border-radius: var(--cj-radius-btn, 10px);
background: var(--cj-surface-primary, #fff);
color: var(--cj-indigo, #4c187e);
text-decoration: none;
font-weight: 500;
font-size: 0.85rem;
white-space: nowrap;
transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.cnjrly-tec-bar__btn:hover {
border-color: var(--cj-indigo, #4c187e);
background: rgba(76, 24, 126, 0.06);
color: var(--cj-indigo, #4c187e);
text-decoration: none;
}
.cnjrly-tec-bar__btn--disabled {
opacity: 0.35;
cursor: default;
pointer-events: none;
}
.cnjrly-tec-bar__btn--add {
background: var(--cj-indigo, #4c187e);
border-color: var(--cj-indigo, #4c187e);
color: #fff;
font-weight: 600;
}
.cnjrly-tec-bar__btn--add:hover {
background: var(--cj-indigo-hover, #6f4697);
border-color: var(--cj-indigo-hover, #6f4697);
color: #fff;
}
/* =========================================================
Magician / GD single detail-field presentation
=========================================================
GeoDirectory multi-select fields render as ordinary lists. On a listing
detail page those values are attributes, not prose, so present them as
quiet Conjurly chips while leaving normal post-content lists untouched. */
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .geodir-field-post_category.geodir_post_meta ul,
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .geodir-field-post_category.geodir-post-meta ul {
display: flex;
flex-wrap: wrap;
gap: 0.4rem 0.45rem;
margin: 0.45rem 0 0 !important;
padding: 0 !important;
list-style: none !important;
}
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .geodir-field-post_category.geodir_post_meta ul > li,
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .geodir-field-post_category.geodir-post-meta ul > li {
display: inline-flex;
align-items: center;
width: auto;
min-height: 1.8rem;
margin: 0 !important;
padding: 0.28rem 0.62rem !important;
border: 1px solid var(--cj-border-light, #e6e7eb);
border-radius: 999px;
background: var(--cj-surface-subtle, #f7f7f8);
color: var(--cj-text-primary, #2f3033);
font-size: 0.86rem;
font-weight: 400;
line-height: 1.2;
list-style: none !important;
}
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .geodir-field-post_category.geodir_post_meta ul > li::marker,
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .geodir-field-post_category.geodir-post-meta ul > li::marker {
content: "";
}
/* Elementor owns scalar GeoDirectory field typography, spacing, and heading
presentation. Conjurly intentionally styles only multi-select value lists as
attribute chips here. This prevents the shared single stylesheet from
overriding profile-header title/location styling configured in Elementor. */
/* Keep attribute chips comfortably tappable/wrappable on narrow screens
without allowing them to become full-width Bootstrap-style list items. */
@media (max-width: 767px) {
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .geodir-field-post_category.geodir_post_meta ul,
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .geodir-field-post_category.geodir-post-meta ul {
gap: 0.4rem;
}
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .geodir-field-post_category.geodir_post_meta ul > li,
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .geodir-field-post_category.geodir-post-meta ul > li {
max-width: 100%;
white-space: normal;
}
}
/* =========================================================
Magician single detail polish — v0.1.158
========================================================= */
/* Chips should read as quiet attributes, not disabled controls. */
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .geodir-field-post_category.geodir_post_meta ul > li,
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .geodir-field-post_category.geodir-post-meta ul > li {
min-height: 1.9rem;
padding: 0.32rem 0.7rem !important;
border-color: #dedfe3;
background: var(--cj-surface-subtle, #f7f7f8);
color: #3b3c40;
font-size: 0.875rem;
font-weight: 500;
}
/* Scalar field labels/values and Elementor headings are deliberately not
normalized here. Their typography and spacing belong to the Elementor
template so profile identity fields can use a distinct presentation from
lower-page detail fields without specificity fights. */
@media (max-width: 767px) {
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .geodir-field-post_category.geodir_post_meta ul > li,
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] .geodir-field-post_category.geodir-post-meta ul > li {
min-height: 1.85rem;
padding: 0.3rem 0.65rem !important;
}
}
/* =========================================================
Magician single gallery flow — v0.1.164
=========================================================
Gallery clearance now comes from the carousel itself. Earlier mobile-only
margin/clear hacks are intentionally removed so following Elementor widgets
simply follow the carousel's real normal-flow height. */
/* ── Photo Gallery contained blur frame — v0.1.171 ─────────────────────────
GD outputs a Bootstrap ratio wrapper for each slide. The foreground image and
its blur backdrop must occupy that SAME frame. 0.1.170 put the blur on the
carousel item while the image remained in normal flow, exposing Bootstrap's
ratio spacer above the image. This version restores the intended 16:9 frame:
blurred cover background + fully visible contained foreground. */
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .carousel-item {
overflow: hidden;
background: var(--cj-border-light, #e6e7eb);
}
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .carousel-item > .ratio,
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .carousel-item > .embed-responsive {
position: relative;
overflow: hidden;
isolation: isolate;
}
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .ratio > .cnjrly-gallery-blur-bg,
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .embed-responsive > .cnjrly-gallery-blur-bg {
position: absolute;
inset: -24px;
z-index: 0;
pointer-events: none;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
filter: blur(20px);
opacity: 0.78;
transform: scale(1.04);
}
/* Bootstrap's ratio component expects its media child to fill the reserved box.
Contain preserves portrait, square, and landscape uploads without cropping. */
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .carousel-item > .ratio > img,
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .carousel-item > .embed-responsive > img {
position: absolute !important;
inset: 0 !important;
width: 100% !important;
height: 100% !important;
max-width: 100% !important;
object-fit: contain !important;
object-position: center center !important;
z-index: 1;
}
/* ── Photo Gallery mobile flow containment — v0.1.172 ──────────────────────
On narrow screens GD/Bootstrap's ratio child can be visually taller than
the carousel-item's normal-flow box. The following Elementor section then
starts too early and overlaps the image/indicators. Make the carousel item
itself own the 16:9 geometry on mobile; the existing ratio wrapper becomes
a positioned fill layer inside that real flow box. No image measurement,
min-height, or tallest-slide calculation is used. */
@media (max-width: 767px) {
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images,
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .elementor-widget-container,
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .geodir-post-slider,
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .geodir-image-container,
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .geodir-image-wrapper {
display: block;
width: 100%;
}
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .carousel-inner {
position: relative;
display: block;
width: 100%;
overflow: hidden;
}
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .carousel-item.active,
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .carousel-item-next,
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .carousel-item-prev {
position: relative;
width: 100%;
aspect-ratio: 16 / 9;
height: auto !important;
min-height: 0 !important;
}
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .carousel-item > .ratio,
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .carousel-item > .embed-responsive {
position: absolute !important;
inset: 0 !important;
width: 100% !important;
height: 100% !important;
aspect-ratio: auto !important;
}
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .carousel-item > .ratio::before,
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .carousel-item > .embed-responsive::before {
display: none !important;
padding-top: 0 !important;
}
.cnjrly-gd-single-main .elementor-widget-wp-widget-gd_post_images .carousel-indicators.position-relative {
position: relative !important;
clear: both;
margin-top: 0.25rem !important;
margin-bottom: 0.25rem !important;
}
.cnjrly-gd-single-main .cnjrly-magician-media {
overflow: visible;
}
}
/* ── Mobile profile section navigator — v0.1.177 ─────────────────────────── */
@media (max-width: 767px) {
.cnjrly-sections-toggle a,
.cnjrly-sections-toggle button {
position: relative;
}
.cnjrly-sections-toggle a::after,
.cnjrly-sections-toggle button::after {
content: "▾";
position: absolute;
top: 50%;
right: 1rem;
display: block;
margin: 0;
line-height: 1;
transform: translateY(-50%);
transform-origin: center;
transition: transform 160ms ease;
}
.cnjrly-sections-toggle.is-open a::after,
.cnjrly-sections-toggle.is-open button::after {
transform: translateY(-50%) rotate(180deg);
}
.cnjrly-mobile-sections-menu {
width: 100%;
margin-top: 0.5rem;
padding: 0.4rem;
border: 1px solid var(--cj-border, #e6e7eb);
border-radius: var(--cj-radius-input, 10px);
background: var(--cj-surface, #fff);
box-shadow: var(--cj-shadow-card, 0 1px 4px rgba(0,0,0,.12));
}
.cnjrly-mobile-sections-menu[hidden] {
display: none !important;
}
.cnjrly-mobile-sections-link {
display: block !important;
width: 100% !important;
margin: 0 !important;
padding: 0.7rem 0.85rem !important;
border: 0 !important;
border-radius: 8px !important;
background: transparent !important;
color: var(--cj-indigo, #4c187e) !important;
font: inherit !important;
text-align: center !important;
text-decoration: none !important;
line-height: 1.2 !important;
cursor: pointer;
appearance: none;
-webkit-appearance: none;
}
.cnjrly-mobile-sections-link + .cnjrly-mobile-sections-link {
border-top: 1px solid var(--cj-border, #e6e7eb);
}
}
@media (min-width: 768px) {
.cnjrly-mobile-sections-menu {
display: none !important;
}
}
/* =========================================================
Magician single Elementor/GD ownership cleanup — v0.1.205
=========================================================
Elementor and each GD shortcode own scalar-field output, responsive
visibility, alignment and formatting. Conjurly no longer globally forces
headings/labels visible and no longer treats arbitrary GD lists as chips.
Category chips remain intentionally scoped to post_category only. */
/* Humanized Service Area — v0.1.207 */
.cnjrly-service-area{display:flex;flex-direction:column;gap:5px}
.cnjrly-service-area p{margin:0;line-height:1.45}
.cnjrly-service-area__travel{margin-top:9px}
.cnjrly-service-area__label{font-weight:600;margin-bottom:2px}
/* Service Area + existing-field Pricing display — v0.1.209 */
.cnjrly-service-area__travel{margin-top:18px}
.cnjrly-service-area h5.cnjrly-service-area__label{
margin:0 0 10px;
padding:0;
font-family:"IBM Plex Sans Condensed",sans-serif;
font-size:1.125rem;
font-weight:500;
line-height:1.1;
letter-spacing:-.01em;
color:#4C187E;
}
.cnjrly-pricing{display:flex;flex-direction:column;gap:10px}
.cnjrly-pricing__range{
font-family:"IBM Plex Sans Condensed",sans-serif;
font-size:1.125rem;
font-weight:500;
line-height:1.2;
color:#4C187E;
}
.cnjrly-pricing__minimum,
.cnjrly-pricing__contact{margin:0;line-height:1.45}
.cnjrly-pricing__notes{margin-top:4px}
.cnjrly-pricing__notes p{margin:0 0 8px}
.cnjrly-pricing__notes p:last-child{margin-bottom:0}
/* Service Area: section gap before optional Additional Information block. */
.cnjrly-service-area__notes {
margin-top: 36px;
}
/* =========================================================
Magician single visual system — v0.1.233
Full style pass. UI Core owns tokens; this file maps the
Elementor/GeoDirectory output onto those shared primitives.
========================================================= */
/* Page chassis: reclaim the full Conjurly content width before dividing the
page into the profile and commercial rail. BuddyBoss otherwise leaves the
GD template inside a content-area width intended for a theme sidebar. */
body:has(.cnjrly-gd-single-layout) {
--cnjrly-gd-single-max: 1240px;
}
body:has(.cnjrly-gd-single-layout) .bb-grid.site-content-grid,
body:has(.cnjrly-gd-single-layout) .container.site-content-grid {
width: calc(100% - 40px);
max-width: var(--cnjrly-gd-single-max, var(--cj-content-max, 1180px));
margin-right: auto;
margin-left: auto;
}
body:has(.cnjrly-gd-single-layout) .site-content-grid > .content-area,
body:has(.cnjrly-gd-single-layout) #primary.content-area {
flex: 0 0 100%;
width: 100%;
max-width: none;
min-width: 0;
}
.cnjrly-gd-single-layout {
grid-template-columns: minmax(0, 1fr) var(--cj-rail-width, 300px);
gap: var(--cj-gap-rail, 24px);
max-width: var(--cnjrly-gd-single-max, var(--cj-content-max, 1180px));
padding-top: var(--cj-layout-top, 20px);
}
.cnjrly-gd-single-main,
.cnjrly-gd-single-main * {
box-sizing: border-box;
}
.cnjrly-gd-single-main [data-elementor-type="geodirectory"] {
width: 100%;
min-width: 0;
}
.cnjrly-magician-single {
overflow: hidden;
border: 1px solid var(--cj-border-card, rgba(0, 0, 0, 0.08)) !important;
border-radius: var(--cj-radius-card, 14px) !important;
background: var(--cj-surface-primary, #fff) !important;
box-shadow: var(--cj-shadow-card, 0 1px 4px rgba(0, 0, 0, 0.04)) !important;
font-family: var(--cj-font-sans, "IBM Plex Sans", sans-serif);
font-size: var(--cj-body-font-size, 18px);
line-height: 1.55;
color: var(--cj-text-primary, #2f3033);
}
.cnjrly-magician-single p,
.cnjrly-magician-single li {
line-height: 1.55;
}
.cnjrly-magician-single a:not(.elementor-button):not(.cnjrly-gd-cat-pill) {
color: var(--cj-link, #4c187e);
text-decoration-thickness: 1px;
text-underline-offset: 0.16em;
}
.cnjrly-magician-single a:not(.elementor-button):not(.cnjrly-gd-cat-pill):hover {
color: var(--cj-link-hover, #6f4697);
}
/* Navigation bar above the profile. */
.cnjrly-tec-top-bar {
display: grid;
grid-template-columns: auto auto auto minmax(0, 1fr) auto auto;
gap: 0.5rem;
margin-bottom: var(--cj-gap-card, 20px);
padding: 0.75rem;
font-family: var(--cj-font-sans, "IBM Plex Sans", sans-serif);
font-size: var(--cj-btn-font-size-sm, 0.875rem);
}
.cnjrly-tec-bar__btn {
min-height: 2.4rem;
height: auto;
padding: var(--cj-btn-padding-y-sm, 0.55rem) var(--cj-btn-padding-x-sm, 0.95rem);
border-radius: var(--cj-btn-radius, 10px);
font-family: var(--cj-btn-font-family, var(--cj-font-sans));
font-size: var(--cj-btn-font-size-sm, 0.875rem);
font-weight: var(--cj-btn-font-weight, 500);
line-height: var(--cj-btn-line-height, 1.15);
}
.cnjrly-tec-bar__btn--add {
background: var(--cj-btn-primary-bg, #4c187e);
border-color: var(--cj-btn-primary-border, #4c187e);
}
.cnjrly-gd-claim-slot {
display: flex;
align-items: stretch;
min-width: 0;
height: 100%;
}
.cnjrly-gd-claim-slot > * {
display: flex;
width: 100%;
height: 100%;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
body .cnjrly-tec-top-bar .cnjrly-gd-claim-slot a,
body .cnjrly-tec-top-bar .cnjrly-gd-claim-slot button {
display: inline-flex !important;
align-items: center;
justify-content: center;
box-sizing: border-box;
height: 100%;
min-height: 2.4rem;
margin: 0 !important;
padding: var(--cj-btn-padding-y-sm, 0.55rem) var(--cj-btn-padding-x-sm, 0.95rem) !important;
border: 1px solid var(--cj-btn-secondary-border, #4c187e) !important;
border-radius: var(--cj-btn-radius, 10px) !important;
background: var(--cj-btn-secondary-bg, #fff) !important;
color: var(--cj-btn-secondary-color, #4c187e) !important;
font-family: var(--cj-btn-font-family, var(--cj-font-sans));
font-size: var(--cj-btn-font-size-sm, 0.875rem);
font-weight: var(--cj-btn-font-weight, 500);
line-height: var(--cj-btn-line-height, 1.15);
text-decoration: none !important;
white-space: nowrap;
box-shadow: none !important;
filter: none !important;
transform: none !important;
}
body .cnjrly-tec-top-bar .cnjrly-gd-claim-slot a:hover,
body .cnjrly-tec-top-bar .cnjrly-gd-claim-slot button:hover,
body .cnjrly-tec-top-bar .cnjrly-gd-claim-slot a:active,
body .cnjrly-tec-top-bar .cnjrly-gd-claim-slot button:active,
body .cnjrly-tec-top-bar .cnjrly-gd-claim-slot a:focus:not(:focus-visible),
body .cnjrly-tec-top-bar .cnjrly-gd-claim-slot button:focus:not(:focus-visible) {
border-color: var(--cj-btn-secondary-hover-border, #6f4697) !important;
background: var(--cj-btn-secondary-hover-bg, rgba(76, 24, 126, 0.045)) !important;
color: var(--cj-btn-secondary-hover-color, #6f4697) !important;
box-shadow: none !important;
filter: none !important;
transform: none !important;
}
body .cnjrly-tec-top-bar .cnjrly-gd-claim-slot a:visited {
color: var(--cj-btn-secondary-color, #4c187e) !important;
}
body .cnjrly-tec-top-bar .cnjrly-gd-claim-slot a:focus-visible,
body .cnjrly-tec-top-bar .cnjrly-gd-claim-slot button:focus-visible {
outline: var(--cj-focus-outline-width, 2px) solid var(--cj-focus-outline-color, #4c187e);
outline-offset: var(--cj-focus-outline-offset, 2px);
box-shadow: var(--cj-focus-ring-shadow, 0 0 0 0.2rem rgba(76, 24, 126, 0.22)) !important;
}
/* Featured bar and profile identity. */
.cnjrly-magician-single .elementor-widget-wp-widget-gd_post_badge:first-child {
position: relative;
z-index: 2;
margin: 0 !important;
}
.cnjrly-magician-profile-header {
display: grid !important;
grid-template-columns: 190px minmax(0, 1fr) 180px;
gap: 24px !important;
align-items: center !important;
padding: 24px !important;
background: var(--cj-surface-primary, #fff);
}
.cnjrly-magician-profile-header > .e-con-inner {
display: contents;
}
.cnjrly-magician-profile-header > * {
width: auto !important;
min-width: 0;
}
/* Elementor may emit the three profile columns directly or place them inside
an .e-con-inner wrapper. In either shape, keep identity and navigation on
the same top line while allowing the portrait to remain vertically centred. */
.cnjrly-magician-profile-header > :nth-child(2),
.cnjrly-magician-profile-header > :nth-child(3),
.cnjrly-magician-profile-header > .e-con-inner > :nth-child(2),
.cnjrly-magician-profile-header > .e-con-inner > :nth-child(3) {
align-self: start !important;
}
.cnjrly-profile-actions {
display: grid !important;
grid-template-columns: minmax(0, 1fr);
gap: 0.65rem;
align-self: stretch;
grid-column: 1 / -1;
box-sizing: border-box;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
}
.cnjrly-profile-actions--has-edit {
grid-template-columns: minmax(0, 1fr);
}
.cnjrly-profile-actions > .elementor-widget-button {
width: 100% !important;
}
.cnjrly-profile-actions > .cnjrly-profile-contact-primary {
grid-column: 1 / -1;
}
.cnjrly-profile-actions--has-edit > .cnjrly-profile-contact-primary {
grid-column: 1 / -1;
}
.cnjrly-profile-actions > .cnjrly-profile-nav-toggle {
grid-column: 1 / -1;
}
.cnjrly-profile-actions a {
display: inline-flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
min-height: 2.65rem;
padding: var(--cj-btn-padding-y-sm, 0.55rem) var(--cj-btn-padding-x, 1.25rem);
border: var(--cj-btn-border-width, 1px) solid transparent;
border-radius: var(--cj-btn-radius, 10px);
font-family: var(--cj-btn-font-family, var(--cj-font-sans));
font-size: var(--cj-btn-font-size-sm, 0.875rem);
font-weight: var(--cj-btn-font-weight, 500);
line-height: var(--cj-btn-line-height, 1.15);
letter-spacing: var(--cj-btn-letter-spacing, 0.01em);
text-align: center;
text-decoration: none !important;
white-space: nowrap;
transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}
.cnjrly-profile-actions .cnjrly-profile-contact-primary .elementor-button {
background: var(--cj-cta, #d97d37) !important;
border-color: var(--cj-cta, #d97d37) !important;
color: var(--cj-text-on-accent, #fff) !important;
}
.cnjrly-profile-actions .cnjrly-profile-contact-primary .elementor-button:hover {
background: var(--cj-cta-hover, #e0975e) !important;
border-color: var(--cj-cta-hover, #e0975e) !important;
color: var(--cj-text-on-accent, #fff) !important;
}
.cnjrly-profile-edit-widget {
width: 100% !important;
min-width: 0;
}
.cnjrly-profile-edit-widget:empty {
display: none !important;
}
.cnjrly-profile-actions__edit {
display: inline-flex;
width: 100%;
min-width: 9.5rem;
background: var(--cj-btn-secondary-bg, #fff);
border-color: var(--cj-btn-secondary-border, #4c187e) !important;
color: var(--cj-btn-secondary-color, #4c187e) !important;
}
.cnjrly-profile-actions__edit:hover {
background: var(--cj-btn-secondary-hover-bg, rgba(76, 24, 126, 0.045));
border-color: var(--cj-btn-secondary-hover-border, #6f4697) !important;
color: var(--cj-btn-secondary-hover-color, #6f4697) !important;
}
.cnjrly-profile-actions a:focus-visible {
outline: var(--cj-focus-outline-width, 2px) solid var(--cj-focus-outline-color, #4c187e);
outline-offset: var(--cj-focus-outline-offset, 2px);
box-shadow: var(--cj-focus-ring-shadow, 0 0 0 0.2rem rgba(76, 24, 126, 0.22));
}
.cnjrly-profile-actions--mobile {
display: none !important;
}
.cnjrly-profile-actions--desktop,
.cnjrly-magician-single .elementor-element-6fd318a4 {
flex: 0 0 calc(100% - 48px) !important;
width: calc(100% - 48px) !important;
max-width: calc(100% - 48px) !important;
margin: 0 24px 24px !important;
}
.cnjrly-magician-profile-header > :first-child img {
display: block;
width: 180px !important;
height: 180px !important;
margin: 0 auto;
border-radius: 50% !important;
object-fit: cover;
}
.cnjrly-magician-profile-header > :first-child .cnjrly-gd-avatar--single {
--cnjrly-gd-avatar-size: 180px;
margin: 0 auto;
}
.cnjrly-magician-profile-header h1,
.cnjrly-magician-profile-header .elementor-heading-title {
margin: 0 0 0.45rem !important;
font-family: var(--cj-heading-font-family, "IBM Plex Sans Condensed", sans-serif) !important;
font-size: clamp(2.25rem, 3vw, 2.75rem) !important;
font-weight: var(--cj-heading-font-weight, 500) !important;
line-height: var(--cj-heading-line-height-display, 1.03) !important;
letter-spacing: var(--cj-heading-letter-spacing-tight, -0.01em) !important;
color: var(--cj-indigo, #4c187e) !important;
}
.cnjrly-magician-profile-header .elementor-widget-shortcode {
font-size: var(--cj-meta-font-size, 0.92rem);
line-height: var(--cj-meta-line-height, 1.4);
}
.cnjrly-magician-single .cnjrly-gd-cat-pills {
margin-top: 0.75rem;
}
/* Canonical Elementor button mapping for this template. */
.cnjrly-magician-single .elementor-widget-button .elementor-button {
min-height: 2.65rem;
padding: var(--cj-btn-padding-y-sm, 0.55rem) var(--cj-btn-padding-x, 1.25rem) !important;
border: var(--cj-btn-border-width, 1px) solid var(--cj-btn-primary-border, #4c187e) !important;
border-radius: var(--cj-btn-radius, 10px) !important;
background: var(--cj-btn-primary-bg, #4c187e) !important;
color: var(--cj-btn-primary-color, #fff) !important;
font-family: var(--cj-btn-font-family, var(--cj-font-sans)) !important;
font-size: var(--cj-btn-font-size-sm, 0.875rem) !important;
font-weight: var(--cj-btn-font-weight, 500) !important;
line-height: var(--cj-btn-line-height, 1.15) !important;
letter-spacing: var(--cj-btn-letter-spacing, 0.01em) !important;
text-decoration: none !important;
transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}
.cnjrly-magician-single .elementor-widget-button .elementor-button:hover {
background: var(--cj-btn-primary-hover-bg, #6f4697) !important;
border-color: var(--cj-btn-primary-hover-border, #6f4697) !important;
color: var(--cj-btn-primary-hover-color, #fff) !important;
}
.cnjrly-magician-single .elementor-widget-button .elementor-button:focus-visible {
outline: var(--cj-focus-outline-width, 2px) solid var(--cj-focus-outline-color, #4c187e);
outline-offset: var(--cj-focus-outline-offset, 2px);
box-shadow: var(--cj-focus-ring-shadow, 0 0 0 0.2rem rgba(76, 24, 126, 0.22));
}
/* The desktop section navigator is the third profile-header column. Target
both Elementor output shapes rather than relying on instance classes or
:has(), which did not match consistently on the live template. */
.cnjrly-magician-profile-header > :nth-child(3),
.cnjrly-magician-profile-header > .e-con-inner > :nth-child(3) {
display: flex !important;
flex-direction: column !important;
gap: 0 !important;
overflow: hidden;
padding: 4px !important;
border: 1px solid var(--cj-border-light, #e6e7eb);
border-radius: var(--cj-radius-input, 10px);
background: var(--cj-surface-subtle, #f7f7f8);
}
.cnjrly-magician-profile-header > :nth-child(3) > .elementor-widget-button,
.cnjrly-magician-profile-header > .e-con-inner > :nth-child(3) > .elementor-widget-button {
width: 100% !important;
margin: 0 !important;
}
.cnjrly-magician-profile-header > :nth-child(3) > .elementor-widget-button + .elementor-widget-button,
.cnjrly-magician-profile-header > .e-con-inner > :nth-child(3) > .elementor-widget-button + .elementor-widget-button {
border-top: 1px solid var(--cj-divider, rgba(0, 0, 0, 0.05));
}
.cnjrly-magician-profile-header > :nth-child(3) .elementor-button,
.cnjrly-magician-profile-header > .e-con-inner > :nth-child(3) .elementor-button,
.cnjrly-magician-single .cnjrly-profile-nav .elementor-button {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
min-height: 2.25rem;
padding: 0.48rem 0.7rem !important;
border: 0 !important;
border-radius: 6px !important;
background: transparent !important;
color: var(--cj-indigo, #4c187e) !important;
font-size: 0.82rem !important;
font-weight: 500 !important;
}
.cnjrly-magician-single .cnjrly-profile-nav .elementor-button-content-wrapper {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
text-align: center !important;
}
.cnjrly-magician-profile-header > :nth-child(3) .elementor-button:hover,
.cnjrly-magician-profile-header > .e-con-inner > :nth-child(3) .elementor-button:hover,
.cnjrly-magician-single .cnjrly-profile-nav .elementor-button:hover {
background: rgba(76, 24, 126, 0.07) !important;
color: var(--cj-indigo-hover, #6f4697) !important;
}
/* Section hierarchy and rhythm. */
.cnjrly-magician-section {
position: relative;
padding: 28px 28px !important;
border-top: 1px solid var(--cj-divider, rgba(0, 0, 0, 0.05));
background: var(--cj-surface-primary, #fff);
}
/* Pricing ends the Overview section. Keep a single modest gap before
Performance instead of adding the generic section padding on both sides. */
.cnjrly-magician-single .cnjrly-magician-overview {
padding-bottom: 0 !important;
}
/* Tighten the top of Overview only when its performer-logo slot contains
a real image. Listings without a logo keep the standard section padding. */
.cnjrly-magician-single .cnjrly-magician-overview:has(> .elementor-element-2c031ea5 > img.e-image-base:is([data-src]:not([data-src=""]), [src]:not([src=""]):not([src^="data:"]))) {
padding-top: 20px !important;
}
.cnjrly-magician-single .cnjrly-magician-performance {
padding-top: 16px !important;
}
.cnjrly-magician-section[id],
.cnjrly-magician-section .cnjrly-section-heading,
.cnjrly-affiliations,
.cnjrly-external-reviews {
scroll-margin-top: 160px;
}
.cnjrly-section-heading .elementor-heading-title,
.cnjrly-section-heading h2 {
margin: 0 !important;
font-family: var(--cj-heading-font-family, "IBM Plex Sans Condensed", sans-serif) !important;
font-size: var(--cj-heading-h3-size, 24px) !important;
font-weight: var(--cj-heading-font-weight, 500) !important;
line-height: var(--cj-heading-line-height-tight, 1.1) !important;
letter-spacing: var(--cj-heading-letter-spacing-tight, -0.01em) !important;
color: var(--cj-indigo, #4c187e) !important;
}
.cnjrly-magician-section .elementor-widget-text-editor p {
margin: 0 0 1.05em;
}
.cnjrly-magician-section .elementor-widget-text-editor p:last-child {
margin-bottom: 0;
}
/* Intro and lead media. */
.cnjrly-magician-overview > .elementor-widget-wp-widget-gd_post_meta,
.cnjrly-magician-overview > .elementor-widget-shortcode {
width: 100%;
max-width: 72ch;
margin-bottom: 22px;
}
.cnjrly-magician-intro-media {
overflow: hidden;
width: 100% !important;
border-radius: var(--cj-radius-card, 14px);
background: var(--cj-surface-subtle, #f7f7f8);
}
.cnjrly-magician-intro-media img {
display: block;
width: 100% !important;
height: auto !important;
border-radius: var(--cj-radius-card, 14px) !important;
}
/* The current Elementor template emits the populated Intro image as an atomic
flexbox rather than the legacy .cnjrly-magician-intro-media wrapper. Keep
this scoped to that direct overview image so profile avatars, description
header images, maps, and galleries retain their own treatments. */
.cnjrly-magician-overview > .e-flexbox-base:not(.cnjrly-magician-profile-header-mobile):has(> img.e-image-base[src]:not([src=""])) {
overflow: hidden !important;
border-radius: var(--cj-radius-card, 14px) !important;
}
.cnjrly-magician-overview > .e-flexbox-base:not(.cnjrly-magician-profile-header-mobile) > img.e-image-base[src]:not([src=""]) {
display: block;
border-radius: var(--cj-radius-card, 14px) !important;
}
.cnjrly-info-group {
min-width: 0;
padding: 20px !important;
border: 1px solid var(--cj-border-light, #e6e7eb);
border-radius: var(--cj-radius-card, 14px);
background: var(--cj-surface-subtle, #f7f7f8);
}
.cnjrly-info-group .elementor-heading-title,
.cnjrly-info-group h3,
.cnjrly-info-group h4,
.cnjrly-info-group h5,
.cnjrly-service-area h5.cnjrly-service-area__label,
.cnjrly-pricing__range {
margin: 0 0 0.75rem !important;
font-family: var(--cj-heading-font-family, "IBM Plex Sans Condensed", sans-serif) !important;
font-size: var(--cj-heading-h5-size, 18px) !important;
font-weight: 500 !important;
line-height: 1.25 !important;
letter-spacing: var(--cj-heading-letter-spacing-tight, -0.01em) !important;
color: var(--cj-indigo, #4c187e) !important;
}
.cnjrly-service-area,
.cnjrly-pricing {
gap: 0.45rem;
}
.cnjrly-service-area__travel,
.cnjrly-service-area__notes {
margin-top: 24px;
padding-top: 20px;
border-top: 1px solid var(--cj-divider, rgba(0, 0, 0, 0.05));
}
/* The native GD post map is deliberately replaced by the privacy-safe map
emitted by [cnjrly_primary_service_area]. Hide its now-empty Elementor slot. */
.cnjrly-service-group .elementor-widget-wp-widget-gd_map {
display: none !important;
}
.cnjrly-service-map-shell {
position: relative;
isolation: isolate;
width: 100%;
min-height: 260px;
margin-top: 20px;
aspect-ratio: 16 / 9;
overflow: hidden;
border: 1px solid var(--cj-border-light, #e6e7eb);
border-radius: var(--cj-radius-input, 10px);
background: var(--cj-surface-subtle, #f7f7f8);
}
.cnjrly-service-map {
position: absolute !important;
inset: 0 !important;
box-sizing: border-box;
width: 100% !important;
height: 100% !important;
min-height: 100%;
margin: 0 !important;
}
.cnjrly-service-map > div,
.cnjrly-service-map .gm-style,
.cnjrly-service-map-shell .cmplz-placeholder-element {
top: 0 !important;
right: 0 !important;
bottom: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
min-height: 100% !important;
margin: 0 !important;
}
.cnjrly-service-map-shell .cmplz-placeholder-element {
position: absolute !important;
inset: 0;
margin: 0 !important;
}
/* Retain Google's standard fullscreen control. Keep its control layer above
Conjurly's fixed mobile authentication/header bars. */
.cnjrly-service-map:fullscreen,
.cnjrly-service-map:-webkit-full-screen,
.cnjrly-service-map .gm-fullscreen-control {
z-index: 2147483647 !important;
}
.cnjrly-service-map .gm-fullscreen-control {
margin-top: max(10px, env(safe-area-inset-top)) !important;
margin-left: max(10px, env(safe-area-inset-left)) !important;
}
/* Google omits the native Fullscreen API control on iOS. The script adds this
visually compatible fallback only when no visible native control exists. */
.cnjrly-service-map__fullscreen-fallback {
position: absolute;
top: max(10px, env(safe-area-inset-top));
left: max(10px, env(safe-area-inset-left));
z-index: 2147483647;
display: inline-grid;
place-items: center;
box-sizing: border-box;
width: 40px;
height: 40px;
margin: 0;
padding: 8px;
border: 0;
border-radius: 2px;
background: #fff;
color: #666;
cursor: pointer;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}
.cnjrly-service-map__fullscreen-fallback:hover,
.cnjrly-service-map__fullscreen-fallback:active {
background: #fff;
color: #333;
}
.cnjrly-service-map__fullscreen-fallback:focus-visible {
outline: 2px solid var(--cj-focus-outline-color, #4c187e);
outline-offset: 2px;
}
.cnjrly-service-map__fullscreen-fallback svg {
display: block;
width: 24px;
height: 24px;
fill: none;
stroke: currentColor;
stroke-width: 2.25;
stroke-linecap: square;
stroke-linejoin: miter;
pointer-events: none;
}
.cnjrly-service-map-shell--expanded {
position: fixed !important;
inset: 0 !important;
z-index: 2147483646 !important;
width: 100vw !important;
height: 100vh !important;
height: 100dvh !important;
min-height: 0 !important;
margin: 0 !important;
aspect-ratio: auto !important;
border: 0 !important;
border-radius: 0 !important;
}
body.cnjrly-service-map-open {
overflow: hidden !important;
}
/* V11 owns the stacked Performance structure and element widths. CSS supplies only
the row rhythm and dividers inside the single grey information card. */
.cnjrly-performance-row {
min-width: 0;
}
.cnjrly-performance-row + .cnjrly-performance-row {
margin-top: 18px !important;
padding-top: 18px !important;
border-top: 1px solid var(--cj-divider, rgba(0, 0, 0, 0.05));
}
.cnjrly-performance-grid .elementor-widget-wp-widget-gd_post_meta ul,
.cnjrly-performance-grid .geodir-post-meta ul,
.cnjrly-performance-grid .geodir_post_meta ul {
display: flex !important;
flex-wrap: wrap;
gap: 0.5rem;
margin: 0 !important;
padding: 0 !important;
list-style: none !important;
}
.cnjrly-performance-grid .elementor-widget-wp-widget-gd_post_meta li,
.cnjrly-performance-grid .geodir-post-meta li,
.cnjrly-performance-grid .geodir_post_meta li {
display: inline-flex;
align-items: center;
width: auto !important;
min-height: 2rem;
margin: 0 !important;
padding: 0.35rem 0.72rem !important;
border: 1px solid var(--cj-border-light, #e6e7eb);
border-radius: 999px;
background: var(--cj-surface-primary, #fff);
color: var(--cj-text-primary, #2f3033);
font-size: 0.875rem;
font-weight: 500;
line-height: 1.2;
list-style: none !important;
}
/* About, web presence and affiliations. */
.cnjrly-magician-about > .elementor-widget-text-editor,
.cnjrly-magician-about .cnjrly-about-block > .elementor-widget-text-editor {
width: 100% !important;
max-width: none;
margin-right: 0 !important;
margin-left: 0 !important;
}
.cnjrly-contact-row {
display: grid !important;
grid-template-columns: minmax(0, 1fr) auto;
gap: 24px !important;
align-items: center;
width: 100% !important;
margin-top: 26px;
padding: 20px !important;
border: 1px solid var(--cj-border-light, #e6e7eb);
border-radius: var(--cj-radius-card, 14px);
background: var(--cj-surface-subtle, #f7f7f8);
}
.cnjrly-contact-row > * {
width: auto !important;
min-width: 0;
}
.cnjrly-contact-details {
width: 100% !important;
}
.cnjrly-contact-details .elementor-heading-title,
.cnjrly-affiliations__heading {
margin: 0 !important;
font-family: var(--cj-heading-font-family, "IBM Plex Sans Condensed", sans-serif) !important;
font-size: var(--cj-heading-h4-size, 20px) !important;
font-weight: 500 !important;
line-height: 1.3 !important;
letter-spacing: var(--cj-heading-letter-spacing-tight, -0.01em) !important;
color: var(--cj-indigo, #4c187e) !important;
}
.cnjrly-contact-map-col {
width: auto !important;
}
.cnjrly-contact-row .elementor-social-icon {
width: 2.6rem;
height: 2.6rem;
border-radius: var(--cj-radius-input, 10px);
}
.cnjrly-affiliations-panel {
margin-top: 30px;
}
.cnjrly-affiliations {
width: 100%;
margin-top: 0;
padding: 20px;
border: 1px solid var(--cj-border-light, #e6e7eb);
border-radius: var(--cj-radius-card, 14px);
background: var(--cj-surface-subtle, #f7f7f8);
}
.cnjrly-affiliations__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 20px 28px;
align-items: center;
margin: 10px 0 0;
padding: 0;
list-style: none;
}
.cnjrly-affiliations__item {
display: grid;
grid-template-columns: 136px minmax(0, 1fr);
gap: 14px;
align-items: center;
min-width: 0;
min-height: 82px;
margin: 0;
padding: 0;
}
.cnjrly-affiliations__logo-wrap {
height: 76px;
display: flex;
align-items: center;
justify-content: flex-start;
margin: 0;
}
.cnjrly-affiliations__logo {
display: block;
width: auto;
height: auto;
max-width: 136px;
max-height: 76px;
object-fit: contain;
object-position: left center;
}
@media (min-width: 768px) {
.cnjrly-affiliations__logo-wrap {
justify-content: flex-end;
}
.cnjrly-affiliations__logo {
object-position: right center;
}
.cnjrly-affiliations__grid .cnjrly-affiliations__item--featured {
grid-column: 1 / -1;
grid-template-columns: minmax(0, 240px) max-content;
justify-content: center;
gap: 20px;
min-height: 96px;
}
.cnjrly-affiliations__item--featured .cnjrly-affiliations__logo-wrap {
height: 90px;
}
.cnjrly-affiliations__item--featured .cnjrly-affiliations__logo {
max-width: 240px;
max-height: 90px;
}
/* Shift any multi-item regular affiliation set left as one visual unit.
AMA, when present, remains independently centered in its featured row. */
.cnjrly-affiliations__grid--multiple-regular .cnjrly-affiliations__item:not(.cnjrly-affiliations__item--featured) {
transform: translateX(-10%);
}
.cnjrly-affiliations__grid--single-regular .cnjrly-affiliations__item:not(.cnjrly-affiliations__item--featured) {
grid-column: 1 / -1;
width: min(100%, calc((100% - 28px) / 2));
justify-self: center;
transform: none;
}
}
.cnjrly-affiliations__name {
font-size: 0.9rem;
font-weight: 500;
line-height: 1.35;
}
.cnjrly-affiliations__name-line {
display: block;
}
/* Repeated booking actions become intentional section bands. */
.cnjrly-booking-band,
.cnjrly-magician-contact {
margin: 0 !important;
}
.cnjrly-booking-band .elementor-button,
.cnjrly-magician-contact .elementor-button {
min-height: 3rem !important;
font-size: var(--cj-btn-font-size, 0.95rem) !important;
}
/* Keep every plugin-owned contact label centered through Elementor's nested
button markup. Centering only the outer anchor leaves the content wrapper
free to retain a stale template alignment. */
.cnjrly-magician-single .cnjrly-profile-actions .elementor-button,
.cnjrly-magician-single .cnjrly-booking-band .elementor-button,
.cnjrly-magician-single .cnjrly-magician-contact .elementor-button,
.cnjrly-magician-single .cnjrly-contact-cta.elementor-button,
.cnjrly-magician-single .cnjrly-contact-cta .elementor-button {
display: flex !important;
align-items: center !important;
justify-content: center !important;
text-align: center !important;
}
.cnjrly-magician-single .cnjrly-profile-actions .elementor-button-content-wrapper,
.cnjrly-magician-single .cnjrly-booking-band .elementor-button-content-wrapper,
.cnjrly-magician-single .cnjrly-magician-contact .elementor-button-content-wrapper,
.cnjrly-magician-single .cnjrly-contact-cta .elementor-button-content-wrapper {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
text-align: center !important;
}
.cnjrly-magician-single .cnjrly-profile-actions .elementor-button-text,
.cnjrly-magician-single .cnjrly-booking-band .elementor-button-text,
.cnjrly-magician-single .cnjrly-magician-contact .elementor-button-text,
.cnjrly-magician-single .cnjrly-contact-cta .elementor-button-text {
flex: 0 1 auto;
text-align: center !important;
}
.cnjrly-magician-contact {
padding: 22px 28px !important;
background: var(--cj-surface-subtle, #f7f7f8);
}
/* Media owns consistent frames; existing gallery/video behavior is unchanged. */
.cnjrly-magician-media .elementor-widget-wp-widget-gd_post_images > .elementor-widget-container {
width: 100% !important;
margin-right: 0 !important;
margin-left: 0 !important;
}
.cnjrly-magician-media .elementor-widget-wp-widget-gd_post_images .carousel,
.cnjrly-magician-media .elementor-widget-wp-widget-gd_post_images .carousel-inner,
.cnjrly-magician-media .elementor-widget-wp-widget-gd_post_images .carousel-item,
.cnjrly-video-gallery__stage {
border-radius: var(--cj-radius-card, 14px);
}
.cnjrly-video-block {
margin-top: 24px;
padding-right: 0 !important;
padding-left: 0 !important;
}
.cnjrly-video-gallery__thumb {
border-radius: var(--cj-radius-input, 10px);
}
/* Reviews: normalize the GD summary, comments and form without changing any
review behavior or markup. */
.cnjrly-magician-reviews .geodir-review-ratings,
.cnjrly-magician-reviews .geodir-rating-summary,
.cnjrly-magician-reviews .comments-area,
.cnjrly-magician-reviews .comment-respond {
font-family: var(--cj-font-sans, "IBM Plex Sans", sans-serif);
}
.cnjrly-magician-reviews .comment,
.cnjrly-magician-reviews .comment-body,
.cnjrly-magician-reviews .comment-respond,
.cnjrly-magician-reviews form.comment-form {
border-color: var(--cj-border-light, #e6e7eb) !important;
border-radius: var(--cj-radius-card, 14px) !important;
}
/* GeoDirectory offsets the complete review-card list 27px while keeping its
right edge fixed. Align the cards with the review heading and summary; card
interiors retain their existing padding. */
.cnjrly-magician-reviews ul.commentlist {
width: 100% !important;
margin-left: 0 !important;
padding-left: 0 !important;
}
.cnjrly-magician-reviews input[type="text"],
.cnjrly-magician-reviews input[type="email"],
.cnjrly-magician-reviews input[type="url"],
.cnjrly-magician-reviews select,
.cnjrly-magician-reviews textarea {
width: 100%;
min-height: 3rem;
padding: 0.75rem 0.9rem;
border: 1px solid var(--cj-border-light, #e6e7eb);
border-radius: var(--cj-radius-input, 10px);
background: var(--cj-surface-primary, #fff);
font: inherit;
color: var(--cj-text-primary, #2f3033);
}
.cnjrly-magician-reviews textarea {
min-height: 9rem;
resize: vertical;
}
.cnjrly-magician-reviews input:focus,
.cnjrly-magician-reviews select:focus,
.cnjrly-magician-reviews textarea:focus {
border-color: var(--cj-indigo, #4c187e);
outline: 0;
box-shadow: var(--cj-focus-ring-shadow, 0 0 0 0.2rem rgba(76, 24, 126, 0.22));
}
.cnjrly-magician-reviews input[type="submit"],
.cnjrly-magician-reviews button[type="submit"] {
min-height: 2.8rem;
padding: var(--cj-btn-padding-y, 0.72rem) var(--cj-btn-padding-x, 1.25rem);
border: 1px solid var(--cj-btn-primary-border, #4c187e);
border-radius: var(--cj-btn-radius, 10px);
background: var(--cj-btn-primary-bg, #4c187e);
color: var(--cj-btn-primary-color, #fff);
font-family: var(--cj-btn-font-family, var(--cj-font-sans));
font-size: var(--cj-btn-font-size, 0.95rem);
font-weight: var(--cj-btn-font-weight, 500);
}
/* GeoDirectory mixes its legacy orange rating foreground with Bootstrap's
warning yellow in the rating distribution. Keep every active review accent
on the Conjurly Ember token while retaining the neutral empty-star track. */
.cnjrly-magician-reviews .gd-rating-foreground,
.cnjrly-magician-reviews .gd-rating-foreground i,
.cnjrly-magician-reviews .progress-bar,
.cnjrly-magician-reviews i.text-gray,
.cnjrly-magician-reviews .text-warning {
color: var(--cj-ember, #d97d37) !important;
}
.cnjrly-magician-reviews .progress-bar {
background-color: var(--cj-ember, #d97d37) !important;
}
/* GeoDirectory renders Edit and Reply as separate legacy link/button styles.
Map both to the same compact Conjurly secondary action. This also prevents
the native Reply button from producing purple text on a purple background. */
.cnjrly-magician-reviews .comment-links {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 0.5rem;
}
.cnjrly-magician-reviews .comment-links .edit-link,
.cnjrly-magician-reviews .comment-links .reply-link {
display: inline-flex;
}
.cnjrly-magician-reviews .comment-edit-link,
.cnjrly-magician-reviews .comment-reply-link {
display: inline-flex !important;
align-items: center;
justify-content: center;
box-sizing: border-box;
min-height: 2rem;
margin: 0 !important;
padding: 0.38rem 0.75rem !important;
border: 1px solid var(--cj-btn-secondary-border, #4c187e) !important;
border-radius: var(--cj-radius-control, 8px) !important;
background: var(--cj-btn-secondary-bg, #fff) !important;
color: var(--cj-btn-secondary-color, #4c187e) !important;
font-family: var(--cj-btn-font-family, var(--cj-font-sans)) !important;
font-size: var(--cj-btn-font-size-sm, 0.875rem) !important;
font-weight: var(--cj-btn-font-weight, 500) !important;
line-height: 1.1 !important;
text-decoration: none !important;
box-shadow: none !important;
}
.cnjrly-magician-reviews .comment-edit-link:hover,
.cnjrly-magician-reviews .comment-reply-link:hover,
.cnjrly-magician-reviews .comment-edit-link:active,
.cnjrly-magician-reviews .comment-reply-link:active {
border-color: var(--cj-btn-secondary-hover-border, #6f4697) !important;
background: var(--cj-btn-secondary-hover-bg, rgba(76, 24, 126, 0.045)) !important;
color: var(--cj-btn-secondary-hover-color, #6f4697) !important;
}
.cnjrly-magician-reviews .comment-edit-link:focus-visible,
.cnjrly-magician-reviews .comment-reply-link:focus-visible {
outline: var(--cj-focus-outline-width, 2px) solid var(--cj-focus-outline-color, #4c187e);
outline-offset: var(--cj-focus-outline-offset, 2px);
box-shadow: var(--cj-focus-ring-shadow, 0 0 0 0.2rem rgba(76, 24, 126, 0.22)) !important;
}
@media (max-width: 1024px) {
.cnjrly-profile-actions--desktop {
display: none !important;
}
.cnjrly-profile-actions--mobile {
display: grid !important;
width: 100% !important;
margin: 0 !important;
}
.cnjrly-profile-actions--mobile.cnjrly-profile-actions--has-edit {
grid-template-columns: minmax(0, 1fr);
}
.cnjrly-gd-single-layout {
grid-template-columns: minmax(0, 1fr) minmax(220px, 260px);
}
.cnjrly-magician-profile-header {
grid-template-columns: 158px minmax(0, 1fr) 160px;
gap: 20px !important;
padding: 24px !important;
}
.cnjrly-magician-profile-header > :first-child img {
width: 148px !important;
height: 148px !important;
}
.cnjrly-affiliations__item {
grid-template-columns: 118px minmax(0, 1fr);
}
.cnjrly-affiliations__logo {
max-width: 118px;
}
}
@media (max-width: 782px) {
body:has(.cnjrly-gd-single-layout) #content.site-content {
margin-top: 0 !important;
padding-top: 24px !important;
}
/* BuddyBoss nests the site-content grid inside a separate .container.
Own that real outer wrapper so its default mobile gutter is not compounded
with the Conjurly single-layout gutter. */
body:has(.cnjrly-gd-single-layout) #content.site-content > .container {
box-sizing: border-box;
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 10px !important;
}
body:has(.cnjrly-gd-single-layout) .bb-grid.site-content-grid,
body:has(.cnjrly-gd-single-layout) .container.site-content-grid {
box-sizing: border-box;
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding-right: 0 !important;
padding-left: 0 !important;
}
body:has(.cnjrly-gd-single-layout) .site-content-grid > .content-area,
body:has(.cnjrly-gd-single-layout) #primary.content-area {
box-sizing: border-box;
margin-right: 0 !important;
margin-left: 0 !important;
padding-right: 0 !important;
padding-left: 0 !important;
}
body:has(.cnjrly-gd-single-layout) #main.site-main {
margin-top: 0 !important;
margin-right: 0 !important;
margin-left: 0 !important;
padding-top: 0 !important;
padding-right: 0 !important;
padding-left: 0 !important;
}
.cnjrly-gd-single-layout {
grid-template-columns: minmax(0, 1fr);
gap: var(--cj-gap-card, 16px);
width: 100%;
padding-top: 0;
}
.cnjrly-gd-single-main {
width: 100%;
min-width: 0;
}
.cnjrly-gd-single-rail--right {
position: static;
}
}
@media (max-width: 767px) {
/* This explicit override is required because the desktop header's grid uses
!important above; otherwise it wins over Elementor's hidden-mobile class. */
.cnjrly-magician-profile-header {
display: none !important;
}
.cnjrly-profile-actions--mobile,
.cnjrly-profile-actions--mobile.cnjrly-profile-actions--has-edit {
grid-template-columns: minmax(0, 1fr);
width: 100% !important;
margin: 0 !important;
}
.cnjrly-profile-actions--mobile.cnjrly-profile-actions--has-edit > .cnjrly-profile-contact-primary {
grid-column: 1 / -1;
}
.cnjrly-profile-actions__edit {
width: 100%;
}
.cnjrly-tec-top-bar {
grid-template-columns: repeat(3, minmax(0, 1fr));
margin-bottom: var(--cj-gap-card, 16px);
padding: 0.75rem;
}
.cnjrly-tec-bar__spacer {
display: none;
}
.cnjrly-tec-bar__btn {
justify-content: center;
padding-right: 0.55rem;
padding-left: 0.55rem;
}
.cnjrly-tec-bar__btn--add {
grid-column: 1 / -1;
}
.cnjrly-gd-claim-slot {
grid-column: 1 / -1 !important;
justify-self: stretch !important;
width: 100% !important;
max-width: none !important;
}
.cnjrly-gd-claim-slot > *,
.cnjrly-gd-claim-slot .geodir-post-claim,
.cnjrly-gd-claim-slot .gd-post-claim-wrap,
body .cnjrly-tec-top-bar .cnjrly-gd-claim-slot a,
body .cnjrly-tec-top-bar .cnjrly-gd-claim-slot button {
box-sizing: border-box;
width: 100% !important;
max-width: none !important;
}
.cnjrly-magician-single {
font-size: 1rem;
}
/* The current Magician template is a legacy boxed Elementor section. Its
default column gap adds another mobile gutter inside the profile card. */
.cnjrly-magician-single.elementor-section-boxed > .elementor-container {
width: 100% !important;
max-width: none !important;
}
.cnjrly-magician-single > .elementor-container.elementor-column-gap-default > .elementor-column > .elementor-element-populated {
padding-right: 0 !important;
padding-left: 0 !important;
}
.cnjrly-magician-profile-header-mobile {
padding: 26px 20px 30px !important;
}
.cnjrly-magician-profile-header-mobile img {
width: 148px !important;
height: 148px !important;
border-radius: 50% !important;
object-fit: cover;
}
.cnjrly-magician-profile-header-mobile > .cnjrly-gd-avatar--single {
--cnjrly-gd-avatar-size: 148px;
flex: 0 0 auto !important;
align-self: center !important;
width: 148px !important;
max-width: 148px !important;
margin: 0 auto !important;
}
.cnjrly-magician-profile-header-mobile > .cnjrly-gd-avatar--single .cnjrly-gd-avatar__media {
width: 148px !important;
height: 148px !important;
max-width: 148px !important;
aspect-ratio: 1 / 1;
}
.cnjrly-magician-profile-header-mobile h1,
.cnjrly-magician-profile-header-mobile .elementor-heading-title {
font-family: var(--cj-heading-font-family, "IBM Plex Sans Condensed", sans-serif) !important;
font-size: var(--cj-heading-h1-size, 32px) !important;
font-weight: 500 !important;
line-height: 1.08 !important;
letter-spacing: var(--cj-heading-letter-spacing-tight, -0.01em) !important;
color: var(--cj-indigo, #4c187e) !important;
text-align: center;
}
.cnjrly-magician-profile-header-mobile .cnjrly-gd-cat-pills {
justify-content: center;
}
.cnjrly-profile-nav-toggle .elementor-button {
border-color: var(--cj-border-light, #e6e7eb) !important;
background: var(--cj-surface-subtle, #f7f7f8) !important;
color: var(--cj-indigo, #4c187e) !important;
}
.cnjrly-magician-section {
padding: 24px 18px !important;
}
.cnjrly-section-heading .elementor-heading-title,
.cnjrly-section-heading h2 {
font-size: var(--cj-heading-h3-size, 22px) !important;
}
.cnjrly-info-group {
padding: 18px !important;
}
.cnjrly-performance-row + .cnjrly-performance-row {
margin-top: 16px !important;
padding-top: 16px !important;
}
.cnjrly-performance-grid .elementor-widget-wp-widget-gd_post_meta ul,
.cnjrly-performance-grid .geodir-post-meta ul,
.cnjrly-performance-grid .geodir_post_meta ul {
gap: 0.45rem;
}
.cnjrly-contact-row {
grid-template-columns: minmax(0, 1fr);
gap: 18px !important;
padding: 18px !important;
}
.cnjrly-contact-row .elementor-social-icons-wrapper {
justify-content: flex-start !important;
}
.cnjrly-affiliations-panel {
margin-top: 20px;
}
.cnjrly-affiliations {
padding: 16px;
}
.cnjrly-affiliations__grid {
grid-template-columns: minmax(0, 1fr);
gap: 14px;
}
.cnjrly-affiliations__item {
grid-template-columns: 104px minmax(0, 1fr);
gap: 10px;
min-height: 72px;
}
.cnjrly-affiliations__logo-wrap {
height: 68px;
}
.cnjrly-affiliations__logo {
max-width: 104px;
max-height: 68px;
}
.cnjrly-magician-contact {
padding: 20px !important;
}
.cnjrly-video-block {
margin-top: 20px;
}
.cnjrly-magician-reviews .comment-respond {
padding: 18px !important;
}
/* The outer response panel already supplies the mobile inset. Avoid a
second 18px layer on the nested form that makes every field too narrow. */
.cnjrly-magician-reviews form.comment-form {
padding: 0 !important;
}
}
@media (max-width: 430px) {
body:has(.cnjrly-gd-single-layout) .bb-grid.site-content-grid,
body:has(.cnjrly-gd-single-layout) .container.site-content-grid {
width: 100% !important;
}
.cnjrly-magician-section {
padding: 22px 16px !important;
}
.cnjrly-magician-profile-header-mobile {
padding: 24px 16px 28px !important;
}
.cnjrly-affiliations__item {
grid-template-columns: 100px minmax(0, 1fr);
}
.cnjrly-affiliations__logo {
max-width: 100px;
}
}
/* 0.1.301: long magician names must not expand single-page Contact buttons. */
.cnjrly-magician-single .cnjrly-profile-actions .elementor-button,
.cnjrly-magician-single .cnjrly-profile-actions .elementor-button-content-wrapper,
.cnjrly-magician-single .cnjrly-profile-actions .elementor-button-text,
.cnjrly-magician-single .cnjrly-booking-band .elementor-button,
.cnjrly-magician-single .cnjrly-booking-band .elementor-button-content-wrapper,
.cnjrly-magician-single .cnjrly-booking-band .elementor-button-text,
.cnjrly-magician-single .cnjrly-magician-contact .elementor-button,
.cnjrly-magician-single .cnjrly-magician-contact .elementor-button-content-wrapper,
.cnjrly-magician-single .cnjrly-magician-contact .elementor-button-text,
.cnjrly-magician-single .cnjrly-contact-cta .elementor-button,
.cnjrly-magician-single .cnjrly-contact-cta .elementor-button-content-wrapper,
.cnjrly-magician-single .cnjrly-contact-cta .elementor-button-text {
min-width: 0 !important;
max-width: 100% !important;
}
.cnjrly-magician-single .cnjrly-profile-actions .elementor-button-text,
.cnjrly-magician-single .cnjrly-booking-band .elementor-button-text,
.cnjrly-magician-single .cnjrly-magician-contact .elementor-button-text,
.cnjrly-magician-single .cnjrly-contact-cta .elementor-button-text {
display: block !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
}
/* Payment methods accepted — v0.1.316
Compact, borderless icon grid driven by the GeoDirectory
payment_methods_accepted multiselect field. */
.cnjrly-payment-methods {
width: 100%;
margin-top: 28px;
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
}
.cnjrly-payment-methods__heading {
margin: 0 !important;
font-family: var(--cj-heading-font-family, "IBM Plex Sans Condensed", sans-serif) !important;
font-size: 15px !important;
font-weight: 500 !important;
line-height: 1.3 !important;
letter-spacing: var(--cj-heading-letter-spacing-tight, -0.01em) !important;
color: var(--cj-indigo, #4c187e) !important;
}
.cnjrly-payment-methods__grid {
display: grid !important;
grid-template-columns: repeat(var(--cnjrly-payment-cols-desktop, 12), max-content);
column-gap: 9px;
row-gap: 10px;
justify-content: start !important;
justify-items: center;
align-items: start;
margin: 12px 0 0 !important;
padding: 0 !important;
list-style: none !important;
}
.cnjrly-payment-methods__item {
display: flex !important;
flex-direction: column;
align-items: center;
justify-content: flex-start;
gap: 4px;
min-width: 0;
width: max-content;
margin: 0 !important;
padding: 0 !important;
text-align: center;
list-style: none !important;
}
.cnjrly-payment-methods__item::marker,
.cnjrly-payment-methods__item::before {
content: none !important;
display: none !important;
}
.cnjrly-payment-methods__image-wrap {
display: flex;
align-items: center;
justify-content: center;
width: max-content;
height: 26px;
margin: 0;
padding: 0;
}
.cnjrly-payment-methods__image {
display: block;
width: auto;
height: auto;
max-width: none;
max-height: 26px;
object-fit: contain;
margin: 0;
padding: 0;
}
.cnjrly-payment-methods__label {
font-family: var(--cj-body-font-family, "IBM Plex Sans", sans-serif);
font-size: 10px;
font-weight: 400;
line-height: 1.2;
color: var(--cj-text, #2f3137);
text-align: center;
white-space: nowrap;
margin: 0;
padding: 0;
}
@media (max-width: 767px) {
.cnjrly-payment-methods {
margin-top: 24px;
}
.cnjrly-payment-methods__grid {
grid-template-columns: repeat(var(--cnjrly-payment-cols-mobile, 6), max-content);
column-gap: 7px;
row-gap: 10px;
justify-content: start !important;
margin-left: 0 !important;
padding-left: 0 !important;
}
.cnjrly-payment-methods__image-wrap {
height: 25px;
}
.cnjrly-payment-methods__image {
max-height: 25px;
}
}
@media (max-width: 414px) {
.cnjrly-payment-methods__grid {
grid-template-columns: repeat(var(--cnjrly-payment-cols-mobile-narrow, 5), max-content);
column-gap: 6px;
}
}
@media (max-width: 360px) {
.cnjrly-payment-methods__grid {
grid-template-columns: repeat(var(--cnjrly-payment-cols-mobile-tiny, 4), max-content);
column-gap: 7px;
}
}
/* 0.1.325: Intro/featured-image spacing owns a modest closing gap.
Service Area, Pricing and later sections are separate conditional sections now,
so the Overview no longer needs legacy 36px closing padding. */
.cnjrly-magician-single .cnjrly-magician-overview {
padding-bottom: 18px !important;
}
@media (max-width: 700px) {
.cnjrly-magician-single .cnjrly-magician-overview {
padding-bottom: 14px !important;
}
}
/* =========================================================
Conditional-safe profile-detail rhythm (v0.1.325)
========================================================= */
/* About, Online Info, Testimonials and Professional Credits share one visual
region, but each child block can disappear independently. Elementor's flex
gap only applies to rendered children, so missing blocks never leave phantom
spacing behind. */
.cnjrly-magician-about {
gap: 34px !important;
padding-bottom: 20px !important;
}
.cnjrly-magician-about .cnjrly-profile-subsection {
box-sizing: border-box;
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding-right: 0 !important;
padding-left: 0 !important;
}
.cnjrly-magician-about .cnjrly-profile-subsection-heading {
width: 100% !important;
margin: 0 0 18px !important;
padding: 0 !important;
}
.cnjrly-magician-about .cnjrly-profile-subsection-heading .elementor-heading-title,
.cnjrly-magician-about .cnjrly-profile-subsection-heading h2 {
margin: 0 !important;
font-family: var(--cj-heading-font-family, "IBM Plex Sans Condensed", sans-serif) !important;
font-size: 24px !important;
font-weight: var(--cj-heading-font-weight, 500) !important;
line-height: var(--cj-heading-line-height-tight, 1.1) !important;
letter-spacing: var(--cj-heading-letter-spacing-tight, -0.01em) !important;
color: var(--cj-indigo, #4c187e) !important;
}
.cnjrly-magician-about .cnjrly-online-info-card {
margin-top: 0 !important;
}
/* The slider already reserves its control row below the card. Do not add a
second shortcode-level bottom margin before the next conditional block. */
.cnjrly-magician-about .cnjrly-testimonials-block .cnjrly-testimonials {
margin: 0 !important;
}
/* Professional Credits: strong separation between credit types, with a very
light branded rule under each subtype title. */
.cnjrly-magician-single .cnjrly-professional-credits-block .cnjrly-credit-logos__group {
margin: 0 !important;
}
.cnjrly-magician-single .cnjrly-professional-credits-block .cnjrly-credit-logos__group + .cnjrly-credit-logos__group {
margin-top: 34px !important;
}
.cnjrly-magician-single .cnjrly-professional-credits-block .cnjrly-credit-logos__group > h3,
.cnjrly-magician-single .cnjrly-professional-credits-block .cnjrly-credit-logos__group--professional_memberships > h2 {
margin: 0 0 14px !important;
padding: 0 0 8px !important;
border-bottom: 1px solid rgba(76, 24, 126, .12);
}
/* Mid-page and bottom Contact actions are sibling rows, never children of
Credits, Media or Reviews. They own their spacing and remain full width. */
.cnjrly-magician-single .cnjrly-magician-cta-row {
box-sizing: border-box;
width: 100% !important;
margin: 0 !important;
padding: 12px 28px 20px !important;
background: var(--cj-surface-primary, #fff);
}
.cnjrly-magician-single .cnjrly-magician-cta-row > .elementor-widget-button,
.cnjrly-magician-single .cnjrly-magician-cta-row .cnjrly-booking-band {
width: 100% !important;
max-width: none !important;
margin: 0 !important;
}
@media (max-width: 700px) {
.cnjrly-magician-about {
gap: 28px !important;
padding-bottom: 18px !important;
}
.cnjrly-magician-about .cnjrly-profile-subsection-heading {
margin-bottom: 16px !important;
}
.cnjrly-magician-single .cnjrly-professional-credits-block .cnjrly-credit-logos__group + .cnjrly-credit-logos__group {
margin-top: 30px !important;
}
.cnjrly-magician-single .cnjrly-magician-cta-row {
padding: 10px 18px 18px !important;
}
}
@media (max-width: 430px) {
.cnjrly-magician-single .cnjrly-magician-cta-row {
padding-right: 16px !important;
padding-left: 16px !important;
}
}
/* 0.1.324 — native Conjurly Reviews follows Ratings Around the Web as its own subsection. */
.cnjrly-magician-reviews .cnjrly-conjurly-reviews {
box-sizing: border-box;
width: 100%;
margin-top: 42px;
}
.cnjrly-magician-reviews .cnjrly-conjurly-reviews__heading {
width: 100% !important;
margin: 0 0 18px !important;
padding: 0 !important;
}
.cnjrly-magician-reviews .cnjrly-conjurly-reviews__heading .elementor-heading-title,
.cnjrly-magician-reviews .cnjrly-conjurly-reviews__heading h2 {
margin: 0 !important;
font-family: var(--cj-heading-font-family, "IBM Plex Sans Condensed", sans-serif) !important;
font-size: var(--cj-heading-h3-size, 24px) !important;
font-weight: var(--cj-heading-font-weight, 500) !important;
line-height: var(--cj-heading-line-height-tight, 1.1) !important;
letter-spacing: var(--cj-heading-letter-spacing-tight, -0.01em) !important;
color: var(--cj-indigo, #4c187e) !important;
}
@media (max-width: 700px) {
.cnjrly-magician-reviews .cnjrly-conjurly-reviews { margin-top: 34px; }
.cnjrly-magician-reviews .cnjrly-conjurly-reviews__heading { margin-bottom: 16px !important; }
}