/* ==========================================================================
   OneMed — design system
   Tokens sampled directly from the approved reference design.
   Everything here is additive to Elementor; nothing fights the editor.
   ========================================================================== */

:root {
	/* Brand palette */
	--omn-navy:        #011B32;
	--omn-navy-soft:   #062741;
	--omn-blue:        #047CF8;
	--omn-blue-dark:   #0362c6;
	--omn-light:       #CEE0EE;
	--omn-light-soft:  #E4EEF6;
	--omn-white:       #FFFFFF;
	--omn-ink:         #011B32;

	/* Text on dark */
	--omn-on-dark:      #FFFFFF;
	--omn-on-dark-mute: rgba(255, 255, 255, 0.78);

	/* Shape */
	--omn-radius-section: 40px;
	--omn-radius-card:    12px;
	--omn-radius-pill:    999px;

	/* Layout */
	--omn-container: 1400px;
	--omn-gutter: 40px;

	/* Type */
	--omn-font-display: "Wix Madefor Display", "Helvetica Neue", Helvetica, Arial, sans-serif;
	--omn-font-text:    "Wix Madefor Text", "Helvetica Neue", Helvetica, Arial, sans-serif;

	/* Motion */
	--omn-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--omn-dur: 0.75s;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

body.onemed {
	font-family: var(--omn-font-text);
	color: var(--omn-ink);
	background-color: var(--omn-navy);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

body.onemed h1,
body.onemed h2,
body.onemed h3,
body.onemed h4,
body.onemed h5,
body.onemed h6 {
	font-family: var(--omn-font-display);
	font-weight: 400;
	letter-spacing: -0.02em;
	margin: 0;
}

/* The reference sets headings unusually light for their size — this is the
   single most recognisable trait of the design, so it is enforced here. */
body.onemed .omn-display {
	font-family: var(--omn-font-display);
	font-weight: 400;
	letter-spacing: -0.025em;
	line-height: 1.2;
}

/* --------------------------------------------------------------------------
   Section shapes — the large 40px top radius on alternating panels
   -------------------------------------------------------------------------- */

.omn-round-top > .e-con-inner,
.omn-round-top {
	border-top-left-radius: var(--omn-radius-section);
	border-top-right-radius: var(--omn-radius-section);
}

.omn-round-bottom {
	border-bottom-left-radius: var(--omn-radius-section);
	border-bottom-right-radius: var(--omn-radius-section);
}

.omn-round-top,
.omn-round-bottom {
	overflow: hidden;
}

/* Panels sit flush with no gap between them */
.omn-panel {
	position: relative;
	z-index: 1;
}

.omn-panel + .omn-panel {
	margin-top: -1px; /* kill sub-pixel seams between full-bleed panels */
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */

.omn-header {
	position: sticky;
	top: 0;
	z-index: 999;
	background-color: var(--omn-navy);
	transition: box-shadow 0.3s ease, background-color 0.3s ease;
}

.omn-header.is-stuck {
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.28);
}

.omn-header .wpr-nav-menu > li > a,
.omn-header .elementor-nav-menu > li > a {
	font-family: var(--omn-font-text);
	font-size: 15px;
	font-weight: 400;
	color: var(--omn-on-dark);
	letter-spacing: 0;
	position: relative;
}

/* Underline that grows from the left — matches the reference hover */
.omn-header .wpr-nav-menu > li > a::after,
.omn-header .elementor-nav-menu > li > a::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -4px;
	width: 100%;
	height: 1px;
	background-color: currentColor;
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.35s var(--omn-ease);
}

.omn-header .wpr-nav-menu > li > a:hover::after,
.omn-header .elementor-nav-menu > li > a:hover::after,
.omn-header .wpr-nav-menu > li.current-menu-item > a::after,
.omn-header .elementor-nav-menu > li.current-menu-item > a::after {
	transform: scaleX(1);
}

/* Outlined pill CTA */
.omn-btn-outline .elementor-button,
.omn-btn-outline .wpr-button,
a.omn-btn-outline {
	border: 1px solid var(--omn-on-dark);
	border-radius: var(--omn-radius-pill);
	background-color: transparent;
	color: var(--omn-on-dark);
	padding: 14px 30px;
	font-family: var(--omn-font-text);
	font-size: 15px;
	font-weight: 400;
	line-height: 1;
	transition: background-color 0.35s var(--omn-ease), color 0.35s var(--omn-ease);
}

.omn-btn-outline .elementor-button:hover,
.omn-btn-outline .wpr-button:hover,
a.omn-btn-outline:hover {
	background-color: var(--omn-on-dark);
	color: var(--omn-navy);
}

/* Soft-filled pill (hero "Contact us", footer "Contact us") */
.omn-btn-soft .elementor-button,
.omn-btn-soft .wpr-button,
a.omn-btn-soft {
	border-radius: var(--omn-radius-pill);
	background-color: var(--omn-light);
	color: var(--omn-navy);
	padding: 14px 32px;
	font-family: var(--omn-font-text);
	font-size: 15px;
	line-height: 1;
	border: 1px solid transparent;
	transition: background-color 0.35s var(--omn-ease), color 0.35s var(--omn-ease), transform 0.35s var(--omn-ease);
}

.omn-btn-soft .elementor-button:hover,
.omn-btn-soft .wpr-button:hover,
a.omn-btn-soft:hover {
	background-color: var(--omn-white);
	transform: translateY(-2px);
}

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */

.omn-hero {
	background-color: var(--omn-navy);
}

.omn-hero .omn-hero-title {
	font-size: clamp(38px, 4.5vw, 68px);
	line-height: 1.2;
	letter-spacing: -0.025em;
	font-weight: 400;
	color: var(--omn-on-dark);
}

.omn-hero .omn-hero-lead {
	font-family: var(--omn-font-text);
	font-size: clamp(18px, 1.6vw, 24px);
	line-height: 1.4;
	color: var(--omn-on-dark);
}

/* Dot-swarm logo lockup video sits on the navy with no visible box */
.omn-hero-mark video,
.omn-hero-mark img {
	display: block;
	width: 100%;
	height: auto;
	mix-blend-mode: screen; /* video is on black — drop the box */
}

/* --------------------------------------------------------------------------
   Type scale for content sections
   -------------------------------------------------------------------------- */

.omn-eyebrow {
	font-family: var(--omn-font-display);
	font-size: clamp(18px, 1.5vw, 22px);
	font-weight: 400;
	letter-spacing: -0.01em;
}

.omn-h2 {
	font-size: clamp(32px, 3.2vw, 48px);
	line-height: 1.27;
	letter-spacing: -0.025em;
	font-weight: 400;
}

.omn-h3 {
	font-size: clamp(21px, 1.8vw, 26px);
	line-height: 1.3;
	letter-spacing: -0.02em;
	font-weight: 400;
}

.omn-body,
.omn-body p {
	font-family: var(--omn-font-text);
	font-size: 16px;
	line-height: 1.45;
	font-weight: 400;
}

.omn-body p + p {
	margin-top: 1.4em;
}

.on-dark,
.on-dark p,
.on-dark h1,
.on-dark h2,
.on-dark h3 {
	color: var(--omn-on-dark);
}

.on-light,
.on-light p,
.on-light h1,
.on-light h2,
.on-light h3 {
	color: var(--omn-navy);
}

/* Framed illustration plates (light card holding a graphic on the navy) */
.omn-plate img {
	background-color: #F1F4F8;
	border-radius: 2px;
	display: block;
	width: 100%;
	height: auto;
}

/* --------------------------------------------------------------------------
   Staggered card grids — Products & Platforms, The OneMedNet Team
   The reference walks each card down and to the right. Implemented with
   margin offsets so the cards stay real Elementor containers.
   -------------------------------------------------------------------------- */

.omn-stagger {
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	gap: 0;
}

.omn-stagger > * {
	flex: 0 0 auto;
}

.omn-step-1 { margin-top: 0; }
.omn-step-2 { margin-top: 14vw; }
.omn-step-3 { margin-top: 28vw; }

/* Product cards */
.omn-product-card {
	background-color: var(--omn-navy);
	border-radius: var(--omn-radius-card);
	padding: 32px;
	color: var(--omn-on-dark);
	transition: transform 0.5s var(--omn-ease), box-shadow 0.5s var(--omn-ease);
}

.omn-product-card:hover {
	transform: translateY(-8px);
	box-shadow: 0 24px 60px rgba(1, 27, 50, 0.35);
}

.omn-product-card .omn-card-dot {
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background-color: var(--omn-white);
	display: block;
	margin-bottom: 26px;
}

.omn-product-card h3 {
	font-size: 24px;
	font-weight: 400;
	margin-bottom: 14px;
	color: var(--omn-on-dark);
}

.omn-product-card p {
	font-size: 15px;
	line-height: 1.45;
	color: var(--omn-on-dark);
}

/* Team cards */
.omn-team-card img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	border-radius: 6px;
	transition: transform 0.6s var(--omn-ease);
}

