/*
Theme Name: Neve Child
Theme URI: https://revochat.tech
Description: Child theme for revochat.tech. Exists so that CSS and template overrides survive a Neve update — edits made inside the parent theme do not.
Author: RevoChat
Template: neve
Version: 1.0.0
*/

/* The child's stylesheet is enqueued by functions.php, not pulled in by an
 * @import here: @import blocks rendering until it has been fetched and parsed,
 * which costs a round trip on every page load for no benefit.
 *
 * Both rules below fix the landing page's own markup, which lives in an
 * Elementor HTML widget — so the values they override sit in a <style> block in
 * the *body*, after this file. That is why the selectors are more specific than
 * the ones they beat; on equal specificity the later block would win. Changing
 * the source instead would mean editing JSON in the database, out of sight of
 * this repo. If either of these is ever fixed at source, delete the rule here
 * rather than leaving two answers to the same question. */

/* 1. The white border around the page.
 *
 * Elementor 4's atomic containers inherit a 10px padding, and this page has
 * exactly one top-level container holding everything, so the hero's dark
 * background stopped 10px short on the left, right and top — a white frame
 * around a full-bleed design. Measured at 1512px: the hero sat at left 10,
 * top 10, right 1502 instead of 0 / 0 / 1512.
 *
 * Only the outer container is zeroed. Every section sets its own gutter through
 * .rc-container (width: min(1180px, 100% - 48px); margin: 0 auto), so the text
 * stays exactly where it was — verified unchanged at 166–1346 — and nothing
 * moves to touch the screen edge except the backgrounds that should.
 *
 * Three IDs because the selector is per-page: Elementor puts the post ID in the
 * body class, so 49 and 51 — the private /playground/ and /playground-2/ clones
 * of 19, one per design direction being compared — would otherwise render with
 * the white frame this rule exists to remove, and every experiment there would
 * start by re-fixing a bug that is already fixed. Left specific rather than
 * generalised to .elementor-page: the reasoning above holds for a page whose
 * top-level container is the only one, which is these three and not a promise
 * about the next. Drop the clones' IDs when the clones go. */
.elementor-19 > .e-con.e-atomic-element,
.elementor-49 > .e-con.e-atomic-element,
.elementor-51 > .e-con.e-atomic-element {
	--padding-block-start: 0px;
	--padding-block-end: 0px;
	--padding-inline-start: 0px;
	--padding-inline-end: 0px;
	padding: 0;
}

/* 2. The "< 3 sec / Average first response" card covered the conversation.
 *
 * It is positioned absolutely against the phone mock-up and hangs off its right
 * edge on purpose. The trouble is vertical: at bottom: 60px it landed straight
 * on the last chat bubble, hiding the end of "Absolutely. Is 2:00 PM convenient
 * for you?", and on the "Lead captured · Demo intent detected" strip beneath it.
 * Both overlaps were present at 1512px, 768px and 390px — the existing
 * breakpoints only reduce how far the card hangs out, they never move it clear.
 *
 * There is no band inside the card where it could sit without covering text:
 * the bubbles and the strip both run to the card's right edge. So it is anchored
 * below the card instead, overlapping the bottom edge by 18px so it still reads
 * as a card floating over the mock-up rather than a caption under it.
 *
 * top/100% rather than a negative bottom per breakpoint: it resolves against the
 * card's own height, so one rule holds at every width instead of three magic
 * numbers that would need re-tuning whenever the conversation gains a line. */
.rc-hero .rc-phone .rc-response-card {
	top: calc(100% - 18px);
	bottom: auto;
}

/* 3. The "Log in" link beside "Book a Demo".
 *
 * The markup for it is in the page's Elementor HTML widget, since that is where
 * the rest of the bar lives — a nav link is markup, not styling, and putting it
 * here via a string replacement on rendered HTML would rot the first time the
 * bar changed. Only the styling is here.
 *
 * .rc-nav-inner is flex with space-between, so a third child would have landed
 * in the middle of the bar. The two actions are wrapped in .rc-nav-actions to
 * keep the logo left and both buttons together on the right.
 *
 * Deliberately quieter than Book a Demo: same family, size and weight as the
 * bar's other text, but no pill, no border, and a muted white. A stranger who
 * has just landed has no account, so the demo has to stay the one obvious
 * action; a customer looking for the way in still finds it immediately. */
.rc-nav-actions {
	display: flex;
	align-items: center;
	gap: 20px;
}

.rc-nav-login {
	color: rgba(255, 255, 255, 0.78);
	font-size: 16px;
	font-weight: 800;
	text-decoration: none;
	white-space: nowrap;
	transition: color 0.25s ease;
}

.rc-nav-login:hover,
.rc-nav-login:focus-visible {
	color: #ffffff;
}

/* The bar tightens at Neve's own breakpoints; the link follows so it never
 * crowds the pill on a phone. */
@media (max-width: 640px) {
	.rc-nav-actions {
		gap: 12px;
	}

	.rc-nav-login {
		font-size: 14px;
	}
}