/* FAKTIV landing · v2 · Apple / iOS design language · 02.11.2026
   Шрифт: системный SF Pro на устройствах Apple; на остальных — Inter (локально, OFL). */

/* ---------- Fonts (local fallback for non-Apple devices) ---------- */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/inter-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/inter-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/inter-cyrillic-600-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/inter-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/inter-cyrillic-700-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/inter-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------- Tokens (iOS system palette + FAKTIV tint) ---------- */
:root{
  --bg:#F5F5F7;            /* Apple page gray */
  --card:#FFFFFF;
  --label:#1D1D1F;         /* primary text */
  --label-2:#6E6E73;       /* secondary text */
  --label-3:#86868B;
  --sep:rgba(60,60,67,.18);/* iOS separator */
  --fill:rgba(118,118,128,.12);
  --tint:#0E7C66;          /* FAKTIV green as iOS tint color */
  --tint-2:#0B6A57;
  --tint-soft:#E3F2ED;
  --gold:#F2B33D;
  --red:#FF3B30; --orange:#FF9500; --gray:#8E8E93;
  --black:#000;
  --r-xl:28px; --r-lg:20px; --r-md:14px; --r-sm:10px;
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:17px;line-height:1.47;letter-spacing:-.022em;color:var(--label);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--tint);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{margin:0 0 .4em;font-weight:700;color:var(--label);letter-spacing:-.03em;line-height:1.08}
h1{font-size:clamp(34px,8.6vw,64px)}
h2{font-size:clamp(28px,6.4vw,48px)}
h3{font-size:19px;line-height:1.25;letter-spacing:-.02em;font-weight:600}
p{margin:0 0 1em}
.wrap{width:100%;max-width:1024px;margin:0 auto;padding:0 20px}
.wrap--narrow{max-width:720px}
.wrap--form{max-width:560px}
.h-center{text-align:center;margin-left:auto;margin-right:auto;max-width:20ch}
.sub{color:var(--label-2);font-size:clamp(17px,2.4vw,21px);max-width:36ch}
.muted{color:var(--label-3)}
:focus-visible{outline:3px solid rgba(14,124,102,.45);outline-offset:2px;border-radius:6px}
section[id]{scroll-margin-top:52px}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 22px;border-radius:980px;background:var(--tint);color:#fff;font:600 17px/1 var(--font);letter-spacing:-.01em;border:0;cursor:pointer;transition:background .2s,transform .1s}
.btn:hover{background:var(--tint-2);text-decoration:none}
.btn:active{transform:scale(.98)}
.btn--sm{min-height:30px;padding:0 14px;font-size:13px}
.btn--block{width:100%;min-height:50px;border-radius:var(--r-md)}
.btn[disabled]{opacity:.5;cursor:progress}
.link-btn{font-size:13px;color:var(--label)}
.link-more{font-size:17px;display:inline-flex;align-items:center;gap:4px}
.link-more::after{content:"›";font-size:22px;line-height:1;transform:translateY(-1px)}

/* ---------- Nav (frosted glass) ---------- */
.nav{position:sticky;top:0;z-index:20;background:rgba(245,245,247,.72);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:.5px solid var(--sep)}
.nav__in{display:flex;align-items:center;justify-content:space-between;height:48px;gap:16px}
.brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:17px;letter-spacing:-.01em;color:var(--label)}
.brand:hover{text-decoration:none}
.brand img{border-radius:7px}
.nav__links{display:none;gap:28px}
.nav__links a{font-size:13px;color:var(--label);opacity:.8}
.nav__links a:hover{opacity:1;text-decoration:none}
.nav__actions{display:flex;align-items:center;gap:14px}