.omn-team-card {
	overflow: hidden;
}

.omn-team-card:hover img {
	transform: scale(1.04);
}

.omn-team-card .omn-team-name {
	font-family: var(--omn-font-text);
	font-size: 17px;
	color: var(--omn-on-dark);
	margin-top: 14px;
}

.omn-team-card .omn-team-role {
	font-family: var(--omn-font-text);
	font-size: 15px;
	color: var(--omn-on-dark-mute);
	margin-top: 2px;
}

/* --------------------------------------------------------------------------
   Testimonials
   -------------------------------------------------------------------------- */

.omn-testimonial {
	background-color: var(--omn-blue);
	border-radius: var(--omn-radius-card);
	padding: 42px 34px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 300px;
	color: var(--omn-white);
	transition: transform 0.5s var(--omn-ease);
}

.omn-testimonial:hover {
	transform: translateY(-6px);
}

.omn-testimonial .omn-quote {
	font-family: var(--omn-font-display);
	font-size: clamp(20px, 1.9vw, 27px);
	line-height: 1.3;
	letter-spacing: -0.02em;
	font-weight: 400;
	color: var(--omn-white);
}

.omn-testimonial .omn-cite {
	font-family: var(--omn-font-text);
	font-size: 14px;
	color: var(--omn-white);
	margin-top: 34px;
}

/* --------------------------------------------------------------------------
   Contact form — underline fields on a light panel
   -------------------------------------------------------------------------- */

.omn-form-panel {
	background-color: var(--omn-light-soft);
	border-radius: var(--omn-radius-section);
	padding: 56px 48px;
}

.omn-form .wpr-form-builder__field,
.omn-form .elementor-field-group {
	margin-bottom: 26px;
}

.omn-form label,
.omn-form .elementor-field-label {
	font-family: var(--omn-font-text);
	font-size: 13px;
	color: var(--omn-navy);
	margin-bottom: 6px;
	display: block;
}

.omn-form input[type="text"],
.omn-form input[type="email"],
.omn-form input[type="tel"],
.omn-form textarea {
	width: 100%;
	background-color: transparent;
	border: 0;
	border-bottom: 1px solid var(--omn-navy);
	border-radius: 0;
	padding: 8px 0;
	font-family: var(--omn-font-text);
	font-size: 15px;
	color: var(--omn-navy);
	box-shadow: none;
	transition: border-color 0.3s ease;
}

.omn-form textarea {
	min-height: 92px;
	resize: vertical;
}

.omn-form input:focus,
.omn-form textarea:focus {
	outline: none;
	border-bottom-color: var(--omn-blue);
	box-shadow: none;
}

.omn-form button[type="submit"],
.omn-form .elementor-button,
.omn-form .wpr-form-builder__submit {
	width: 100%;
	border: 1px solid var(--omn-navy);
	border-radius: var(--omn-radius-pill);
	background-color: transparent;
	color: var(--omn-navy);
	padding: 15px 24px;
	font-family: var(--omn-font-text);
	font-size: 15px;
	transition: background-color 0.35s var(--omn-ease), color 0.35s var(--omn-ease);
}

