/* =====================
  Design Tokens
====================== */
:root{
  --bg: #F6F7FB;
  --card: #FFFFFF;
  --text: #0F172A;
  --muted: #64748B;
  --border: #E2E8F0;

  --accent: #FF8A00;
  --grad-a: #5B5FFF;
  --grad-b: #8A4DFF;
  --grad-c: #FF6A88;

  --shadow: 0 12px 32px rgba(15,23,42,.08);
  --shadow-hover: 0 16px 40px rgba(15,23,42,.12);

  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 20px;
  --r-xl: 28px;

  --container: 1200px;
}

/* =====================
  Base
====================== */
*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";
  color:var(--text);
  background: var(--bg);
  line-height:1.5;
}
a{ color:inherit; text-decoration:none; }
.container{
  width: min(var(--container), calc(100% - 48px));
  margin: 0 auto;
}

/* =====================
  Header
====================== */
header{
  position: sticky;
  top:0;
  z-index: 50;
  backdrop-filter: blur(14px);
  background: rgba(246,247,251,.7);
  border-bottom: 1px solid rgba(226,232,240,.7);
}
.nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 0;
  gap: 16px;
}
.brand {
  display:flex;
  align-items:center;
  gap: 12px;
  font-weight: 700;
  letter-spacing: .2px;
}
.brand img {
  height: 30px  
}
.logo{
  width:38px;height:38px;border-radius: 12px;
  background: linear-gradient(135deg,var(--grad-a),var(--grad-b),var(--grad-c));
  box-shadow: 0 10px 24px rgba(91,95,255,.22);
}
.navlinks{
  display:flex;
  align-items:center;
  gap: 18px;
  color: var(--muted);
  font-weight: 600;
  font-size: 14px;
}
.navlinks a{ padding: 8px 10px; border-radius: 10px; }
.navlinks a:hover{ background: rgba(15,23,42,.05); color: var(--text); }

.navactions{ display:flex; align-items:center; gap: 10px; }
.burger{
  display:none;
  width:42px;height:42px;border-radius: 12px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.65);
  cursor:pointer;
}
.burger:active{ transform: scale(.98); }
.burger span{
  display:block;
  width:18px;height:2px;background: var(--text);
  margin: 0 auto;
  border-radius: 2px;
  position: relative;
}
.burger span::before, .burger span::after{
  content:"";
  position:absolute; left:0;
  width:18px;height:2px;background: var(--text);
  border-radius:2px;
}
.burger span::before{ top:-6px; }
.burger span::after{ top:6px; }

/* =====================
  Buttons
====================== */
.btn{
  height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 0 22px;
  border-radius: var(--r-md);
  font-weight: 700;
  font-size: 14px;
  border: 1px solid transparent;
  cursor:pointer;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease, opacity .15s ease;
  user-select:none;
  white-space: nowrap;
}
.btn:active{ transform: scale(.98); }
.btn-primary{
  color:#fff;
  background: linear-gradient(135deg,var(--grad-a) 0%, var(--grad-b) 45%, var(--grad-c) 100%);
  box-shadow: 0 12px 26px rgba(138,77,255,.25);
}
.btn-primary:hover{ box-shadow: 0 16px 34px rgba(138,77,255,.30); }
.btn-ghost{
  color: var(--text);
  background: rgba(255,255,255,.65);
  border-color: var(--border);
}
.btn-ghost:hover{ box-shadow: var(--shadow); }
.btn-dark{
  color:#fff;
  background: rgba(15,23,42,.92);
  border-color: rgba(15,23,42,.92);
  box-shadow: 0 12px 26px rgba(15,23,42,.20);
}
.btn-dark:hover{ box-shadow: 0 16px 34px rgba(15,23,42,.26); }

/* =====================
  Hero
====================== */
.hero{
  position: relative;
  overflow:hidden;
  padding: 72px 0 44px;
}
.hero-bg{
  position:absolute; inset:-120px -160px auto -160px;
  height: 520px;
  background:
    radial-gradient(700px 340px at 18% 40%, rgba(91,95,255,.45), transparent 60%),
    radial-gradient(600px 320px at 62% 35%, rgba(138,77,255,.42), transparent 60%),
    radial-gradient(520px 320px at 88% 20%, rgba(255,106,136,.35), transparent 60%);
  filter: blur(0px);
  pointer-events:none;
}
.hero-shell{
  position: relative;
  border-radius: var(--r-xl);
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(226,232,240,.9);
  box-shadow: var(--shadow);
  overflow:hidden;
}
.hero-inner{
  display:grid;
  grid-template-columns: 1.25fr .75fr;
  gap: 24px;
  padding: 44px;
  align-items: center;
}
.kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(226,232,240,.9);
  background: rgba(255,255,255,.7);
  font-weight: 700;
  color: rgba(15,23,42,.85);
  font-size: 13px;
  width: fit-content;
}
.dot{
  width:10px;height:10px;border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 6px rgba(255,138,0,.18);
}
h1{
  margin: 14px 0 10px;
  font-size: 48px !important;
  line-height: 1.15;
  letter-spacing: -.5px;
}
.lead{
  margin: 0 0 18px;
  color: var(--muted);
  font-size: 16px;
  max-width: 52ch;
}
.hero-actions{
  display:flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 10px;
}

