/* ==========================================================================
   BIS landing pages: tokens from the BIS Safety Software design system,
   plus the layout pieces used by hand-built pages (Custom HTML blocks).
   ========================================================================== */

:root {
	--bis-primary: #009acb;
	--bis-primary-dark: #0078b3;
	--bis-blue-50: #e6f5fb;
	--bis-white: #ffffff;
	--bis-neutral-50: #f7f8f9;
	--bis-neutral-200: #e2e2e2;
	--bis-neutral-300: #cccccc;
	--bis-neutral-500: #666666;
	--bis-neutral-700: #333333;
	--bis-neutral-900: #191919;
	--bis-success: #167b00;
	--bis-success-tint: #eaf3e6;
	--bis-error: #cc2222;

	--font-brand: 'Montserrat', Arial, Helvetica, sans-serif;
	--font-body: 'Segoe UI', -apple-system, system-ui, BlinkMacSystemFont, Helvetica, Arial, sans-serif;

	--radius-sm: 2px;
	--radius-md: 4px;
	--radius-lg: 8px;
	--shadow-card: 0 1px 2px rgba(25, 25, 25, .06), 0 4px 16px rgba(25, 25, 25, .06);
	--shadow-cover: 0 1px 2px rgba(25, 25, 25, .06), 0 12px 32px rgba(25, 25, 25, .12);
	--shadow-focus: 0 0 0 3px rgba(0, 154, 203, .30);

	--lp-max: 1120px;
	--lp-gutter: 20px;
	--lp-section: clamp(40px, 6vw, 72px);
}

/* ---- Base ---------------------------------------------------------------- */

/* Blank template: the page owns the whole body. With the site template the theme's header and footer are on
   the page, so every base rule below is scoped to the page's own markup and leaves them alone. */
body.bis-lp:not(.bis-lp--site) {
	margin: 0;
	background: var(--bis-white);
	-webkit-text-size-adjust: 100%;
	text-rendering: optimizeLegibility;
}
.bis-lp-main, .bis-lp-header, .bis-lp-footer {
	color: var(--bis-neutral-900);
	font-family: var(--font-body);
	font-size: 16px;
	line-height: 1.55;
}
:is(.bis-lp-main, .bis-lp-header, .bis-lp-footer),
:is(.bis-lp-main, .bis-lp-header, .bis-lp-footer) *,
:is(.bis-lp-main, .bis-lp-header, .bis-lp-footer) *::before,
:is(.bis-lp-main, .bis-lp-header, .bis-lp-footer) *::after { box-sizing: border-box; }
body :is(.bis-lp-main, .bis-lp-header, .bis-lp-footer) img { max-width: 100%; height: auto; }
body :is(.bis-lp-main, .bis-lp-header, .bis-lp-footer) a { color: var(--bis-primary-dark); text-decoration: underline; text-underline-offset: 2px; }
body :is(.bis-lp-main, .bis-lp-header, .bis-lp-footer) a:hover { color: var(--bis-neutral-900); }
body :is(.bis-lp-main, .bis-lp-header, .bis-lp-footer) :focus-visible { outline: none; box-shadow: var(--shadow-focus); border-radius: var(--radius-sm); }
body .bis-lp-main :is(h1, h2, h3) { margin: 0; font-family: var(--font-brand); color: var(--bis-neutral-900); }
body .bis-lp-main p { margin: 0; }

.bis-lp-wrap { max-width: var(--lp-max); margin: 0 auto; padding: 0 var(--lp-gutter); }
/* Site template: same content width as the site header (.bis-hd__wrap) and footer (.bis-ft__wrap). */
.bis-lp--site { --lp-max: 1240px; }
.bis-lp-main { display: block; }

/* ---- Header / footer ----------------------------------------------------- */

.bis-lp-header { background: var(--bis-white); border-bottom: 1px solid var(--bis-neutral-200); }
.bis-lp-header .bis-lp-wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 14px; padding-bottom: 14px; }
.bis-lp .bis-lp-header__phone {
	font-family: var(--font-brand); font-weight: 700; font-size: 15px; color: var(--bis-neutral-900);
	text-decoration: none; white-space: nowrap;
}
.bis-lp .bis-lp-header__phone:hover { color: var(--bis-primary-dark); }
.bis-lp-header img { display: block; height: 32px; width: auto; }
.bis-lp-logo { display: inline-block; line-height: 0; }