.omn-form button[type="submit"]:hover,
.omn-form .elementor-button:hover,
.omn-form .wpr-form-builder__submit:hover {
	background-color: var(--omn-navy);
	color: var(--omn-white);
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.omn-footer {
	background-color: var(--omn-white);
	color: var(--omn-navy);
	border-top-left-radius: var(--omn-radius-section);
	border-top-right-radius: var(--omn-radius-section);
}

.omn-footer a {
	color: var(--omn-navy);
	text-decoration: none;
	transition: opacity 0.25s ease;
}

.omn-footer a:hover {
	opacity: 0.55;
}

.omn-footer .omn-footer-links li {
	list-style: none;
	margin: 0 0 3px;
	font-size: 15px;
}

.omn-footer .omn-footer-links {
	margin: 0;
	padding: 0;
}

/* --------------------------------------------------------------------------
   Scroll reveal — the reference fades and lifts each block into place
   -------------------------------------------------------------------------- */

/*
 * Fail-safe: content is visible by default. The hidden starting state is only
 * applied once the script has confirmed it is running, so a JS error or a
 * blocked file can never leave the page blank.
 */
.omn-reveal {
	opacity: 1;
	transform: none;
}

html.omn-js .omn-reveal {
	opacity: 0;
	transform: translateY(34px);
	transition: opacity var(--omn-dur) var(--omn-ease), transform var(--omn-dur) var(--omn-ease);
	will-change: opacity, transform;
}

html.omn-js .omn-reveal.is-visible {
	opacity: 1;
	transform: none;
}

.omn-reveal-delay-1 { transition-delay: 0.09s; }
.omn-reveal-delay-2 { transition-delay: 0.18s; }
.omn-reveal-delay-3 { transition-delay: 0.27s; }

@media (prefers-reduced-motion: reduce) {
	.omn-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}

	.omn-product-card,
	.omn-testimonial,
	.omn-team-card img {
		transition: none;
	}
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 1024px) {
	:root {
		--omn-radius-section: 28px;
		--omn-gutter: 28px;
	}

	.omn-step-2,
	.omn-step-3 {
		margin-top: 0;
	}

	.omn-stagger {
		flex-wrap: wrap;
		gap: 24px;
	}

	.omn-form-panel {
		padding: 40px 28px;
	}
}

@media (max-width: 767px) {
	:root {
		--omn-radius-section: 22px;
		--omn-gutter: 20px;
	}

	.omn-hero .omn-hero-title {
		font-size: 34px;
	}

	.omn-product-card {
		padding: 26px;
	}

	.omn-testimonial {
		min-height: 0;
		padding: 32px 26px;
	}
}

/* --------------------------------------------------------------------------
   Products & Platforms — the oversized bulleted statement
   -------------------------------------------------------------------------- */

.omn-products-list ul {
	margin: 0;
	padding: 0 0 0 1em;
	list-style: disc;
}

.omn-products-list li {
	font-family: var(--omn-font-display);
	font-size: clamp(28px, 3.1vw, 48px);
	line-height: 1.22;
	letter-spacing: -0.025em;
	font-weight: 400;
	color: var(--omn-navy);
	margin-bottom: 0.1em;
}

.omn-products-list li::marker {
	font-size: 0.5em;
}

/* --------------------------------------------------------------------------
   Header logo
   -------------------------------------------------------------------------- */

.omn-header-logo img {
	max-width: 150px;
	height: auto;
	display: block;
}

/* --------------------------------------------------------------------------
   Royal nav menu overrides
   The free plugin only ships a horizontal layout, so the footer columns are
   stacked here rather than by widget setting.
   -------------------------------------------------------------------------- */

.omn-footer-links .wpr-nav-menu,
.omn-footer-links .wpr-nav-menu-container ul {
	flex-direction: column !important;
	align-items: flex-start !important;
	gap: 0 !important;
	margin: 0;
	padding: 0;
}

.omn-footer-links .wpr-nav-menu > li {
	width: 100%;
	margin: 0 !important;
}

.omn-footer-links .wpr-nav-menu > li > a {
	font-family: var(--omn-font-text);
	font-size: 15px;
/* 	color: var(--omn-navy) !important; */
	padding: 2px 0 !important;
	justify-content: flex-start;
}

.omn-header .wpr-nav-menu > li > a {
	padding: 8px 18px !important;
}

.omn-footer .elementor-widget-text-editor ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

/* --------------------------------------------------------------------------
   Contact Form 7 layout — two fields per row, underline inputs
   -------------------------------------------------------------------------- */

.omn-form .omn-form-row {
	display: flex;
	gap: 34px;
	margin-bottom: 26px;
}

.omn-form .omn-field {
	flex: 1 1 0;
	min-width: 0;
	display: block;
}

.omn-form .omn-field-full {
	flex-basis: 100%;
}

.omn-form .omn-field label {
	display: block;
	font-family: var(--omn-font-text);
	font-size: 13px;
	color: var(--omn-navy);
	margin-bottom: 8px;
}

.omn-form .wpcf7-form-control-wrap {
	display: block;
	width: 100%;
}

.omn-form input.wpcf7-text,
.omn-form input.wpcf7-tel,
.omn-form input.wpcf7-email,
.omn-form textarea.wpcf7-textarea {
	width: 100%;
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--omn-navy);
	border-radius: 0;
	padding: 8px 0;
	font-family: var(--omn-font-text);
	font-size: 15px;
	color: var(--omn-navy);
	box-shadow: none;
	transition: border-color 0.3s ease;
}

.omn-form textarea.wpcf7-textarea {
	min-height: 92px;
	resize: vertical;
}