.hero-side{
  position: relative;
  border-radius: 22px;
  background:
    linear-gradient(135deg, rgba(91,95,255,.14), rgba(138,77,255,.10), rgba(255,106,136,.10));
  border: 1px solid rgba(226,232,240,.9);
  padding: 18px;
  overflow:hidden;
  min-height: 260px;
}
.stat{
  display:grid;
  gap: 6px;
  padding: 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(226,232,240,.9);
  box-shadow: 0 10px 24px rgba(15,23,42,.06);
  margin-bottom: 10px;
}
.stat b{ font-size: 18px; }
.stat span{ color: var(--muted); font-weight: 600; font-size: 13px; }
.blob{
  position:absolute;
  inset:auto -60px -80px auto;
  width: 280px; height: 280px;
  background: linear-gradient(135deg,var(--grad-a),var(--grad-b),var(--grad-c));
  border-radius: 60% 40% 55% 45% / 55% 60% 40% 45%;
  filter: blur(14px);
  opacity: .35;
  pointer-events:none;
}

/* =====================
  Flow sections (single-flow, but visually grouped)
====================== */
.flow{ padding: 26px 0 76px; }
.group{ margin-top: 26px; }
.group-title{
  font-size: 22px;
  margin: 0 0 14px;
  letter-spacing: -.2px;
}
.subtle{
  color: var(--muted);
  font-weight: 600;
  font-size: 14px;
  margin: -4px 0 18px;
}

/* Cards */
.grid-3{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.grid-2{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}
.card{
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(226,232,240,.9);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow);
  padding: 22px;
  transition: transform .15s ease, box-shadow .15s ease;
  overflow:hidden;
  position: relative;
}
.card:hover{ transform: translateY(-4px); box-shadow: var(--shadow-hover); }
.card h3{
  margin: 0 0 6px;
  font-size: 16px;
  letter-spacing: -.2px;
}
.card p{ margin:0; color: var(--muted); font-size: 14px; }
.icon{
  width:44px;height:44px;border-radius: 14px;
  display:grid; place-items:center;
  background: linear-gradient(135deg, rgba(91,95,255,.18), rgba(138,77,255,.14), rgba(255,106,136,.14));
  border: 1px solid rgba(226,232,240,.9);
  margin-bottom: 12px;
}
.icon svg{ width:22px; height:22px; color: rgba(15,23,42,.85); }

/* Case cards */
.case-metric{
  display:flex;
  align-items: baseline;
  gap: 10px;
  margin-top: 10px;
  color: var(--muted);
  font-weight: 700;
  font-size: 13px;
}
.case-metric b{
  color: var(--text);
  font-size: 26px;
  letter-spacing: -.6px;
}
.mini-chart{
  margin-top: 14px;
  height: 68px;
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(91,95,255,.16), rgba(255,255,255,0)),
    repeating-linear-gradient(90deg, rgba(226,232,240,.8) 0 1px, transparent 1px 14px);
  border: 1px solid rgba(226,232,240,.9);
  position: relative;
  overflow:hidden;
}
.mini-chart::after{
  content:"";
  position:absolute; inset: 14px 14px 14px 14px;
  background: linear-gradient(90deg, rgba(91,95,255,.0), rgba(138,77,255,.28), rgba(255,106,136,.24));
  clip-path: polygon(0% 80%, 18% 62%, 38% 72%, 56% 45%, 74% 52%, 100% 20%, 100% 100%, 0% 100%);
  border-radius: 10px;
  opacity: .9;
}

/* Pricing */
.price{
  display:flex;
  align-items: baseline;
  gap: 8px;
  margin: 10px 0 14px;
}
.price b{ font-size: 30px; letter-spacing: -.6px; }
.price span{ color: var(--muted); font-weight: 700; font-size: 13px; }
.pill{
  display:inline-flex;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(226,232,240,.9);
  background: rgba(255,255,255,.8);
  color: rgba(15,23,42,.82);
  font-weight: 800;
  font-size: 12px;
  width: fit-content;
  /*margin-bottom: 10px;*/
}
.list{
  display:grid;
  gap: 10px;
  margin: 0 0 16px;
  padding: 0;
  list-style:none;
  color: var(--muted);
  font-weight: 600;
  font-size: 14px;
}
.list li{
  display:flex; align-items:center; gap: 10px;
}
.check{
  width:18px;height:18px;border-radius: 6px;
  background: rgba(255,138,0,.16);
  border: 1px solid rgba(255,138,0,.28);
  display:grid; place-items:center;
  flex: 0 0 auto;
}
.check svg{ width:12px; height:12px; color: rgba(15,23,42,.85); }

/* CTA */
.cta{
  padding: 26px;
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 18px;
  align-items:center;
  background:
    radial-gradient(600px 220px at 25% 10%, rgba(91,95,255,.22), transparent 60%),
    radial-gradient(560px 220px at 90% 25%, rgba(255,106,136,.16), transparent 60%),
    rgba(255,255,255,.75);
  border: 1px solid rgba(226,232,240,.9);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow);
  overflow:hidden;
  position: relative;
}
.cta h2{
  margin: 0 0 8px;
  font-size: clamp(22px, 2.6vw, 36px);
  line-height: 1.15;
  letter-spacing: -.4px;
}
.cta p{ margin: 0; color: var(--muted); font-weight: 600; }

