/*
 * Dani Page Title Bar v1.3
 * Fixes:
 * - bar is positioned fully BELOW the fixed header/admin bar
 * - removes the large blank white gap above page content
 * - keeps dropdown menus above the title bar
 */

:root {
	--dtb-bg: #11110f;
	--dtb-bg-soft: #1b1811;
	--dtb-text: #ffffff;
	--dtb-muted: rgba(255,255,255,.62);
	--dtb-gold: #a88a50;
}

#dtb-page-titlebar {
	display: none;
}

#dtb-page-titlebar.dtb-mounted {
	display: block;
}

/* Hide common native title/breadcrumb areas to avoid duplicates. */
body.dtb-titlebar-active .page-header,
body.dtb-titlebar-active .page-title-area,
body.dtb-titlebar-active .page-header-area,
body.dtb-titlebar-active .breadcrumb-area,
body.dtb-titlebar-active .breadcrumb-section,
body.dtb-titlebar-active .breadcrumbs-area,
body.dtb-titlebar-active .titlebar,
body.dtb-titlebar-active .subheader {
	display: none !important;
}

/*
 * Remove the theme's large top spacer below the header.
 * We leave only a small, controlled breathing room before page content.
 */
body.dtb-titlebar-active #page_content_wrap,
body.dtb-titlebar-active .page_content_wrap,
body.dtb-titlebar-active .content_wrap,
body.dtb-titlebar-active .content,
body.dtb-titlebar-active article,
body.dtb-titlebar-active .post_content {
	margin-top: 0 !important;
	padding-top: 0 !important;
}

/* Elementor / first content block: kill the old large white top gap. */
body.dtb-titlebar-active .post_content > .elementor,
body.dtb-titlebar-active #page_content_wrap .elementor,
body.dtb-titlebar-active .page_content_wrap .elementor {
	margin-top: 0 !important;
	padding-top: 0 !important;
}

body.dtb-titlebar-active .post_content > .elementor > .elementor-element:first-child,
body.dtb-titlebar-active #page_content_wrap .elementor > .elementor-element:first-child,
body.dtb-titlebar-active .page_content_wrap .elementor > .elementor-element:first-child {
	margin-top: 0 !important;
	padding-top: 18px !important;
}

/* Keep the full site header and dropdowns above the title bar. */
body.dtb-titlebar-active .top_panel,
body.dtb-titlebar-active header.top_panel,
body.dtb-titlebar-active .top_panel_custom,
body.dtb-titlebar-active .elementor-location-header,
body.dtb-titlebar-active #masthead,
body.dtb-titlebar-active .site-header {
	z-index: 99990 !important;
}

body.dtb-titlebar-active .top_panel .menu_main_nav,
body.dtb-titlebar-active .top_panel .menu_main_nav > li,
body.dtb-titlebar-active .top_panel .menu_main_nav > li > ul,
body.dtb-titlebar-active .top_panel .sub-menu,
body.dtb-titlebar-active .menu_main_nav .sub-menu,
body.dtb-titlebar-active .sc_layouts_menu_nav .sub-menu,
body.dtb-titlebar-active .menu_mobile,
body.dtb-titlebar-active .menu_mobile_overlay {
	z-index: 99999 !important;
}

/* Prevent dropdown clipping. */
body.dtb-titlebar-active .top_panel,
body.dtb-titlebar-active .top_panel_navi,
body.dtb-titlebar-active .sc_layouts_row,
body.dtb-titlebar-active .sc_layouts_column,
body.dtb-titlebar-active .sc_layouts_item,
body.dtb-titlebar-active .sc_layouts_menu {
	overflow: visible !important;
}

.dtb-page-titlebar {
	position: relative;
	z-index: 1;
	overflow: hidden;
	background:
		radial-gradient(circle at 15% 30%, rgba(168,138,80,.10), transparent 31%),
		linear-gradient(115deg, var(--dtb-bg-soft), var(--dtb-bg));
	border-bottom: 1px solid rgba(168,138,80,.18);
	color: var(--dtb-text);
}

.dtb-page-titlebar::after {
	content: "";
	position: absolute;
	width: 230px;
	height: 230px;
	right: -145px;
	top: -175px;
	border: 1px solid rgba(168,138,80,.08);
	border-radius: 50%;
	pointer-events: none;
}

.dtb-page-titlebar__inner {
	width: min(1180px, calc(100% - 44px));
	margin: 0 auto;
	padding: 20px 0 17px;
	text-align: center;
}

.dtb-page-titlebar__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 7px;
	margin-bottom: 7px;
}

.dtb-page-titlebar__eyebrow span {
	display: block;
	width: 25px;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--dtb-gold));
}

.dtb-page-titlebar__eyebrow span:last-child {
	background: linear-gradient(90deg, var(--dtb-gold), transparent);
}

.dtb-page-titlebar__eyebrow i {
	display: block;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--dtb-gold);
	box-shadow: 0 0 0 3px rgba(168,138,80,.08);
}

