/* ===== Критический блок главной (файл подключается в через iflow_seo.php) ===== Гасит штатный хром Aspro ДО первой отрисовки — без мелькания старой шапки при обновлении. */ .header-wrapper{display:none!important} .iflow-tri-band--top{display:none!important} footer > .footer-v4,footer > .viewed_product_block{display:none!important} .iflow-tri-band--footer{display:none!important} .drag-block{display:none!important} #headerfixed{display:none!important} #iflow-progress{display:none!important} .inline-search-block{display:none!important} html #content{border-top:0!important} html,body{background:#eef3f9!important} body > .wrapper{background:transparent!important} html{overflow-x:hidden;overflow-x:clip} /* Главная Инфотехновации — стили контентной части (изолированы под #iflow-home). v1 2026-07-14 */ #iflow-home{ --navy:#081a34; --navy-2:#0b213f; --panel:#0f2848; --line:rgba(120,170,225,.16); --ink:#eef4fb; --muted:#9fbbd8; --sky:#4c9be8; --blue:#2e75b6; --blue-d:#1b5cb0; --blue-l:#6ba4de; --paper:#eef3f9; --paper-2:#ffffff; --ink-d:#0e2340; --muted-d:#5a7392; --line-d:rgba(31,78,121,.12); --light:#6E93D1; --dark:#1450b4; --seam:#0a1c38; --r:16px; --maxw:1200px; } #iflow-home *{box-sizing:border-box} #iflow-home{scroll-behavior:smooth} #iflow-home{margin:0;background:var(--paper);color:var(--ink-d);position:relative; font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.5} #iflow-home img{max-width:100%;display:block} #iflow-home a{color:inherit;text-decoration:none} #iflow-home .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px} #iflow-home .eyebrow{font:700 12px/1 ui-monospace,"SF Mono",Consolas,monospace;letter-spacing:.24em;text-transform:uppercase;color:var(--blue)} #iflow-home h2{font-size:clamp(25px,3.3vw,38px);line-height:1.1;letter-spacing:-.015em;margin:.4em 0 .3em;text-wrap:balance;font-weight:800} #iflow-home .lead{color:var(--muted-d);max-width:60ch;font-size:16px} #iflow-home .hero{margin-top:-2px} #iflow-home .trust{margin-top:-2px} #iflow-home .btn{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:15px;border-radius:12px;padding:13px 22px;cursor:pointer;border:1px solid transparent;transition:transform .2s,box-shadow .2s,background .2s,border-color .2s;white-space:nowrap} #iflow-home .btn:active{transform:translateY(1px) scale(.97)} #iflow-home .btn-primary{background:linear-gradient(180deg,var(--sky),var(--blue));color:#fff;box-shadow:0 12px 26px -12px rgba(46,117,182,.9),0 0 34px rgba(76,155,232,.28)} #iflow-home .btn-primary:hover{transform:translateY(-2px);box-shadow:0 18px 34px -12px rgba(46,117,182,1)} #iflow-home .btn-ghost{background:transparent;border-color:rgba(150,190,235,.35);color:#eaf2fb} #iflow-home .btn-ghost:hover{border-color:var(--sky);background:rgba(76,155,232,.12);transform:translateY(-2px)} #iflow-home .btn-dl{background:rgba(76,155,232,.14);border-color:rgba(120,170,225,.34);color:#eaf2fb} #iflow-home .btn-dl:hover{background:rgba(76,155,232,.22);border-color:var(--sky);transform:translateY(-2px)} #iflow-home .btn svg{width:17px;height:17px;flex:none} #iflow-home .hero{position:relative;background: radial-gradient(70% 90% at 82% 8%,rgba(76,155,232,.3),transparent 55%), radial-gradient(60% 80% at 8% 100%,rgba(27,92,176,.4),transparent 60%), linear-gradient(160deg,#0b2242,#081a34 60%,#050f22);color:var(--ink);overflow:hidden} #iflow-home .hero::before{content:"";position:absolute;inset:0;opacity:.5; background-image:linear-gradient(rgba(120,170,225,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(120,170,225,.06) 1px,transparent 1px); background-size:46px 46px;-webkit-mask:radial-gradient(80% 70% at 72% 34%,#000,transparent 75%);mask:radial-gradient(80% 70% at 72% 34%,#000,transparent 75%)} #iflow-home .hero .wrap{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding:74px 24px 88px} #iflow-home .hero h1{font-size:clamp(33px,4.7vw,55px);line-height:1.05;letter-spacing:-.02em;margin:16px 0 18px;font-weight:800;text-wrap:balance} #iflow-home .hero h1 b{font-weight:800;background:linear-gradient(92deg,#4c9be8,#8ec2ff 60%,#4c9be8);-webkit-background-clip:text;background-clip:text;color:transparent} #iflow-home .hero p{color:#c2d6ef;font-size:18px;max-width:52ch;margin:0 0 30px} #iflow-home .hero-cta{display:flex;gap:14px;flex-wrap:wrap} #iflow-home .chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:32px} #iflow-home .chip{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#cfe0f4; background:rgba(120,170,225,.1);border:1px solid rgba(120,170,225,.2);border-radius:999px;padding:8px 14px; transition:transform .2s,border-color .2s,background .2s} #iflow-home a.chip:hover{transform:translateY(-2px);border-color:var(--sky);background:rgba(76,155,232,.18);color:#fff} #iflow-home .chip svg{width:15px;height:15px;color:var(--sky)} #iflow-home .hft{position:absolute;pointer-events:none;width:0;height:0;border-style:solid;opacity:.12; animation:hfloat var(--fd,17s) ease-in-out var(--fdel,0s) infinite alternate} @keyframes hfloat{0%{transform:translateY(0) rotate(0)}100%{transform:translateY(-30px) rotate(16deg)}} #iflow-home .hexwrap{position:relative;display:grid;place-items:center;min-height:420px} #iflow-home .hexglow{position:absolute;width:350px;height:350px;border-radius:50%; background:radial-gradient(circle,rgba(76,155,232,.55),rgba(46,117,182,.16) 45%,transparent 66%);filter:blur(10px)} #iflow-home.js .hexglow{animation:glowpulse 5s ease-in-out infinite} @keyframes glowpulse{0%,100%{opacity:.65;transform:scale(1)}50%{opacity:1;transform:scale(1.07)}} #iflow-home .hexring{position:absolute;width:360px;height:360px;border-radius:50%;border:1px dashed rgba(120,170,225,.28)} #iflow-home.js .hexring{animation:ringspin 40s linear infinite} #iflow-home .hexring::before,#iflow-home .hexring::after{content:"";position:absolute;width:9px;height:9px;border-radius:50%;background:var(--sky);box-shadow:0 0 12px var(--sky)} #iflow-home .hexring::before{top:-5px;left:50%;margin-left:-4px} #iflow-home .hexring::after{bottom:-5px;left:50%;margin-left:-4px;background:var(--blue-l)} @keyframes ringspin{to{transform:rotate(360deg)}} #iflow-home svg.hexsvg{position:relative;width:340px;height:auto;overflow:visible;filter:drop-shadow(0 28px 56px rgba(6,16,34,.75))} #iflow-home .hexspin{transform-origin:167.5px 193.5px} @keyframes spin{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}} #iflow-home .frag{transform-box:view-box;transition:filter .3s ease} #iflow-home .hexsolid{opacity:0;transition:opacity .45s ease;pointer-events:none} #iflow-home .hexsolid.on{opacity:1} #iflow-home .frag.lift{filter:brightness(1.45) saturate(1.15)} #iflow-home.js .disassemble .frag{animation:disasm .72s cubic-bezier(.5,0,.75,.4) both;animation-delay:calc(var(--d)*.45)} #iflow-home.js .assemble .frag{opacity:0;animation:assemble .95s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--d)} @keyframes assemble{ 0%{opacity:0;transform:translate(var(--tx),var(--ty)) rotate(var(--tr)) scale(.3)} 55%{opacity:1} 80%{transform:translate(0,0) rotate(0) scale(1.08)} 100%{opacity:1;transform:translate(0,0) rotate(0) scale(1)} } @keyframes disasm{ 0%{opacity:1;transform:translate(0,0) rotate(0) scale(1)} 100%{opacity:0;transform:translate(var(--tx),var(--ty)) rotate(var(--tr)) scale(.3)} } #iflow-home .hex-caption{position:absolute;bottom:10px;left:0;right:0;display:flex;justify-content:center;gap:30px;text-align:center} #iflow-home .hex-caption a{color:#9fbbd8;font:700 12px/1.3 system-ui;display:block;transition:transform .2s,color .2s} #iflow-home .hex-caption a:hover{transform:translateY(-2px);color:#cfe0f4} #iflow-home .hex-caption a:hover b{color:var(--sky)} #iflow-home .hex-caption b{display:block;color:#eaf2fb;font-size:22px;letter-spacing:-.01em;transition:color .2s} #iflow-home .trust{background:#071630;border-top:1px solid rgba(120,170,225,.1);border-bottom:1px solid rgba(120,170,225,.1)} #iflow-home .trust .wrap{display:flex;flex-wrap:wrap;gap:14px 34px;align-items:center;justify-content:space-between;padding:18px 24px} #iflow-home .trust b{color:#dbe8f7} #iflow-home .trust .ti{display:flex;align-items:center;gap:10px;color:#9fbbd8;font-size:14px;font-weight:600;transition:color .2s,transform .2s} #iflow-home .trust a.ti:hover{color:#fff;transform:translateY(-2px)} #iflow-home .trust .ti svg{width:20px;height:20px;color:var(--sky);flex:none} #iflow-home section{padding:74px 0} #iflow-home .sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:36px;flex-wrap:wrap} #iflow-home .sec-head .lead{margin-top:8px} #iflow-home .link-all{color:var(--blue);font-weight:700;font-size:15px;display:inline-flex;gap:7px;align-items:center;white-space:nowrap;transition:gap .2s} #iflow-home .link-all:hover{gap:12px} #iflow-home .cats{background:var(--paper)} #iflow-home .cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px} #iflow-home .cat{position:relative;background:var(--paper-2);border:1px solid var(--line-d);border-radius:18px;overflow:hidden; transition:transform .28s,box-shadow .28s,border-color .28s;display:flex;flex-direction:column} #iflow-home .cat:hover{transform:translateY(-8px) rotate3d(1,-1,0,1.6deg);box-shadow:0 30px 60px -30px rgba(31,78,121,.5);border-color:rgba(46,117,182,.45)} #iflow-home .cat .ph{position:relative;aspect-ratio:16/10;background:radial-gradient(120% 120% at 50% 0%,#f2f7fd,#e5eef8);display:grid;place-items:center;overflow:hidden} #iflow-home .cat .ph img{width:82%;height:82%;object-fit:contain;transition:transform .4s;filter:drop-shadow(0 12px 20px rgba(31,78,121,.18))} #iflow-home.js .cat .ph img{animation:kenburns 16s ease-in-out infinite alternate} @keyframes kenburns{0%{transform:scale(1) translate(0,0)}100%{transform:scale(1.05) translate(-5px,3px)}} #iflow-home .cat:hover .ph img{transform:scale(1.08);animation-play-state:paused} #iflow-home .cat .ph::after{content:"";position:absolute;top:0;bottom:0;left:-85%;width:55%;pointer-events:none; background:linear-gradient(105deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-18deg);transition:left .65s ease} #iflow-home .cat:hover .ph::after{left:135%} #iflow-home .cat .ph .badge{position:absolute;top:12px;left:12px;z-index:4;background:rgba(8,26,52,.92);color:#dceafa;font:700 11px/1 ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;padding:7px 12px;border-radius:999px;white-space:nowrap;box-shadow:0 4px 14px -4px rgba(8,26,52,.5)} #iflow-home .cat .bd{padding:22px 24px 26px} #iflow-home .cat h3{font-size:19px;margin:0 0 6px;font-weight:700;color:var(--ink-d)} #iflow-home .cat p{color:var(--muted-d);font-size:14px;margin:0 0 14px} #iflow-home .cat .go{display:inline-flex;align-items:center;gap:7px;color:var(--blue);font-weight:700;font-size:14px;transition:gap .2s} #iflow-home .cat:hover .go{gap:12px} #iflow-home .cat::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:0;background:linear-gradient(90deg,var(--sky),var(--blue));transition:width .35s;z-index:2} #iflow-home .cat:hover::after{width:100%} #iflow-home .services{background:linear-gradient(180deg,#eaf1f9,#e4edf7)} #iflow-home .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:s} #iflow-home .step{background:var(--paper-2);border:1px solid var(--line-d);border-radius:var(--r);padding:26px 22px;position:relative;transition:transform .25s,box-shadow .25s} #iflow-home .step:hover{transform:translateY(-5px);box-shadow:0 22px 46px -26px rgba(31,78,121,.42)} #iflow-home .step::before{counter-increment:s;content:"0" counter(s);font:800 30px/1 ui-monospace,monospace;color:rgba(46,117,182,.22);position:absolute;top:18px;right:20px} #iflow-home .step .ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(160deg,rgba(76,155,232,.18),rgba(46,117,182,.1));color:var(--blue);margin-bottom:16px} #iflow-home .step .ic svg{width:23px;height:23px} #iflow-home .step h4{margin:0 0 6px;font-size:17px;color:var(--ink-d)} #iflow-home .step p{color:var(--muted-d);font-size:13.5px;margin:0} #iflow-home .step .more{display:inline-flex;margin-top:14px;color:var(--blue);font-weight:700;font-size:13.5px;opacity:0;transform:translateY(4px);transition:opacity .25s,transform .25s} #iflow-home .step:hover .more{opacity:1;transform:none} #iflow-home a.step{display:block} #iflow-home .solutions{background:var(--paper)} #iflow-home .sol-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px} #iflow-home .sol{position:relative;border-radius:18px;padding:26px 22px;color:#eaf2fb;overflow:hidden;min-height:180px;display:flex;flex-direction:column;justify-content:flex-end; background:linear-gradient(160deg,#12365f,#0b2242);border:1px solid rgba(120,170,225,.18);transition:transform .28s,box-shadow .28s} #iflow-home .sol:hover{transform:translateY(-6px);box-shadow:0 28px 56px -28px rgba(8,26,52,.6)} #iflow-home .sol .si{position:absolute;top:20px;left:22px;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:rgba(76,155,232,.18);color:var(--sky)} #iflow-home .sol .si svg{width:22px;height:22px} #iflow-home .sol h4{margin:0 0 6px;font-size:18px} #iflow-home .sol p{margin:0;color:#a9c4e2;font-size:13.5px} #iflow-home .sol::after{content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(76,155,232,.3),transparent 70%)} #iflow-home .why::after{content:"";position:absolute;width:480px;height:480px;border-radius:50%;right:-140px;top:-160px;pointer-events:none; background:radial-gradient(circle,rgba(76,155,232,.14),transparent 65%);filter:blur(30px);animation:ctaDrift 24s ease-in-out infinite alternate} #iflow-home .cta{position:relative;overflow:hidden} #iflow-home .cta::after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;left:-120px;bottom:-180px;pointer-events:none; background:radial-gradient(circle,rgba(20,80,180,.25),transparent 65%);filter:blur(32px);animation:ctaDrift 21s ease-in-out infinite alternate-reverse} @keyframes ctaDrift{0%{transform:translate(0,0) scale(1)}100%{transform:translate(60px,30px) scale(1.15)}} #iflow-home .why{background:var(--navy);color:var(--ink);position:relative;overflow:hidden} #iflow-home .why::before{content:"";position:absolute;inset:0;opacity:.5;background-image:linear-gradient(rgba(120,170,225,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(120,170,225,.06) 1px,transparent 1px);background-size:46px 46px;-webkit-mask:radial-gradient(70% 90% at 20% 20%,#000,transparent 70%);mask:radial-gradient(70% 90% at 20% 20%,#000,transparent 70%)} #iflow-home .why .wrap{position:relative} #iflow-home .why .eyebrow{color:var(--sky)} #iflow-home .why h2{color:#fff} #iflow-home .stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:36px} #iflow-home .stat{border-left:2px solid rgba(76,155,232,.4);padding:6px 0 6px 20px;display:block;transition:border-color .25s,transform .25s} #iflow-home a.stat:hover{border-color:var(--sky);transform:translateY(-3px)} #iflow-home a.stat:hover b{color:var(--sky)} #iflow-home .stat b{display:block;font-size:38px;font-weight:800;letter-spacing:-.02em;color:#fff;line-height:1;transition:color .25s} #iflow-home .stat span{color:#a9c4e2;font-size:14px;display:block;margin-top:8px} #iflow-home .why-points{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px} #iflow-home .pt{display:flex;gap:14px;align-items:flex-start;transition:transform .25s} #iflow-home a.pt:hover{transform:translateY(-3px)} #iflow-home a.pt:hover h4{color:var(--sky)} #iflow-home .pt h4{transition:color .25s} #iflow-home .pt .b{flex:none;width:42px;height:42px;border-radius:11px;background:rgba(76,155,232,.16);display:grid;place-items:center;color:var(--sky)} #iflow-home .pt .b svg{width:22px;height:22px} #iflow-home .pt h4{margin:2px 0 5px;font-size:16px;color:#eaf2fb} #iflow-home .pt p{margin:0;color:#9fbbd8;font-size:14px} #iflow-home .brands{background:var(--paper)} #iflow-home .brand-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px} #iflow-home .brand-row a{background:var(--paper-2);border:1px solid var(--line-d);border-radius:14px;padding:22px 20px; color:#5f7590;font-weight:800;letter-spacing:.02em;font-size:17px;text-align:center;transition:transform .25s,color .25s,border-color .25s,box-shadow .25s;position:relative;overflow:hidden} #iflow-home .brand-row a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,var(--sky),var(--blue));transform:scaleX(0);transform-origin:left;transition:transform .3s} #iflow-home .brand-row a:hover{transform:translateY(-4px);color:var(--blue);border-color:rgba(46,117,182,.45);box-shadow:0 20px 40px -26px rgba(31,78,121,.4)} #iflow-home .brand-row a:hover::after{transform:scaleX(1)} @media(max-width:760px){#iflow-home .brand-row{grid-template-columns:repeat(2,1fr)} } #iflow-home .docs{background:linear-gradient(180deg,#eef3f9,#e6eef7)} #iflow-home .doc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px} #iflow-home .doc{background:var(--paper-2);border:1px solid var(--line-d);border-radius:16px;padding:26px;display:flex;gap:16px;align-items:flex-start;transition:transform .25s,box-shadow .25s} #iflow-home .doc:hover{transform:translateY(-5px);box-shadow:0 24px 48px -28px rgba(31,78,121,.4)} #iflow-home .doc .di{flex:none;width:48px;height:48px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(160deg,rgba(76,155,232,.18),rgba(46,117,182,.1));color:var(--blue)} #iflow-home .doc .di svg{width:24px;height:24px} #iflow-home .doc h4{margin:0 0 5px;font-size:17px;color:var(--ink-d)} #iflow-home .doc p{margin:0 0 10px;color:var(--muted-d);font-size:14px} #iflow-home .doc .go{color:var(--blue);font-weight:700;font-size:14px;display:inline-flex;gap:6px;transition:gap .2s} #iflow-home .doc:hover .go{gap:11px} #iflow-home .cta{background:radial-gradient(80% 130% at 80% 0%,rgba(76,155,232,.32),transparent 55%),linear-gradient(120deg,#0b2242,#081a34);color:#fff} #iflow-home .cta .wrap{display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;padding:58px 24px} #iflow-home .cta h2{color:#fff;margin:0} #iflow-home .cta p{color:#c2d6ef;margin:8px 0 0;max-width:46ch} #iflow-home.js [data-rv]{opacity:0;will-change:transform,opacity;transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--rd,0s)} #iflow-home.js [data-rv="up"]{transform:translateY(40px)} #iflow-home.js [data-rv="left"]{transform:translateX(-48px)} #iflow-home.js [data-rv="right"]{transform:translateX(48px)} #iflow-home.js [data-rv="zoom"]{transform:scale(.88)} #iflow-home.js [data-rv="flip"]{transform:perspective(700px) rotateX(14deg) translateY(28px)} #iflow-home.js [data-rv].in{opacity:1;transform:none} @media(max-width:960px){#iflow-home .hero .wrap{grid-template-columns:1fr;padding:54px 24px 64px} #iflow-home .hexwrap{order:-1;min-height:320px} #iflow-home svg.hexsvg{width:260px} #iflow-home .cat-grid,#iflow-home .sol-grid,#iflow-home .doc-grid{grid-template-columns:repeat(2,1fr)} #iflow-home .steps,#iflow-home .stat-grid,#iflow-home .why-points{grid-template-columns:repeat(2,1fr)} } @media(max-width:560px){#iflow-home .cat-grid,#iflow-home .sol-grid,#iflow-home .steps,#iflow-home .stat-grid,#iflow-home .why-points,#iflow-home .doc-grid{grid-template-columns:1fr} #iflow-home .hero h1{font-size:31px} } /* Нейтрализация тег-правил Aspro внутри нового контента */ #iflow-home h1,#iflow-home h2,#iflow-home h3,#iflow-home h4,#iflow-home h5{color:inherit;text-transform:none} #iflow-home .btn{text-transform:none;letter-spacing:normal} #iflow-home p{margin-top:0} #iflow-home section{background-clip:padding-box} /* ===== Точь-в-точь превью: сброс теговых правил Aspro внутри #iflow-home ===== */ #iflow-home h1,#iflow-home h2,#iflow-home h3,#iflow-home h4,#iflow-home h5,#iflow-home h6{ font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif!important} #iflow-home input,#iflow-home button,#iflow-home select,#iflow-home textarea{font-family:inherit} #iflow-home .cat .ph img{width:82%!important;height:82%!important;object-fit:contain!important;max-height:82%!important} #iflow-home img{border:0} #iflow-home a:hover{text-decoration:none} #iflow-home ul{list-style:none;padding:0} /* Тёмная основа блока (как в превью: html/body были тёмными) — все секции имеют собственные фоны, основа видна только сквозь полупрозрачную шапку и в межблочных щелях */ #iflow-home{background:var(--paper,#eef3f9)} /* 2026-07-14 v7: точное соответствие эталону превью (автосверка 34 селектора × 13 свойств). Aspro задаёт body 15px и Bootstrap line-height у .btn; глобальный скин красил тег header. */ #iflow-home{font-size:16px;line-height:1.5} #iflow-home .btn{line-height:1.5!important} #iflow-home h3,#iflow-home h4,#iflow-home h5,#iflow-home h6{font-weight:700!important;line-height:1.5!important} /* 2026-07-14 v8: Aspro сбрасывает *{margin:0} - возвращаем браузерные отступы по умолчанию, как было в превью. :where() = нулевая специфичность, любое явное правило выше сильнее. */ #iflow-home :where(p){margin:1em 0} #iflow-home :where(h1){margin:.67em 0} #iflow-home :where(h2){margin:.83em 0} #iflow-home :where(h3){margin:1em 0} #iflow-home :where(h4){margin:1.33em 0} #iflow-home :where(h5){margin:1.67em 0} #iflow-home :where(h6){margin:2.33em 0} #iflow-home :where(ul,ol){margin:1em 0} /* iflowPop — в chrome.css */ /* Выравнивание шапки: ничего не переносится, поиск гибко ужимается */ /* v10: с иконками контенту шапки нужен воздух — рамка топбара и шапки шире контентной сетки (1440 против 1200 у секций); логотип и меню не сжимаются, гибкий только поиск */ /* геометрия шапки — в chrome.css (единый хром) */ /* ================= v13: больше жизни у фигур и элементов ================= */ /* треугольники заметнее и разнообразнее */ #iflow-home .hft{opacity:.22} @keyframes hfloatB{0%{transform:translateY(0) rotate(0)}100%{transform:translateY(22px) rotate(-14deg)}} #iflow-home .hft--b{animation-name:hfloatB} #iflow-home .cats,#iflow-home .services{position:relative;overflow:hidden} #iflow-home .hero .wrap,#iflow-home .why .wrap,#iflow-home .cta .wrap,#iflow-home .foot .wrap, #iflow-home .cats .wrap,#iflow-home .services .wrap{position:relative;z-index:1} /* блик по фото карточек каталога при наведении */ #iflow-home .cat .ph::after{content:"";position:absolute;top:0;left:-75%;width:46%;height:100%; background:linear-gradient(105deg,rgba(255,255,255,0),rgba(255,255,255,.5) 50%,rgba(255,255,255,0)); transform:skewX(-18deg);pointer-events:none;transition:left .65s ease} #iflow-home .cat:hover .ph::after{left:130%} /* мягкий пульс свечения главных кнопок */ @keyframes iflowGlowP{0%,100%{box-shadow:0 10px 26px -14px rgba(76,155,232,.5)}50%{box-shadow:0 16px 36px -12px rgba(76,155,232,.85)}} #iflow-home .hero-cta .btn-primary,#iflow-home .cta .btn-primary{animation:iflowGlowP 4.6s ease-in-out infinite} /* пробегающий блик по полосе доверия */ #iflow-home .trust{position:relative;overflow:hidden} #iflow-home .trust::after{content:"";position:absolute;top:0;left:-45%;width:26%;height:100%;transform:skewX(-20deg); background:linear-gradient(105deg,rgba(120,170,225,0),rgba(120,170,225,.14) 50%,rgba(120,170,225,0)); pointer-events:none;animation:iflowSheenX 8s ease-in-out infinite} @keyframes iflowSheenX{0%,58%{left:-45%}88%,100%{left:135%}} /* отклик иконок шагов/решений/документов */ #iflow-home .step .ic,#iflow-home .doc .di,#iflow-home .sol .si{transition:transform .3s cubic-bezier(.3,1.4,.4,1)} #iflow-home .step:hover .ic{transform:translateY(-3px) rotate(-5deg) scale(1.07)} #iflow-home .doc:hover .di{transform:translateY(-3px) rotate(5deg) scale(1.07)} #iflow-home .sol:hover .si{transform:translateY(-3px) rotate(-6deg) scale(1.1)} /* пульсирующий треугольный маркер у надзаголовков */ #iflow-home .eyebrow{position:relative;padding-left:14px} #iflow-home .eyebrow::before{content:"";position:absolute;left:0;top:50%;margin-top:-4px;width:0;height:0; border-style:solid;border-width:0 5px 8px 5px;border-color:transparent transparent currentColor transparent; animation:iflowMark 2.6s ease-in-out infinite} @keyframes iflowMark{0%,100%{opacity:.55;transform:translateY(0)}50%{opacity:1;transform:translateY(-2px)}} /* дыхание цифр статистики */ @keyframes iflowStatG{0%,100%{text-shadow:0 0 0 rgba(142,194,255,0)}50%{text-shadow:0 0 18px rgba(142,194,255,.45)}} #iflow-home .stat b{animation:iflowStatG 5.2s ease-in-out infinite} /* ================= v14: плавные анимации ================= */ /* бархатное появление секций (длиннее и мягче) */ #iflow-home.js [data-rv]{transition-duration:1.05s,1.05s; transition-timing-function:cubic-bezier(.16,1,.3,1),cubic-bezier(.16,1,.3,1)} /* дрейфующие световые пятна в тёмных секциях */ #iflow-home .glb{position:absolute;border-radius:50%;pointer-events:none;will-change:transform; background:radial-gradient(circle,rgba(76,155,232,.26),rgba(46,117,182,.09) 45%,transparent 70%); animation:iflowDriftA var(--gd,26s) ease-in-out var(--gdel,0s) infinite} #iflow-home .glb--b{animation-name:iflowDriftB} #iflow-home .glb--warm{background:radial-gradient(circle,rgba(142,194,255,.16),rgba(76,155,232,.06) 45%,transparent 70%)} @keyframes iflowDriftA{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(70px,-46px) scale(1.12)}66%{transform:translate(-52px,38px) scale(.94)}} @keyframes iflowDriftB{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(-64px,42px) scale(1.08)}66%{transform:translate(48px,-34px) scale(.92)}} /* мягче ховеры карточек */ #iflow-home .cat,#iflow-home .step,#iflow-home .doc,#iflow-home .sol,#iflow-home .brand-row a{ transition-duration:.45s;transition-timing-function:cubic-bezier(.22,.61,.36,1)} /* ================= v15: фигуры плавают из стороны в сторону, без рывков ================= */ @keyframes hswayA{ 0%{transform:translate(0,0) rotate(0)} 25%{transform:translate(28px,-12px) rotate(7deg)} 50%{transform:translate(2px,-22px) rotate(0)} 75%{transform:translate(-26px,-10px) rotate(-7deg)} 100%{transform:translate(0,0) rotate(0)} } @keyframes hswayB{ 0%{transform:translate(0,0) rotate(0)} 25%{transform:translate(-24px,10px) rotate(-6deg)} 50%{transform:translate(2px,20px) rotate(2deg)} 75%{transform:translate(26px,9px) rotate(6deg)} 100%{transform:translate(0,0) rotate(0)} } #iflow-home .hft{animation:hswayA var(--fd,18s) ease-in-out var(--fdel,0s) infinite} #iflow-home .hft--b{animation-name:hswayB} /* ================= v16: ещё плавнее ================= */ #iflow-home .hft{animation-duration:calc(var(--fd,18s)*1.7)} #iflow-home .glb{animation-duration:calc(var(--gd,26s)*1.4)} #iflow-home .hero{margin-top:-4px} #iflow-home .trust{margin-top:-4px} /* треугольники: чуть быстрее, блуждание из стороны в сторону + собственное вращение. rotate — независимое свойство, не конфликтует с transform-траекторией. */ @keyframes hswayA2{0%{transform:translate(0,0)}25%{transform:translate(30px,-14px)}50%{transform:translate(3px,-24px)}75%{transform:translate(-28px,-11px)}100%{transform:translate(0,0)}} @keyframes hswayB2{0%{transform:translate(0,0)}25%{transform:translate(-26px,11px)}50%{transform:translate(2px,22px)}75%{transform:translate(28px,10px)}100%{transform:translate(0,0)}} @keyframes iflowTwirl{to{rotate:360deg}} @keyframes iflowTwirlR{to{rotate:-360deg}} #iflow-home .hft{animation:hswayA2 calc(var(--fd,18s)*1.15) ease-in-out var(--fdel,0s) infinite, iflowTwirl calc(var(--fd,18s)*1.5) linear infinite} #iflow-home .hft--b{animation-name:hswayB2,iflowTwirlR}