/* ==========================================================================
   Velocity — Elementor adapter (converted pages only)

   The converted pages are Elementor containers carrying the original
   Velocity CSS classes. Kit-level spacing defaults are zeroed (kit 9), so
   this file only patches where the Elementor DOM differs from the PHP
   markup the original selectors expected. Loaded BEFORE the per-page
   stylesheets so page rules win ties.
   ========================================================================== */

/* Widgets that must shrink-wrap as flex items (buttons) opt in. */
.elementor-widget.vel-w-auto { width: auto; max-width: 100%; flex-shrink: 0; }

/* Containers nested in row-flex sections default to width:100%, which
   starves their siblings; restore natural flex sizing. */
.e-con.velp-ab-band-card > .e-con,
.e-con.velp-ab-role > .e-con { width: auto; flex: 1 1 auto; min-width: 0; }

/* Absolutely-positioned decor: .elementor-widget is position:relative, so
   a decor span would anchor to its own wrapper. Instead the wrapper opts
   in to become a full-bleed overlay of the nearest positioned section. */
.elementor-widget.vel-w-abs { position: absolute; inset: 0; width: auto; pointer-events: none; }

/* Grid sections: the class must beat the .e-con flex default regardless
   of stylesheet load order. */
.e-con.vel-cards-3,
.e-con.velp-ab-culture-grid,
.e-con.velp-ab-culture-photos { display: grid; }

/* Row-flex sections: .e-con defaults to flex-direction column; restore the
   row the original CSS assumed, and mirror its breakpoint stacking (the
   originals' media rules lose to these higher-specificity ones). */
.e-con.velp-ab-hero-actions,
.e-con.velp-ab-band-card,
.e-con.velp-ab-role { flex-direction: row; }

@media ( max-width: 900px ) {
	.e-con.velp-ab-band-card { flex-direction: column; }
}

@media ( max-width: 640px ) {
	.e-con.velp-ab-role { flex-direction: column; }
}

/* Photo placeholder spans now live inside widget wrappers (inline spans
   collapse without this). */
.elementor-widget .velp-ab-photo { display: block; }

/* keydesign-framework forces text-editor <p>/<a> to inherit font metrics
   (higher specificity than the page classes). Classed root <p>s carry
   their class on the widget wrapper (builders do this); descendant-styled
   paragraphs get their metrics restored on the wrapper here. */
.vel-card .elementor-widget-text-editor:has(p) { font-size: 14px; line-height: 1.45; }
.vel-why-item .elementor-widget-text-editor:has(p) { font-size: 16px; line-height: 1.65; }
.velp-ab-band-card .elementor-widget-text-editor:has(p) { font-size: 15px; line-height: 1.6; }
.velp-ab-culture-copy .elementor-widget-text-editor:has(p) { font-size: 15.5px; line-height: 1.7; }
/* No margin restore here: .vel-cta-card p's own margin survives the cascade
   (restoring on the wrapper doubles it). */
.vel-cta-card .elementor-widget-text-editor:has(p) { font-size: 18px; line-height: 1.6; }

/* Classed paragraphs lose their margin-bottom to global.css p:last-child.
   Restore on the wrapper at 0-3-0 — Elementor's own
   `.e-con .elementor-widget.elementor-widget { margin-block-end: 0 }`
   outranks anything weaker. */
.e-con .elementor-widget.vel-hero-sub { margin-bottom: 26px; }
.e-con .elementor-widget.vel-section-sub { margin-bottom: 44px; }

/* keydesign's .elementor-widget-text-editor line-height:1.75 ties with the
   copied class on the wrapper and wins on load order — re-assert the class
   metrics at wrapper level. */
.elementor-widget-text-editor.vel-hero-sub { font-size: 18px; line-height: 1.6; }
.elementor-widget-text-editor.velp-ab-hero-sub { font-size: 16.5px; line-height: 1.65; }
.elementor-widget-text-editor.vel-section-sub { font-size: 18px; line-height: 1.6; }

/* Bare elements inside widgets inherit keydesign's 1.75 wrapper line-height
   instead of the original flow's — restore. */
.elementor-widget .vel-eyebrow { line-height: normal; }
.velp-ab-band-card h2 { line-height: normal; }

/* keydesign paints text-editor wrappers #757575; the design's body color is
   slate. Paragraphs with their own color rules still win on the p itself. */
.vel-main .elementor-widget-text-editor { color: var(--vel-slate); }

/* keydesign also sets wrapper line-height 1.75 — non-paragraph content
   (headings, labels, divs) should inherit the surrounding flow instead,
   exactly as it did in the PHP markup. Paragraph widgets keep their
   class/adapter-provided metrics. */
.vel-main .elementor-widget-text-editor:not(:has(p)) { line-height: inherit; }