.bis-lp-footer { border-top: 1px solid var(--bis-neutral-200); background: var(--bis-white); }
.bis-lp-footer .bis-lp-wrap {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px;
	padding-top: 24px; padding-bottom: 24px;
}
.bis-lp-footer img { display: block; height: 28px; width: auto; }
.bis-lp-footer__links { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; font-size: 14px; color: var(--bis-neutral-500); }

/* ---- Hero ---------------------------------------------------------------- */

.bis-lp-hero {
	background: linear-gradient(180deg, var(--bis-blue-50) 0%, var(--bis-white) 100%);
	padding: clamp(32px, 6vw, 64px) 0 clamp(40px, 6vw, 72px);
}
.bis-lp-hero__grid {
	display: grid;
	gap: clamp(28px, 4vw, 48px);
	align-items: center;
	grid-template-columns: 1fr;
	grid-template-areas: "copy" "form" "cover";
}
.bis-lp-hero__copy { grid-area: copy; display: flex; flex-direction: column; gap: 14px; }
.bis-lp-hero__cover { grid-area: cover; display: flex; justify-content: center; }
.bis-lp-hero__form { grid-area: form; width: 100%; max-width: 460px; justify-self: center; scroll-margin-top: 24px; }

.bis-lp-eyebrow {
	font-family: var(--font-brand); font-size: 12px; font-weight: 700; letter-spacing: .08em;
	text-transform: uppercase; color: var(--bis-primary-dark);
}
body .bis-lp-hero h1 {
	max-width: 820px; font-weight: 800; font-size: clamp(28px, 3.4vw + 14px, 48px);
	line-height: 1.15; letter-spacing: -0.01em; text-wrap: balance;
}
.bis-lp-lead { max-width: 640px; font-size: 18px; line-height: 1.55; color: var(--bis-neutral-700); text-wrap: pretty; }
.bis-lp-cover {
	display: block; width: clamp(220px, 34vw, 400px); height: auto;
	border-radius: var(--radius-lg); box-shadow: var(--shadow-cover);
}

@media (min-width: 900px) {
	.bis-lp-hero__grid {
		grid-template-columns: minmax(0, 1fr) minmax(340px, 460px);
		grid-template-areas: "copy copy" "cover form";
	}
}

/* Split hero: copy, then proof (testimonial, contact) on the left, form card on the right. On phones the
   form comes straight after the intro and the proof follows it. */
.bis-lp-hero__grid--split { grid-template-areas: "copy" "form" "proof"; align-items: start; }
.bis-lp-hero__proof { grid-area: proof; display: flex; flex-direction: column; gap: 16px; }
@media (min-width: 900px) {
	.bis-lp-hero__grid--split {
		grid-template-columns: minmax(0, 1fr) minmax(380px, 520px);
		grid-template-areas: "copy form" "proof form";
		grid-template-rows: auto 1fr;
		column-gap: clamp(40px, 5vw, 64px);
		row-gap: 32px;
	}
	.bis-lp-hero__grid--split .bis-lp-hero__form { max-width: 520px; justify-self: end; }
}

/* Demo hero: white with a soft blue wash behind the form, no gradient band. */
.bis-lp-hero--demo {
	background:
		radial-gradient(ellipse 55% 70% at 88% 35%, rgba(0, 154, 203, .10) 0%, rgba(0, 154, 203, 0) 70%),
		var(--bis-white);
	padding: clamp(32px, 5vw, 64px) 0 clamp(40px, 6vw, 72px);
}
body .bis-lp-hero--demo h1 { font-weight: 700; font-size: clamp(30px, 2.4vw + 16px, 44px); line-height: 1.18; max-width: 560px; }
.bis-lp-hero--demo .bis-lp-hero__copy { gap: 20px; }
.bis-lp-hero--demo .bis-lp-lead { font-size: 17px; max-width: 540px; }