form{
  display:grid;
  gap: 10px;
}
.row{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.input{
  height: 56px;
  padding: 0 14px;
  border-radius: var(--r-md);
  border: 1px solid var(--border);
  background: rgba(255,255,255,.8);
  outline: none;
  font-weight: 650;
  color: var(--text);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.input::placeholder{ color: rgba(100,116,139,.9); font-weight: 600; }
.input:focus{
  border-color: rgba(138,77,255,.75);
  box-shadow: 0 0 0 6px rgba(138,77,255,.12);
}
.note{
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
  margin-top: 6px;
}

/* Footer */
footer{
  padding: 26px 0 34px;
  color: var(--muted);
  font-weight: 600;
  font-size: 14px;
}
.foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  flex-wrap: wrap;
  padding-top: 16px;
  border-top: 1px solid rgba(226,232,240,.9);
}
.foot a{ color: rgba(15,23,42,.78); }
.foot a:hover{ text-decoration: underline; }

/* Mobile menu */
.mobile-menu{
  display:none;
  padding: 10px 0 14px;
}
.mobile-menu a{
  display:block;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(226,232,240,.9);
  background: rgba(255,255,255,.7);
  margin-top: 8px;
  color: rgba(15,23,42,.82);
  font-weight: 750;
}

.btn--ghost {
    background: url(./img/ico_tg_white.svg) no-repeat 7px center, #0088CC !important;
    background-size: 20px !important;
    padding-left: 34px !important;
    color: white !important;
}
.btn--ghost:hover {
    background: url(./img/ico_tg_white.svg) no-repeat 7px center, #0088CC !important;
    background-size: 20px !important;
    padding-left: 34px !important;
    color: white !important;
}

:root{
  --brand:#5e5dff;
  --brand-2:#7a79ff;
  --text:#0f172a;
  --muted:#475569;
  --bg:#f7f8ff;
  --card:#ffffff;
  --border:rgba(15,23,42,.10);
  --shadow:0 18px 45px rgba(15,23,42,.08);
  --shadow-soft:0 10px 30px rgba(15,23,42,.10);
  --radius:18px;
  --radius-lg:26px;
  --container:1140px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
  color:var(--text);
  /*background:*/
    /*radial-gradient(900px 500px at 80% -10%, rgba(94,93,255,.18), transparent 60%),*/
    /*radial-gradient(900px 500px at 20% -10%, rgba(94,93,255,.10), transparent 60%),*/
    /*linear-gradient(180deg, #ffffff 0%, var(--bg) 55%, #ffffff 100%);*/
}
a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}

.container{
  width:min(var(--container), calc(100% - 40px));
  margin-inline:auto;
}

/* Header */
.header{
  position:sticky;
  top:0;
  z-index:10;
  backdrop-filter:saturate(180%) blur(12px);
  background:rgba(255,255,255,.70);
  border-bottom:1px solid rgba(15,23,42,.06);
}
.header__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:14px 0;
}
.brand{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:800;
  letter-spacing:.2px;
}
.brand__mark{
  width:34px;height:34px;border-radius:12px;
  background:linear-gradient(135deg, var(--brand) 0%, #8e8dff 60%, #c2c1ff 100%);
  box-shadow:0 10px 30px rgba(94,93,255,.25);
  position:relative;
  overflow:hidden;
}
.brand__mark::after{
  content:"";
  position:absolute; inset:-30%;
  background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.55) 50%, transparent 100%);
  transform:rotate(25deg) translateX(-40%);
  opacity:.7;
}
.brand img {
  height: 40px;
}
.nav{
  display:flex;
  gap:18px;
  align-items:center;
  color:rgba(15,23,42,.85);
  font-weight:600;
  font-size:14px;
}
.nav a{padding:10px 10px; border-radius:12px}
.nav a:hover{background:rgba(94,93,255,.08); color:var(--brand)}
.header__right{
  display:flex;
  align-items:center;
  gap:12px;
}

/* Buttons */
.btn{
  border:1px solid rgba(15,23,42,.10);
  background:#fff;
  padding:12px 16px;
  border-radius:14px;
  font-weight:700;
  font-size:14px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  cursor:pointer;
  transition:.18s ease;
  box-shadow:0 8px 20px rgba(15,23,42,.06);
}
.btn:hover{transform:translateY(-1px); box-shadow:0 12px 30px rgba(15,23,42,.10)}
.btn--primary{
  border:none;
  color:#fff;
  background:linear-gradient(135deg, var(--brand) 0%, #7b7aff 55%, #a3a2ff 110%);
  box-shadow:0 18px 45px rgba(94,93,255,.28);
}
.btn--primary:hover{box-shadow:0 22px 55px rgba(94,93,255,.34)}
.btn--ghost{
  background:rgba(94,93,255,.08);
  border:1px solid rgba(94,93,255,.20);
  color:var(--brand);
  box-shadow:none;
}
.btn--ghost:hover{background:rgba(94,93,255,.12); box-shadow:none}
.btn__dot{
  width:10px;height:10px;border-radius:50%;
  background:rgba(255,255,255,.85);
  box-shadow:0 0 0 6px rgba(255,255,255,.22);
}

/* Hero */
.hero{
  padding:54px 0 26px;
  /*background: #f9f2fd;*/
  background: url(/assets/img/main_block_bg.svg) no-repeat center center;
  background-size: contain;
  margin-bottom: -100px;
}
.hero__grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap:34px;
  align-items:center;
}
.kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(94,93,255,.18);
  background:rgba(94,93,255,.08);
  color:var(--brand);
  font-weight:800;
  font-size:13px;
}
.kicker .pill{
  padding:6px 10px;
  border-radius:999px;
  background:#fff;
  color:rgba(15,23,42,.85);
  border:1px solid rgba(15,23,42,.08);
  font-weight:800;
  font-size:12px;
}
h1{
  margin:14px 0 10px;
  font-size: clamp(34px, 3.6vw, 54px);
  line-height:1.05;
  letter-spacing:-.8px;
}
.lead{
  margin:0;
  color:var(--muted);
  font-size:16px;
  line-height:1.6;
  max-width:56ch;
}
.hero__actions{
  margin-top:18px;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}
