/*
 * CO Elite Investigations pilot - page-scoped styling (loads ONLY on page 106).
 * REVISION 2.2 (2026-07-22): paired-card alignment, lighter heading rhythm,
 * and a centered photo-backed contextual CTA.
 *
 * Non-destructive: enqueued by a guarded is_page(106) hook in the child theme,
 * so nothing here affects the site home, the GlassWest pilot, or any approved
 * reference page. Revertable on its own. Cache-busted by filemtime().
 *
 * Native Divi 5 blocks carry the structure; this file loads Sora/Inter, re-points
 * the Fluent --client-* tokens to the CO Elite palette, isolates the sandbox
 * chrome, and adds the layout polish: the photographic hero overlay, overlapping
 * trust cards, the six-card service grid with a contrasting nav card, the
 * image-led Why-Clients-Choose composition, asymmetric image bands, the
 * new/returning split, the form-plus-image row, and the sticky header. No
 * entrance/scroll animation (studio rule 2); only micro hover feedback.
 *
 * Master grid (studio rule 12): sections 100%/100%; standard rows 95% width /
 * 1450px max / centered (block generator row() default); gutter 2.
 */

@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;600;700;800&family=Inter:wght@400;500;600;700&display=swap');

/* 1. CO Elite palette re-point for the Fluent contact form. Monochrome
 *    blue/silver (binding decision 3): no warm amber. Loads only on this page. */
body {
	--client-primary:   #006699;
	--client-secondary: #10384D;
	--client-accent:    #006EA6;
	--client-success:   #006699;
	--client-text:      #0B2531;
	--client-muted:     #8F9599;
	--client-bg:        #ffffff;
	--client-error:     #b3261e;
	--client-font-heading: 'Sora', system-ui, sans-serif;
	--client-font-body:    'Inter', system-ui, sans-serif;
}

body.page-id-106 .et_pb_text p,
body.page-id-106 .et_pb_text li,
body.page-id-106 .et_pb_text a { font-family: 'Inter', system-ui, sans-serif; }
body.page-id-106 h1, body.page-id-106 h2,
body.page-id-106 h3, body.page-id-106 h4 { font-family: 'Sora', system-ui, sans-serif; }

/* 2. Isolate the pilot: hide the global sandbox chrome on this page only. */
#main-header,
#top-header,
.et-l--footer { display: none !important; }

