/* 
Theme Name:		 Pixelon Child
Theme URI:		 https://themes.rometheme.net/pixelon/
Description:	 Pixelon Child is a child theme of Pixelon, customize your Pixelon theme within this theme child
Author:			 Rometheme
Author URI:		 https://rometheme.net/
Template:		 pixelon
Version:		 2.20.1
Text Domain:	 pixelon
*/


/*
    Add your custom styles here
*/

/* ── Global resets for droi custom layout ─────────────────────────────── */
body {
	background: #0d0d0d;
	margin: 0;
	padding: 0;
}

#wrap {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.droi-main {
	flex: 1;
	width: 100%;
	max-width: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Hide parent theme page title/thumbnail wrappers when using droi shortcodes */
.droi-main .page-header,
.droi-main .page-thumbnail,
.droi-main .single-post-content > .page-header {
	display: none;
}

/* Remove container constraints from inner article wrapper */
.droi-main .single-post-content.entry {
	padding: 0;
	margin: 0;
	max-width: none;
}

/* The HTML hidden attribute must always win over a component's display rule
   (e.g. .sp-form__success { display:flex } on the pre-submit success box). */
[hidden] { display: none !important; }

/* ── Homepage FAQ section: white background ───────────────────────────────
   The section is an Elementor container holding the RomeTheme accordion.
   Matched structurally (a container whose child holds the accordion) so it
   still works if Elementor regenerates its element IDs. */
