/home/bdqbpbxa/demo-subdomains/billine.goodface.com.ua/ui-blocks.html
<!DOCTYPE html>
<html lang="uk">
<head>
<meta charset="utf-8" />
<title>bill_line - UI Blocks</title>
<!-- TODO: Delete noindex on production -->
<meta name="robots" content="noindex" />
<meta name="googlebot" content="noindex" />
<!-- Mobile -->
<meta
name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"
/>
<meta name="format-detection" content="telephone=no" />
<!-- Styles -->
<link rel="stylesheet" type="text/css" href="css/compose.css" />
<!-- Favicon -->
<link
rel="apple-touch-icon"
sizes="180x180"
href="images/favicon/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="images/favicon/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="images/favicon/favicon-16x16.png"
/>
<!-- <link rel="manifest" href="images/favicon/site.webmanifest" />-->
<link
rel="mask-icon"
href="images/favicon/safari-pinned-tab.svg"
color="#9680ff"
/>
<meta name="msapplication-TileColor" content="#ffffff" />
<meta name="theme-color" content="#ffffff" />
<!-- Opengraph -->
<meta name="twitter:card" content="summary_large_image" />
<meta property="og:type" content="website" />
<meta property="og:image:type" content="images/png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:url" content="https://billline.net" />
<meta property="og:site_name" content="bill_line" />
<meta property="og:title" content="UI Blocks" />
<meta property="og:description" content="UI Blocks" />
<meta property="og:image" content="images/opengraph.png" />
</head>
<body>
<hr style="margin: 50px 0" />
<!-- Form's blocks -->
<section class="form-section">
<div class="container">
<div class="form-container --content-container-S">
<div class="form-section__title-box">
<div class="form-section__img">
<img src="images/form/form-stars.svg" alt="" />
</div>
<h2 class="form-section__title title-2 mob-title-2 --bold-text">
Підключайте індивідуальне рішення
</h2>
<p class="form-section__subtitle text-1 mob-text-1">
Ми розуміємо, що кожен бізнес особливий, тому створюємо рішення,
які враховують потреби вашої компанії. Наша команда розробки
має досвід реалізації найбільш складних технічних систем.
</p>
</div>
<div class="form-block -connect --sending-form-container">
<div class="--sending-form">
<div class="form__title-box --white-text">
<h3 class="form__title title-5 mob-title-5 --bold-text">
Заявка на підключення
</h3>
<p class="form__subtitle text-1 mob-text-1">
Залишайте заявку, щоб почати співпрацю
</p>
</div>
<div class="form">
<form name="connect">
<div class="form__grid">
<div class="input -input" data-important="not-empty">
<label>Ім’я *</label>
<input type="text" name="name" />
<span
class="input__invalid"
data-correct-text="Перевірте правильність введених даних"
data-fill-text="Це поле є обов'язковим для заповнення"
>
</span>
</div>
<div class="input -input" data-important="not-empty">
<label>URL адреса *</label>
<input type="text" name="url" />
<span
class="input__invalid"
data-correct-text="Перевірте правильність введених даних"
data-fill-text="Це поле є обов'язковим для заповнення"
>
</span>
</div>
<div class="input -input" data-important="email">
<label>Електронна пошта *</label>
<input type="text" name="email" />
<span
class="input__invalid"
data-correct-text="Перевірте правильність введених даних"
data-fill-text="Це поле є обов'язковим для заповнення"
></span>
</div>
<div class="input -input">
<label>Telegram/Viber/Whatsapp</label>
<input type="text" name="social" />
</div>
<div class="input -input form__textarea">
<label>Короткий опис компанії</label>
<textarea
class="-adaptive-height"
name="message"
></textarea>
</div>
</div>
<div class="checkbox --checkbox" data-important="checked">
<input type="checkbox" checked />
<span class="checkbox__button"></span>
<p class="checkbox__text">
Я згоден, що я ознайомився(лась) з
<a
href="#"
target="_blank"
class="default-link --gradient-hover"
>
Політикою конфіденційності
</a>
та приймаю її
</p>
</div>
<button class="form__button default-button -shadow -black">
<p>Надіслати заявку</p>
</button>
</form>
</div>
</div>
<div class="--sending-block --sending-loading">
<div
class="form-sending__img --mask-item"
style="
-webkit-mask-image: url(images/icons/circle-dashed.svg);
mask-image: url(images/icons/circle-dashed.svg);
"
></div>
<div class="form-sending__subtitle text-1 mob-text-1">
Обробляємо вашу заявку...
</div>
</div>
<div class="--sending-block --sending-success">
<div
class="form-sending__img --mask-item"
style="
-webkit-mask-image: url(images/icons/check-circle.svg);
mask-image: url(images/icons/check-circle.svg);
"
></div>
<div class="form-sending__title title-5 mob-title-5 --bold-text">
Заявку успішно відправлено
</div>
<div class="form-sending__subtitle text-1 mob-text-1">
Наші менеджери зв'яжуться з вами найближчим часом і дадуть
відповіді на запитання, що вас цікавлять.
</div>
<button
class="
form-sending__button
default-button
-shadow
-black
--back-to-form
"
>
<p>ОК</p>
</button>
</div>
<div class="--sending-block --sending-error">
<div
class="form-sending__img --mask-item"
style="
-webkit-mask-image: url(images/icons/x-circle-big.svg);
mask-image: url(images/icons/x-circle-big.svg);
"
></div>
<div class="form-sending__title title-5 mob-title-5 --bold-text">
Заявку не вдалося надіслати
</div>
<div class="form-sending__subtitle text-1 mob-text-1">
Сталася помилка під час відправлення. Будь ласка, спробуйте ще
раз.
</div>
<button
class="
form-sending__button
default-button
-shadow
-white
--back-to-form
"
>
<span
class="default-button__icon --mask-item"
style="
-webkit-mask-image: url(images/icons/arrow-clockwise.svg);
mask-image: url(images/icons/arrow-clockwise.svg);
"
></span>
<p>Спробувати ще раз</p>
</button>
</div>
</div>
</div>
</div>
</section>
<section class="form-section">
<div class="container">
<div class="form-container --content-container-S">
<div class="form-block --sending-form-container">
<div class="--sending-form">
<div class="form__title-box">
<h3 class="form__title title-5 mob-title-5 --bold-text">
Заявка на роботу в команді
</h3>
<p class="form__subtitle text-1 mob-text-1">
Залишайте заявку, щоб почати співпрацю
</p>
</div>
<div class="form">
<form name="join">
<div class="form__grid">
<div class="input -input" data-important="not-empty">
<label>Ім’я та прізвище *</label>
<input type="text" name="name" />
<span
class="input__invalid"
data-correct-text="Перевірте правильність введених даних"
data-fill-text="Це поле є обов'язковим для заповнення"
>
</span>
</div>
<div class="input -input" data-important="inputmask">
<label>Номер телефону *</label>
<input type="text" class="--phone-mask" name="phone" />
<span
class="input__invalid"
data-correct-text="Перевірте правильність введених даних"
data-fill-text="Це поле є обов'язковим для заповнення"
></span>
</div>
<div class="input -input" data-important="email">
<label>Електронна пошта *</label>
<input type="text" name="email" />
<span
class="input__invalid"
data-correct-text="Перевірте правильність введених даних"
data-fill-text="Це поле є обов'язковим для заповнення"
></span>
</div>
<div class="input -file">
<label>
<p>Resume/CV *</p>
<span>.PDF файл, не більше 5 Мб</span>
</label>
<div class="input__box" tabindex="0">
<input
type="file"
size="5242880"
accept="application/pdf"
name="file"
/>
<div
class="
input__file-button
default-button
-small
-shadow
-white
"
>
<span
class="default-button__icon --mask-item"
style="
-webkit-mask-image: url(images/icons/paperclip.svg);
mask-image: url(images/icons/paperclip.svg);
"
></span>
<p>Прикріпити файл</p>
</div>
<div class="input__file-info">
<div class="file-info__left">
<span
class="file-info__icon --mask-item"
style="
-webkit-mask-image: url(images/icons/file.svg);
mask-image: url(images/icons/file.svg);
"
></span>
<div class="file-info__info-box">
<p></p>
<span data-unit="Мб"></span>
</div>
</div>
<span
class="file-info__remove-icon --mask-item"
style="
-webkit-mask-image: url(images/icons/x-circle.svg);
mask-image: url(images/icons/x-circle.svg);
"
></span>
</div>
</div>
</div>
</div>
<div class="checkbox --checkbox" data-important="checked">
<input type="checkbox" checked />
<span class="checkbox__button"></span>
<p class="checkbox__text">
Я згоден, що я ознайомився(лась) з
<a
href="#"
target="_blank"
class="default-link --gradient-hover"
>
Політикою конфіденційності
</a>
та приймаю її
</p>
</div>
<button class="form__button default-button -shadow -black">
<p>Надіслати заявку</p>
</button>
</form>
</div>
</div>
<div class="--sending-block --sending-loading">
<div
class="form-sending__img --mask-item"
style="
-webkit-mask-image: url(images/icons/circle-dashed.svg);
mask-image: url(images/icons/circle-dashed.svg);
"
></div>
<div class="form-sending__subtitle text-1 mob-text-1">
Обробляємо вашу заявку...
</div>
</div>
<div class="--sending-block --sending-success">
<div
class="form-sending__img --mask-item"
style="
-webkit-mask-image: url(images/icons/check-circle.svg);
mask-image: url(images/icons/check-circle.svg);
"
></div>
<div class="form-sending__title title-5 mob-title-5 --bold-text">
Заявку успішно відправлено
</div>
<div class="form-sending__subtitle text-1 mob-text-1">
Наші менеджери зв'яжуться з вами найближчим часом і дадуть
відповіді на запитання, що вас цікавлять.
</div>
<button
class="
form-sending__button
default-button
-shadow
-black
--back-to-form
"
>
<p>ОК</p>
</button>
</div>
<div class="--sending-block --sending-error">
<div
class="form-sending__img --mask-item"
style="
-webkit-mask-image: url(images/icons/x-circle-big.svg);
mask-image: url(images/icons/x-circle-big.svg);
"
></div>
<div class="form-sending__title title-5 mob-title-5 --bold-text">
Заявку не вдалося надіслати
</div>
<div class="form-sending__subtitle text-1 mob-text-1">
Сталася помилка під час відправлення. Будь ласка, спробуйте ще
раз.
</div>
<button
class="
form-sending__button
default-button
-shadow
-white
--back-to-form
"
>
<span
class="default-button__icon --mask-item"
style="
-webkit-mask-image: url(images/icons/arrow-clockwise.svg);
mask-image: url(images/icons/arrow-clockwise.svg);
"
></span>
<p>Спробувати ще раз</p>
</button>
</div>
</div>
</div>
</div>
</section>
<hr style="margin: 50px 0" />
<!-- Connect cards -->
<article class="connect-card-section">
<div class="container">
<div class="connect-card-section-container --content-container-M">
<h2
class="connect-card-section__title title-2 mob-title-2 --bold-text"
>
Створюємо кращий платіжний <br />досвід для ваших клієнтів
</h2>
<div class="connect-card__block">
<div
class="connect-card__left"
style="
background-image: url(images/connect-card/connect-background-1.svg);
"
>
<div class="connect-card__editor --white-text">
<h3>Платіжна система</h3>
<h4>
Ми робимо все, щоб клієнти вашого бізнесу безперебійно
здійснювали оплати. Cтворюємо індивідуальні рішення, які
допоможуть вирішити конкретно ваші задачі.
</h4>
<p>
bill_line забезпечує оплату для Інтернет-магазинів,
платформ, маркетплейсів, банків, страхових компаній,
благодійних організацій, служб таксі, онлайн кас, мобільних
операторів, ігор та будь-яких інших компаній з платіжними
операціями в Інтернеті.
</p>
</div>
<a
href="https://cabinet.billline.net/register"
target="_blank"
class="connect-card__button default-button -shadow -white"
>
<p>Реєстрація</p>
<span class="default-button__arrow"></span>
</a>
</div>
<div class="connect-card__right">
<img
src="images/connect-card/img-1.png"
alt="Створюємо кращий платіжний досвід для ваших клієнтів - bill_line.com"
/>
</div>
</div>
</div>
</div>
</article>
<div class="connect-card__block --content-container-M">
<div
class="connect-card__left"
style="
background-image: url(images/connect-card/connect-background-2.svg);
"
>
<div class="connect-card__editor --white-text">
<h3>Найшвидший спосіб інтеграції до вашого бізнесу</h3>
<h4>Підключення займає в середньому від 3 годин</h4>
<p>
Зрозумілі API та документація дозволяють легко підключити платіжну
систему bill_line. Також маємо модульні рішення для типових
CMS. А наша підтримка швидко допоможе в разі чогось.
</p>
<p>
Якщо вам потрібна нестандартна інтеграція, створимо індивідуальне
рішення.
</p>
</div>
<div class="connect-card__button default-button -shadow -white">
<p>Підключити</p>
<span class="default-button__arrow"></span>
</div>
</div>
<div class="connect-card__right">API</div>
</div>
<hr style="margin: 50px 0" />
<!-- Main title section -->
<article class="main-title-section">
<div class="container">
<div class="main-title-section-container --content-container-S">
<h1 class="main-title__title title-1 mob-title-1 --bold-text">
Користуйтеся продуктами bill_line, щоб заробляти більше
</h1>
<div class="main-title__image"></div>
<p class="main-title__text text-1 mob-text-1">
Швидко приймайте та здійснюйте платежі, керуйте транзакціями в
<br />
особистому кабінеті та отримуйте індивідуальну аналітику.
</p>
</div>
</div>
</article>
<hr style="margin: 50px 0" />
<!-- Info card -->
<div class="default-info-card">
<div class="info-card__icon" style="background-color: #fadceb">
<span
class="--mask-item"
style="
background-color: #e5509b;
-webkit-mask-image: url(images/icons/link-simple.svg);
mask-image: url(images/icons/link-simple.svg);
"
></span>
</div>
<h4 class="info-card__title title-5 mob-title-5 --bold-text">
Платіжні посилання
</h4>
<div class="info-card__text text-2 mob-text-2">
<p>
Надсилайте індивідуальні посилання на оплату з даними замовлення на
e-mail або в месенджер вашому клієнту.
</p>
<p>
Клієнт відкриває посилання, бачить рахунок для оплати, вводить дані
карти і підтверджує платіж.
</p>
</div>
</div>
<div class="default-info-card">
<div class="info-card__icon" style="background-color: #e8ebf8">
<span
class="--mask-item"
style="
background-color: #8d9adb;
-webkit-mask-image: url(images/icons/headset.svg);
mask-image: url(images/icons/headset.svg);
"
></span>
</div>
<h4 class="info-card__title title-5 mob-title-5 --bold-text">
Технічна підтримка
</h4>
<div class="info-card__text text-2 mob-text-2">
<p>Допоможемо з підключенням продукту або вирішимо технічну проблему</p>
<a
href="mailto:support@billline.net"
target="_blank"
class="default-link --gradient-hover"
>
support@billline.net
</a>
<a href="#" target="_blank" class="default-link --gradient-hover">
Telegram
</a>
<a href="#" target="_blank" class="default-link --gradient-hover">
Skype
</a>
</div>
</div>
<div class="info-card-grid --content-container-M">
<div class="default-info-card">
<div class="info-card__icon" style="background-color: #fadceb">
<span
class="--mask-item"
style="
background-color: #e5509b;
-webkit-mask-image: url(images/icons/link-simple.svg);
mask-image: url(images/icons/link-simple.svg);
"
></span>
</div>
<h4 class="info-card__title title-5 mob-title-5 --bold-text">
Платіжні посилання
</h4>
<div class="info-card__text text-2 mob-text-2">
<p>
Надсилайте індивідуальні посилання на оплату з даними замовлення на
e-mail або в месенджер вашому клієнту.
</p>
<p>
Клієнт відкриває посилання, бачить рахунок для оплати, вводить дані
карти і підтверджує платіж.
</p>
</div>
</div>
<div class="default-info-card">
<div class="info-card__icon" style="background-color: #fbf2da">
<span
class="--mask-item"
style="
background-color: #ebbf46;
-webkit-mask-image: url(images/icons/shuffle-angular.svg);
mask-image: url(images/icons/shuffle-angular.svg);
"
></span>
</div>
<h4 class="info-card__title title-5 mob-title-5 --bold-text">
Каскадні <br />платежі
</h4>
<div class="info-card__text text-2 mob-text-2">
<p>
Співпрацюємо з декількома банками та проведемо платіж через інших
партнерів в разі чогось.
</p>
<p>Тому ваші клієнти безперебійно зможуть оплачувати онлайн.</p>
</div>
</div>
<div class="default-info-card">
<div class="info-card__icon" style="background-color: #e1f6fa">
<span
class="--mask-item"
style="
background-color: #6bd1e6;
-webkit-mask-image: url(images/icons/calendar-check.svg);
mask-image: url(images/icons/calendar-check.svg);
"
></span>
</div>
<h4 class="info-card__title title-5 mob-title-5 --bold-text">
Рекурентні платежі
</h4>
<div class="info-card__text text-2 mob-text-2">
<p>
Автоматизовуйте платіжні процеси, підключаючи рекурентні платежі.
</p>
<p>
Списуйте гроші з банківської картки клієнта за чітким графіком —
щодня, щотижня, щомісяця або з тою періодичністю, яка вам потрібна.
</p>
</div>
</div>
</div>
<div class="info-card-grid -two-col --content-container-M">
<div class="default-info-card">
<div class="info-card__icon" style="background-color: #e0eff9">
<span
class="--mask-item"
style="
background-color: #66aee0;
-webkit-mask-image: url(images/icons/currency-circle-dollar.svg);
mask-image: url(images/icons/currency-circle-dollar.svg);
"
></span>
</div>
<h4 class="info-card__title title-5 mob-title-5 --bold-text">
Приймайте платежі <br />в різних валютах
</h4>
<div class="info-card__text text-2 mob-text-2">
<p>
Основні валюти, які використовують клієнти bill_line — гривня,
долар, євро. Але підключаємо локальні валюти з будь-якої країни
світу.
</p>
</div>
</div>
<div class="default-info-card">
<div class="info-card__icon" style="background-color: #e7f4e1">
<span
class="--mask-item"
style="
background-color: #7ac668;
-webkit-mask-image: url(images/icons/timer.svg);
mask-image: url(images/icons/timer.svg);
"
></span>
</div>
<h4 class="info-card__title title-5 mob-title-5 --bold-text">
Отримуйте швидкі <br />виплати
</h4>
<div class="info-card__text text-2 mob-text-2">
<p>
В нас є різні варіанти отримання грошей. Це виплати на карту або
розрахунковий рахунок. В особистому кабінеті зможете налаштувати
автоматичні виплати по API або в будь-який момент отримати виплати в
ручному режимі.
</p>
</div>
</div>
<div class="default-info-card">
<div class="info-card__icon" style="background-color: #e8ebf8">
<span
class="--mask-item"
style="
background-color: #8d9adb;
-webkit-mask-image: url(images/icons/selection-plus.svg);
mask-image: url(images/icons/selection-plus.svg);
"
></span>
</div>
<h4 class="info-card__title title-5 mob-title-5 --bold-text">
Підключайте індивідуальне рішення
</h4>
<div class="info-card__text text-2 mob-text-2">
<p>
Маємо досвід роботи з різними нішами. Від Інтернет-магазинів до
маркетплейсів з великою кількістю платіжних операцій. Можемо
створити візуальне та технічне рішення під ваші потреби.
</p>
</div>
</div>
<div class="default-info-card">
<div class="info-card__icon" style="background-color: #fbf2da">
<span
class="--mask-item"
style="
background-color: #ebbf46;
-webkit-mask-image: url(images/icons/smiley-wink.svg);
mask-image: url(images/icons/smiley-wink.svg);
"
></span>
</div>
<h4 class="info-card__title title-5 mob-title-5 --bold-text">
Збільшуйте кількість вдалих оплат
</h4>
<div class="info-card__text text-2 mob-text-2">
<p>
Ваші клієнти зможуть здійснювати оплати без збоїв. Тому що ми
забезпечили безперебійну систему. Співпрацюємо з декількома банками
і проведемо платіж через інших партнерів.
</p>
</div>
</div>
</div>
<hr style="margin: 50px 0" />
<!-- Quote card -->
<article class="quote-section">
<div class="container">
<div class="quote-card --content-container-S">
<div class="quote-card-container" data-animate="swim-top">
<div class="quote-card__text-container">
<blockquote
class="quote-card__quote title-5 mob-title-5 --bold-text"
>
«Я вірю, що наша компанія стає все більше і більше про людей. Ми
виявляємо проблеми раніше, ніж їх помічає клієнт»
</blockquote>
<div class="quote-card__user">
<img
class="quote-card__user-photo -lazyload"
srcset="images/lazyload.png"
src="images/quote-card/quote-photo-1.png"
alt="Анатолій Платонов - BillLine.com"
/>
<div class="quote-card__user-info">
<div
class="quote-card__user-name text-2 mob-text-2 --bold-text"
>
Анатолій Платонов
</div>
<div class="quote-card__user-position text-3">
Head of bill_line Support
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</article>
<hr style="margin: 50px 0" />
<!-- CTA card -->
<article class="cta-section">
<div class="container">
<div class="cta-card -version-1">
<div class="cta-card__text-box --white-text">
<h2 class="cta-card__title title-2 mob-title-2 --bold-text">
Приймайте платежі з bill_line
</h2>
<div class="cta-card__text text-1 mob-text-1">
<p>
Надайте своїм клієнтам швидший, простіший і безпечніший спосіб
оплати.
</p>
</div>
<div class="cta-card__button-box">
<a
href="https://cabinet.billline.net/register"
target="_blank"
class="default-button -shadow -white"
>
<p>Реєстрація</p>
<span class="default-button__arrow"></span>
</a>
<a href="#" class="default-button --white-text">
<p data-hover-text="Написати Sales">Написати Sales</p>
<span class="default-button__arrow"></span>
</a>
</div>
</div>
<div class="cta-card__illustration">
<img
src="images/cta-card/cta-illustration-1.png"
alt="Приймайте платежі з bill_line - BillLine.com"
/>
</div>
</div>
<div class="cta-card -version-2">
<div class="cta-card__text-box --white-text">
<h2 class="cta-card__title title-2 mob-title-2 --bold-text">
Допомагаємо компаніям швидко отримувати платежі, керувати ними та
заробляти більше
</h2>
<div class="cta-card__button-box">
<a href="#" class="default-button -shadow -white">
<p>Підключити</p>
<span class="default-button__arrow"></span>
</a>
</div>
</div>
<div class="cta-card__illustration">
<img
src="images/cta-card/cta-illustration-2.png"
alt="Допомагаємо компаніям швидко отримувати платежі, керувати ними та заробляти більше - BillLine.com"
/>
</div>
</div>
<div class="cta-card -banner">
<div class="cta-card__text-box">
<h2 class="cta-card__title title-2 mob-title-2 --bold-text">
Як bill_line Checkout збільшив кількість вдалих оплат на 33%
</h2>
<div class="cta-card__text text-1 mob-text-1">
<p>
Дізнавайтеся на прикладах співпраць, які результати приносить
Checkout bill_line
</p>
</div>
<div class="cta-card__button-box">
<a href="#" class="default-button -shadow -black">
<p>Дізнатись більше</p>
<span class="default-button__arrow"></span>
</a>
</div>
</div>
<div class="cta-card__custom-image-box">
<div class="cta-card__custom-image">
<img src="images/logo-text.svg" alt="BillLine.com" />
</div>
<div class="cta-card__custom-x">
<img
src="images/cta-card/banner-x.svg"
alt="Дізнавайтеся на прикладах співпраць - BillLine.com"
/>
</div>
<div class="cta-card__custom-image-text">
<img
src="images/cta-card/the-best-company-text.svg"
alt="The Best Company - BillLine.com"
/>
</div>
</div>
</div>
</div>
</article>
<hr style="margin: 50px 0" />
<!-- Info block -->
<article class="info-block-section">
<div class="container">
<div class="info-block --content-container-M">
<div class="info-block__text-box">
<div class="info-block__editor">
<h2>Постійно покращуємо технології</h2>
<p>
Ми розвиваємо лише платіжну систему, і розуміємо, що потрібно
бізнесу.
</p>
<p>
Вузька спеціалізація дозволяє постійно покращувати продукти
bill_line. А внутрішня команда розробників регулярно створює та
тестує нові функції.
</p>
<p>
Як результат, бізнес отримує кращий досвід роботи з платежами.
</p>
</div>
</div>
<div class="info-block__image -square">
<img
src="images/info-block/improve-tech-image.jpg"
alt="Постійно покращуємо технології - BillLine.com"
/>
</div>
</div>
<div class="info-block -reverse --content-container-M">
<div class="info-block__text-box">
<div class="info-block__editor">
<h2>Постійно покращуємо технології</h2>
<p>
Ми розвиваємо лише платіжну систему, і розуміємо, що потрібно
бізнесу.
</p>
<p>
Вузька спеціалізація дозволяє постійно покращувати продукти
bill_line. А внутрішня команда розробників регулярно створює та
тестує нові функції.
</p>
<p>
Як результат, бізнес отримує кращий досвід роботи з платежами.
</p>
</div>
</div>
<div class="info-block__image -square">
<img
src="images/info-block/improve-tech-image.jpg"
alt="Постійно покращуємо технології - BillLine.com"
/>
</div>
</div>
<div class="info-block --content-container-M">
<div class="info-block__text-box">
<div class="info-block__editor">
<h2>Аналітика за запитом</h2>
<p>
Отримуйте звіт всіх транзакцій, конверсій, доходів, обороту,
платежів за місцем їх проведення, за видами карток, платіжних
операцій кожного каналу та інформації про платників.
</p>
<p>
Також можемо створити кастомну аналітику під будь-який запит.
</p>
</div>
</div>
<div class="info-block__image -landscape -white-bg -contain">
<img
src="images/info-block/stats-image.svg"
alt="Аналітика за запитом - BillLine.com"
/>
</div>
</div>
<div class="info-block -checkout --content-container-M">
<div class="info-block__text-box">
<div class="info-block__editor">
<h2>Використовуйте bill_line Checkout</h2>
<blockquote>
Кожна третя компанія з кастомним чекаутом збільшує ефективність
платежів на 21%
</blockquote>
<p>
Незалежно від того, що ви продаєте в Інтернеті, можемо
підключити ваш Checkout або bill_line Checkout, щоб безпечно
приймати платежі.
</p>
<p>
Постійно покращуємо деталі сторінки оформлення замовлення і
збільшуємо конверсію.
</p>
<p>
Створимо візуальну та функціональну сторінку чекауту, яка буде
вирішувати конкретно ваші задачі, якщо потрібно.
</p>
</div>
</div>
<div class="info-block__image -gray-bg">
<img
src="images/info-block/checkout-image.png"
alt="Використовуйте bill_line Checkout - BillLine.com"
/>
</div>
</div>
<div class="info-block -connect --content-container-M">
<div class="info-block__text-box">
<div class="info-block__editor">
<h2>Допомога при підключенні</h2>
<p>
Прості API та документація дозволяють легко підключити платіжну
систему bill_line.
</p>
<p>
Якщо у вас виникли питання чи проблеми з підключенням, технічні
спеціалісти bill_line підкажуть і допоможуть в разі чогось.
</p>
</div>
<div class="info-block__button-box">
<a href="#" class="default-button -shadow -black">
<p>Написати в підтримку</p>
<span class="default-button__arrow"></span>
</a>
<a href="#" class="default-button">
<p data-hover-text="Дивитись документацію">
Дивитись документацію
</p>
</a>
</div>
</div>
<div class="info-block__image -gray-bg -square"></div>
</div>
<div class="info-block -analytics --content-container-M">
<div class="info-block__text-box">
<div class="info-block__editor">
<h2>Детальна аналітика за запитом</h2>
<p>
Отримуйте звіт всіх транзакцій, конверсій, доходів, обороту,
платежів за місцем їх проведення, за типами карток, платіжних
операцій кожного каналу та інформації про платників.
</p>
<p>
Щоб ви аналізували фінансові показники і масштабували бізнес.
Також можемо створити кастомну аналітику під будь-який запит.
</p>
</div>
</div>
<div class="info-block__image">
<div class="info-block__image-box"></div>
<div class="info-block__image-box"></div>
</div>
</div>
<div class="info-block -secure --content-container-M">
<div class="info-block__text-box">
<div class="info-block__editor">
<h2>Безпека платежів в пріоритеті</h2>
<p>
bill_line сертифікована за найвищими галузевими стандартами та
відповідає світовим стандартам безпеки.
</p>
</div>
</div>
<div class="info-block__image">
<div class="info-block__image-box">
<img
src="images/info-block/secure-img-1.png"
alt="Безпека платежів в пріоритеті - BillLine.com"
/>
</div>
<div class="info-block__image-box">
<img
src="images/info-block/secure-img-2.png"
alt="Безпека платежів в пріоритеті - BillLine.com"
/>
</div>
</div>
</div>
<div class="info-block -system --content-container-M">
<div class="info-block__text-box">
<div class="info-block__editor">
<h2>Платіжна система bill_line</h2>
<p>
Підходить для Інтернет магазинів, платформ, маркетплейсів,
банків, страхових компаній, ігор, благодійних організацій, служб
таксі, онлайн кас, мобільних операторів, магазинів в Instagram,
Telegram, стрімів, донатів та будь-яких інших компаній, які
мають платіжні операції в Інтернеті.
</p>
<blockquote>
Ми маємо досвід роботи з різними нішами та можемо створити
рішення під потреби вашого бізнесу.
</blockquote>
</div>
</div>
<div class="info-block__image">
<div class="info-block__image-box">
<img
src="images/info-block/system-img-1.jpg"
alt="Платіжна система bill_line - BillLine.com"
/>
<img
src="images/info-block/system-img-2.jpg"
alt="Платіжна система bill_line - BillLine.com"
/>
</div>
<div class="info-block__image-box">
<img
src="images/info-block/system-img-3.jpg"
alt="Платіжна система bill_line - BillLine.com"
/>
<img
src="images/info-block/system-img-4.jpg"
alt="Платіжна система bill_line - BillLine.com"
/>
</div>
<div class="info-block__image-box">
<img
src="images/info-block/system-img-5.jpg"
alt="Платіжна система bill_line - BillLine.com"
/>
<img
src="images/info-block/system-img-6.jpg"
alt="Платіжна система bill_line - BillLine.com"
/>
</div>
</div>
</div>
<div class="info-block -payment --content-container-M">
<div class="info-block__text-box">
<div class="info-block__editor">
<h2>Найзручніші методи оплат</h2>
<p>
Ми співпрацюємо тільки з надійними та перевіреними компаніями,
заради комфорту та безпеки наших клієнтів.
</p>
</div>
</div>
<div class="info-block__image">
<div class="info-block__logo">
<img src="images/logo.svg" alt="BillLine.com" />
</div>
<div class="info-block__image-box">
<img
src="images/info-block/apple-pay.svg"
alt="Apple Pay - BillLine.com"
/>
</div>
<div class="info-block__image-box">
<img
src="images/info-block/union-pay.svg"
alt="Union Pay - BillLine.com"
/>
</div>
<div class="info-block__image-box">
<img
src="images/info-block/mastercard.svg"
alt="Mastercard - BillLine.com"
/>
</div>
<div class="info-block__image-box">
<img
src="images/info-block/prostir.png"
alt="Простір - BillLine.com"
/>
</div>
<div class="info-block__image-box">
<img
src="images/info-block/telegram.svg"
alt="Telegram - BillLine.com"
/>
</div>
<div class="info-block__image-box">
<img
src="images/info-block/google-pay.svg"
alt="Google Pay - BillLine.com"
/>
</div>
<div class="info-block__image-box">
<img src="images/info-block/visa.svg" alt="Visa - BillLine.com" />
</div>
</div>
</div>
<div class="info-block -integration --content-container-M">
<div class="info-block__text-box">
<div class="info-block__editor">
<h2>Інтегруємося з різними CMS та платформами</h2>
<p>
Співпрацюємо з найбільш популярними платформами і пропонуємо
плагіни, які допоможуть легко почати вашу інтеграцію.
</p>
</div>
</div>
<div class="info-block__image">
<div class="info-block__image-box">
<img
src="images/info-block/ship-station.svg"
alt="Ship Station - BillLine.com"
/>
</div>
<div class="info-block__image-box">
<img
src="images/info-block/salesforce.svg"
alt="Salesforce - BillLine.com"
/>
</div>
<div class="info-block__image-box">
<img
src="images/info-block/simpla.png"
alt="Simpla - BillLine.com"
/>
</div>
<div class="info-block__image-box">
<img
src="images/info-block/prestashop.svg"
alt="Presta Shop - BillLine.com"
/>
</div>
<div class="info-block__image-box">
<img src="images/info-block/woo.png" alt="Woo - BillLine.com" />
</div>
<div class="info-block__image-box">
<img
src="images/info-block/magento.svg"
alt="Magento - BillLine.com"
/>
</div>
<div class="info-block__image-box">
<img
src="images/info-block/shippo.png"
alt="Shippo - BillLine.com"
/>
</div>
</div>
</div>
<div class="info-block --content-container-M">
<div class="info-block__text-box">
<div class="info-block__editor">
<h2>Приймайте платежі в різних валютах</h2>
<p>
Дозвольте клієнтам платити в зручній для них валюті. Основні
валюти, які використовують клієнти bill_line – гривня, долар та
євро. Але ми можемо підключити локальні валюти з будь-якої
країни світу.
</p>
</div>
</div>
<div class="info-block__image -currency -gray-bg">
<div class="currency-ani-block">
<div class="currency-ani-block__item -active">
<div class="currency-ani-block__left">
<div
class="currency-ani-block__currency"
style="background-color: #fadceb"
>
<span
class="--mask-item"
style="
background-color: #e5509b;
-webkit-mask-image: url(images/currency-icons/uah.svg);
mask-image: url(images/currency-icons/uah.svg);
"
></span>
</div>
<div class="currency-ani-block__name text-2 --bold-text">
Гривні
</div>
</div>
<div class="currency-ani-block__button">
<span></span>
</div>
</div>
<div class="currency-ani-block__item -active">
<div class="currency-ani-block__left">
<div
class="currency-ani-block__currency"
style="background-color: #e7f4e1"
>
<span
class="--mask-item"
style="
background-color: #7ac668;
-webkit-mask-image: url(images/currency-icons/usd.svg);
mask-image: url(images/currency-icons/usd.svg);
"
></span>
</div>
<div class="currency-ani-block__name text-2 --bold-text">
Долари
</div>
</div>
<div class="currency-ani-block__button">
<span></span>
</div>
</div>
<div class="currency-ani-block__item">
<div class="currency-ani-block__left">
<div
class="currency-ani-block__currency"
style="background-color: #e0eff9"
>
<span
class="--mask-item"
style="
background-color: #66aee0;
-webkit-mask-image: url(images/currency-icons/eur.svg);
mask-image: url(images/currency-icons/eur.svg);
"
></span>
</div>
<div class="currency-ani-block__name text-2 --bold-text">
Євро
</div>
</div>
<div class="currency-ani-block__button">
<span></span>
</div>
</div>
<div class="currency-ani-block__item">
<div class="currency-ani-block__left">
<div
class="currency-ani-block__currency"
style="background-color: #fbf2da"
>
<span
class="--mask-item"
style="
background-color: #ebbf46;
-webkit-mask-image: url(images/currency-icons/crypto.svg);
mask-image: url(images/currency-icons/crypto.svg);
"
></span>
</div>
<div class="currency-ani-block__name text-2 --bold-text">
Крипта
</div>
</div>
<div class="currency-ani-block__button">
<span></span>
</div>
</div>
<div class="currency-ani-block__item -active">
<div class="currency-ani-block__left">
<div
class="currency-ani-block__currency"
style="background-color: #e8ebf8"
>
<span
class="--mask-item"
style="
background-color: #8d9adb;
-webkit-mask-image: url(images/currency-icons/star.svg);
mask-image: url(images/currency-icons/star.svg);
"
></span>
</div>
<div class="currency-ani-block__name text-2 --bold-text">
Саме та, яка буде <br />
потрібна вам
</div>
</div>
<div class="currency-ani-block__button">
<span></span>
</div>
</div>
</div>
</div>
</div>
<div class="info-block --content-container-M">
<div class="info-block__text-box">
<div class="info-block__editor">
<h2>Приймайте платежі в різних валютах</h2>
<p>
Дозвольте клієнтам платити в зручній для них валюті. Основні
валюти, які використовують клієнти bill_line – гривня, долар та
євро. Але ми можемо підключити локальні валюти з будь-якої
країни світу.
</p>
</div>
</div>
<div class="info-block__image -graph">
<div class="graph-ani-block">
<div class="graph-ani-block__title --bold-text">
Кількість клієнтів
</div>
<div class="graph-ani-block__graph-box">
<div class="graph-ani-block__graphs">
<div
class="
graph-ani-block__graphs-container
subtitle-1
mob-text-1
--bold-text
--white-text
"
>
<div class="graph-ani-block__graph">
<p>57 984</p>
</div>
<div class="graph-ani-block__graph">
<p>55 223</p>
</div>
<div class="graph-ani-block__graph">
<p>73 581</p>
</div>
<div class="graph-ani-block__graph -active">
<p>133 782</p>
</div>
<div class="graph-ani-block__graph">
<p>137 795</p>
</div>
</div>
</div>
<div class="graph-ani-block__months --bold-text">
<div class="graph-ani-block__month">Березень</div>
<div class="graph-ani-block__month">Квітень</div>
<div class="graph-ani-block__month">Травень</div>
<div class="graph-ani-block__month -active">Червень</div>
<div class="graph-ani-block__month">Липень</div>
</div>
</div>
</div>
</div>
</div>
</div>
</article>
<hr style="margin: 50px 0" />
<script src="js/lib/jquery-3.6.0.min.js"></script>
<script src="js/lib/jquery.inputmask.min.js"></script>
<script src="js/custom-solutions.js"></script>
<script src="js/form.js"></script>
<script src="js/script.js"></script>
<script src="js/test.js"></script>
</body>
</html>