/* 3. Sticky in-page CO Elite header. */
body.page-id-106 .elite-header.et_pb_section {
	position: -webkit-sticky !important; position: sticky !important;
	top: 0; z-index: 10000; width: 100%;
	box-shadow: 0 1px 0 rgba(16, 56, 77, 0.4);
}
/* Keep the sticky header below WordPress preview chrome while logged in. */
body.admin-bar.page-id-106 .elite-header.et_pb_section { top: 32px; }
.elite-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; width: 100%; }
.elite-header-right { display: flex; align-items: center; gap: 1.5rem; }
.elite-logo { display: inline-flex; }
.elite-logo img { height: 68px; max-height: 68px; width: auto; display: block; }
.elite-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 1.4rem; }
.elite-nav a {
	color: rgba(255,255,255,0.86); text-decoration: none;
	font: 600 0.95rem/1 'Inter', sans-serif; letter-spacing: .01em; transition: color .15s ease;
}
.elite-nav a:hover { color: #ffffff; }
.elite-login-btn {
	background: var(--gcid-elite-blue-600, #006EA6); color: #ffffff !important;
	padding: .58rem 1.15rem; border-radius: 6px; font: 700 0.95rem/1 'Inter', sans-serif;
	text-decoration: none; white-space: nowrap; transition: background-color .15s ease;
}
.elite-login-btn:hover { background: var(--gcid-elite-blue-700, #006699); color: #ffffff !important; }

/* 4. Preset-button CTAs (used outside the hero): borderless blue fills. */
.elite-cta .et_pb_button, .elite-cta.et_pb_button, a.et_pb_button.elite-cta {
	border: 0 !important; border-width: 0 !important; box-shadow: none !important;
	color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; transition: background-color .15s ease;
}
.elite-cta--accent .et_pb_button, .elite-cta--accent.et_pb_button { background-color: var(--gcid-elite-blue-600, #006EA6) !important; }
.elite-cta--accent .et_pb_button:hover, .elite-cta--accent.et_pb_button:hover { background-color: var(--gcid-elite-blue-700, #006699) !important; }
.elite-cta--primary .et_pb_button, .elite-cta--primary.et_pb_button { background-color: var(--gcid-elite-blue-700, #006699) !important; }
.elite-cta--primary .et_pb_button:hover, .elite-cta--primary.et_pb_button:hover { background-color: var(--gcid-elite-navy-800, #185272) !important; }

/* 5. HTML button CTAs (hero actions + service nav-card link): shared look. */
.elite-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
	padding: .8rem 1.5rem; border-radius: 6px; font: 700 1rem/1 'Inter', sans-serif;
	text-decoration: none; white-space: nowrap; transition: background-color .15s ease, border-color .15s ease;
}
.elite-btn--accent { background: var(--gcid-elite-blue-600, #006EA6); color: #fff; }
.elite-btn--accent:hover { background: var(--gcid-elite-blue-700, #006699); color: #fff; }
.elite-btn--ghost { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,0.6); }
.elite-btn--ghost:hover { background: rgba(255,255,255,0.12); border-color: #fff; color: #fff; }

/* 6. Eyebrow. */
.elite-eyebrow { text-transform: uppercase; letter-spacing: .18em; font: 700 0.85rem/1.4 'Sora', sans-serif; margin: 0; }

/* 7. Icon language. */
.elite-icon { display: inline-flex; }
.elite-icon svg { display: block; }
.elite-svc-icon { width: 44px; height: 44px; color: var(--gcid-elite-blue-700, #006699); }
.elite-trust-icon { width: 40px; height: 40px; color: var(--gcid-elite-blue-700, #006699); }
.elite-login-motif { width: 74px; height: 74px; color: #8fc6e2; }
.elite-login-motif svg { width: 100%; height: 100%; display: block; }

/* 8. PHOTOGRAPHIC HERO. Background image + navy overlay is set inline (scoped by
 *    #hero) so it is reliable; this only sizes/positions the copy. */
.elite-hero-photo { min-height: 74vh; display: flex; align-items: center; }
.elite-hero-photo.et_pb_section { padding-top: clamp(3rem, 8vh, 7rem); padding-bottom: clamp(3rem, 8vh, 7rem); }
.elite-hero-copy { max-width: 640px; }
.elite-hero-photo h1 { line-height: 1.08; }
.elite-hero-actions { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: .4rem; }

/* 9. TRUST STRIP: elevated white cards with a controlled overlap onto the hero. */
.elite-trust.et_pb_section {
	overflow: visible;
	/* One pixel of padding prevents the row's negative top margin from
	 * collapsing through the section, so the cards visibly cross the actual
	 * hero-to-mist boundary instead of pulling the mist upward with them. */
	padding-top: 1px !important;
}
body.page-id-106 .elite-trust-overlap.et_pb_row {
	position: relative; z-index: 3; margin-top: -88px !important;
}
.elite-trust-cards {
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.1rem; width: 100%;
}
.elite-trust-card {
	display: flex; flex-direction: column; gap: .55rem; align-items: flex-start;
	background: #fff; border: 1px solid #e6eaec; border-radius: 12px; padding: 1.35rem 1.3rem;
	box-shadow: 0 10px 30px rgba(16, 56, 77, 0.14);
}
.elite-trust-card strong { display: block; font: 600 1.02rem/1.3 'Sora', sans-serif; color: var(--gcid-elite-navy-900, #10384D); }
.elite-trust-card span:last-child { display: block; margin-top: .25rem; font-size: .9rem; color: #4a5761; line-height: 1.45; }

/* 10. SERVICES: elevated equal-height cards, six-card 3x2 grid; 6th is a
 *     contrasting navy navigation card. */
.elite-svc-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: clamp(1rem, 2vw, 1.5rem); max-width: 1160px; margin-inline: auto; }
.elite-svc-card {
	flex: 1 1 300px; max-width: 350px; display: flex; flex-direction: column; gap: .7rem;
	background: #fff; border: 1px solid #e6eaec; border-radius: 12px; padding: 1.6rem 1.45rem;
	box-shadow: 0 2px 12px rgba(16, 56, 77, 0.06);
}
.elite-svc-card h3 { margin: 0; font: 600 1.12rem/1.35 'Sora', sans-serif; color: var(--gcid-elite-navy-900, #10384D); }
.elite-svc-card p { margin: 0; color: #34434c; font-size: .95rem; line-height: 1.55; }
.elite-svc-card--nav {
	text-decoration: none; background: var(--gcid-elite-navy-900, #10384D); border-color: var(--gcid-elite-navy-900, #10384D);
	color: #fff; justify-content: space-between;
}
.elite-svc-card--nav h3 { color: #fff; }
.elite-svc-card--nav p { color: rgba(255,255,255,0.82); }
.elite-svc-icon--nav { width: 40px; height: 40px; color: #8fc6e2; }
.elite-svc-more { display: inline-flex; align-items: center; gap: .4rem; margin-top: .3rem; font: 700 .95rem/1 'Inter', sans-serif; color: #8fc6e2; }
.elite-svc-more svg { width: 18px; height: 18px; }
.elite-svc-card--nav:hover { background: var(--gcid-elite-navy-800, #185272); border-color: var(--gcid-elite-navy-800, #185272); }

/* 11. WHY CLIENTS CHOOSE: asymmetric image + differentiator list. */
.elite-why-row { align-items: center; }
.elite-why-img { width: 100%; height: auto; display: block; border-radius: 14px; box-shadow: 0 14px 40px rgba(16, 56, 77, 0.22); }
.elite-why-list { list-style: none; margin: .4rem 0 0; padding: 0; display: flex; flex-direction: column; gap: 1rem; }
.elite-why-item { display: flex; gap: .9rem; align-items: flex-start; }
.elite-why-marker {
	flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; color: #fff;
	background: var(--gcid-elite-blue-600, #006EA6); display: inline-flex; align-items: center; justify-content: center;
}
.elite-why-marker svg { width: 17px; height: 17px; }
.elite-why-item strong { display: block; font: 600 1.02rem/1.35 'Sora', sans-serif; color: var(--gcid-elite-navy-900, #10384D); }
.elite-why-item p { margin: .2rem 0 0; color: #34434c; font-size: .96rem; line-height: 1.5; }

/* 12. CONTEXTUAL CTA BAND: centered hierarchy over an inline, licensed photo
 *     with a strong navy overlay and one clear action. */
.elite-ctabar-section.et_pb_section {
	position: relative; overflow: hidden; min-height: 360px;
	background: #10384d;
}
.elite-ctabar {
	position: relative; z-index: 1; display: flex; flex-direction: column;
	align-items: center; justify-content: center; gap: 1.5rem;
	max-width: 820px; margin-inline: auto; padding: .5rem 0; text-align: center;
}
.elite-ctabar-copy { max-width: 760px; text-align: center; }
.elite-ctabar-eyebrow {
	margin: 0 0 .65rem; color: #8fc6e2; text-transform: uppercase;
	letter-spacing: .18em; font: 700 .78rem/1.4 'Sora', sans-serif;
}
.elite-ctabar h2 {
	margin: 0; color: #fff; font: 600 clamp(1.7rem, 3vw, 2.7rem)/1.18 'Sora', sans-serif;
}
.elite-ctabar-copy > p:last-child {
	max-width: 650px; margin: .9rem auto 0; color: rgba(255,255,255,.84);
	font: 400 1rem/1.65 'Inter', sans-serif;
}
.elite-ctabar-action { position: relative; align-self: center; }
.elite-ctabar-action .elite-btn {
	min-width: 190px; min-height: 52px; box-shadow: 0 10px 24px rgba(5,28,40,.24);
}

/* 13. Surveillance editorial: plain <img> in a code module (reliable). */
.elite-cine-img { width: 100%; height: auto; display: block; border-radius: 12px; box-shadow: 0 10px 30px rgba(16, 56, 77, 0.2); }

/* 14. NEW vs RETURNING split: distinct light vs dark cards, CTAs pinned bottom. */
.elite-split-heading.et_pb_row { margin-bottom: clamp(1.75rem, 3vw, 2.75rem) !important; }
.elite-split-heading h2 { font-weight: 600 !important; }
.elite-split-row { align-items: stretch; }
.elite-split-row .et_pb_column.elite-split-col {
	display: flex; flex-direction: column; height: auto !important; align-self: stretch;
	border-radius: 14px; padding: 1.9rem 1.8rem;
}
.elite-split-new { background: #fff; border: 1px solid #e7ebed; box-shadow: 0 2px 12px rgba(16, 56, 77, 0.06); }
.elite-split-return { background: var(--gcid-elite-navy-900, #10384D); }
.elite-new-motif { color: var(--gcid-elite-blue-700, #006699); }
.elite-split-row h3 { font-weight: 600 !important; }
.elite-split-col .et_pb_button_module_wrapper { margin-top: auto !important; padding-top: .8rem; }
.elite-split-row .elite-cta .et_pb_button { width: 100%; max-width: 300px; text-align: center; }

/* 15. CONTACT form + adjacent professional image. */
.elite-form-row { align-items: stretch; }
.elite-form-imgcol { align-self: stretch; }
.elite-form-photo-wrap {
	position: relative; height: 100%; min-height: 320px; border-radius: 14px; overflow: hidden;
	box-shadow: 0 10px 30px rgba(16, 56, 77, 0.18);
}
/* Navy multiply overlay unifies the warmer legal image with the cool palette. */
.elite-form-photo-wrap::after {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: linear-gradient(180deg, rgba(16,56,77,0.30) 0%, rgba(16,56,77,0.46) 100%);
	mix-blend-mode: multiply;
}
.elite-form-photo {
	width: 100%; height: 100%; min-height: 320px; object-fit: cover; display: block;
	filter: saturate(0.68) brightness(0.97);
}
.elite-contact .fluentform { max-width: 620px; }
.elite-contact .frm-fluent-form > fieldset {
	display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: .9rem; width: 100%;
}
.elite-contact .ff-el-group { width: 100% !important; max-width: none !important; margin-bottom: .7rem; }
.elite-contact .elite-field-full,
.elite-contact .ff-el-group:has([name="name"]),
.elite-contact .ff-el-group:has([name="best_time"]),
.elite-contact .ff_submit_btn_wrapper { grid-column: 1 / -1 !important; }
.elite-contact .elite-field-phone,
.elite-contact .elite-field-email { grid-column: span 1 !important; }
.elite-contact .ff-el-form-control { padding: .55rem .75rem; min-height: 44px; border-radius: 3px; font-size: 16px; }
.elite-contact .ff-btn-submit { width: 100%; min-height: 46px; }

/* 16. Footer. */
.elite-foot-col a { color: rgba(255,255,255,0.85); text-decoration: none; }
.elite-foot-col a:hover { color: #ffffff; }
.elite-footer-bottom { margin-top: 1.6rem; padding-top: 1.2rem; border-top: 1px solid rgba(255,255,255,0.15); }

/* 17. Responsive. */
@media (max-width: 1080px) {
	.elite-trust-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	body.page-id-106 .elite-trust-overlap.et_pb_row { margin-top: -68px !important; }
	.elite-header-right { gap: 1rem; }
	.elite-nav { gap: 1rem; }
	.elite-nav a { font-size: .88rem; }
	.elite-logo img { height: 58px; max-height: 58px; }
}
@media (max-width: 782px) {
	body.admin-bar.page-id-106 .elite-header.et_pb_section { top: 46px; }
	.elite-nav { display: none !important; }   /* keep logo + Client Login visible */
	body.page-id-106 .et_pb_row.et_flex_row { flex-wrap: wrap !important; }
	body.page-id-106 .et_pb_row.et_flex_row > .et_pb_column {
		width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important;
	}
	body.page-id-106 .elite-trust-overlap.et_pb_row { margin-top: -54px !important; }
	.elite-logo img { height: 52px; max-height: 52px; }
	.elite-ctabar { gap: 1.35rem; }
	.elite-hero-photo { min-height: 0; }
	.elite-form-photo { min-height: 240px; }
	.elite-contact .frm-fluent-form > fieldset { grid-template-columns: 1fr; }
	.elite-contact .ff-el-group,
	.elite-contact .ff_submit_btn_wrapper { grid-column: 1 !important; }
}
@media (max-width: 560px) {
	.elite-trust-cards { grid-template-columns: 1fr; }
	.elite-hero-actions .elite-btn { flex: 1 1 auto; }
	.elite-header-inner { gap: .75rem; }
	.elite-header-right { gap: .5rem; }
	.elite-logo img { height: 44px; max-height: 44px; max-width: 190px; }
	.elite-login-btn { padding: .55rem .8rem; font-size: .84rem; }
	body.page-id-106 .elite-trust-overlap.et_pb_row { margin-top: -44px !important; }
}
@media (max-width: 600px) {
	/* WordPress changes its admin bar to absolute positioning at this width. */
	body.admin-bar.page-id-106 .elite-header.et_pb_section { top: 0; }
}