.hero__note{
  margin-top:10px;
  color:rgba(71,85,105,.95);
  font-size:13px;
}

/* Hero art */
.hero__art{
  position:relative;
  /*border-radius:var(--radius-lg);*/
/*      background:
    radial-gradient(700px 250px at 60% 0%, rgba(94,93,255,.25), transparent 60%),
    radial-gradient(500px 300px at 10% 80%, rgba(94,93,255,.18), transparent 60%),
    linear-gradient(135deg, rgba(94,93,255,.10), rgba(255,255,255,.60));*/
  /*border:1px solid rgba(94,93,255,.14);*/
  /*min-height:360px;*/
  /*overflow:hidden;*/
  /*box-shadow:var(--shadow);*/
  /*isolation:isolate;*/
}
.hero__art img {
  border-radius: 20px;
}
.hero__art::before{
  /*content:"";*/
  /*position:absolute;*/
  /*inset:-40% -20%;*/
  /*background:linear-gradient(90deg, transparent, rgba(255,255,255,.65), transparent);*/
  /*transform:rotate(22deg);*/
  /*opacity:.55;*/
  /*box-shadow: inset 5px 5px black;*/
}
.card3d{
  position:absolute;
  left:8%;
  top:18%;
  width:76%;
  height:64%;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.55));
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 25px 70px rgba(15,23,42,.14);
  overflow:hidden;
}
.card3d__top{
  height:42px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 16px;
  border-bottom:1px solid rgba(15,23,42,.06);
  background:rgba(255,255,255,.65);
}
.dot{width:10px;height:10px;border-radius:999px;background:rgba(15,23,42,.12)}
.card3d__content{
  padding:16px;
  height:calc(100% - 42px);
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  align-content:start;
}
.mini{
  display:flex;
  gap:12px;
  align-items:center;
}
.mini__icon{
  width:44px;height:44px;border-radius:14px;
  background:rgba(94,93,255,.12);
  border:1px solid rgba(94,93,255,.20);
  position:relative;
  overflow:hidden;
}
.mini__icon::after{
  content:"";
  position:absolute; inset:12px;
  border-radius:10px;
  background:linear-gradient(135deg, var(--brand), #9b9aff);
  opacity:.9;
}
.mini__text{flex:1}
.mini__title{font-weight:800; font-size:13px; margin:0}
.mini__desc{margin:3px 0 0; color:rgba(71,85,105,.92); font-size:12px; line-height:1.35}
.chart{
  height:140px;
  border-radius:18px;
  background:
    linear-gradient(180deg, rgba(94,93,255,.10), rgba(94,93,255,.02)),
    repeating-linear-gradient(90deg, rgba(15,23,42,.05) 0 1px, transparent 1px 22px),
    repeating-linear-gradient(0deg, rgba(15,23,42,.05) 0 1px, transparent 1px 22px);
  border:1px solid rgba(15,23,42,.07);
  position:relative;
  overflow:hidden;
}
.chart svg{
  position:absolute; inset:0;
  width:100%; height:100%;
}
.badge-top10{
  position:absolute;
  right:18px;
  top:18px;
  padding:10px 12px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 16px 40px rgba(15,23,42,.10);
  font-weight:900;
  color:var(--brand);
  letter-spacing:.4px;
  font-size:12px;
}
.coin{
  position:absolute;
  right:-22px;
  bottom:-18px;
  width:160px;height:160px;
  border-radius:999px;
  background:
    radial-gradient(circle at 30% 25%, rgba(255,255,255,.85), transparent 42%),
    radial-gradient(circle at 65% 70%, rgba(255,255,255,.40), transparent 50%),
    linear-gradient(135deg, rgba(94,93,255,.75), rgba(94,93,255,.18));
  filter:saturate(120%);
  opacity:.9;
  transform:rotate(15deg);
  border:1px solid rgba(255,255,255,.25);
  box-shadow:0 25px 70px rgba(94,93,255,.20);
  z-index:-1;
}

/* Sections */
.section{padding:28px 0}
.section__title{
  margin:0 0 14px;
  font-size: clamp(22px, 2.1vw, 30px);
  letter-spacing:-.4px;
}
.section__sub{
  margin:-6px 0 18px;
  color:var(--muted);
  line-height:1.55;
  max-width:70ch;
}

/* Feature cards */
.grid-3{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:16px;
}
.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:0 14px 40px rgba(15,23,42,.06);
  padding:18px;
}
.card--accent{
  background:
    radial-gradient(420px 200px at 20% 0%, rgba(255,255,255,.30), transparent 50%),
    linear-gradient(135deg, rgba(94,93,255,1) 0%, rgba(123,122,255,.95) 45%, rgba(161,160,255,.85) 110%);
  color:#fff;
  border-color:rgba(255,255,255,.18);
  box-shadow:0 24px 70px rgba(94,93,255,.25);
}
.card__icon{
  width:46px;height:46px;border-radius:16px;
  background:rgba(94,93,255,.12);
  border:1px solid rgba(94,93,255,.18);
  display:grid; place-items:center;
  margin-bottom:12px;
}
.card--accent .card__icon{
  background:rgba(255,255,255,.16);
  border-color:rgba(255,255,255,.22);
}
.card__icon svg{width:22px;height:22px}
.card__title{margin:0 0 6px; font-weight:900; font-size:16px}
.card__text{margin:0; color:rgba(71,85,105,.95); line-height:1.55; font-size:14px}
.card--accent .card__text{color:rgba(255,255,255,.88)}

