/* ===================================================================================
 * Theme Name: Instive Child
 * Template: instive
 * Description: Site-specific styles (safe from ThemeForest parent updates)
 * Version: 1.0.5
 * ================================================================================== */

/* -------------------------------------------------------------------------
   Elementor nav: match live site underline + dropdown hover
   ------------------------------------------------------------------------- */
:root {
	--csos-nav-accent: #d20f16;
}

/*
 * Keep header 14829's desktop navigation above the Cycling UK promo strip.
 * Elementor applies a transform to the sticky section, so the section itself
 * must own the high stacking level; a z-index on the submenu alone cannot
 * escape that stacking context.
 */
.elementor-14829 .elementor-element.elementor-element-42a3b282 {
	position: relative;
	z-index: 10050 !important;
}

/* -------------------------------------------------------------------------
   Elementor 4 compatibility: site-wide display heading line-height

   The migrated Elementor kit has no primary line-height token, so widgets
   without their own value inherit the theme body's fixed 26px line-height.
   Defining the missing token fixes those widgets while preserving intentional
   per-widget line-height settings generated by Elementor.
   ------------------------------------------------------------------------- */
body.elementor-default {
	--e-global-typography-primary-line-height: 1.15em;
}

/* Remove the divider/shadow generated on the responsive menu section. */
body .elementor-14811 .elementor-element.elementor-element-5d09c19f,
body .elementor-element.elementor-element-5d09c19f.elementor-sticky__spacer {
	border: 0 !important;
	box-shadow: none !important;
}

/*
 * Header 14811: section 12aa0542 is the mobile sticky CTA. Elementor's
 * responsive visibility rule can fail after the migration, leaving a large
 * empty sticky bar on wider screens. Keep it mobile-only explicitly.
 */
@media (min-width: 768px) {
	.elementor-14811 .elementor-element.elementor-element-12aa0542 {
		display: none !important;
	}
}

/* Prevent page/video content showing through the mobile CTA while sticky. */
@media (max-width: 767px) {
	/* Remove Elementor's shadow throughout the scroll transition and spacer. */
	body .elementor-element.elementor-element-12aa0542,
	body .elementor-element.elementor-element-5d09c19f {
		box-shadow: none !important;
	}

	.elementor-14811 .elementor-element.elementor-element-12aa0542.elementor-sticky--active,
	.elementor-14811 .elementor-element.elementor-element-12aa0542.elementor-sticky--effects {
		background-color: #ffffff !important;
		box-shadow: none !important;
	}

	.elementor-14811 .elementor-element.elementor-element-12aa0542.elementor-sticky--active > .elementor-background-overlay,
	.elementor-14811 .elementor-element.elementor-element-12aa0542.elementor-sticky--effects > .elementor-background-overlay {
		background-color: #ffffff !important;
		opacity: 1 !important;
	}

	/* Reclaim the hamburger slot when the CTA becomes sticky. */
	.elementor-14811 .elementor-element.elementor-element-12aa0542.elementor-sticky--active .elementor-element-69d7bb5b a.elementor-button,
	.elementor-14811 .elementor-element.elementor-element-12aa0542.elementor-sticky--effects .elementor-element-69d7bb5b a.elementor-button {
		width: 100% !important;
	}

	/* The menu belongs to the normal header, not the scrolled sticky CTA. */
	.elementor-14811 .elementor-element.elementor-element-5d09c19f.elementor-sticky--active {
		visibility: hidden !important;
		pointer-events: none !important;
		box-shadow: none !important;
	}

	.elementor-14811 .elementor-element.elementor-element-5d09c19f.elementor-sticky--effects {
		box-shadow: none !important;
	}
}

/* -------------------------------------------------------------------------
   Elementor header: centre the consultation icon and title as one group

   Elementor 4 makes the icon-box content grow to the full row. Constraining
   both children to their content width restores the centred live-site layout.
   ------------------------------------------------------------------------- */
.elementor-14811 .elementor-element-4f93c99f > .elementor-widget-wrap {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
}

.elementor-14811 .elementor-element-e5edaaa {
	display: flex !important;
	justify-content: center !important;
	width: auto !important;
	max-width: 100% !important;
}

.elementor-14811 .elementor-element-e5edaaa .elementor-icon-box-wrapper {
	display: inline-flex !important;
	flex-direction: row !important;
	justify-content: center !important;
	align-items: center !important;
	width: auto !important;
	gap: 15px;
}

.elementor-14811 .elementor-element-e5edaaa .elementor-icon-box-icon,
.elementor-14811 .elementor-element-e5edaaa .elementor-icon-box-content {
	position: static !important;
	flex: 0 0 auto !important;
	width: auto !important;
}

.elementor-14811 .elementor-element-e5edaaa .elementor-icon-box-title {
	margin: 0 !important;
	text-align: left !important;
}