.dtb-page-titlebar__title {
	margin: 0 !important;
	padding: 0 !important;
	color: var(--dtb-text) !important;
	font-size: clamp(27px, 2.5vw, 38px) !important;
	line-height: 1.08 !important;
	font-weight: 600 !important;
	letter-spacing: -.025em;
	text-transform: none !important;
	background: none !important;
	border: 0 !important;
	overflow: visible !important;
}

.dtb-page-titlebar__breadcrumbs {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 7px;
	margin-top: 7px;
	font-size: 11px;
	line-height: 1.35;
	letter-spacing: .015em;
	color: var(--dtb-muted);
}

.dtb-page-titlebar__breadcrumbs a {
	color: var(--dtb-gold) !important;
	text-decoration: none !important;
}

.dtb-page-titlebar__breadcrumbs a:hover {
	opacity: .72;
}

.dtb-page-titlebar__separator {
	color: rgba(255,255,255,.25);
}

.dtb-page-titlebar__current {
	color: var(--dtb-muted);
}

@media (max-width: 1024px) {
	.dtb-page-titlebar__inner {
		padding: 17px 0 14px;
	}

	.dtb-page-titlebar__title {
		font-size: clamp(24px, 4.2vw, 32px) !important;
	}
}

@media (max-width: 767px) {
	body.dtb-titlebar-active .post_content > .elementor > .elementor-element:first-child,
	body.dtb-titlebar-active #page_content_wrap .elementor > .elementor-element:first-child,
	body.dtb-titlebar-active .page_content_wrap .elementor > .elementor-element:first-child {
		padding-top: 12px !important;
	}

	.dtb-page-titlebar__inner {
		width: calc(100% - 28px);
		padding: 12px 0 11px;
	}

	.dtb-page-titlebar__eyebrow {
		height: 5px;
		margin-bottom: 5px;
	}

	.dtb-page-titlebar__eyebrow span {
		width: 18px;
	}

	.dtb-page-titlebar__title {
		font-size: clamp(19px, 6vw, 25px) !important;
		line-height: 1.1 !important;
	}

	.dtb-page-titlebar__breadcrumbs {
		gap: 5px;
		margin-top: 5px;
		font-size: 9.5px;
		line-height: 1.25;
	}

	.dtb-page-titlebar__current {
		display: inline-block;
		max-width: 58vw;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		vertical-align: bottom;
	}
}

@media (max-width: 420px) {
	.dtb-page-titlebar__inner {
		padding: 10px 0 9px;
	}

	.dtb-page-titlebar__title {
		font-size: 19px !important;
	}
}

/* v1.4: remove the thin light divider between the fixed header and title bar. */
body.dtb-titlebar-active .top_panel,
body.dtb-titlebar-active header.top_panel,
body.dtb-titlebar-active .top_panel_custom,
body.dtb-titlebar-active .top_panel_navi,
body.dtb-titlebar-active .sc_layouts_row,
body.dtb-titlebar-active .elementor-location-header,
body.dtb-titlebar-active #masthead,
body.dtb-titlebar-active .site-header {
    border-bottom: 0 !important;
    box-shadow: none !important;
}

body.dtb-titlebar-active #dtb-page-titlebar,
body.dtb-titlebar-active .dtb-page-titlebar {
    border-top: 0 !important;
}


/* v1.5: make the title bar touch the header with no visible seam. */
body.dtb-titlebar-active .top_panel::before,
body.dtb-titlebar-active .top_panel::after,
body.dtb-titlebar-active header.top_panel::before,
body.dtb-titlebar-active header.top_panel::after,
body.dtb-titlebar-active .top_panel_navi::before,
body.dtb-titlebar-active .top_panel_navi::after {
    border-bottom: 0 !important;
    box-shadow: none !important;
}

body.dtb-titlebar-active #dtb-page-titlebar.dtb-mounted {
    /* 1px visual overlap also covers anti-aliased/theme separator pixels. */
    transform: translateY(-1px);
    margin-bottom: -1px;
}


/* =========================================================
   v1.6
   - Service detail pages: 15px spacing below title bar.
   - Smooth title/breadcrumb entrance after positioning.
   ========================================================= */

#dtb-page-titlebar.dtb-mounted .dtb-page-titlebar__inner {
    opacity: 0;
    transform: translateY(-7px);
}

#dtb-page-titlebar.dtb-mounted.dtb-ready .dtb-page-titlebar__inner {
    opacity: 1;
    transform: translateY(0);
    transition: opacity .30s ease, transform .30s cubic-bezier(.2,.7,.2,1);
}

body.single-cpt_services #page_content_wrap,
body.single-cpt_services .page_content_wrap {
    padding-top: 15px !important;
}

body.single-cpt_services .post_content > .elementor > .elementor-element:first-child,
body.single-cpt_services #page_content_wrap .elementor > .elementor-element:first-child,
body.single-cpt_services .page_content_wrap .elementor > .elementor-element:first-child {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

@media (max-width: 767px) {
    body.single-cpt_services #page_content_wrap,
    body.single-cpt_services .page_content_wrap {
        padding-top: 12px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    #dtb-page-titlebar.dtb-mounted .dtb-page-titlebar__inner,
    #dtb-page-titlebar.dtb-mounted.dtb-ready .dtb-page-titlebar__inner {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}