/* Ignite brand layer for igniteflow.com (both Framer exports + the chooser).
   Linked into every page by Dev/igniteflow-deploy/build.mjs, served from /brand/.
   Letters are CSS masks painted in currentColor (so they follow each spot's text colour);
   the ember is a separate image on the same canvas, so it stays orange everywhere. */

:root {
  --ig-orange: #E8692F;
}

/* ---------- Ignite Software: nav / hero logo (two mono lines "Ignite" / "Software") ---------- */
.framer-93PRb .framer-14km5ri p { -webkit-text-fill-color: transparent !important; }
.framer-93PRb .framer-14km5ri { position: relative !important; min-width: 74px; min-height: 46px; }
.framer-93PRb .framer-14km5ri::before,
.framer-93PRb .framer-14km5ri::after { content: ""; position: absolute; left: 0; top: 50%; width: 74px; height: 46px; transform: translateY(-50%); pointer-events: none; }
.framer-93PRb .framer-14km5ri::before { background-color: #000; -webkit-mask: url(/brand/lk-sw-letters.png?v=e581cf866f) left center / contain no-repeat; mask: url(/brand/lk-sw-letters.png?v=e581cf866f) left center / contain no-repeat; }
.framer-93PRb .framer-14km5ri::after { background: url(/brand/lk-sw-ember.png?v=e581cf866f) left center / contain no-repeat; }
/* pricing page's fixed logo sits on the dark hero */
.local-pricing-logo .framer-14km5ri::before { background-color: #fff; }

/* ---------- Ignite Software: footer brand text "Ignite Software" ---------- */
.framer-1u60pnn { position: relative !important; min-width: 87px; min-height: 54px; }
.framer-1u60pnn p { -webkit-text-fill-color: transparent !important; }
.framer-1u60pnn::before,
.framer-1u60pnn::after { content: ""; position: absolute; left: 0; top: 50%; width: 87px; height: 54px; transform: translateY(-50%); pointer-events: none; }
.framer-1u60pnn::before { background-color: #fff; -webkit-mask: url(/brand/lk-sw-letters.png?v=e581cf866f) left center / contain no-repeat; mask: url(/brand/lk-sw-letters.png?v=e581cf866f) left center / contain no-repeat; }
.framer-1u60pnn::after { background: url(/brand/lk-sw-ember.png?v=e581cf866f) left center / contain no-repeat; }

/* ---------- Ignite Marketing: nav + menu logo (replaces the mono "IGNITE / MARKETING" text) ---------- */
.framer-8oij8x p, .framer-1vc45fw p { position: relative !important; display: block !important; width: 74px !important; height: 46px !important; }
.framer-8oij8x p::before, .framer-1vc45fw p::before,
.framer-8oij8x p::after, .framer-1vc45fw p::after { content: "" !important; position: absolute !important; left: 0; top: 0; width: 74px; height: 46px; pointer-events: none; }
.framer-8oij8x p::before, .framer-1vc45fw p::before {
  display: block !important; background-color: #000; -webkit-mask: url(/brand/lk-mk-letters.png?v=e581cf866f) left center / contain no-repeat; mask: url(/brand/lk-mk-letters.png?v=e581cf866f) left center / contain no-repeat;
}
.framer-8oij8x p::after, .framer-1vc45fw p::after { background: url(/brand/lk-mk-ember.png?v=e581cf866f) left center / contain no-repeat; }

/* ---------- Ignite Marketing: hero "Ignite" (Cal Sans glitch stack) -> the Ignite wordmark ---------- */
.framer-18jn4ic { position: relative; overflow: visible !important; }
.framer-18jn4ic > * { opacity: 0 !important; }
.framer-18jn4ic::after {
  content: ""; position: absolute; left: 1.6%; top: -11.5%; width: 76%; aspect-ratio: 1446 / 676; pointer-events: none;
  background: url(/brand/ignite-hero.png?v=e581cf866f) left top / contain no-repeat;
}
/* the script "marketing" beside it (hero + footer): red -> Ignite orange */
.framer-zd2brd, .framer-zd2brd *, .framer-1smjqpx, .framer-1smjqpx * { color: var(--ig-orange) !important; --framer-text-color: var(--ig-orange) !important; }


/* ---------- Ignite Marketing: footer "Ignite" (Cal Sans fit-text, rendered inside an SVG wrapper,
   so the layer hangs off the <p>; same proportions as the hero box) ---------- */
.framer-1i6kln3 p { position: relative !important; overflow: visible !important; -webkit-text-fill-color: transparent !important; }
.framer-1i6kln3 p::after {
  content: ""; position: absolute; left: 1.6%; top: -11.5%; width: 76%; aspect-ratio: 1446 / 676; pointer-events: none;
  background: url(/brand/ignite-hero.png?v=e581cf866f) left top / contain no-repeat;
}

/* ---------- Ignite Marketing: small "Ignite" brand labels (feature cards + the two logo marquees) ---------- */
.framer-xuwly0 p, .framer-hhuz61 p, .framer-1hczyhw p, .framer-8v70o p { position: relative !important; overflow: visible !important; -webkit-text-fill-color: transparent !important; }
.framer-xuwly0 p::before, .framer-hhuz61 p::before, .framer-1hczyhw p::before, .framer-8v70o p::before,
.framer-xuwly0 p::after, .framer-hhuz61 p::after, .framer-1hczyhw p::after, .framer-8v70o p::after {
  content: ""; position: absolute; left: 0; top: 50%; height: 1.45em; aspect-ratio: 597 / 278; transform: translateY(-58%); pointer-events: none;
}
.framer-xuwly0 p::before, .framer-hhuz61 p::before, .framer-1hczyhw p::before, .framer-8v70o p::before {
  background-color: currentColor; -webkit-mask: url(/brand/lk-word-letters.png?v=e581cf866f) left center / contain no-repeat; mask: url(/brand/lk-word-letters.png?v=e581cf866f) left center / contain no-repeat;
}
.framer-xuwly0 p::after, .framer-hhuz61 p::after, .framer-1hczyhw p::after, .framer-8v70o p::after { background: url(/brand/lk-word-ember.png?v=e581cf866f) left center / contain no-repeat; }

/* ---------- Chooser (/): the grey "Ignite" above Marketing / Software ---------- */
h2 > small { position: relative; -webkit-text-fill-color: transparent; opacity: 1 !important; }
h2 > small::before,
h2 > small::after { content: ""; position: absolute; left: 0; top: -.05em; height: 1.32em; aspect-ratio: 597 / 278; pointer-events: none; }
h2 > small::before { background-color: currentColor; opacity: .55; -webkit-mask: url(/brand/lk-word-letters.png?v=e581cf866f) left top / contain no-repeat; mask: url(/brand/lk-word-letters.png?v=e581cf866f) left top / contain no-repeat; }
h2 > small::after { background: url(/brand/lk-word-ember.png?v=e581cf866f) left top / contain no-repeat; }