/* =====================================================================
   Bugbee Law — Elementor adapter
   Loads after elementor-frontend. Neutralises Elementor's generic widget
   spacing/alignment so the design's own values (set as controls or
   per-element Custom CSS) are the only thing that affects layout.
   ===================================================================== */
html { -webkit-text-size-adjust: 100%; }
body { font-family: var(--bb-font-body); color: #0A1730; background: #fff; margin: 0; }
img { max-width: 100%; height: auto; }

/* Widgets are plain flex/grid items: no bottom margin, no forced centring */
.e-con .elementor-widget, .e-con .elementor-widget.elementor-widget { margin-block-end: 0; }
.elementor-widget-image { text-align: initial; }
.elementor-widget-image .elementor-widget-container { line-height: 0; }
.elementor-widget-text-editor p { margin: 0; }
.elementor-widget-text-editor p + p { margin-top: var(--bb-p-gap, 0); }
.elementor-widget-heading .elementor-heading-title { margin: 0; }
.elementor-heading-title { padding: 0; line-height: inherit; }

/* Containers: no transitions on background/border (the design animates transform/shadow only where stated) */
.e-con { --background-transition: 0s; --border-transition: 0s; }

/* Entrance animations: 0.8s, signature easing, 28px travel (Elementor's fadeInUp travels 100%) */
.elementor-element.animated, .elementor-widget.animated { animation-duration: .8s; animation-timing-function: cubic-bezier(.2,.7,.2,1); animation-fill-mode: both; }
@keyframes bbFadeInUp { from { opacity: 0; transform: translate3d(0,28px,0); } to { opacity: 1; transform: none; } }
@keyframes bbFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes bbRevealImg { from { opacity: 0; transform: scale(1.04); } to { opacity: 1; transform: none; } }
.animated.fadeInUp { animation-name: bbFadeInUp; }
.animated.fadeIn { animation-name: bbFadeIn; }
.bb-reveal-img.animated { animation-name: bbRevealImg; animation-duration: 1.2s; }
@media (prefers-reduced-motion: reduce) { .elementor-invisible { visibility: visible !important; } .animated { animation: none !important; } }

/* Focus */
a:focus-visible, button:focus-visible { outline: 2px solid #8A6A2A; outline-offset: 3px; }

/* Intrinsic sizing: the design's flex items keep the browser default min-width:auto (a grid of 250px tiles
   cannot shrink below its min-content width, so it wraps under the image card at tablet widths).
   Elementor forces min-width:0 on containers and widgets, which changes where rows wrap. */
.e-con { min-width: auto; }
.e-con .elementor-widget { min-width: auto; }

/* ---------- Header: sticky wrapper reserves 128px (desktop) / 69px (mobile) so content never jumps; inner bars shrink */
.elementor-location-header { position: sticky; top: 0; z-index: 50; }
.bb-header--desktop { height: 128px; pointer-events: none; }
.bb-header--desktop > * { pointer-events: auto; }
.bb-header--mobile { height: 69px; }
.bb-mbar { box-shadow: none; transition: box-shadow .3s ease; }
body.bb-scrolled .bb-mbar, body.bb-drawer-open .bb-mbar { box-shadow: 0 10px 30px -18px rgba(10, 23, 48,.35); }
body.bb-drawer-open { overflow: hidden; }
/* nav active section (set by theme body classes) — order: DUI, Criminal, Driver's License, Case Results, About Chris, Resources, Contact */
body.bb-section-dui .bb-nav .e-n-menu-item:nth-child(1) > .e-n-menu-title,
body.bb-section-crim .bb-nav .e-n-menu-item:nth-child(2) > .e-n-menu-title,
body.bb-section-dl .bb-nav .e-n-menu-item:nth-child(3) > .e-n-menu-title,
body.bb-section-results .bb-nav .e-n-menu-item:nth-child(4) > .e-n-menu-title,
body.bb-section-attorney .bb-nav .e-n-menu-item:nth-child(5) > .e-n-menu-title,
body.bb-section-blog .bb-nav .e-n-menu-item:nth-child(6) > .e-n-menu-title,
body.bb-section-contact .bb-nav .e-n-menu-item:nth-child(7) > .e-n-menu-title { color: #8A6A2A; }
body.bb-section-dui .bb-nav .e-n-menu-item:nth-child(1) > .e-n-menu-title::after,
body.bb-section-crim .bb-nav .e-n-menu-item:nth-child(2) > .e-n-menu-title::after,
body.bb-section-dl .bb-nav .e-n-menu-item:nth-child(3) > .e-n-menu-title::after,
body.bb-section-results .bb-nav .e-n-menu-item:nth-child(4) > .e-n-menu-title::after,
body.bb-section-attorney .bb-nav .e-n-menu-item:nth-child(5) > .e-n-menu-title::after,
body.bb-section-blog .bb-nav .e-n-menu-item:nth-child(6) > .e-n-menu-title::after,
body.bb-section-contact .bb-nav .e-n-menu-item:nth-child(7) > .e-n-menu-title::after { background: #C9A04F; }
/* dropdown link current state */
.bb-mega-panel a.bb-current, .bb-mega-panel .current-page { background: #F3EDE0 !important; color: #8A6A2A !important; font-weight: 600; }

/* ---------- Hero photo motion (design: Ken Burns 22s alternate + 28% scroll parallax via interactions.js) */
@keyframes bb-kenburns-img { from { transform: scale(1.02) translate(0,0); } to { transform: scale(1.1) translate(-1.6%,-1.2%); } }
.bb-hero-media img { animation: bb-kenburns-img 22s ease-in-out infinite alternate; will-change: transform; }
.bb-hero-media { will-change: translate; }
@media (prefers-reduced-motion: reduce) { .bb-hero-media img { animation: none; } }
/* current page inside dropdown / drawer */
.bb-mega-panel a.bb-current { background: #F3EDE0 !important; color: #8A6A2A !important; }
.bb-mega-panel a.bb-current .elementor-icon, .bb-mega-panel a.bb-current .e-con { background: #C9A04F !important; color: #0A1730 !important; }
.bb-drawer-wrap a.bb-current { color: #8A6A2A !important; font-weight: 600; }
.bb-drawer-wrap .e-con.e-grid > a.bb-current, .bb-drawer-wrap a.bb-current.e-con { background: #C9A04F !important; color: #0A1730 !important; }
.bb-drawer-wrap a.bb-current.e-con * { color: #fff !important; }
.bb-drawer-wrap a.bb-current > .elementor-widget-text-editor + .e-con { background: #C9A04F !important; }

/* Elementor min-height control must beat bugbee.css .bb-hero / .bb-hero--home defaults */
.e-con.bb-hero { min-height: var(--min-height, 0px); }

/* The handoff hero pseudo-layers (pattern ::before, mobile scrim ::after z-index 2) duplicate the real overlay
   containers in the Elementor build and the ::after paints OVER the hero text — disable both. */
.e-con.bb-hero::before, .e-con.bb-hero::after { content: none !important; display: none !important; }

/* ---------- Mobile/tablet call bar: Elementor buttons are inline-flex — make each fill its half of the grid */
.bb-callbar .elementor-widget-button { min-width: 0; }
.bb-callbar .elementor-button-wrapper { display: block; }
.bb-callbar .elementor-button { display: flex !important; width: 100%; justify-content: center; padding-inline: 10px; white-space: nowrap; }
/* The call bar's 70px of clearance belongs to the (navy) footer, not a white strip under it */
@media (max-width:1299px) {
	body { padding-bottom: 0 !important; }
	/* 0.4.2: bottom call bar retired (header carries Call/Text) — no reserved space */
}

/* ---------- Phones + tablets (0.4.7): heroes that feature Chris show him as a photo band above the copy.
   (Desktop keeps the photo on the right behind the gradient; narrower, that crop sits behind the copy.) */
@media (max-width:1024px) {
	/* 0.4.7: the band starts BELOW the header so his head is never under the logo/Call bar */
	.e-con.bb-hero:has(.bb-hero-media img[src*="/chris-"]) { --bb-photo-h: 320px; --bb-hdr: 132px; }
	/* gradient/texture overlay layers sized for the side-by-side layout */
	.e-con.bb-hero:has(.bb-hero-media img[src*="/chris-"]) > .e-con:not(:has(.bb-hero-media)):not(:last-child) { display: none !important; }
	.e-con.bb-hero:has(.bb-hero-media img[src*="/chris-"]) > .e-con:has(.bb-hero-media) { top: var(--bb-hdr) !important; left: 0 !important; right: 0 !important; bottom: auto !important; width: 100% !important; height: var(--bb-photo-h) !important; overflow: hidden; }
	.e-con.bb-hero:has(.bb-hero-media img[src*="/chris-"]) > .e-con:has(.bb-hero-media)::after { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
		background: linear-gradient(180deg, rgba(10, 23, 48,.05) 0%, rgba(10, 23, 48,.18) 45%, rgba(10, 23, 48,.75) 80%, #0A1730 100%); }
	.e-con.bb-hero:has(.bb-hero-media img[src*="/chris-"]) .bb-hero-media { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; translate: none !important; }
	.e-con.bb-hero .bb-hero-media img[src*="/chris-"] { position: absolute !important; inset: 0 !important; left: 0 !important; right: auto !important; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover !important; object-position: var(--bb-face, 50% 22%) !important; }
	.e-con.bb-hero:has(.bb-hero-media img[src*="/chris-"]) > .e-con:last-child { padding-top: calc(var(--bb-photo-h) + var(--bb-hdr) - 130px) !important; }
	.e-con.bb-hero:has(.bb-hero-media img[src*="/chris-"]) > .e-con:last-child { position: relative !important; z-index: 5 !important; }
	/* where his face sits in each photo */
	.bb-hero-media img[src*="/chris-brick"] { --bb-face: 42% 26%; }
	.bb-hero-media img[src*="/chris-headshot"] { --bb-face: 66% 30%; }
	.bb-hero-media img[src*="/chris-client"] { --bb-face: 42% 18%; }
	.bb-hero-media img[src*="/chris-seated"] { --bb-face: 60% 22%; }
	.bb-hero-media img[src*="/chris-handshake"] { --bb-face: 62% 14%; }
	.bb-hero-media img[src*="/chris-family"] { --bb-face: 50% 20%; }
	/* 30 Oct 2026: client's own photo shoot */
	.bb-hero-media img[src*="/chris-bugbee-client-consultation"] { --bb-face: 66% 24%; }
	.bb-hero-media img[src*="/chris-bugbee-client-meeting"] { --bb-face: 68% 20%; }
}
@media (min-width:768px) and (max-width:1024px) {
	.e-con.bb-hero:has(.bb-hero-media img[src*="/chris-"]) { --bb-photo-h: 460px; }
}

/* ---------- Sticky columns that have stacked (set by site.js) scroll with the page */
.bb-unstuck { position: relative !important; top: auto !important; }

/* ---------- Hero eyebrow ("SPOKANE, WA · …") stays on one line on phones: text sized to the viewport */
@media (max-width:767px) {
	.e-con.bb-eyebrow { flex-wrap: nowrap !important; gap: 12px !important; align-items: center !important; }
	.e-con.bb-eyebrow > .e-con:first-child { width: 28px !important; flex: 0 0 28px !important; }
	.e-con.bb-eyebrow .elementor-widget-text-editor { min-width: 0 !important; flex: 1 1 auto !important; }
	.e-con.bb-eyebrow .elementor-widget-text-editor, .e-con.bb-eyebrow .elementor-widget-text-editor p {
		white-space: nowrap !important; font-size: min(13px, calc((100vw - 90px) / 24)) !important; letter-spacing: .1em !important; line-height: 1.4 !important; }
}

/* ---------- Footer (phones): Privacy Policy right after the disclaimer, compact bottom */
@media (max-width:767px) {
	.e-con.bb-foot-bottom { padding-bottom: 20px !important; }
	.e-con.bb-foot-legal { flex-direction: column !important; align-items: flex-start !important; gap: 14px !important; }
	.bb-foot-legal .bb-foot-privacy { order: -1; }
	.bb-foot-legal .bb-foot-sep { display: none !important; }
}

/* ---------- Mobile/tablet menu tray: stacked pill rows, compact type, clear close (X) */
body.bb-drawer-open .bb-menu-toggle .elementor-button { background: #0A1730 !important; border-color: #0A1730 !important; color: #fff !important; }
body.bb-drawer-open .bb-menu-toggle .elementor-button-icon i, body.bb-drawer-open .bb-menu-toggle .elementor-button-icon { color: #fff !important; }
body.bb-drawer-open .bb-menu-toggle .elementor-button-icon i::before { content: "\e1b2" !important; } /* lucide x */
.bb-drawer-wrap { background: #fff; }
.bb-drawer-wrap .e-con.bb-drawer { padding: 14px 16px 28px !important; gap: 8px !important; }
.bb-drawer-wrap .e-n-accordion { display: flex !important; flex-direction: column !important; gap: 8px !important; }
.bb-drawer-wrap .e-n-accordion-item { border: 0 !important; border-radius: 16px !important; background: #F8F5EE !important; overflow: hidden; margin: 0 !important; }
.bb-drawer-wrap .e-n-accordion-item-title { min-height: 56px; padding: 12px 12px 12px 18px !important; border: 0 !important; background: none !important; display: flex !important; align-items: center !important; justify-content: space-between !important; }
.bb-drawer-wrap .e-n-accordion-item-title-text { font: 600 17px/1.3 var(--bb-font-body) !important; letter-spacing: 0 !important; color: #0A1730 !important; text-transform: none !important; }
.bb-drawer-wrap .e-n-accordion-item[open] .e-n-accordion-item-title-text { color: #8A6A2A !important; }
.bb-drawer-wrap .e-n-accordion-item-title-icon { width: 32px !important; height: 32px !important; border-radius: 50% !important; background: #fff !important; display: flex !important; align-items: center !important; justify-content: center !important; flex: none !important; font-size: 15px !important; color: #8A6A2A !important; }
.bb-drawer-wrap .e-n-accordion-item-title-icon i, .bb-drawer-wrap .e-n-accordion-item-title-icon svg { font-size: 15px !important; width: 15px; height: 15px; color: inherit !important; fill: currentColor; }
.bb-drawer-wrap .e-n-accordion-item[open] .e-n-accordion-item-title-icon { background: #C9A04F !important; color: #0A1730 !important; }
/* dropdown contents: one stacked column of pill links (no desktop two-column grid, no outline box) */
.bb-drawer-wrap .e-n-accordion-item > .e-con { display: flex !important; flex-direction: column !important; grid-template-columns: none !important; gap: 6px !important; padding: 0 10px 12px !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; background: none !important; }
.bb-drawer-wrap .e-n-accordion-item > .e-con > .elementor-widget { width: 100% !important; max-width: 100% !important; margin: 0 !important; }
.bb-drawer-wrap .e-n-accordion-item > .e-con .elementor-button-wrapper { display: block !important; }
.bb-drawer-wrap .e-n-accordion-item > .e-con .elementor-button { display: flex !important; align-items: center !important; width: 100% !important; min-height: 48px; padding: 10px 14px !important; gap: 12px; background: #fff !important; border: 1px solid #E6DECB !important; border-radius: 12px !important; color: #0A1730 !important; font: 500 15px/1.3 var(--bb-font-body) !important; text-align: left !important; box-shadow: none !important; }
.bb-drawer-wrap .e-n-accordion-item > .e-con .elementor-button-content-wrapper { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: flex-start !important; gap: 12px !important; width: 100% !important; }
.bb-drawer-wrap .e-n-accordion-item > .e-con .elementor-button-text { flex: 1 1 auto; text-align: left !important; white-space: normal; }
.bb-drawer-wrap .e-n-accordion-item > .e-con .elementor-button-icon { order: 0; width: 30px !important; height: 30px !important; border-radius: 50%; background: #F3EDE0; color: #8A6A2A !important; display: flex !important; align-items: center; justify-content: center; flex: none !important; margin: 0 !important; font-size: 15px; }
.bb-drawer-wrap .e-n-accordion-item > .e-con .elementor-button-icon i { font-size: 15px !important; color: inherit !important; }
/* arrow-only items (criminal group): arrow sits at the end */
.bb-drawer-wrap .e-n-accordion-item > .e-con .elementor-button-icon:has(i[class*="arrow"]) { order: 2; background: none; width: 28px !important; height: 28px !important; min-width: 28px; aspect-ratio: 1; border-radius: 50% !important; }
.bb-drawer-wrap .e-n-accordion-item > .e-con a.bb-current { background: #F3EDE0 !important; border-color: #D9CCAE !important; color: #8A6A2A !important; font-weight: 600 !important; }
.bb-drawer-wrap .e-n-accordion-item > .e-con a.bb-current .elementor-button-icon { background: #C9A04F !important; color: #0A1730 !important; }
/* top-level links as pill rows */
.bb-drawer-wrap .bb-drawer > a.e-con { min-height: 56px; padding: 0 16px 0 18px !important; border: 0 !important; border-radius: 16px !important; background: #F8F5EE !important; align-items: center !important; justify-content: space-between !important; }
.bb-drawer-wrap .bb-drawer > a.e-con p, .bb-drawer-wrap .bb-drawer > a.e-con .elementor-widget-text-editor { font: 600 17px/1.3 var(--bb-font-body) !important; letter-spacing: 0 !important; color: #0A1730 !important; }
.bb-drawer-wrap .bb-drawer > a.e-con.bb-current { background: #C9A04F !important; }
.bb-drawer-wrap .bb-drawer > a.e-con.bb-current p { color: #fff !important; }
/* contact block under the links */
.bb-drawer-wrap .bb-drawer > .e-con:not(a):last-child { margin-top: 10px !important; padding: 18px 4px 0 !important; border-top: 1px solid #E6DECB !important; gap: 14px !important; }

/* ---------- Mobile call bar: Call | Text | Free Consultation */
.bb-callbar { gap: 6px !important; }
.bb-callbar .elementor-button { padding-inline: 6px !important; gap: 6px; }
.bb-callbar .elementor-button-icon { margin: 0 !important; }
/* grade.us review stream in the testimonials card */
.bb-gradeus iframe { min-height: 420px; }
/* Driver's License chips on the homepage wrap instead of scrolling */
.bb-dol-links.e-con { flex-wrap: wrap !important; overflow: visible !important; }

/* ---------- Desktop nav: 7 items fit beside logo + CTA (Elementor adds item margin AND flex gap — keep only one) */
.bb-nav .e-n-menu-heading { gap: 0 !important; }
.bb-nav .e-n-menu-item { margin-inline-end: 14px !important; }
.bb-nav .e-n-menu-item:last-child { margin-inline-end: 0 !important; }
.bb-nav .e-n-menu-title, .bb-nav .e-n-menu-title-text { font-size: 14.5px !important; white-space: nowrap; }
.bb-mainbar [data-id="6f47d4d"] { display: none !important; }
.bb-mainbar [data-id="79aa104"] { padding-inline: 20px !important; }
@media (max-width: 1499px) {
	.bb-nav .e-n-menu-item { margin-inline-end: 13px !important; }
	.bb-nav .e-n-menu-title, .bb-nav .e-n-menu-title-text { font-size: 14px !important; }
}
@media (max-width: 1379px) {
	.bb-nav .e-n-menu-item { margin-inline-end: 10px !important; }
	.bb-nav .e-n-menu-title, .bb-nav .e-n-menu-title-text { font-size: 13.5px !important; }
	.bb-logo [data-id="6a9b56a"] .elementor-widget-text-editor:first-child p { font-size: 17px !important; }
}

/* Elementor mega-menu draws a 2px black divider (border-left) on each title's ::after — it showed as small marks under the nav */
.bb-nav .e-n-menu-title::after { border: 0 !important; }

/* 0.4.1 — Navy & Gold: Elementor kit link colour was still blue (kit setting, not a global) */
body.elementor-kit-6 a { color: #8A6A2A; }
body.elementor-kit-6 a:hover { color: #6F541F; }

/* In-text internal links (SEO round, 23 Oct 2026): keep the surrounding text colour (works on light and navy
   sections), underline marks them as links. */
.elementor-widget-text-editor a.bb-inlink{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em;text-decoration-color:color-mix(in srgb,currentColor 55%,transparent);transition:text-decoration-color .15s}
.elementor-widget-text-editor a.bb-inlink:hover,.elementor-widget-text-editor a.bb-inlink:focus-visible{color:inherit;text-decoration-color:currentColor;text-decoration-thickness:2px}
/* same on the native homepage, whose design reset turns every link gold */
html body .ng-page.ng-page a.bb-inlink{color:inherit !important;text-decoration:underline !important;text-decoration-thickness:1px !important;text-underline-offset:.18em !important;text-decoration-color:color-mix(in srgb,currentColor 55%,transparent) !important}
html body .ng-page.ng-page a.bb-inlink:hover{text-decoration-color:currentColor !important;text-decoration-thickness:2px !important}