.bis-lp-ticks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; max-width: 540px; }
.bis-lp-ticks li { position: relative; padding-left: 28px; font-size: 16px; color: var(--bis-neutral-700); }
.bis-lp-ticks li::before {
	content: ""; position: absolute; left: 0; top: 4px; width: 18px; height: 18px; border-radius: 999px;
	background: var(--bis-blue-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230078B3' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 11px no-repeat;
}

.bis-lp-quote { margin: 0; padding: clamp(20px, 3vw, 32px); background: var(--bis-neutral-50); border-radius: var(--radius-lg); max-width: 540px; }
.bis-lp-quote blockquote { margin: 0; padding: 0; border: 0; }
body .bis-lp-quote blockquote p { font-size: 18px; line-height: 1.55; color: var(--bis-neutral-700); text-wrap: pretty; }
/* The theme styles figcaption (italic, centered), hence the body prefix. */
body .bis-lp-quote figcaption { display: flex; align-items: center; gap: 12px; margin: 20px 0 0; font-style: normal; text-align: left; }
body .bis-lp-quote figcaption img { width: 48px; height: 48px; border-radius: 999px; object-fit: cover; }
body .bis-lp-quote figcaption > span { display: flex; flex-direction: column; line-height: 1.35; }
body .bis-lp-quote .bis-lp-quote__name { font-family: var(--font-brand); font-size: 15px; font-weight: 700; color: var(--bis-neutral-900); }
body .bis-lp-quote .bis-lp-quote__role { font-size: 13px; color: var(--bis-neutral-500); }

body .bis-lp-main .bis-lp-reach { margin-top: 8px; font-family: var(--font-brand); font-weight: 700; font-size: 15px; color: var(--bis-neutral-900); }
.bis-lp-hero__proof .bis-lp-contact { gap: 8px; }
.bis-lp-hero__proof .bis-lp-contact li { font-size: 15px; }

/* Form card in the demo hero: centered head and legal line, more room, softer and deeper shadow. */
.bis-lp-card--form {
	border-color: rgba(25, 25, 25, .06); border-radius: var(--radius-lg);
	box-shadow: 0 1px 2px rgba(25, 25, 25, .04), 0 24px 48px rgba(25, 25, 25, .10);
	padding: clamp(24px, 4vw, 36px);
}
.bis-lp-card--form .bis-lp-form__head { text-align: center; gap: 10px; margin-bottom: 4px; }
body .bis-lp-card--form .bis-lp-form__head h2 { font-size: clamp(24px, 1.2vw + 16px, 30px); }
.bis-lp-card--form .bis-lp-form__head p { font-size: 15px; color: var(--bis-neutral-700); text-wrap: balance; }
.bis-lp-card--form .bis-lp-form__legal { text-align: center; margin-top: -4px; }
.bis-lp-card--form .bis-lp-form--hubspot {
	--hsf-field-label__font-size: 13px;
	--hsf-field-label__color: var(--bis-neutral-500);
	--hsf-field-input__border-color: var(--bis-neutral-200);
	--hsf-field-input__border-radius: var(--radius-md);
	--hsf-field-textarea__border-color: var(--bis-neutral-200);
	--hsf-field-textarea__border-radius: var(--radius-md);
	--hsf-row__vertical-spacing: 14px;
}
.bis-lp-card--form .bis-lp-form--hubspot .hsfc-FieldLabel { font-weight: 500; }

.bis-lp-contact { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.bis-lp-contact li { display: flex; align-items: flex-start; gap: 12px; font-size: 16px; color: var(--bis-neutral-700); }
.bis-lp-contact svg { flex: 0 0 auto; width: 20px; height: 20px; margin-top: 2px; color: var(--bis-primary-dark); }
.bis-lp .bis-lp-contact a { color: var(--bis-neutral-900); font-weight: 600; text-decoration: none; }
.bis-lp .bis-lp-contact a:hover { color: var(--bis-primary-dark); text-decoration: underline; }

/* ---- Card + form --------------------------------------------------------- */

.bis-lp-card {
	background: var(--bis-white); border: 1px solid var(--bis-neutral-200);
	border-radius: var(--radius-md); box-shadow: var(--shadow-card);
	padding: clamp(20px, 4vw, 28px);
}

.bis-lp-form { display: flex; flex-direction: column; gap: 16px; margin: 0; }
.bis-lp-form__head { display: flex; flex-direction: column; gap: 4px; }
body .bis-lp-form__head h2 { font-weight: 700; font-size: 20px; line-height: 1.3; }
.bis-lp-form__head p { font-size: 14px; line-height: 1.5; color: var(--bis-neutral-500); }

.bis-lp-form__fields { display: flex; flex-wrap: wrap; gap: 16px; }
.bis-lp-form__field { flex: 1 1 100%; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.bis-lp-form__field--half { flex: 1 1 150px; }
.bis-lp-form__field label { font-size: 14px; font-weight: 600; color: var(--bis-neutral-900); }
.bis-lp-form__field input {
	width: 100%; height: 44px; padding: 0 12px; margin: 0;
	font: inherit; font-size: 16px; color: var(--bis-neutral-900);
	background: var(--bis-white); border: 1px solid var(--bis-neutral-300); border-radius: var(--radius-sm);
	transition: border-color .12s ease, box-shadow .12s ease;
}
.bis-lp-form__field input:hover { border-color: var(--bis-neutral-500); }
.bis-lp-form__field input:focus { outline: none; border-color: var(--bis-primary); box-shadow: var(--shadow-focus); }
.bis-lp-form__field input[aria-invalid="true"] { border-color: var(--bis-error); }

.bis-lp-form__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.bis-lp-form__legal { font-size: 12px; line-height: 1.55; color: var(--bis-neutral-500); text-wrap: pretty; }
.bis-lp-form__error { font-size: 14px; font-weight: 600; color: var(--bis-error); }
.bis-lp-form__error:empty { display: none; }

.bis-lp-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 48px; padding: 0 24px; margin: 0;
	font-family: var(--font-brand); font-size: 16px; font-weight: 700; line-height: 1.2;
	border: 1.5px solid transparent; border-radius: var(--radius-md); cursor: pointer;
	text-decoration: none; transition: background-color .12s ease, transform .08s ease;
}
.bis-lp .bis-lp-btn--primary { background: var(--bis-primary-dark); color: var(--bis-white); text-decoration: none; }
.bis-lp .bis-lp-btn--primary:hover { background: #006397; color: var(--bis-white); }
.bis-lp .bis-lp-btn--secondary { background: var(--bis-white); color: var(--bis-primary-dark); border-color: var(--bis-primary-dark); text-decoration: none; }
.bis-lp .bis-lp-btn--secondary:hover { background: var(--bis-blue-50); color: var(--bis-primary-dark); }
.bis-lp-btn:active { transform: translateY(1px); }
.bis-lp-btn:disabled { opacity: .7; cursor: progress; }
.bis-lp-btn--block { width: 100%; margin-top: 4px; }

/* ---- HubSpot developer embed (hs-form-html) -------------------------------
   HubSpot's base styles read var(--hsf-<name>, var(--hsf-default-<name>)), so setting
   --hsf-* here restyles the form without fighting its selectors. */

.bis-lp-form--hubspot {
	--hsf-global__font-family: var(--font-body);
	--hsf-row__vertical-spacing: 16px;
	--hsf-row__horizontal-spacing: 16px;
	--hsf-module__vertical-spacing: 6px;
	--hsf-background__padding: 0;
	--hsf-background__border-width: 0;

	--hsf-field-label__font-family: var(--font-body);
	--hsf-field-label__font-size: 14px;
	--hsf-field-label__color: var(--bis-neutral-900);
	--hsf-field-description__font-size: 14px;
	--hsf-field-description__color: var(--bis-neutral-500);
	--hsf-field-footer__font-size: 12px;
	--hsf-field-footer__color: var(--bis-neutral-500);

	--hsf-field-input__font-family: var(--font-body);
	--hsf-field-input__font-size: 16px;
	--hsf-field-input__color: var(--bis-neutral-900);
	--hsf-field-input__background-color: var(--bis-white);
	--hsf-field-input__placeholder-color: var(--bis-neutral-500);
	--hsf-field-input__border-color: var(--bis-neutral-300);
	--hsf-field-input__border-width: 1px;
	--hsf-field-input__border-style: solid;
	--hsf-field-input__border-radius: var(--radius-sm);
	--hsf-field-input__padding: 10px 12px;
	--hsf-field-textarea__font-family: var(--font-body);
	--hsf-field-textarea__font-size: 16px;
	--hsf-field-textarea__color: var(--bis-neutral-900);
	--hsf-field-textarea__background-color: var(--bis-white);
	--hsf-field-textarea__border-color: var(--bis-neutral-300);
	--hsf-field-textarea__border-width: 1px;
	--hsf-field-textarea__border-style: solid;
	--hsf-field-textarea__border-radius: var(--radius-sm);
	--hsf-field-textarea__padding: 10px 12px;
	--hsf-field-checkbox__border-color: var(--bis-neutral-300);
	--hsf-field-radio__border-color: var(--bis-neutral-300);

	--hsf-button__font-family: var(--font-brand);
	--hsf-button__font-size: 16px;
	--hsf-button__font-weight: 700;
	--hsf-button__color: var(--bis-white);
	--hsf-button__background-color: var(--bis-primary-dark);
	--hsf-button__background-image: none;
	--hsf-button__border-width: 0;
	--hsf-button__border-radius: var(--radius-md);
	--hsf-button__padding: 14px 24px;
	--hsf-button__box-shadow: none;

	--hsf-richtext__font-family: var(--font-body);
	--hsf-richtext__font-size: 12px;
	--hsf-richtext__color: var(--bis-neutral-500);
	--hsf-erroralert__font-family: var(--font-body);
	--hsf-erroralert__font-size: 14px;
	--hsf-erroralert__color: var(--bis-error);
	--hsf-infoalert__font-family: var(--font-body);
	--hsf-infoalert__font-size: 14px;
	--hsf-infoalert__color: var(--bis-neutral-700);
}
.bis-lp-form--hubspot .hs-form-html { margin-top: 4px; }
.bis-lp-form--hubspot .hsfc-FieldLabel { font-weight: 600; }
.bis-lp-form--hubspot .hsfc-TextInput { min-height: 44px; }
.bis-lp-form--hubspot .hsfc-TextareaInput { min-height: 96px; }
.bis-lp-form--hubspot .hsfc-TextInput:focus,
.bis-lp-form--hubspot .hsfc-TextareaInput:focus { outline: none; border-color: var(--bis-primary); box-shadow: var(--shadow-focus); }
.bis-lp-form--hubspot .hsfc-NavigationRow__Buttons .hsfc-Button { width: 100%; min-height: 48px; cursor: pointer; transition: background-color .12s ease; }
.bis-lp-form--hubspot .hsfc-NavigationRow__Buttons .hsfc-Button:hover { background-color: #006397; }
/* Forms set up with an image layout in HubSpot (e.g. "twoThirdRight") get a banner column that squeezes the
   fields; the card has no room for it. */
body .bis-lp-form--hubspot .hsfc-Step > .hsfc-Step__Banner { display: none; }
/* Forms with reCAPTCHA (invisible, Enterprise) show a 256x60 badge that renders as an empty box here. Google allows
   hiding the badge when the form carries the "protected by reCAPTCHA" notice (see the form config consent_html).
   visibility, not display: the captcha must stay in the page to run. */
.bis-lp-form--hubspot .hsfc-Row:has(> .hsfc-ReCaptchaV2) { height: 0; min-height: 0; margin: 0; overflow: hidden; visibility: hidden; }
/* body + child combinator: beats HubSpot's layout widths ([data-hsfc-id] .hsfc-Step--layoutTemplate-* > .hsfc-Step__Content). */
body .bis-lp-form--hubspot .hsfc-Step > .hsfc-Step__Content { flex: 1 1 100%; width: 100%; max-width: none; }
/* HubSpot forms often open with their own heading; the card already has one. Hides rich-text rows that
   come before a field (an intro), never one after the last field (e.g. a legal line). */
.bis-lp-form--hide-intro .hsfc-Step__Content > .hsfc-Row:has(> .hsfc-RichText):has(~ .hsfc-Row :is(input, textarea, select)) { display: none; }

.bis-lp-thanks { display: flex; flex-direction: column; gap: 16px; }
.bis-lp-thanks__icon {
	width: 44px; height: 44px; border-radius: 999px; display: flex; align-items: center; justify-content: center;
	background: var(--bis-success-tint); color: var(--bis-success);
}
.bis-lp-thanks__text { display: flex; flex-direction: column; gap: 8px; }
body .bis-lp-thanks h2 { font-weight: 700; font-size: 24px; line-height: 1.3; }
.bis-lp-thanks h2:focus { outline: none; box-shadow: none; }
.bis-lp-thanks__text p { color: var(--bis-neutral-700); text-wrap: pretty; }
.bis-lp-thanks__demo { padding-top: 16px; border-top: 1px solid var(--bis-neutral-200); font-size: 14px; color: var(--bis-neutral-500); }

/* ---- Sections ------------------------------------------------------------ */

.bis-lp-section { padding: var(--lp-section) 0; }
body .bis-lp-section h2 { font-weight: 700; font-size: 28px; line-height: 1.3; }
.bis-lp-section__inner { display: flex; flex-direction: column; gap: 28px; }

.bis-lp-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); gap: 24px 32px; }
.bis-lp-step { display: flex; flex-direction: column; gap: 8px; padding-top: 16px; border-top: 2px solid var(--bis-primary); }
.bis-lp-step__num { font-family: var(--font-brand); font-weight: 700; font-size: 14px; color: var(--bis-primary-dark); }
body .bis-lp-step h3 { font-weight: 700; font-size: 18px; line-height: 1.3; }
.bis-lp-step p { color: var(--bis-neutral-700); text-wrap: pretty; }

.bis-lp-split {
	display: flex; flex-wrap: wrap; gap: 12px 32px; align-items: baseline;
	padding-top: clamp(28px, 4vw, 40px); border-top: 1px solid var(--bis-neutral-200);
}
.bis-lp-section--flush { padding-top: 0; }
.bis-lp-split h2 { flex: 0 0 auto; min-width: 200px; }
.bis-lp-split p { flex: 1 1 320px; max-width: 720px; font-size: 18px; color: var(--bis-neutral-700); text-wrap: pretty; }

/* Team band: grey section, centered head, white cards with the photo beside the name. */
.bis-lp-section--team { background: var(--bis-neutral-50); }
.bis-lp-section__head { display: flex; flex-direction: column; gap: 8px; text-align: center; align-items: center; }
body .bis-lp-section--team h2 { font-size: clamp(24px, 1.4vw + 16px, 32px); }
.bis-lp-section__head p { font-size: 17px; color: var(--bis-neutral-700); max-width: 560px; text-wrap: balance; }

.bis-lp-people { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 20px; }
.bis-lp-person {
	display: flex; flex-direction: column; gap: 20px;
	background: var(--bis-white); border: 1px solid rgba(25, 25, 25, .06); border-radius: var(--radius-lg);
	box-shadow: 0 1px 2px rgba(25, 25, 25, .04), 0 8px 24px rgba(25, 25, 25, .06); padding: 24px;
}
.bis-lp-person__top { display: flex; align-items: center; gap: 16px; }
body .bis-lp-person img { flex: 0 0 auto; width: 64px; height: 64px; border-radius: 999px; object-fit: cover; }
body .bis-lp-person h3 { font-weight: 700; font-size: 17px; line-height: 1.3; }
body .bis-lp-main .bis-lp-person__role { font-size: 14px; color: var(--bis-neutral-500); }
body .bis-lp-main .bis-lp-person__phone { font-size: 15px; margin-top: 2px; }
body .bis-lp-main .bis-lp-person__phone a { color: var(--bis-neutral-900); font-weight: 600; text-decoration: none; }
body .bis-lp-main .bis-lp-person__phone a:hover { color: var(--bis-primary-dark); text-decoration: underline; }
.bis-lp-person .bis-lp-btn { width: 100%; margin-top: auto; }

/* Sales team contacts as one centered row under the account manager cards. */
.bis-lp-contact--inline { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 12px 32px; padding-top: 4px; }
.bis-lp-contact--inline li { align-items: center; gap: 10px; font-size: 15px; }
.bis-lp-contact--inline svg { margin-top: 0; width: 18px; height: 18px; }
@media (max-width: 600px) {
	.bis-lp-contact--inline { flex-direction: column; align-items: flex-start; gap: 10px; }
}

.bis-lp-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; }
.bis-lp-cta > div { flex: 1 1 360px; display: flex; flex-direction: column; gap: 8px; }
body .bis-lp-cta h2 { font-weight: 700; font-size: 24px; line-height: 1.3; }
.bis-lp-cta p { color: var(--bis-neutral-700); max-width: 640px; }
.bis-lp-band--cta { padding: clamp(32px, 5vw, 48px) 0; background: var(--bis-blue-50); }

.bis-lp-band { background: var(--bis-neutral-50); padding: 24px 0; }
.bis-lp-band:not(.bis-lp-band--cta) p { text-align: center; color: var(--bis-neutral-700); text-wrap: balance; }
.bis-lp-band strong { font-family: var(--font-brand); font-weight: 700; color: var(--bis-primary-dark); }

@media (prefers-reduced-motion: reduce) {
	.bis-lp-main * { transition: none !important; }
}

/* ---- Customer logo strip (Fellow-style) ------------------------------------
   Endless horizontal scroll: the list is in the markup twice (the second copy is aria-hidden), and the
   track moves by exactly one copy (-50%). Edges fade out with a mask; hover pauses it. With reduced
   motion it becomes a static, centred, wrapping row (the copy is hidden). */
/* Sits right under the hero: no top padding (the hero's bottom padding is the space above) and the same
   value as the hero's bottom padding below, so the gaps above and below the strip are equal. */
.bis-lp-logos { padding: 0 0 clamp(40px, 6vw, 72px); background: var(--bis-white); }
body .bis-lp-main .bis-lp-logos__title { text-align: center; font-size: 13px; color: var(--bis-neutral-500); margin-bottom: 22px; }
.bis-lp-logos__viewport {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
}
.bis-lp-logos__track {
	display: flex; align-items: center; gap: clamp(40px, 5vw, 72px); width: max-content;
	list-style: none; margin: 0; padding: 0;
	animation: bis-lp-logos 45s linear infinite;
}
.bis-lp-logos__viewport:hover .bis-lp-logos__track { animation-play-state: paused; }
.bis-lp-logos__track li { flex: 0 0 auto; display: flex; align-items: center; }
body .bis-lp-logos__track img { display: block; max-width: none; filter: grayscale(1); opacity: .6; }
@keyframes bis-lp-logos {
	from { transform: translateX(0); }
	/* -50% of the track minus half a gap, so the second copy lands exactly where the first started. */
	to { transform: translateX(calc(-50% - clamp(40px, 5vw, 72px) / 2)); }
}
@media (prefers-reduced-motion: reduce) {
	.bis-lp-logos__viewport { -webkit-mask-image: none; mask-image: none; }
	.bis-lp-logos__track { animation: none; width: auto; flex-wrap: wrap; justify-content: center; row-gap: 24px; }
	.bis-lp-logos__track li[aria-hidden="true"] { display: none; }
}

/* ---- Watch on-demand demo: light hero laid out like gomotive.com/watch-demo: centered head, then the
   checklist and buttons in a narrow left column and the gated video poster wide on the right. ---- */

.bis-lp-hero--watch {
	background:
		radial-gradient(ellipse 55% 70% at 80% 55%, rgba(0, 154, 203, .10) 0%, rgba(0, 154, 203, 0) 70%),
		var(--bis-white);
	padding: clamp(36px, 5vw, 72px) 0 clamp(40px, 6vw, 72px);
}
.bis-lp-watch__head { display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; margin-bottom: clamp(32px, 5vw, 56px); }
body .bis-lp-main .bis-lp-hero--watch h1 { font-weight: 700; font-size: clamp(30px, 2.4vw + 16px, 46px); line-height: 1.15; max-width: 900px; text-wrap: balance; }
.bis-lp-hero--watch .bis-lp-lead { font-size: 17px; max-width: 600px; text-wrap: balance; }

/* Phones: video first, then the checklist and buttons. */
.bis-lp-watch { display: grid; grid-template-columns: 1fr; grid-template-areas: "media" "copy"; gap: clamp(28px, 4vw, 48px); align-items: center; }
.bis-lp-watch__copy { grid-area: copy; display: flex; flex-direction: column; gap: 28px; }
.bis-lp-watch__media { grid-area: media; }
@media (min-width: 900px) {
	.bis-lp-watch { grid-template-columns: minmax(0, 1fr) minmax(0, 1.9fr); grid-template-areas: "copy media"; }
}
.bis-lp-hero--watch .bis-lp-ticks { gap: 16px; }
.bis-lp-watch__actions { display: flex; flex-wrap: wrap; gap: 12px; }
/* Customer logos inside the hero, under the two columns, behind a thin divider. */
.bis-lp-hero--watch .bis-lp-logos { background: transparent; margin-top: clamp(48px, 6vw, 72px); padding: 0; }
.bis-lp-hero--watch .bis-lp-logos > .bis-lp-wrap { padding-top: clamp(28px, 4vw, 40px); border-top: 1px solid var(--bis-neutral-200); }

/* ---- Contact page: quick links under the contact details (bordered link cards with an arrow) ---- */

body .bis-lp-main .bis-lp-quicklinks__title { margin-top: 8px; font-family: var(--font-brand); font-weight: 700; font-size: 15px; color: var(--bis-neutral-900); }
.bis-lp-quicklinks { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; max-width: 540px; }
body .bis-lp-main .bis-lp-quicklinks a {
	position: relative; display: flex; flex-direction: column; gap: 2px; padding: 14px 48px 14px 16px;
	background: var(--bis-white); border: 1px solid var(--bis-neutral-200); border-radius: var(--radius-lg);
	color: var(--bis-neutral-900); text-decoration: none; transition: border-color .12s ease, box-shadow .12s ease;
}
body .bis-lp-main .bis-lp-quicklinks a:hover { border-color: var(--bis-primary); box-shadow: var(--shadow-card); color: var(--bis-neutral-900); }
.bis-lp-quicklinks a span:first-child { font-family: var(--font-brand); font-weight: 700; font-size: 15px; }
.bis-lp-quicklinks a span:last-child { font-size: 14px; color: var(--bis-neutral-500); }
.bis-lp-quicklinks a::after {
	content: ""; position: absolute; right: 18px; top: 50%; width: 16px; height: 16px; transform: translateY(-50%);
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230078B3' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Form without its card (box, border, shadow, padding): add bis-lp-card--bare next to bis-lp-card--form.
   Contact Us test, 30 Oct. */
body .bis-lp-main .bis-lp-card--bare { background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 0; }
/* HubSpot paints the form step white from the form's own style settings. */
body .bis-lp-main .bis-lp-card--bare .hsfc-Step { background: transparent; }

/* Centered page head over the hero content (Contact Us; same look as the watch page's head). */
.bis-lp-hero__head { display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; margin-bottom: clamp(32px, 5vw, 56px); }
body .bis-lp-main .bis-lp-hero--contact h1 { max-width: 900px; text-wrap: balance; }
.bis-lp-hero--contact .bis-lp-lead { max-width: 600px; text-wrap: balance; }

/* Contact Us: form on the left, "Reach us directly" and quick links on the right; phones stack them. */
/* minmax(0, 1fr), not 1fr: a 1fr column grows to its widest content (the logo carousel), which made the form 1,700 px wide on phones. */
.bis-lp-contact-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(36px, 5vw, 48px); max-width: 1040px; align-items: start; }
.bis-lp-contact-side, .bis-lp-contact-side__group { min-width: 0; }
@media (min-width: 900px) {
	.bis-lp-contact-grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); column-gap: clamp(64px, 9vw, 136px); align-items: center; }
}
.bis-lp-contact-grid .bis-lp-hero__form { grid-area: auto; max-width: none; justify-self: stretch; }
.bis-lp-contact-side { display: flex; flex-direction: column; gap: 32px; }
.bis-lp-contact-side__group { display: flex; flex-direction: column; gap: 6px; }
body .bis-lp-main .bis-lp-contact-side__group .bis-lp-quicklinks__title { margin-top: 0; }
/* "Trusted by" group in the contact side column: a line of text and two rows of grey customer logos scrolling in
   opposite directions, faded at the edges; they keep moving on hover (unlike the .bis-lp-logos strip). */
