/* Additions on top of lovable.css, the prototype's compiled Tailwind build.
   lovable.css only contains the utilities the prototype used; anything else goes here. */

/* Preflight's [hidden] rule loses to utilities like .flex; the runtime toggles hidden a lot. */
[hidden] { display: none !important; }

/* ---- Blog post: article body typography (BlogPost chunk renders its markdown with these utilities;
   our posts are stored HTML, so the same look is applied to the elements) ---- */
.prose-custom h2 { font-size: 1.5rem; line-height: 2rem; font-weight: 700; color: hsl(var(--foreground)); margin: 2.5rem 0 1rem; }
.prose-custom h3 { font-size: 1.25rem; line-height: 1.75rem; font-weight: 700; color: hsl(var(--foreground)); margin: 2rem 0 .75rem; }
.prose-custom p { color: hsl(var(--muted-foreground)); line-height: 1.625; margin: 1rem 0; }
.prose-custom ul { list-style: none; margin: 1rem 0 1rem .25rem; padding: 0; }
.prose-custom ul > li { position: relative; padding-left: 1.125rem; color: hsl(var(--muted-foreground)); line-height: 1.625; }
.prose-custom ul > li + li { margin-top: .5rem; }
.prose-custom ul > li::before { content: ""; position: absolute; left: 0; top: .5rem; width: .375rem; height: .375rem; border-radius: 9999px; background: hsl(var(--primary)); }
.prose-custom ol { list-style: decimal; margin: 1rem 0 1rem .25rem; padding-left: 1.25rem; }
.prose-custom ol > li { color: hsl(var(--muted-foreground)); line-height: 1.625; padding-left: .25rem; }
.prose-custom ol > li + li { margin-top: .25rem; }
.prose-custom li > p { margin: 0; }
.prose-custom strong, .prose-custom b { color: hsl(var(--foreground)); font-weight: 600; }
.prose-custom a { color: hsl(var(--primary)); font-weight: 500; text-decoration: underline; text-underline-offset: 4px; }
.prose-custom a:hover { opacity: .8; }
.prose-custom img { border-radius: 1rem; margin: 1.5rem 0; }
.prose-custom blockquote { border-left: 3px solid hsl(var(--primary) / .4); padding-left: 1rem; margin: 1.5rem 0; }

/* ---- Landing pages (landing-a): the mobile landing's fixed bottom bar (mobileLandingContent M wraps the
   page in pb-24; our footer sits outside the page, so the body gets the padding instead) ---- */
@media (max-width: 1023.98px) {
    body:has([data-la-mobile-bar]) { padding-bottom: 6rem; }
}

/* ---- Landing pages (landing-a, BookDemo/FreeDemo): Tailwind's `contents` utility, used on wrapper spans that
   swap a button's label for its spinner/check icon ---- */
.contents { display: contents; }

/* Utilities the prototype's markup uses but its Tailwind build never generated (they rendered
   as nothing there too, e.g. size "xl" buttons with h-13 collapsed to their text height). */
.h-13 { height: 3.25rem; }
.h-4\.5 { height: 1.125rem; }
.w-4\.5 { width: 1.125rem; }
.duration-400 { transition-duration: 400ms; }
.shadow-button { box-shadow: var(--shadow-button); }
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }
.scrollbar-hide::-webkit-scrollbar { display: none; }
.from-primary\/8 { --tw-gradient-from: hsl(var(--primary) / .08) var(--tw-gradient-from-position); --tw-gradient-to: hsl(var(--primary) / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.text-feature-indigo { color: hsl(var(--feature-indigo)); }
.bg-feature-indigo\/10 { background-color: hsl(var(--feature-indigo) / .1); }
.bg-feature-pink\/10 { background-color: hsl(var(--feature-pink) / .1); }
.bg-feature-cyan\/15 { background-color: hsl(var(--feature-cyan) / .15); }
.bg-feature-blue\/80 { background-color: hsl(var(--feature-blue) / .8); }
.bg-feature-green\/80 { background-color: hsl(var(--feature-green) / .8); }
.bg-feature-orange\/80 { background-color: hsl(var(--feature-orange) / .8); }
.bg-feature-pink\/80 { background-color: hsl(var(--feature-pink) / .8); }
.bg-feature-purple\/80 { background-color: hsl(var(--feature-purple) / .8); }