.e-con:has(> .e-con-inner > .elementor-widget-rkit-accordion),
.elementor-element.elementor-element-15c417d5 {
	background-color: #ffffff !important;
}
.e-con:has(> .e-con-inner > .elementor-widget-rkit-accordion) .elementor-heading-title {
	color: #111 !important;
}
.e-con:has(> .e-con-inner > .elementor-widget-rkit-accordion) .elementor-widget-text-editor,
.e-con:has(> .e-con-inner > .elementor-widget-rkit-accordion) .elementor-widget-text-editor p {
	color: #555 !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   Unified page header — the "About" hero style, used on every page except
   the individual service pages: dark band, orange eyebrow, large white
   headline with an italic orange accent, white lead, stats in a bordered
   card row. Prefixed .droi-main so it beats each page's own hero rules.
   ═══════════════════════════════════════════════════════════════════════ */

/* Parent theme puts a bottom margin on every <section>; on our full-width
   band layout it shows the dark body colour between sections as black bars. */
.droi-main section { margin: 0 !important; }

.droi-main :is(.ab-hero,.si-hero,.cl-hero,.ow-hero,.ip-hero,.hp-hero,.car-hero,.blf-hero,.prv-hero,.ct-hero) {
	background: #0d0d0d;
	padding: 100px 0 80px;
	text-align: center;
	border-bottom: 0;
	color: #fff;
}

/* eyebrow */
.droi-main :is(.ab-hero__eyebrow,.si-hero__eyebrow,.cl-hero__eyebrow,.ow-hero__eyebrow,.ip-hero__eyebrow,.car-hero__eyebrow,.blf-hero__label,.prv-hero__eyebrow,.ct-hero__eyebrow) {
	display: block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #ed3d0e;
	margin: 0 0 20px;
}

/* headline */
.droi-main :is(.ab-hero__h1,.si-hero__h1,.cl-hero__h1,.ow-hero__h1,.ip-hero__h1,.hp-hero__h1,.car-hero__h1,.blf-hero__h1,.prv-hero__h1,.ct-hero__h1) {
	font-size: clamp(44px, 7vw, 80px) !important;
	font-weight: 900 !important;
	line-height: 1.05 !important;
	letter-spacing: -.03em !important;
	color: #fff !important;
	margin: 0 auto 24px !important;
	text-transform: none !important;
	max-width: 100%;
}
.droi-main :is(.ab-hero__h1,.si-hero__h1,.cl-hero__h1,.ow-hero__h1,.ip-hero__h1,.car-hero__h1,.blf-hero__h1,.ct-hero__h1) em {
	font-style: italic;
	color: #ed3d0e !important;
}
.droi-main .hp-hero__dot,
.droi-main .sp-hero__dot { color: #ed3d0e; }

/* lead paragraph */
.droi-main :is(.ab-hero__lead,.si-hero__lead,.cl-hero__lead,.ow-hero__lead,.ip-hero__lead,.hp-hero__lead,.car-hero__lead,.blf-hero__lead,.prv-hero__meta,.ct-hero__lead) {
	font-size: 18px;
	line-height: 1.7;
	color: #fff !important;
	max-width: 640px;
	margin: 0 auto !important;
}

/* breadcrumbs (industries, hubs) */
.droi-main :is(.ip-hero__breadcrumb,.hp-hero__breadcrumb) {
	justify-content: center;
	margin-bottom: 24px;
}
.droi-main .hp-hero__content { max-width: 820px; margin: 0 auto; }

/* stats row as a bordered card */
.droi-main :is(.ab-hero__stats,.si-hero__counts,.cl-hero__stats,.ow-hero__stats,.ct-hero__cards) {
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	gap: 0;
	border: 1px solid rgba(255,255,255,.07);
	border-radius: 14px;
	overflow: hidden;
	max-width: 760px;
	margin: 56px auto 0;
	padding: 0;
}
.droi-main :is(.ab-hero__stats,.si-hero__counts,.cl-hero__stats,.ow-hero__stats,.ct-hero__cards) > * {
	flex: 1;
	padding: 32px 24px;
	border-right: 1px solid rgba(255,255,255,.07);
	background: #111;
	text-align: center;
	margin: 0;
}
.droi-main :is(.ab-hero__stats,.si-hero__counts,.cl-hero__stats,.ow-hero__stats,.ct-hero__cards) > *:last-child { border-right: 0; }
.droi-main :is(.si-hero__count-val,.cl-hero__stat-val,.ow-hero__stat-val,.ab-stat__val) {
	font-size: clamp(22px, 3vw, 32px);
	font-weight: 900;
	color: #fff;
	letter-spacing: -.02em;
	line-height: 1;
	margin-bottom: 8px;
}
.droi-main :is(.si-hero__count-val,.cl-hero__stat-val,.ow-hero__stat-val,.ab-stat__val) span { color: #ed3d0e; }
.droi-main :is(.si-hero__count-label,.cl-hero__stat-label,.ow-hero__stat-label,.ab-stat__label) {
	font-size: 12px;
	color: rgba(255,255,255,.55);
	line-height: 1.4;
	margin-top: 0;
}

@media (max-width: 768px) {
	.droi-main :is(.ab-hero,.si-hero,.cl-hero,.ow-hero,.ip-hero,.hp-hero,.car-hero,.blf-hero,.prv-hero,.ct-hero) { padding: 72px 0 56px; }
	.droi-main :is(.ab-hero__stats,.si-hero__counts,.cl-hero__stats,.ow-hero__stats,.ct-hero__cards) {
		flex-direction: column;
		border-radius: 12px;
	}
	.droi-main :is(.ab-hero__stats,.si-hero__counts,.cl-hero__stats,.ow-hero__stats,.ct-hero__cards) > * {
		border-right: 0;
		border-bottom: 1px solid rgba(255,255,255,.07);
	}
	.droi-main :is(.ab-hero__stats,.si-hero__counts,.cl-hero__stats,.ow-hero__stats,.ct-hero__cards) > *:last-child { border-bottom: 0; }
}

/* reCAPTCHA v3: hide the floating badge (it sat under the dark-mode and back-to-top buttons);
   Google's required notice is shown under each form instead (droi_recaptcha_notice()). */
.grecaptcha-badge { visibility: hidden !important; }
.droi-rc-note { margin: 12px 0 0; font-size: 11px !important; max-width: 100%; overflow-wrap: anywhere; line-height: 1.5; opacity: .65; color: inherit; }
.droi-rc-note a { color: inherit !important; font-size: inherit !important; font-weight: inherit !important; line-height: inherit !important; letter-spacing: inherit !important; text-transform: none !important; text-decoration: underline; text-underline-offset: 2px; }