/* Stats */
.stats{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:14px;
}
.stat{
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:16px;
  box-shadow:0 14px 40px rgba(15,23,42,.06);
}
.stat__value{
  font-weight:950;
  font-size:26px;
  letter-spacing:-.4px;
  color:var(--brand);
  margin:0;
  animation: morg ease-in-out infinite 1s;
}
@keyframes morg {
  0% {
    transform: rotate(-8deg);
  }
  33% {
    transform: rotate(0deg);
  }
  33% {
    transform: rotate(8deg);
  }
  100% {
    transform: rotate(-8deg);
  }
}
.stat__label{
  margin:6px 0 0;
  color:rgba(71,85,105,.95);
  font-size:13px;
  line-height:1.35;
}

/* Pricing */
.pricing{
  margin-top:10px;
  border-radius:var(--radius-lg);
  padding:30px 0 22px;
  background:
    radial-gradient(900px 250px at 20% 0%, rgba(255,255,255,.20), transparent 55%),
    radial-gradient(900px 250px at 80% 100%, rgba(255,255,255,.18), transparent 55%),
    linear-gradient(135deg, rgba(94,93,255,1) 0%, rgba(123,122,255,.95) 55%, rgba(161,160,255,.82) 110%);
  color:#fff;
  box-shadow:0 30px 90px rgba(94,93,255,.30);
  border:1px solid rgba(255,255,255,.18);
  overflow:hidden;
  position:relative;
}
.pricing::after{
  content:"";
  position:absolute; inset:-35%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
  transform:rotate(18deg);
  opacity:.35;
  pointer-events:none;
}
.pricing .section__title{color:#fff}
.pricing .section__sub{color:rgba(255,255,255,.86)}

.pricing__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
}
.switch{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.20);
  position:relative;
  z-index:1;
}
.switch button{
  border:none;
  background:transparent;
  color:rgba(255,255,255,.86);
  font-weight:900;
  padding:10px 12px;
  border-radius:999px;
  cursor:pointer;
  font-size:13px;
}
.switch button.is-active{
  background:#fff;
  color:var(--brand);
  box-shadow:0 14px 35px rgba(15,23,42,.20);
}
.pricing__grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:16px;
  position:relative;
  z-index:1;
}
.plan{
  background:rgba(255,255,255,.92);
  color:var(--text);
  border-radius:22px;
  padding:18px;
  border:1px solid rgba(255,255,255,.30);
  box-shadow:0 18px 55px rgba(15,23,42,.14);
}
.plan__name{margin:0; font-weight:950; font-size:18px}
.plan__price{
  margin:10px 0 8px;
  font-weight:1000;
  letter-spacing:-.6px;
  font-size:34px;
  color:var(--text);
}
.plan__price small{
  font-weight:800;
  font-size:14px;
  color:rgba(71,85,105,.95);
  letter-spacing:0;
}
.plan__list{
  margin:10px 0 14px;
  padding:0;
  list-style:none;
  color:rgba(71,85,105,.95);
  font-size:14px;
}
.plan__list li{
  padding:8px 0;
  display:flex;
  gap:10px;
  align-items:flex-start;
  border-bottom:1px dashed rgba(15,23,42,.10);
}
.plan__list li:last-child{border-bottom:none}
.check{
  width:18px; height:18px; flex:0 0 18px;
  border-radius:6px;
  background:rgba(94,93,255,.12);
  border:1px solid rgba(94,93,255,.22);
  display:grid; place-items:center;
  margin-top:2px;
}
.plan .btn--primary{width:100%; justify-content:center}
.plan__hint{
  margin:10px 0 0;
  color:rgba(71,85,105,.95);
  font-size:12px;
}

/* Testimonials */
.testimonials{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:16px;
}
.review{
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:18px;
  box-shadow:0 14px 40px rgba(15,23,42,.06);
  display:flex;
  gap:14px;
  align-items:flex-start;
}
.avatar{
  width:44px;height:44px;border-radius:999px;
  background:linear-gradient(135deg, rgba(94,93,255,.95), rgba(161,160,255,.70));
  box-shadow:0 16px 40px rgba(94,93,255,.18);
  flex:0 0 44px;
  position:relative;
}
.avatar::after{
  content:"";
  position:absolute; inset:10px;
  border-radius:999px;
  background:rgba(255,255,255,.35);
}
.review__name{margin:0; font-weight:950}
.review__meta{margin:2px 0 8px; color:rgba(71,85,105,.95); font-size:12px}
.stars{display:flex; gap:4px; margin:2px 0 10px}
.stars span{
  width:10px;height:10px;border-radius:3px;
  background:rgba(94,93,255,.85);
}
.review__text{margin:0; color:rgba(71,85,105,.95); line-height:1.55; font-size:14px}