.omn-form input.wpcf7-text:focus,
.omn-form input.wpcf7-tel:focus,
.omn-form input.wpcf7-email:focus,
.omn-form textarea.wpcf7-textarea:focus {
	outline: none;
	border-bottom-color: var(--omn-blue);
}

.omn-form .omn-submit {
	margin-top: 34px;
}

.omn-form input.wpcf7-submit {
	width: 100%;
	border: 1px solid var(--omn-navy);
	border-radius: var(--omn-radius-pill);
	background: transparent;
	color: var(--omn-navy);
	padding: 15px 24px;
	font-family: var(--omn-font-text);
	font-size: 15px;
	cursor: pointer;
	transition: background-color 0.35s var(--omn-ease), color 0.35s var(--omn-ease);
}

.omn-form input.wpcf7-submit:hover {
	background-color: var(--omn-navy);
	color: var(--omn-white);
}

.omn-form .wpcf7-not-valid-tip {
	font-size: 12px;
	color: #c0392b;
	margin-top: 6px;
}

.omn-form .wpcf7-response-output {
	margin: 22px 0 0;
	border-radius: 8px;
	font-size: 14px;
	padding: 12px 16px;
}

@media (max-width: 767px) {
	.omn-form .omn-form-row {
		flex-direction: column;
		gap: 0;
		margin-bottom: 0;
	}

	.omn-form .omn-field {
		margin-bottom: 22px;
	}
}

/* ==========================================================================
   Homepage v2 — sections introduced by the 17 Aug client feedback
   ========================================================================== */

/* Short accent rule that sits above a section heading */
.omn-rule {
	display: block;
	width: 58px;
	height: 5px;
	border-radius: 3px;
	background: linear-gradient(90deg, var(--omn-navy) 0%, var(--omn-blue) 100%);
	margin-bottom: 22px;
}

/* --------------------------------------------------------------------------
   Credibility band
   -------------------------------------------------------------------------- */

.omn-stat {
	text-align: center;
	flex: 1 1 0;
}

.omn-stat .omn-stat-value {
	font-family: var(--omn-font-display);
	font-size: clamp(44px, 5.4vw, 84px);
	line-height: 1;
	letter-spacing: -0.03em;
	font-weight: 700;
	color: var(--omn-blue);
	margin: 0;
}

.omn-stat .omn-stat-label {
	font-family: var(--omn-font-text);
	font-size: clamp(14px, 1.2vw, 17px);
	line-height: 1.35;
	color: var(--omn-on-dark);
	margin: 14px 0 0;
}

/* --------------------------------------------------------------------------
   Precision Data — vertical tabs
   -------------------------------------------------------------------------- */

.omn-tabs .elementor-tabs {
	display: flex;
	gap: 46px;
	align-items: flex-start;
}

.omn-tabs .elementor-tabs-wrapper {
	flex: 0 0 290px;
	display: flex;
	flex-direction: column;
	gap: 14px;
	border: 0;
}

.omn-tabs .elementor-tab-title {
	background-color: var(--omn-navy);
	color: var(--omn-white);
	border: 0 !important;
	border-radius: 4px;
	padding: 20px 26px !important;
	font-family: var(--omn-font-text);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.3s var(--omn-ease), color 0.3s var(--omn-ease);
}

.omn-tabs .elementor-tab-title:hover {
	background-color: var(--omn-blue);
}

/* Active tab inverts and points at the panel, as in the approved design */
.omn-tabs .elementor-tab-title.elementor-active {
	background-color: var(--omn-white);
	color: var(--omn-navy);
	position: relative;
}

.omn-tabs .elementor-tab-title.elementor-active::after {
	content: "";
	position: absolute;
	right: -11px;
	top: 50%;
	transform: translateY(-50%);
	border-top: 11px solid transparent;
	border-bottom: 11px solid transparent;
	border-left: 11px solid var(--omn-white);
}

.omn-tabs .elementor-tabs-content-wrapper {
	flex: 1 1 auto;
	border: 0;
}

.omn-tabs .elementor-tab-content {
	border: 0 !important;
	padding: 0 !important;
	font-family: var(--omn-font-text);
	font-size: 16px;
	line-height: 1.55;
	color: var(--omn-navy);
}

.omn-tabs .elementor-tab-content p + p {
	margin-top: 1.3em;
}

/* Elementor renders mobile accordion titles as well — hide on desktop */
.omn-tabs .elementor-tab-mobile-title {
	display: none;
}

/* Outlined dark CTA used under the tabs */
.omn-btn-line .elementor-button,
a.omn-btn-line {
	border: 1px solid var(--omn-navy);
	border-radius: 2px;
	background-color: transparent;
	color: var(--omn-navy);
	padding: 16px 30px;
	font-family: var(--omn-font-text);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1;
	transition: background-color 0.35s var(--omn-ease), color 0.35s var(--omn-ease);
}

.omn-btn-line .elementor-button:hover,
a.omn-btn-line:hover {
	background-color: var(--omn-navy);
	color: var(--omn-white);
}

/* --------------------------------------------------------------------------
   Get started
   -------------------------------------------------------------------------- */

.omn-getstarted .omn-getstarted-title,
.omn-getstarted .omn-getstarted-lead,
.omn-getstarted .omn-getstarted-lead p {
	color: var(--omn-navy);
}

.omn-getstarted .omn-form-panel {
	background-color: transparent;
	padding: 0;
	border-radius: 0;
}

/* On the gradient the underline fields read better in white */
.omn-getstarted .omn-form .omn-field label {
	color: var(--omn-navy);
	font-weight: 500;
}

.omn-getstarted .omn-form input.wpcf7-text,
.omn-getstarted .omn-form input.wpcf7-tel,
.omn-getstarted .omn-form input.wpcf7-email,
.omn-getstarted .omn-form textarea.wpcf7-textarea {
	background-color: rgba(255, 255, 255, 0.92);
	border: 1px solid transparent;
	border-radius: 3px;
	padding: 12px 14px;
}

