/* ---- Satoshi (headings) — loaded from Fontshare CDN ---- */
@import url('https://api.fontshare.com/v2/css?f[]=satoshi@500,600,700,800,900&display=swap');

:root {
	/* ---- Brand palette ----
	   Single source of truth for the system primary. Widget CSS files were
	   ported from amber to this purple in v1.11.0; if you ever need to swap
	   palettes again, update these tokens and re-run the find/replace. */
	--oib-primary:        #7E5D74;          /* primary brand color */
	--oib-primary-dark:   #6A4960;          /* darker hover/active variant */
	--oib-primary-light:  #917388;          /* lighter variant for gradient stops */
	--oib-primary-soft:   #f4eef2;          /* very light tint for surfaces */
	--oib-primary-rgb:    126, 93, 116;     /* for rgba() shadows / overlays */

	/* ---- Generic tokens (kept for backwards compatibility) ---- */
	--oib-color-bg: #ffffff;
	--oib-color-fg: #1f1d2c;
	--oib-color-muted: #6b7280;
	--oib-color-accent: var(--oib-primary);
	--oib-color-accent-soft: var(--oib-primary-soft);
	--oib-radius: 12px;
	--oib-shadow: 0 6px 24px rgba(31, 29, 44, 0.08);

	/* ---- Typography ----
	   Per Blog Typography Guideline:
	     • Headings → Satoshi (700/600), color #111
	     • Body     → Inter, 18/16px, color #222, line-height 1.8
	     • Meta     → Inter 14px, color #666, weight 500 */
	--oib-font:         "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--oib-font-heading: "Satoshi", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	--oib-color-heading: #111111;
	--oib-color-body:    #222222;
	--oib-color-meta:    #666666;

	--oib-gap: 24px;
}

/* ==========================================================================
   PRIMARY COLOR OVERRIDES
   ==========================================================================
   Existing widget instances that were configured before the v1.11 palette
   swap kept their amber values in the DB — Elementor outputs those as
   per-instance inline CSS which beats the file defaults. These !important
   rules force the system primary on common button/badge/accent surfaces so
   the migration is automatic without re-saving every widget.

   To allow per-widget color customization via Elementor controls again,
   remove the matching block here. */

/* ---- Primary buttons (background) ---- */
.oib-hero__btn--primary,
.oib-cban__btn-primary,
.oib-fsec__btn,
.oib-ctac__btn,
.oib-nav__cta,
.oib-cta__submit,
.oib-footer__submit {
	background: var(--oib-primary) !important;
	background-color: var(--oib-primary) !important;
	background-image: none !important;
	color: #ffffff !important;
}

.oib-hero__btn--primary:hover,
.oib-hero__btn--primary:focus-visible,
.oib-cban__btn-primary:hover,
.oib-cban__btn-primary:focus-visible,
.oib-fsec__btn:hover,
.oib-fsec__btn:focus-visible,
.oib-ctac__btn:hover,
.oib-ctac__btn:focus-visible,
.oib-nav__cta:hover,
.oib-nav__cta:focus-visible,
.oib-cta__submit:hover,
.oib-cta__submit:focus-visible,
.oib-footer__submit:hover,
.oib-footer__submit:focus-visible {
	background: var(--oib-primary-dark) !important;
	background-color: var(--oib-primary-dark) !important;
}

/* ---- Badges / accent surfaces ---- */
.oib-stg__badge,
.oib-cs__badge,
.oib-ppl__icon {
	background: var(--oib-primary) !important;
	color: #ffffff !important;
}

/* ---- Accent text colors ---- */
.oib-cs__view-all,
.oib-cs__stat-value,
.oib-tl__step-label,
.oib-fsec__btn,
.oib-services__card:hover .oib-services__icon,
.oib-stg__cta:hover {
	/* keep these primary-purple */
}
.oib-cs__view-all,
.oib-cs__stat-value,
.oib-tl__step-label {
	color: var(--oib-primary) !important;
}

/* ---- Hover-border accents ---- */
.oib-services .oib-services__grid .oib-services__card:hover,
.oib-services .oib-services__grid .oib-services__card--linked:focus-visible {
	border-color: var(--oib-primary) !important;
}

/* ---- Icon-on-hover (Services widget flips icon bg to primary) ---- */
.oib-services .oib-services__grid .oib-services__card:hover .oib-services__icon {
	background-color: var(--oib-primary) !important;
}

/* ---- Process Steps active circle ---- */
.oib-process__step--active .oib-process__circle {
	border-color: var(--oib-primary) !important;
}
.oib-process__step--active .oib-process__number {
	color: var(--oib-primary) !important;
}

/* ---- Why Choose stat-card gradient ---- */
.oib-why__card {
	background: linear-gradient(160deg, var(--oib-primary) 0%, var(--oib-primary-dark) 100%) !important;
}

/* ---- Timeline callout left accent ---- */
.oib-tl__callout {
	border-left-color: var(--oib-primary) !important;
}