/* Footer logos */
.logos{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  padding:18px;
  border-radius:var(--radius);
  border:1px solid rgba(15,23,42,.08);
  background:rgba(255,255,255,.75);
  box-shadow:0 10px 30px rgba(15,23,42,.05);
}
.logo-pill{
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(15,23,42,.08);
  background:#fff;
  font-weight:900;
  color:rgba(15,23,42,.75);
  font-size:13px;
}
.logo-pill--accent{
  color:var(--brand);
  border-color:rgba(94,93,255,.22);
  background:rgba(94,93,255,.08);
}
.odometer.odometer-auto-theme, .odometer.odometer-theme-default {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  position: relative;
}
.odometer.odometer-auto-theme .odometer-digit, .odometer.odometer-theme-default .odometer-digit {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  position: relative;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer, .odometer.odometer-theme-default .odometer-digit .odometer-digit-spacer {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  visibility: hidden;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, .odometer.odometer-theme-default .odometer-digit .odometer-digit-inner {
  text-align: left;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon, .odometer.odometer-theme-default .odometer-digit .odometer-ribbon {
  display: block;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner, .odometer.odometer-theme-default .odometer-digit .odometer-ribbon-inner {
  display: block;
  -webkit-backface-visibility: hidden;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-value, .odometer.odometer-theme-default .odometer-digit .odometer-value {
  display: block;
  -webkit-transform: translateZ(0);
}
.odometer.odometer-auto-theme .odometer-digit .odometer-value.odometer-last-value, .odometer.odometer-theme-default .odometer-digit .odometer-value.odometer-last-value {
  position: absolute;
}
.odometer.odometer-auto-theme.odometer-animating-up .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-up .odometer-ribbon-inner {
  -webkit-transition: -webkit-transform 2s;
  -moz-transition: -moz-transform 2s;
  -ms-transition: -ms-transform 2s;
  -o-transition: -o-transform 2s;
  transition: transform 2s;
}
.odometer.odometer-auto-theme.odometer-animating-up.odometer-animating .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-up.odometer-animating .odometer-ribbon-inner {
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
}
.odometer.odometer-auto-theme.odometer-animating-down .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-down .odometer-ribbon-inner {
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
}
.odometer.odometer-auto-theme.odometer-animating-down.odometer-animating .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-down.odometer-animating .odometer-ribbon-inner {
  -webkit-transition: -webkit-transform 2s;
  -moz-transition: -moz-transform 2s;
  -ms-transition: -ms-transform 2s;
  -o-transition: -o-transform 2s;
  transition: transform 2s;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
}

.odometer.odometer-auto-theme, .odometer.odometer-theme-default {
  font-family: "Helvetica Neue", sans-serif;
  line-height: 1.1em;
}
.odometer.odometer-auto-theme .odometer-value, .odometer.odometer-theme-default .odometer-value {
  text-align: center;
}

.odo-first {
    font-size: 14px;
    color: #666;
    font-weight: bolder;
}

.odo-count .odometer {
    font-size: 48px;
    font-weight: bold;
}

.odo-last {
    font-size: 16px;
    color: #888;
    /*margin-top: 15px;*/
}

.odometer.odometer-auto-theme, .odometer.odometer-theme-default {
    font-family: 'Arial', monospace;
}

/* Стили для эффекта игрового автомата - прокрутка цифр */
.odometer-digit {
    display: inline-block;
    position: relative;
    vertical-align: top;
    overflow: hidden;
}

.odometer-ribbon {
    display: inline-block;
    position: relative;
}

.odometer-ribbon-inner {
    display: block;
    position: relative;
    top: 0;
    left: 0;
    text-align: center;
    white-space: nowrap;
    transition: transform 0.3s ease;
}

.odometer-value {
    display: inline-block;
}

/* Заменяем запятые на точки через CSS */
.odometer::after {
    content: '';
}

/* Используем CSS для замены запятых на точки */
#odometer {
    font-variant-numeric: tabular-nums;
    background: url(/assets/img/arrow_green_up.svg) no-repeat left 10%;
    background-size: 16px;
    padding-left:  20px;
}

.with-odometer {
  position: relative;
}        
#odometerBlock {
  background: white;
  border: 3px solid #5e5dff;
  border-radius: 15px;
  padding: 5px 10px 5px 5px;
  position: absolute;
  top: 17%;
  left: -10%;
  box-shadow: 3px 3px 5px 1px #00000096;
}
.odo-first {
}
.odo-count {
  font-size: 22px;
  font-weight: 700;
  margin: 3px 0;
  font-size: 22px !important;
  letter-spacing: 1px;
}

#odometer {
  font-size: 22px !important;
  letter-spacing: 1px;
}
.odo-last {
}

.twice-top {
    display: flex;
    gap: 15px;
}
.twice-top > * {
    display: flex;
    flex-flow: column;
    align-items: center;
    text-align: center;
    justify-content: center;
}
.twice-top picture {
    width: 100%;
    display: flex;
    justify-content: center;
    padding-bottom: 15px;
    text-align: center;
}
.twice-top picture img {
    width: 200px !important
    
}

.triple {
    display: flex;
    justify-content: space-between;
    gap: 15px;
}
.triple > * {
    width: 31%;
}

.twice-top .triple {
    display: flex;
    gap: 25px;
    justify-content: space-around;
    padding-bottom: 15px;
    width: 100%
}

.column-row {
    display: flex;
    flex-flow: column;
    width: fit-content;
    margin: 15px auto;
    gap: 10px;
}

.kletki {
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
    margin: 25px 0;
}
.kletki .card {
    padding: 25px;
    width: 31%;
    display: flex;
    align-items: center;
}
.kletki .card path {
    fill: #5e5dff;
}
.kletki .card rect {
    fill: #5e5dff;
}
.kletki .card svg {
    width: 100px;
}

.top-zone {
    max-width: 960px !important;
    margin: 0 auto;
    display: flex;
    flex-flow: column;
    gap: 35px
}
.top-zone > .top-zone-plast {
    display: flex;
    gap: 35px;
    position: relative;
}
.top-zone .top-zone-plast > div {
    width: 50%;
    flex-flow: column;
}
.top-zone .top-zone-plast > div .block-number {
    background: #5e5dff;
    color: white;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-weight: bold;
    font-size: 24px;
}
.top-zone .top-zone-plast > svg {
    position: absolute;
}

.keyword-with-setka {
    display: flex;
    justify-content: space-between;
    margin: 15px 0;
    font-weight: bold;
}

.keyword-with-setka-rows {
    display: flex;
    flex-flow: column;
    gap: 5px;
    margin: 10px 0;
    width: 100% !important;
}
.keyword-with-setka-rows > * {
    display: flex;
    width: 100%;
    justify-content: space-between;
}
.keyword-with-setka-rows .flex {
    display: flex;
    gap: 5px;
    flex-flow: row;
}
.keyword-with-setka-rows .flex .rounded-md {
    display: flex;
    border: 3px solid #5e5dff !important;
    width: 35px;
    height: 35px;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}

.keyword-with-setka-rows.rows-plus .rounded-md {
    width: auto !important;
    padding: 5px;
}

.top-zone-plast svg path {
    fill: black !important;
}

svg.svg1 {
    left: 44%;
    top: 32%;
    z-index: 9999999;
}
svg.svg2 {
    left: 44%;
    top: 119%;
    z-index: 9999999;
}
svg.svg3 {
    left: 44%;
    top: 15%;
    z-index: 9999999;
}
svg.svg4 {
    left: 44%;
    top: 73%;
    z-index: 9999999;
}
svg.svg5 {
    left: 44%;
    top: 109%;
    z-index: 9999999;
}

.top-zone > .top-zone-plast:nth-child(1) {
    
}
.top-zone > .top-zone-plast:nth-child(1) > .card:nth-child(2) {
    margin-top: 100px;
    position: absolute;
    right: 0;
    width: 48%;
}
.top-zone > .top-zone-plast:nth-child(2) {
    margin-top: 75px;
}
.top-zone > .top-zone-plast:nth-child(2) > .card:nth-child(2) {
    margin-top: 225px;
    position: absolute;
    right: 0;
    width: 48%;
}
.top-zone > .top-zone-plast:nth-child(3) {
    
}

.for-green {
    background: #06bf0647;
}

/*.clients-upp {
    background: #0a240a4d;
    padding: 15px;
    color: white;
    border-radius: 15px;
    margin-bottom: 15px;
    display: flex;
    justify-content: center;
    flex-flow: column;
    align-items: center;
    font-size: 20px;
}
.clients-upp .justify-center {
    display: flex;
    font-size: 25px;
    font-weight: bold;
    align-items: center;
    gap: 7px
}*/

.twice-top .triple ._for_white {
    width: 115px !important;
}

.twice-top .triple span {
    font-weight: 950;
    font-size: 20px;
    letter-spacing: -.4px;
    color: var(--brand);
    margin: 0;
}

.for-use {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 25px;
}

#lastVidget {
  cursor:pointer;
  position:fixed;
  bottom:25px;
  right:25px;
  border:none;
  width:75px;
  height:75px;
  text-align:center;
  border-radius:50%;
  background:url(/assets/img/icon_support_white.svg) no-repeat center, #5e5dff;
  background-size:30px;
  z-index:99999;
    box-shadow: 0 0 5px 5px #00000021;
}
#lastVidget:hover {
  opacity:.8
}
#tgMailZone {