.omn-getstarted .omn-form input.wpcf7-text:focus,
.omn-getstarted .omn-form input.wpcf7-tel:focus,
.omn-getstarted .omn-form input.wpcf7-email:focus,
.omn-getstarted .omn-form textarea.wpcf7-textarea:focus {
	background-color: #fff;
	border-color: var(--omn-navy);
}

.omn-getstarted .omn-form input.wpcf7-submit {
	width: auto;
	min-width: 190px;
	border-radius: 3px;
	border-color: var(--omn-navy);
	background-color: var(--omn-navy);
	color: var(--omn-white);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 13px;
	font-weight: 600;
}

.omn-getstarted .omn-form input.wpcf7-submit:hover {
	background-color: var(--omn-white);
	color: var(--omn-navy);
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 1024px) {
	.omn-tabs .elementor-tabs {
		flex-direction: column;
		gap: 26px;
	}

	.omn-tabs .elementor-tabs-wrapper {
		flex: 1 1 auto;
		width: 100%;
	}

	.omn-tabs .elementor-tab-title.elementor-active::after {
		display: none;
	}
}

@media (max-width: 767px) {
	.omn-stat {
		flex: 1 1 100%;
		margin-bottom: 34px;
	}

	.omn-stat .omn-stat-value {
		font-size: 52px;
	}
}

/* ==========================================================================
   Header — utility bar + main bar
   ========================================================================== */

.omn-utility-bar {
	border-bottom: 1px solid rgba(255, 255, 255, 0.09);
}

.omn-utility-links .wpr-nav-menu > li > a {
	font-family: var(--omn-font-text);
	font-size: 13px;
	color: var(--omn-light) !important;
	padding: 4px 12px !important;
	letter-spacing: 0.01em;
}

.omn-utility-links .wpr-nav-menu > li > a:hover {
	color: var(--omn-white) !important;
}

.omn-social {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	padding-left: 12px;
}

.omn-social a {
	color: var(--omn-light);
	display: inline-flex;
	transition: color 0.25s ease, transform 0.25s ease;
}

.omn-social a:hover {
	color: var(--omn-white);
	transform: translateY(-1px);
}

/*
 * Dropdown submenus.
 *
 * Royal renders submenus as .wpr-sub-menu / .wpr-sub-menu-item — NOT the
 * WordPress-standard .sub-menu — so selectors written against .sub-menu match
 * nothing at all. Colours are also set on the widget itself (see the installer)
 * because Royal emits per-element CSS that outranks this file.
 */
.omn-header .wpr-sub-menu {
	background-color: var(--omn-navy);
	border-radius: 6px;
	padding: 8px 0;
	box-shadow: 0 18px 46px rgba(0, 0, 0, 0.38);
	min-width: 240px;
	overflow: hidden;
}

.omn-header .wpr-sub-menu .wpr-sub-menu-item {
	font-family: var(--omn-font-text);
	font-size: 14px;
	line-height: 1.4;
	color: var(--omn-white);
	background-color: transparent;
	white-space: nowrap;
	display: block;
}

.omn-header .wpr-sub-menu .wpr-sub-menu-item:hover,
.omn-header .wpr-sub-menu .wpr-sub-menu-item.wpr-active-menu-item {
	color: var(--omn-white);
	background-color: var(--omn-blue);
}

/* Submenu items must never inherit the growing underline from the top level */
.omn-header .wpr-sub-menu .wpr-sub-menu-item::after,
.omn-header .wpr-sub-menu a::after {
	display: none !important;
}

/* Keep the dropdown clear of the header edge and above everything else */
.omn-header .wpr-nav-menu > li > .wpr-sub-menu {
	z-index: 1000;
}

.omn-header {
	z-index: 1000;
}

/* ==========================================================================
   Inner pages
   ========================================================================== */

.omn-page-hero .omn-page-title {
	font-size: clamp(32px, 3.8vw, 58px);
	line-height: 1.15;
	letter-spacing: -0.025em;
	font-weight: 400;
	color: var(--omn-on-dark);
}

.omn-page-hero .omn-page-eyebrow {
	font-family: var(--omn-font-text);
	font-size: 13px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--omn-blue);
	margin: 0 0 14px;
}

.omn-page-hero .omn-page-lead,
.omn-page-hero .omn-page-lead p {
	font-family: var(--omn-font-text);
	font-size: clamp(17px, 1.4vw, 21px);
	line-height: 1.45;
	color: var(--omn-on-dark-mute);
}

.omn-content-band .omn-body ul {
	margin: 1.1em 0 0;
	padding-left: 1.15em;
}

.omn-content-band .omn-body li {
	margin-bottom: 0.5em;
}

/* --------------------------------------------------------------------------
   Legal pages — a single readable measure
   -------------------------------------------------------------------------- */

.omn-legal-body {
	max-width: 78ch;
}

.omn-legal-body h2 {
	font-family: var(--omn-font-display);
	font-size: 24px;
	line-height: 1.3;
	font-weight: 500;
	color: var(--omn-navy);
	margin: 2.2em 0 0.7em;
}

.omn-legal-body h2:first-child {
	margin-top: 0;
}

.omn-legal-body p {
	margin-bottom: 1.15em;
	color: var(--omn-navy);
}

.omn-legal-body ul {
	margin: 0 0 1.3em;
	padding-left: 1.2em;
}

.omn-legal-body li {
	margin-bottom: 0.45em;
}

/* --------------------------------------------------------------------------
   Listing pages — News, Events, Blog
   -------------------------------------------------------------------------- */

.omn-listing .omn-card {
	background-color: var(--omn-white);
	border-radius: 10px;
	padding: 30px 28px;
	display: flex;
	flex-direction: column;
	transition: transform 0.4s var(--omn-ease), box-shadow 0.4s var(--omn-ease);
}

.omn-listing .omn-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 20px 46px rgba(1, 27, 50, 0.14);
}

.omn-card .omn-card-date {
	font-family: var(--omn-font-text);
	font-size: 12px;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--omn-blue);
	margin: 0 0 12px;
}