body .bis-lp-main .bis-lp-contact-side__text { font-size: 15px; color: var(--bis-neutral-500); }
.bis-lp-logo-rows { --lr-gap: 36px; display: flex; flex-direction: column; gap: 18px; margin-top: 6px; }
.bis-lp-logo-rows__viewport {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 14%, #000 86%, transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 14%, #000 86%, transparent 100%);
}
.bis-lp-logo-rows__track {
	display: flex; align-items: center; gap: var(--lr-gap); width: max-content;
	list-style: none; margin: 0; padding: 0;
	animation: bis-lp-logo-rows 34s linear infinite;
}
.bis-lp-logo-rows__track--reverse { animation-direction: reverse; animation-duration: 30s; }
.bis-lp-logo-rows__track li { flex: 0 0 auto; display: flex; align-items: center; }
body .bis-lp-main .bis-lp-logo-rows__track img { display: block; width: auto; max-width: none; height: auto; max-height: 24px; filter: grayscale(1); opacity: .6; }
@keyframes bis-lp-logo-rows {
	from { transform: translateX(0); }
	/* -50% of the track minus half a gap: the second copy lands exactly where the first started. */
	to { transform: translateX(calc(-50% - var(--lr-gap) / 2)); }
}
@media (prefers-reduced-motion: reduce) {
	.bis-lp-logo-rows__viewport { -webkit-mask-image: none; mask-image: none; }
	.bis-lp-logo-rows__track { animation: none; width: auto; flex-wrap: wrap; row-gap: 16px; }
	.bis-lp-logo-rows__track li[aria-hidden="true"] { display: none; }
}

/* Contact Us "Call us" / "Email us": icon + underlined link per line (like untitledui's contact page). */
.bis-lp-contact-links { list-style: none; margin: 2px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.bis-lp-contact-links li { display: flex; align-items: center; gap: 10px; font-size: 15px; color: var(--bis-neutral-500); }
.bis-lp-contact-links svg { flex: 0 0 auto; width: 18px; height: 18px; color: var(--bis-neutral-900); }
body .bis-lp-main .bis-lp-contact-links a { color: var(--bis-neutral-900); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
body .bis-lp-main .bis-lp-contact-links a:hover { color: var(--bis-primary-dark); }
/* More room between the contact groups and the "Trusted by" logos (88 px in total with the column gap). */
.bis-lp-contact-side__group--trusted { margin-top: 56px; }
/* Both phone numbers on one line (wraps on narrow phones). */
.bis-lp-contact-links--row { flex-direction: row; flex-wrap: wrap; gap: 10px 24px; }
@media (max-width: 600px) {
	.bis-lp-contact-links--row { column-gap: 14px; }
}