/*   display: none; */
}
#tgMailZone.active {
  display: block;
}
#lastVidgetPopupBody {
  
}
#lastVidgetPopupBody h3 {
  margin: 0;
  margin-bottom: 15px;
}
#lastVidgetPopupBody ul {
  display: flex;
  padding: 0;
  gap: 15px;
  margin:  0
}
#lastVidgetPopupBody li {
  list-style: none;
}
#lastVidgetPopup {
  background: white;
  box-shadow: 0 0 5px 5px #00000021;
  width: 300px;
  padding: 15px;
  border-radius: 15px;
  position: fixed;
  top: 40%;
  left: 40%;
  padding-right: 50px;
}
#lastVidgetCloser {
  width: 40px;
  height: 40px;
  background: url(/assets/img/icon_cross_blue.svg) no-repeat center;
  background-size: 25px;
  position: absolute;
  right: 10px;
  top: 10px;
  cursor: pointer;
}
#lastVidgetCloser:hover {
  opacity: 0.8;
}
#lastVidget {
  animation:shake .5s ease-in-out infinite
}
@keyframes shake {
  0%,
  10%,
  to {
    transform:translate(0)
  }
  20%,
  60% {
    transform:translate(-1px,1px)
  }
  40%,
  80% {
    transform:translate(1px,-1px)
  }
}

#tgMailZone {
  background: #0000002b !important;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  z-index: 10;
  display: none;
}
#tgMailZone.active {
    display: flex;
}
#lastVidget {
  z-index: 5;
}

#popAct {
  border: 2px solid #5e5dff;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px 15px;
  border-radius: 5px;
  cursor: pointer;
  color: #5e5dff !important;
}
#popAct:hover {
  opacity: 0.8;
}

#forOdoLottie {
    overflow: hidden !important;
    width: 100px;
    height: 100px;
    position: relative;
}
lottie-player._for_white {
    position: absolute !important;
    width: 250px !important;
    height: 250px !important;
    left: -79%;
    top: -67%;
}

._mob {
  display: none;
}

._mob_no {
  display: block;
}

.triple lottie-player._for_white {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    height: auto !important;
}

#footer {

}
#footer .container {
  padding-bottom:34px;
}
#footerLast {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
}
#footerCopy .muted {
  font-weight:800;
}
#footerCopy p {
  font-size: 12px;
  width: 60%;
}
#footerMenu {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: end;
  flex-flow: column;
  align-items: self-end;
  text-align: right;
}

div#footerMenu a {
    font-size: 14px;
}

.socs a.btn--ghost {
  width: fit-content;
  padding: 5px 13px;
  height: 35px;
  font-size: 12px !important;
}

#footerForm {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 12px;
}