.omn-card .omn-card-title {
	font-family: var(--omn-font-display);
	font-size: 20px;
	line-height: 1.28;
	font-weight: 500;
	letter-spacing: -0.015em;
	color: var(--omn-navy);
	margin: 0 0 12px;
}

.omn-card .omn-card-excerpt {
	font-family: var(--omn-font-text);
	font-size: 15px;
	line-height: 1.5;
	color: #3d556e;
	margin: 0 0 18px;
	flex: 1 1 auto;
}

.omn-btn-text .elementor-button {
	background: transparent;
	color: var(--omn-blue);
	padding: 0;
	font-family: var(--omn-font-text);
	font-size: 14px;
	font-weight: 600;
	border: 0;
}

.omn-btn-text .elementor-button:hover {
	text-decoration: underline;
}

/* CTA button sitting on the blue gradient */
.omn-btn-line-dark .elementor-button {
	border-color: var(--omn-navy);
	background-color: var(--omn-navy);
	color: var(--omn-white);
	border-radius: 3px;
}

.omn-btn-line-dark .elementor-button:hover {
	background-color: var(--omn-white);
	color: var(--omn-navy);
}

@media (max-width: 1024px) {
	.omn-listing .omn-card {
		padding: 24px 22px;
	}
}

/* ==========================================================================
   Layout hardening
   Column widths are authored as percentages, and flex gaps are added on top
   of them, so a row of 52% + 48% with a 60px gap would overflow. Allowing
   containers to shrink resolves that everywhere at once rather than by
   hand-tuning every percentage.
   ========================================================================== */

.omn-panel .e-con,
.omn-panel .e-con-inner > .e-con {
	flex-shrink: 1;
	min-width: 0;
}

/* Widgets should never force a row wider than its column */
.omn-panel .elementor-widget {
	min-width: 0;
	max-width: 100%;
}

.omn-panel img {
	max-width: 100%;
	height: auto;
}

/* Statistics sit on an even three-up regardless of the authored width */
.omn-stats .omn-stat {
	flex: 1 1 0 !important;
	width: auto !important;
}

/* --------------------------------------------------------------------------
   Vertical rhythm
   Elementor's global 20px widget gap is too loose inside tight blocks and too
   tight between a rule and its heading. Normalised here.
   -------------------------------------------------------------------------- */

.omn-panel .elementor-widget:not(:last-child) {
	--kit-widget-spacing: 0px;
	margin-bottom: 0;
}

.omn-panel .omn-rule {
	margin-bottom: 20px;
}

.omn-page-hero .omn-page-eyebrow {
	margin-bottom: 12px;
}

.omn-hero-title,
.omn-page-title,
.omn-h2,
.omn-h3 {
	margin: 0;
}

/* Restore deliberate spacing after headings */
.omn-h2 + .elementor-widget-text-editor,
.omn-h3 + .elementor-widget-text-editor {
	margin-top: 22px;
}

/* --------------------------------------------------------------------------
   Header alignment
   -------------------------------------------------------------------------- */

.omn-header-main > .e-con-inner,
.omn-header-main {
	align-items: center;
}

.omn-header .elementor-widget-button,
.omn-header .elementor-widget-wpr-nav-menu {
	display: flex;
	align-items: center;
}

.omn-header .wpr-nav-menu-container {
	width: 100%;
}

.omn-header .omn-main-menu .wpr-nav-menu {
	justify-content: center;
	flex-wrap: wrap;
}

.omn-utility-bar .omn-utility-links .wpr-nav-menu {
	justify-content: flex-end;
}

/* The logo column must not collapse when the menu is wide */
.omn-header-logo {
	flex: 0 0 auto;
}

/* --------------------------------------------------------------------------
   Buttons — guard against any inherited white-on-white
   -------------------------------------------------------------------------- */

.omn-btn-outline .elementor-button {
	background-color: transparent !important;
	color: var(--omn-white) !important;
	border: 1px solid var(--omn-white) !important;
}

.omn-btn-outline .elementor-button:hover,
.omn-btn-outline .elementor-button:focus {
	background-color: var(--omn-white) !important;
	color: var(--omn-navy) !important;
}

.omn-btn-soft .elementor-button {
	background-color: var(--omn-light) !important;
	color: var(--omn-navy) !important;
}

.omn-btn-soft .elementor-button:hover,
.omn-btn-soft .elementor-button:focus {
	background-color: var(--omn-white) !important;
	color: var(--omn-navy) !important;
}

.omn-btn-line .elementor-button {
	background-color: transparent !important;
	color: var(--omn-navy) !important;
	border: 1px solid var(--omn-navy) !important;
}

.omn-btn-line .elementor-button:hover,
.omn-btn-line .elementor-button:focus {
	background-color: var(--omn-navy) !important;
	color: var(--omn-white) !important;
}

.omn-btn-line-dark .elementor-button {
	background-color: var(--omn-navy) !important;
	color: var(--omn-white) !important;
	border: 1px solid var(--omn-navy) !important;
}

.omn-btn-line-dark .elementor-button:hover,
.omn-btn-line-dark .elementor-button:focus {
	background-color: var(--omn-white) !important;
	color: var(--omn-navy) !important;
}

.omn-btn-text .elementor-button {
	background-color: transparent !important;
	color: var(--omn-blue) !important;
	border: 0 !important;
	padding: 0 !important;
}

/* Hello Elementor styles bare buttons; keep it away from Elementor buttons */
.omn-panel .elementor-button,
.omn-header .elementor-button {
	box-shadow: none;
	text-decoration: none;
}

/* --------------------------------------------------------------------------
   Blank pages — a titled hero and nothing else should still breathe
   -------------------------------------------------------------------------- */

.omn-page-hero:last-child {
	min-height: 42vh;
	display: flex;
	align-items: center;
}

/* ==========================================================================
   Fixes — round 2
   ========================================================================== */