/* ---------- Hero ---------- */
.hero{padding:48px 0 0;text-align:center;overflow:hidden;background:linear-gradient(#F5F5F7,#FFF 70%)}
.hero__text h1{max-width:16ch;margin:0 auto .3em}
.kicker{font-size:15px;font-weight:600;color:var(--tint);margin-bottom:10px}
.lead{font-size:clamp(17px,2.6vw,21px);color:var(--label-2);max-width:34ch;margin:0 auto 24px}
.hero__cta{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:20px;margin-bottom:14px}
.fine{font-size:13px;color:var(--label-3);margin:0 auto}
.hero__device{margin-top:40px;display:flex;justify-content:center;padding:0 20px}

/* iPhone mock */
.iphone{width:min(330px,100%);padding:11px;border-radius:56px;background:#1D1D1F;box-shadow:0 0 0 1.5px #3A3A3C inset,0 40px 80px -20px rgba(0,0,0,.35)}
.iphone__screen{background:#F2F2F7;border-radius:46px;padding:12px 14px 140px;text-align:left;overflow:hidden}
.ios-status{display:flex;align-items:center;justify-content:space-between;padding:4px 14px 10px;font-size:14px}
.ios-status i{width:26px;height:12px;border-radius:4px;border:1.5px solid var(--label);position:relative}
.ios-status i::after{content:"";position:absolute;inset:1.5px;right:5px;background:var(--label);border-radius:1.5px}
.ios-island{width:96px;height:28px;border-radius:20px;background:#000}
.ios-large{font-size:30px;font-weight:700;letter-spacing:-.03em;margin:4px 4px 10px}
.ios-seg{display:grid;grid-template-columns:repeat(4,1fr);background:var(--fill);border-radius:9px;padding:2px;font-size:12px;text-align:center;margin-bottom:12px}
.ios-seg b,.ios-seg span{padding:5px 0;border-radius:7px;font-weight:500}
.ios-seg b{background:#fff;box-shadow:0 3px 8px rgba(0,0,0,.12);font-weight:600}
.ios-widgets{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.w{background:#fff;border-radius:18px;padding:12px;display:flex;flex-direction:column;gap:1px}
.w__l{font-size:12px;color:var(--label-2);font-weight:500}
.w__v{font-size:26px;font-weight:700;letter-spacing:-.03em}
.w__d{font-size:11px;color:var(--label-3)}
.w__d.up{color:#248A3D;font-weight:600}
.w--tint{background:var(--tint)}
.w--tint .w__l,.w--tint .w__d{color:rgba(255,255,255,.8)}
.w--tint .w__v{color:#fff}
.ios-section{font-size:13px;text-transform:uppercase;color:var(--label-2);letter-spacing:0;margin:18px 16px 6px}
.ios-list{list-style:none;margin:0;padding:0;background:#fff;border-radius:12px;overflow:hidden}
.ios-list li{display:flex;align-items:center;gap:12px;padding:9px 14px;position:relative;font-size:15px}
.ios-list li+li::before{content:"";position:absolute;top:0;left:54px;right:0;border-top:.5px solid var(--sep)}
.ios-list .t{flex:1;display:flex;flex-direction:column;line-height:1.25}
.ios-list small{font-size:12px;color:var(--label-2)}
.ico{width:28px;height:28px;border-radius:7px;display:grid;place-items:center;color:#fff;font-weight:700;font-size:15px;flex:0 0 28px}
.ico--red{background:var(--red)} .ico--orange{background:var(--orange)} .ico--gray{background:var(--gray)}
.chev{width:8px;height:8px;border-right:2px solid #C4C4C7;border-top:2px solid #C4C4C7;transform:rotate(45deg)}
.ios-foot{text-align:center;font-size:11px;color:var(--label-3);margin:14px 0 0}

/* ---------- Sections ---------- */
.section{padding:72px 0}
.section--white{background:#fff}
.section--black{background:var(--black);color:#A1A1A6}
.section--black h2,.section--black h3{color:#F5F5F7}

/* Tiles */
.tiles{display:grid;gap:16px;margin-top:40px}
.tile{background:var(--card);border-radius:var(--r-xl);padding:28px 24px;display:flex;flex-direction:column}
.tile__k{font-size:14px;font-weight:600;color:var(--orange);margin-bottom:8px}
.tile h3{font-size:22px;line-height:1.18}
.tile p{color:var(--label-2);font-size:16px}
.tile__in{margin:auto 0 0!important;padding-top:14px;border-top:.5px solid var(--sep);color:var(--tint)!important;font-weight:600;font-size:15px!important}

/* Steps */
.steps{list-style:none;margin:40px 0 0;padding:0;display:grid;gap:28px;text-align:center}
.steps__n{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--tint-soft);color:var(--tint);font-weight:700;font-size:19px;margin-bottom:14px}
.steps p{color:var(--label-2);font-size:16px;max-width:30ch;margin:0 auto}

/* Bento */
.bento{display:grid;gap:14px;margin-top:40px}
.b{background:var(--card);border-radius:var(--r-lg);padding:24px 22px 10px}
.b__k{font-size:14px;font-weight:600;color:var(--tint);margin-bottom:6px}
.b p:not(.b__k){color:var(--label-2);font-size:16px}
.b--dark{background:#1D1D1F}
.b--dark h3{color:#F5F5F7}
.b--dark p:not(.b__k){color:#A1A1A6}
.b--dark .b__k{color:var(--gold)}
.soon{margin-top:24px;text-align:center;color:var(--label-2);font-size:15px}
.pill{display:inline-block;background:var(--fill);color:var(--label);font-size:12px;font-weight:600;padding:3px 10px;border-radius:980px;margin-right:6px}

/* Security */
.secure{display:grid;gap:28px;margin-top:40px;text-align:center}
.secure__i{display:block;font-size:30px;color:var(--gold);margin-bottom:8px}
.secure p{font-size:16px;max-width:30ch;margin:0 auto}
.secure__lead{font-size:19px;line-height:1.45;max-width:46ch;margin:16px auto 0;text-align:center;color:#D2D2D7}
.secure__note{font-size:16px;max-width:52ch;margin:40px auto 0;text-align:center;color:#A1A1A6}

/* iOS inset grouped list */
.ios-group{list-style:none;margin:32px 0 0;padding:0;background:#fff;border-radius:var(--r-md);overflow:hidden}
.ios-group li{position:relative;padding:14px 16px 14px 52px;font-size:16px}
.ios-group li+li::before{content:"";position:absolute;top:0;left:52px;right:0;border-top:.5px solid var(--sep)}
.ios-group li::after{content:"";position:absolute;left:16px;top:50%;width:22px;height:22px;margin-top:-11px;border-radius:50%;background:var(--tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M6.5 11.5l3 3 6-6.5' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/22px no-repeat}

/* FAQ */
.faq{margin-top:32px}
.faq details{border-bottom:.5px solid var(--sep)}
.faq summary{list-style:none;cursor:pointer;padding:20px 36px 20px 0;font-weight:600;font-size:19px;letter-spacing:-.02em;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:50%;width:9px;height:9px;border-right:2px solid var(--label-2);border-bottom:2px solid var(--label-2);transform:translateY(-70%) rotate(45deg);transition:transform .25s}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq details p{color:var(--label-2);margin:-6px 0 20px;font-size:17px}

/* Form — iOS Settings style */
.form{margin-top:32px;display:grid;gap:12px}
.ios-form{background:#fff;border-radius:var(--r-md);overflow:hidden}
.field{display:flex;align-items:center;gap:12px;padding:0 16px;min-height:50px;position:relative}
.field+.field,.field-row+.field,.field+.field-row,.field-row .field+.field{border-top:.5px solid var(--sep)}
.field>span{flex:0 0 112px;font-size:17px;color:var(--label)}
.field input,.field select,.field textarea{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:17px;color:var(--label);padding:14px 0;outline:none;letter-spacing:-.02em}
.field input::placeholder,.field textarea::placeholder{color:#C4C4C7}
.field--select select{appearance:none;-webkit-appearance:none;color:var(--label-2);text-align:right;text-align-last:right;padding-right:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 13'%3E%3Cpath d='M1 1l5.5 5.5L1 12' fill='none' stroke='%23C4C4C7' stroke-width='2'/%3E%3C/svg%3E") right center/7px no-repeat}
.field--select select:valid{color:var(--label)}
.field--area{align-items:flex-start}
.field--area>span{padding-top:14px}
.field textarea{resize:none;min-height:50px}
.field-row{display:block}
.field--bad>span{color:var(--red)}
.hint{font-size:13px;color:var(--label-2);margin:-4px 16px 4px}
.hint--bad{color:var(--red)}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.check{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--label-2);cursor:pointer;padding:4px 4px 8px}
.check input{flex:0 0 22px;width:22px;height:22px;margin:0;accent-color:var(--tint)}
.check--bad span{color:var(--red)}
.form__error{margin:0;padding:12px 16px;border-radius:var(--r-sm);background:#FFEDEC;color:#C4281C;font-size:15px}
.form__ok{padding:22px;border-radius:var(--r-md);background:#fff;font-size:17px;text-align:center}
.form__ok b{color:var(--tint)}

/* Footer */
.footer{background:var(--bg);border-top:.5px solid var(--sep);padding:20px 0 100px;font-size:12px;color:var(--label-2);line-height:1.5}
.footer__note{padding-bottom:16px;border-bottom:.5px solid var(--sep);margin-bottom:16px}
.footer__in{display:grid;gap:18px}
.footer p{margin:0 0 4px}
.footer a{color:var(--label-2)}
.footer__h{color:var(--label);font-weight:600}
.footer__copy{margin-top:18px!important}

/* Sticky CTA (mobile) */
.sticky-cta{position:fixed;left:16px;right:16px;bottom:16px;z-index:30;display:flex;align-items:center;justify-content:center;min-height:50px;border-radius:var(--r-md);background:var(--tint);color:#fff;font-weight:600;font-size:17px;box-shadow:0 10px 30px rgba(14,124,102,.35);transition:opacity .25s,transform .25s}
.sticky-cta:hover{text-decoration:none}
.sticky-cta.is-hidden{opacity:0;transform:translateY(16px);pointer-events:none}

/* ---------- Breakpoints ---------- */
@media (min-width:640px){
  .tiles{grid-template-columns:1fr 1fr}
  .bento{grid-template-columns:1fr 1fr;grid-auto-flow:dense}
  .b--wide{grid-column:span 2}
  .secure{grid-template-columns:1fr 1fr}
  .footer__in{grid-template-columns:1.2fr 1fr 1fr}
}
@media (min-width:900px){
  .section{padding:110px 0}
  .hero{padding-top:84px}
  .nav__links{display:flex}
  .steps{grid-template-columns:repeat(3,1fr)}
  .bento{grid-template-columns:repeat(4,1fr)}
  .b--wide-lg{grid-column:span 2}
  .secure{grid-template-columns:repeat(3,1fr)}
  .sticky-cta{display:none}
  .footer{padding-bottom:40px}
  .iphone{width:360px}
  .lead{max-width:40ch}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* ---------- Document pages (privacy, consent) ---------- */
.doc{background:#fff}
.doc .nav{background:rgba(255,255,255,.8)}
.doc__body{padding:32px 20px 64px;font-size:17px}
.doc__body h1{font-size:clamp(28px,6vw,40px);margin-top:12px}
.doc__body h2{font-size:21px;margin-top:32px;letter-spacing:-.02em}
.doc__body p,.doc__body li{color:#333336}
.doc__body ul{padding-left:20px}
.doc__body li{margin-bottom:6px}
.doc__draft{background:#FFF8E6;border-radius:var(--r-sm);padding:12px 16px;font-size:14px}
.doc__meta{margin-top:32px;font-size:13px;color:var(--label-3)!important}


/* ---------- v2.4: consolidated layout ---------- */
section[id]{scroll-margin-top:52px}

/* Hero device: real screenshot, cropped with fade */
.hero{padding-bottom:56px}
.hero__device{flex-direction:column;align-items:center;margin-top:36px}
.iphone__screen--shot{position:relative;padding:28px 0 0;max-height:500px;overflow:hidden}
.iphone__screen--shot img{width:100%;height:auto;display:block}
.iphone__screen--shot::after{content:"";position:absolute;left:0;right:0;bottom:0;height:90px;background:linear-gradient(rgba(242,242,247,0),#F2F2F7)}
.shot-note{font-size:12px;color:var(--label-3);text-align:center;margin:16px auto 0;max-width:36ch}

/* Real screens: mobile = swipe row, desktop = grid */
.screens{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:32px 20px 8px;scroll-padding:0 20px;scrollbar-width:none}
.screens::-webkit-scrollbar{display:none}
.scr{flex:0 0 82%;max-width:360px;margin:0;scroll-snap-align:start}
.scr--wide{display:none}
.scr__img{aspect-ratio:4/5;border-radius:18px;overflow:hidden;background:#F5F5F7;box-shadow:0 0 0 .5px rgba(0,0,0,.08),0 14px 30px -18px rgba(0,0,0,.3)}
.scr__img img{width:100%;height:100%;object-fit:cover;object-position:var(--m,0% 0%);display:block}
.scr figcaption{font-size:15px;color:var(--label-2);margin-top:12px;padding:0 2px}
.scr figcaption b{color:var(--label)}
.screens__hint{text-align:center;font-size:13px;color:var(--label-3);margin:8px 0 0}

/* Touch targets & safe areas */
.nav__actions .link-btn{padding:12px 4px}
.nav__actions .btn--sm{min-height:34px}
.link-more{min-height:44px}
.sticky-cta{bottom:calc(16px + env(safe-area-inset-bottom))}
.footer{padding-bottom:calc(100px + env(safe-area-inset-bottom))}
.footer__col a{display:inline-block;padding:4px 0}
.footer__col p{margin:0 0 2px}

@media (max-width:359px){
  .wrap{padding:0 16px}
  .field>span{flex-basis:92px;font-size:16px}
}
@media (min-width:900px){
  .lead{max-width:40ch}
  .hero{padding-bottom:80px}
  .iphone__screen--shot{max-height:560px}
  .screens{display:grid;grid-template-columns:1fr 1fr;gap:28px;max-width:1024px;margin:0 auto;padding:40px 20px 0;overflow:visible}
  .scr{max-width:none}
  .scr--wide{display:block;grid-column:1/-1}
  .scr--wide .scr__img{aspect-ratio:auto}
  .scr__img{aspect-ratio:4/3}
  .scr__img img{object-position:0% 0%}
  .scr--wide .scr__img img{height:auto}
  .screens__hint{display:none}
  .footer{padding-bottom:40px}
}
.hero h1 .muted{display:block}
#screens{padding-bottom:72px}
/* v2.5: secondary button (when signup is the main CTA) */
.btn--secondary{background:var(--tint-soft);color:var(--tint)}
.btn--secondary:hover{background:#D3EBE3}
.form .btn--block+.btn--block{margin-top:0}

/* Security flow graphic */
.sflow{display:flex;flex-direction:column;align-items:center;gap:0;margin:40px auto 8px;max-width:820px}
.sflow__node{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:180px;padding:22px 26px;border:1px solid #3A3A3C;border-radius:22px;background:#1C1C1E;text-align:center}
.sflow__cap{font-size:20px;font-weight:600;color:#F5F5F7;letter-spacing:-.01em}
.sflow__node small{font-size:14px;color:#A1A1A6;margin-top:2px}
.sflow__node--safe{color:var(--gold);border-color:rgba(201,162,39,.55);box-shadow:0 0 0 6px rgba(201,162,39,.08),0 0 48px rgba(201,162,39,.18)}
.sflow__node--safe svg{width:58px;height:64px;margin-bottom:8px}
.sflow__pipe{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:26px 0 30px;text-align:center}
.sflow__pipe::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;transform:translateX(-50%);background:linear-gradient(#3A3A3C,var(--gold));z-index:0}
.sflow__pipe::after{content:"";position:absolute;left:50%;bottom:-2px;width:10px;height:10px;border-right:2px solid var(--gold);border-bottom:2px solid var(--gold);transform:translateX(-50%) rotate(45deg)}
.sflow__pipe>span{position:relative;z-index:1;background:var(--black);padding:3px 10px;border-radius:10px;font-size:15px}
.sflow__key{display:inline-flex;align-items:center;gap:6px;color:#F5F5F7;font-weight:600}
.sflow__key svg{width:20px;height:20px;color:var(--gold)}
.sflow__ok{color:#30D158}
.sflow__no{color:#FF6961;text-decoration:line-through;text-decoration-thickness:1px}
@media (min-width:768px){
  .sflow{flex-direction:row;align-items:stretch}
  .sflow__node{min-width:200px}
  .sflow__pipe{flex:1;padding:0 8px;justify-content:center}
  .sflow__pipe::before{left:0;right:0;top:50%;bottom:auto;width:auto;height:2px;transform:translateY(-50%);background:linear-gradient(90deg,#3A3A3C,var(--gold))}
  .sflow__pipe::after{left:auto;right:2px;top:50%;bottom:auto;transform:translateY(-50%) rotate(-45deg)}
}