/* Keep Elementor red underline while the submenu is open / hovered */
.elementor-nav-menu--main .menu-item-has-children:hover > .elementor-item:not(.elementor-sub-item):after,
.elementor-nav-menu--main .menu-item-has-children:focus-within > .elementor-item:not(.elementor-sub-item):after,
.elementor-nav-menu--main .menu-item-has-children.highlighted > .elementor-item:not(.elementor-sub-item):after,
.elementor-nav-menu--main .menu-item-has-children.csos-open > .elementor-item:not(.elementor-sub-item):after,
.elementor-nav-menu--main .menu-item-has-children > .elementor-item.highlighted:after {
	opacity: 1 !important;
	transform: scale(1) !important;
	background-color: var(--csos-nav-accent) !important;
}

/* Dropdown link hover — brand red with a smooth transition */
.elementor-nav-menu--main .elementor-nav-menu--dropdown a,
.elementor-nav-menu--main .elementor-nav-menu .sub-menu a {
	color: #000000 !important;
	transition: color 0.25s ease;
}

.elementor-nav-menu--main .elementor-nav-menu--dropdown a:hover,
.elementor-nav-menu--main .elementor-nav-menu--dropdown a:focus,
.elementor-nav-menu--main .elementor-nav-menu--dropdown a.highlighted,
.elementor-nav-menu--main .elementor-nav-menu .sub-menu a:hover,
.elementor-nav-menu--main .elementor-nav-menu .sub-menu a:focus {
	color: var(--csos-nav-accent) !important;
	background-color: #ffffff !important;
}

/* Sit flush under the bar (no hover dead-zone gap) */
body .elementor-widget-nav-menu .elementor-nav-menu--main > .elementor-nav-menu > li > ul.elementor-nav-menu--dropdown,
body .elementor-widget-nav-menu .elementor-nav-menu--main > .elementor-nav-menu > li > ul.sub-menu,
body .elementor-nav-menu--main .elementor-nav-menu > li > ul {
	margin-top: 0 !important;
}

/* -------------------------------------------------------------------------
   /bicycle-accident-claims-2/ (page-id-17552) header tweaks only
   ------------------------------------------------------------------------- */
.page-id-17552 .elementor-14811 .elementor-element-574d938d,
.page-id-17552 .elementor-14811 .elementor-element-69d7bb5b,
.page-id-17552 .elementor-14811 .elementor-element-45253a48 {
	display: none !important;
}

.page-id-17552 .elementor-14811 .elementor-element-6e210695 .elementor-widget-wrap {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
}

.page-id-17552 .elementor-14811 .elementor-element-e5edaaa {
	width: auto !important;
	max-width: 100% !important;
}

.page-id-17552 .elementor-14811 .elementor-element-e5edaaa .elementor-icon-box-wrapper {
	display: inline-flex !important;
	flex-direction: row !important;
	justify-content: center !important;
	align-items: center !important;
	width: auto !important;
	gap: 15px;
}

.page-id-17552 .elementor-14811 .elementor-element-e5edaaa .elementor-icon-box-icon {
	position: static !important;
	flex: 0 0 auto !important;
}

.page-id-17552 .elementor-14811 .elementor-element-e5edaaa .elementor-icon-box-content {
	flex: 0 0 auto !important;
	width: auto !important;
	text-align: left !important;
}

.page-id-17552 .elementor-14811 .elementor-element-e5edaaa .elementor-icon-box-title {
	text-align: left !important;
}

.page-id-17552 .elementor-14811 .elementor-element-68ab5e13 > .elementor-container {
	justify-content: center !important;
}

.page-id-17552 .elementor-14811 .elementor-element-68a48d76 {
	width: auto !important;
}

.page-id-17552 .elementor-14811 .elementor-element-7cf5d5ab,
.page-id-17552 .elementor-14811 .elementor-element-7cf5d5ab .elementor-button-wrapper {
	text-align: center !important;
}

/* Match the mobile flyout to the existing tablet menu treatment. */
@media (max-width: 767px) {
	.page-id-17552 .elementor-14811 .elementor-element-5d09c19f {
		background-color: #000000 !important;
	}

	.page-id-17552 .elementor-14811 .elementor-element-4c7b83ba .elementor-nav-menu--dropdown {
		background-color: #ffffff !important;
	}

	.page-id-17552 .elementor-14811 .elementor-element-4c7b83ba .elementor-nav-menu--dropdown .elementor-item,
	.page-id-17552 .elementor-14811 .elementor-element-4c7b83ba .elementor-nav-menu--dropdown .elementor-sub-item {
		padding: 13px 20px !important;
		font-family: "Oswald", sans-serif !important;
		font-size: 15px !important;
		font-weight: 400 !important;
		line-height: 1.15 !important;
		text-transform: uppercase !important;
	}
}