/* --------------------------------------------------------------------------
   Utility bar
   Royal's nav menu ships its own paddings and a stretched container, which
   left the links and the social icons unevenly spaced and off the baseline.
   Reset it to a simple right-aligned row with one consistent gap.
   -------------------------------------------------------------------------- */

.omn-utility-bar {
	min-height: 40px;
}

.omn-utility-bar > .e-con-inner {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 0;
}

.omn-utility-bar .e-con {
/* 	width: auto !important; */
	flex: 0 0 auto !important;
	align-items: space-between;
	padding: 0 !important;
}

.omn-utility-bar .elementor-widget {
	margin: 0 !important;
	width: auto !important;
}

.omn-utility-bar .wpr-nav-menu-container {
	width: auto !important;
}

.omn-utility-links .wpr-nav-menu {
	display: flex !important;
	align-items: center;
	gap: 4px;
	margin: 0 !important;
	padding: 0 !important;
	flex-wrap: nowrap;
}

.omn-utility-links .wpr-nav-menu > li {
	margin: 0 !important;
	line-height: 1;
}

.omn-utility-links .wpr-nav-menu > li > a {
	padding: 0 14px !important;
	line-height: 1.2 !important;
	min-height: 0 !important;
	display: inline-flex;
	align-items: center;
}

/* Utility links never take the animated underline */
.omn-utility-bar .wpr-nav-menu > li > a::after {
	display: none !important;
}

/* Divider between the links and the social icons */
.omn-social {
	padding-left: 18px;
	margin-left: 4px;
	border-left: 1px solid rgba(255, 255, 255, 0.16);
	line-height: 1;
}

.omn-social-wrap {
	display: flex;
	align-items: center;
}

@media (max-width: 767px) {
	.omn-utility-bar {
		min-height: 0;
	}

	.omn-utility-links .wpr-nav-menu > li > a {
		padding: 0 9px !important;
		font-size: 12px;
	}

	.omn-social {
		padding-left: 10px;
		gap: 10px;
	}
}

/* --------------------------------------------------------------------------
   Contact form
   Royal's Form Styler wraps CF7 in its own container; neutralise that so the
   field grid below is the only thing controlling layout.
   -------------------------------------------------------------------------- */

.omn-form .wpr-forms-container,
.omn-form .wpr-forms-container form {
	margin: 0;
	padding: 0;
	max-width: none;
}

.omn-form .omn-cf7 {
	margin: 0;
	padding: 0;
}

/* CF7 injects these; keep them from adding stray vertical space */
.omn-form .wpcf7-spinner {
	position: absolute;
	margin: 0 0 0 10px;
}

.omn-form .screen-reader-response {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

.omn-form .omn-form-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0 30px;
	margin: 0;
}

.omn-form .omn-field {
	flex: 1 1 220px;
	min-width: 0;
	display: block;
	margin-bottom: 24px;
}

.omn-form .omn-field-full {
	flex: 1 1 100%;
}

.omn-form .omn-field label {
	display: block;
	margin: 0 0 8px;
	font-family: var(--omn-font-text);
	font-size: 13px;
	line-height: 1.3;
}

.omn-form .omn-submit {
	position: relative;
	margin-top: 10px;
	display: flex;
	align-items: center;
}

/* Consistent field height whatever the input type */
.omn-form input.wpcf7-text,
.omn-form input.wpcf7-tel,
.omn-form input.wpcf7-email,
.omn-form textarea.wpcf7-textarea {
	display: block;
	width: 100%;
	box-sizing: border-box;
	font-family: var(--omn-font-text);
	line-height: 1.4;
}

.omn-form .wpcf7-not-valid-tip {
	display: block;
	margin-top: 6px;
	font-size: 12px;
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.omn-footer .omn-footer-head {
	font-family: var(--omn-font-text);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	color: var(--omn-navy);
	opacity: 0.55;
	margin: 0 0 16px;
}

.omn-footer .omn-footer-logo img {
	max-width: 300px;
	height: auto;
	display: block;
}

.omn-footer .omn-body p {
	margin: 0;
	line-height: 1.65;
}

/* Bottom bar: separated, baseline-aligned, full width */
.omn-footer .omn-footer-bottom {
	border-top: 1px solid rgba(1, 27, 50, 0.12);
	margin-top: 46px;
	padding-top: 22px;
}

.omn-footer .omn-footer-bottom > .e-con-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
}

.omn-footer .omn-footer-bottom p {
	margin: 0;
	font-size: 13px;
	line-height: 1.4;
	color: rgba(1, 27, 50, 0.7);
}

.omn-footer .omn-footer-bottom .elementor-widget {
	width: auto !important;
	margin: 0 !important;
}

@media (max-width: 767px) {
	.omn-footer .omn-footer-bottom > .e-con-inner {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* Social icons on the light footer */
.omn-social-dark {
	border-left: 0;
	padding-left: 0;
	margin-left: 0;
	gap: 16px;
}

.omn-social-dark a {
	color: var(--omn-navy);
	opacity: 0.65;
}

.omn-social-dark a:hover {
	color: var(--omn-blue);
	opacity: 1;
}

.omn-footer .omn-footer-social {
	align-items: flex-end;
}

@media (max-width: 767px) {
	.omn-footer .omn-footer-social {
		align-items: flex-start;
	}
}

/* ==========================================================================
   Contact form — exact two-up field grid
   Royal's Form Styler writes `width: 50% !important` onto CF7 inputs by
   default. That is now overridden on the widget itself, and belt-and-braces
   here, so each field fills its half of the row completely.
   ========================================================================== */

.omn-form .omn-form-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0 30px;
	margin: 0;
	width: 100%;
}

.omn-form .omn-field {
	flex: 1 1 calc(50% - 15px);
	max-width: 100%;
	min-width: 0;
	display: block;
	margin-bottom: 24px;
}

.omn-form .omn-field-full {
	flex: 1 1 100%;
}

.omn-form .omn-field .wpcf7-form-control-wrap {
	display: block;
	width: 100%;
}

.omn-form input.wpcf7-text,
.omn-form input.wpcf7-tel,
.omn-form input.wpcf7-email,
.omn-form input.wpcf7-number,
.omn-form select.wpcf7-select,
.omn-form textarea.wpcf7-textarea {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box;
	display: block;
}

/* CF7 gives text inputs a size attribute; stop it influencing layout */
.omn-form input[size] {
	width: 100% !important;
}

@media (max-width: 767px) {
	.omn-form .omn-form-row {
		gap: 0;
	}

	.omn-form .omn-field {
		flex: 1 1 100%;
		margin-bottom: 20px;
	}
}

/* ==========================================================================
   Homepage — merged layout
   ========================================================================== */

/* Supporting image beside the Get started form */
.omn-getstarted-img {
	margin-top: 34px;
}

.omn-getstarted-img img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 8px;
	box-shadow: 0 18px 44px rgba(1, 27, 50, 0.18);
}