.scrollToTop {
    background: url(/assets/img/icon_angle_closer_white.svg) no-repeat center, #5E5DFF;
    background-size: 20px;
    position: fixed;
    bottom: 25px;
    left: 25px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 0 8px -1px #00000069 !important;
    z-index: 9999999;
}
.scrollToTop:hover {
    opacity: 0.8;
}

.after-mail {
  display: none;
}
.after-mail.active {
    display: block;
    background: #acacf8;
    color: white;
    padding: 25px;
    font-weight: bold;
    font-size: 24px;
}

/* =====================
  Responsive
====================== */
@media (max-width: 980px){
  .hero-inner{ grid-template-columns: 1fr; padding: 28px; }
  .grid-3{ grid-template-columns: 1fr; }
  .grid-2{ grid-template-columns: 1fr; }
  .cta{ grid-template-columns: 1fr; }
  .row{ grid-template-columns: 1fr; }
  .navlinks{ display:none; }
  .burger{ display:inline-flex; align-items:center; justify-content:center; }
  .mobile-menu{ display:block; }
  .mobile-menu[hidden]{ display:none; }

  ._mob {
    display: block;
  }

  ._mob_no {
    display: none;
  }

  #tgMailZone {
      align-items: center;
  }

  #lastVidgetPopup {
    left: 15px;
    right: 15px;
    width: calc( 100% - 30px);
  }

  #gambMenu {
      width: 40px;
      height: 40px;
      background: url(/assets/img/icon_gamb.svg) no-repeat center;
      background-size: 25px;
      position: absolute;
      right: 10px;
      top: 15px;
      cursor: pointer;
  }
  #mobCloser {
      width: 40px;
      height: 40px;
      background: url(/assets/img/icon_cross_blue.svg) no-repeat center;
      background-size: 25px;
      position: absolute;
      right: 10px;
      top: 15px;
      cursor: pointer;
  }
  nav {
      display: none !important;
      position: fixed;
      flex-flow: column;
      background: white;
      left: 0;
      top: 0;
      right: 0;
      bottom: 0;
      width: 100vw;
      height: 100vh;
      justify-content: center !important;
  }
  nav.active {
      display: flex !important;
      z-index: 9999;
      justify-content: start !important;
      padding-top: 35px;
  }
  .nav a {
      font-size: 4vw;
  }
  .hero__grid {
      flex-flow: column-reverse;
      display: flex;
  }
  #odometerBlock {
      right: 15px;
      left: auto;
      top: 63%;
  }
  .btn__dot {
    display: none;
  }
  .triple {
      flex-flow: column;
  }
  .triple > * {
      width: 100% !important;
  }
  .stats {
      display: flex;
      flex-flow: column;
  }
  .twice-top {
      flex-flow: column;
  }
  .stat {
      justify-content: center;
  }
  p.stat__value {
      justify-content: center;
      display: flex;
  }
  p.stat__label {
      font-size: 4vw;
  }
  svg.svg1 {
      left: 70%;
      top: 42%;
      z-index: 9999999;
      transform: rotate(100deg);
  }
  svg.svg2 {
      left: 24%;
      top: 99%;
      z-index: 9999999;
      transform: rotate(-100deg);
  }
  svg.svg3 {
      left: 44%;
      top: 15%;
      z-index: 9999999;
  }
  svg.svg4 {
      left: 68%;
      top: 50%;
      z-index: 9999999;
      transform: rotate(55deg);
  }
  svg.svg5 {
      left: 59%;
      top: 100%;
      z-index: 9999999;
      transform: rotate(-49deg);
  }
  .top-zone > .top-zone-plast:nth-child(1) {
      flex-flow: column;
  }
  .top-zone > .top-zone-plast:nth-child(1) > .card:nth-child(2) {
      margin-top: 0;
      position: relative;
      right: 0;
      width: 100%;
  }
  .top-zone > .top-zone-plast:nth-child(2) {
      margin-top: 0;
      flex-flow: column;
  }
  .top-zone > .top-zone-plast:nth-child(2) > .card:nth-child(2) {
      margin-top: 0;
      position: relative;
      right: 0;
      width: 100%;
  }
  .top-zone > .top-zone-plast:nth-child(3) {
      
  }
  .top-zone .top-zone-plast > div {
      width: 100%;
  }
  .kletki .card {
      width: 100%;
      padding: 5px 10px;
  }
  .pricing__grid {
      display: flex;
      flex-flow: column;
  }
  .pricing__head {
      display: flex;
      flex-flow: column;
      align-items: center;
  }
  .pricing__head div:first-child {
      display: flex;
      flex-flow: column;
      align-items: center;
      justify-content: center;
  }

  div#footerForm {
      flex-flow: column;
      display: flex;
  }

  div#footerLast {
      flex-flow: column;
  }

  #footerCopy p {
      width: 100%;
      align-items: center;
      text-align: center;
  }

  #footerCopy .muted {
      text-align: center;
  }

  div#footerMenu {
      flex-flow: column;
      justify-content: center;
      align-items: center;
  }

  h1 {
    font-size: 8.5vw !important;
  }
  h1.main-h1 {
    font-size: 11vw !important;
  }

  .mob-log {
      width: 90%;
      justify-content: center;
      display: flex;
      align-items: center;
      background: #bcbcbc;
  }
  .mob-log svg {
      width: 25px;
      height: 25px
  }
  .mob-log span {
      margin-top: -3px;
      position: abs;
  }
  .mob-reg {
      width: 90%;
      display: flex;
      justify-content: center;
  }

}

/* Small helpers */
.muted{color:var(--muted)}
.spacer{height:8px}