/* Client artwork already carries its own light background, so the plate only
   needs to frame it rather than paint behind it. */
.omn-why .omn-plate img {
	background-color: transparent;
	border-radius: 4px;
}

/* Products list now carries real product names rather than placeholder text */
.omn-products-list li {
	margin-bottom: 0.16em;
}

@media (max-width: 767px) {
	.omn-getstarted-img {
		margin-top: 26px;
	}
}

/* ==========================================================================
   Inner page components — batch 1
   Structure mirrors the live onemednet.com pages; styling stays in the
   OneMed design system.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Numbered process steps
   -------------------------------------------------------------------------- */

.omn-step-num {
	font-family: var(--omn-font-display);
	font-size: clamp(40px, 4vw, 62px);
	line-height: 1;
	font-weight: 700;
	letter-spacing: -0.03em;
	color: var(--omn-blue);
	margin: 0 0 10px;
}

.omn-steps .omn-step {
	position: relative;
}

.omn-steps .omn-plate img {
	background-color: transparent;
	border-radius: 6px;
}

/* --------------------------------------------------------------------------
   Testimonial band
   -------------------------------------------------------------------------- */

.omn-quoteband {
	text-align: center;
}

.omn-bigquote {
	font-family: var(--omn-font-display);
	font-size: clamp(21px, 2.3vw, 32px);
	line-height: 1.35;
	letter-spacing: -0.02em;
	font-weight: 400;
	color: var(--omn-navy);
	margin: 0;
}

.omn-bigcite {
	font-family: var(--omn-font-text);
	font-size: 15px;
	line-height: 1.45;
	color: rgba(1, 27, 50, 0.68);
	margin: 0;
}

.omn-quote-logo img {
	max-width: 190px;
	height: auto;
	margin-top: 26px;
}

/* --------------------------------------------------------------------------
   Leadership grid
   -------------------------------------------------------------------------- */

.omn-teamband .omn-team-card img {
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 8px;
	background-color: #0a2a46;
}

.omn-teamband .omn-team-name {
	font-family: var(--omn-font-text);
	font-size: 16px;
	font-weight: 600;
	color: var(--omn-on-dark);
	margin: 14px 0 2px;
}

.omn-teamband .omn-team-role {
	font-family: var(--omn-font-text);
	font-size: 14px;
	line-height: 1.4;
	color: var(--omn-on-dark-mute);
	margin: 0;
}

/* --------------------------------------------------------------------------
   Accordion
   -------------------------------------------------------------------------- */

.omn-accordion .elementor-accordion-item {
	border: 0 !important;
	border-bottom: 1px solid rgba(1, 27, 50, 0.14) !important;
}

.omn-accordion .elementor-tab-title {
	background-color: transparent !important;
	padding: 22px 0 !important;
}

.omn-accordion .elementor-accordion-title {
	font-family: var(--omn-font-display);
	font-size: clamp(18px, 1.7vw, 23px);
	font-weight: 500;
	letter-spacing: -0.015em;
	color: var(--omn-navy);
}

.omn-accordion .elementor-tab-content {
	border: 0 !important;
	padding: 0 0 24px !important;
	font-family: var(--omn-font-text);
	font-size: 16px;
	line-height: 1.55;
	color: var(--omn-navy);
}

.omn-accordion .elementor-accordion-icon {
	color: var(--omn-blue);
}

/* --------------------------------------------------------------------------
   Product card grid
   -------------------------------------------------------------------------- */

.omn-prodgrid .omn-prod-card {
	background-color: var(--omn-navy);
	border-radius: 12px;
	padding: 34px 30px;
	display: flex;
	flex-direction: column;
	transition: transform 0.45s var(--omn-ease), box-shadow 0.45s var(--omn-ease);
}

.omn-prodgrid .omn-prod-card:hover {
	transform: translateY(-7px);
	box-shadow: 0 24px 56px rgba(1, 27, 50, 0.28);
}

.omn-prodgrid .omn-card-dot {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background-color: var(--omn-blue);
	display: block;
	margin-bottom: 22px;
}

.omn-prodgrid .omn-prod-title {
	font-family: var(--omn-font-display);
	font-size: 22px;
	font-weight: 500;
	letter-spacing: -0.015em;
	color: var(--omn-white);
	margin: 0 0 12px;
}

.omn-prodgrid .omn-prod-text p {
	font-family: var(--omn-font-text);
	font-size: 15px;
	line-height: 1.5;
	color: var(--omn-on-dark-mute);
	margin: 0 0 18px;
	flex: 1 1 auto;
}

.omn-prodgrid .omn-btn-text .elementor-button {
	color: #6FC0FF !important;
}

@media (max-width: 1024px) {
	.omn-prodgrid .omn-prod-card {
		padding: 26px 24px;
	}

	.omn-teamband .omn-team-card {
		flex-basis: 45% !important;
	}
}

@media (max-width: 767px) {
	.omn-step-num {
		font-size: 38px;
	}

	.omn-teamband .omn-team-card {
		flex-basis: 100% !important;
	}
}
