*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;color:#20211f;background:white;font:16px/1.5 "Helvetica Neue",Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,summary,select{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible,select:focus-visible{outline:3px solid #e87a43;outline-offset:3px}header{border-bottom:1px solid #e6e5e2;background:white}.nav,.wrap{max-width:1216px;width:calc(100% - 112px);margin:auto}.nav{height:76px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:26px;font-weight:750;letter-spacing:-1.7px;display:inline-flex;align-items:center}.brand span{color:#777875}.mark{width:27px;height:26px;display:inline-flex;gap:3px;align-items:end;margin-right:9px;transform:skewY(-13deg)}.mark b{width:6px;background:#ea6535;height:12px}.mark b:nth-child(2){height:19px}.mark b:last-child{height:25px}nav{display:flex;gap:28px;font-size:13px}nav a:hover,footer a:hover{color:#c14a19}.navcta,.outline,.dark{border-radius:8px;padding:10px 17px;font-weight:550;font-size:14px}.navcta,.dark{color:white;background:#222320}.navcta span{margin-left:9px}.hero{position:relative;isolation:isolate;overflow:hidden;min-height:590px;border-bottom:1px solid #e4e3df;text-align:center;background-color:#fbfbf9;background-image:linear-gradient(#dfdfd73b 1px,transparent 1px),linear-gradient(90deg,#dfdfd73b 1px,transparent 1px);background-size:48px 48px}.hero canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1}.hero-inner{padding:57px 18px 140px}.eyebrow,.section-label,small,.wave-caption{font-family:ui-monospace,Menlo,monospace;font-size:10px;font-weight:600;letter-spacing:1.5px}.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:5px 11px;border:1px solid #dadbd4;border-radius:20px;background:#fff}.eyebrow i,.section-label:before,.free i,.wave-caption i{display:inline-block;content:"";width:6px;height:6px;background:#eb6b37;border-radius:50%}h1,h2,h3,p{margin:0}h1{font-size:clamp(60px,6.8vw,98px);line-height:.99;letter-spacing:-.069em;margin:22px 0 19px;font-weight:640}h1 span,h2 span{color:#ee6836}.hero p,.cta p{color:#5b5c56;font-size:18px;line-height:1.48}.hero form{display:flex;align-items:center;margin:24px auto 9px;max-width:615px;padding:6px;border:1px solid #ccccbf;background:white;border-radius:13px;box-shadow:0 5px 20px #29240b0c}.spark{color:#e36635;font-size:26px;margin:0 12px}.hero input{flex:1;min-width:0;border:0;background:none;font-size:15px;padding:8px 0}.hero button,.dark{border:none;background:#232420;color:white;padding:13px 19px;border-radius:8px;font-weight:550}.hero button span{margin-left:6px}.free{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:#676963}.free i{background:#808f75;width:5px;height:5px}.wave-caption{position:absolute;bottom:15px;left:4%;letter-spacing:.3px;font-size:10px;color:#71716b;background:#fbfbf9dd;padding:2px 6px}.wave-caption i{margin-right:7px}.section{padding-top:71px}.section-label{display:flex;align-items:center;gap:9px;color:#70716a;font-size:10px}.section-label:before{border-radius:1px}.section h2,.catalog h1{font-size:clamp(34px,4vw,58px);font-weight:590;line-height:1.05;letter-spacing:-.055em;margin:12px 0 27px}.steps,.cards,.banners{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.steps article,.case,.card,.cta,.banners>*{border:1px solid #dedfd8;border-radius:14px}.steps article{padding:22px 24px;position:relative;background:#fafbf8;overflow:hidden}.steps small,.case small{color:#71736a}h3{font-size:23px;letter-spacing:-.045em;line-height:1.2}.steps p,.case p,details p{margin-top:8px;color:#62635d;font-size:15px}.diagram{height:66px;display:flex;align-items:center;position:relative;margin:8px 0 10px}.d1{gap:4px}.d1 i{background:#ee7d51;width:4px;border-radius:3px;height:16px}.d1 i:nth-child(2n){height:32px}.d1 i:nth-child(3n){height:43px}.d1 i:nth-child(5){height:53px}.d2{width:95px}.d2 b,.d2 i{border:1px solid #e47042;position:absolute;border-radius:4px;background:#fff3e9}.d2 b{width:24px;height:24px;left:0}.d2 i{width:23px;height:10px;left:62px;top:9px}.d2 i:before{content:"";position:absolute;width:39px;height:1px;background:#d5a58a;right:100%;top:50%;transform-origin:right;transform:rotate(-22deg)}.d2 i:nth-child(3){top:29px}.d2 i:nth-child(3):before{transform:none}.d2 i:last-child{top:49px}.d2 i:last-child:before{transform:rotate(22deg)}.d3 b{width:68px;height:45px;border:1.5px solid #d77750;border-radius:5px;background:linear-gradient(#ffeadc 8px,#d77750 9px,white 10px)}.d3 i{position:absolute;width:35px;height:12px;background:#ffc29f;left:9px;top:29px}.case,.cta{background:#f7f8f4;padding:32px;display:flex;gap:26px;align-items:center;justify-content:space-between}.case>div:first-child{max-width:420px}.case h3{margin-top:9px}.metrics{display:flex;gap:22px}.metrics div{border-left:1px solid #d5d6ce;padding-left:20px;font-size:13px;color:#73756c}.metrics strong{display:block;font-size:42px;font-weight:450;color:#30332c}.row,footer{display:flex;align-items:center;justify-content:space-between;gap:16px}.outline{border:1px solid #cfd0c9;background:white;display:inline-block}.category{margin:18px 0 13px;font-size:20px}.cards{margin-bottom:30px}.card{overflow:hidden;background:white}.preview{height:175px;background:var(--tone);padding:18px 18px 0;overflow:hidden}.mini{height:100%;position:relative;isolation:isolate;overflow:hidden;background:#252622;padding:14px;color:white;border-radius:4px 4px 0 0;box-shadow:0 4px 14px #0002}.mini img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.mini:after{content:"";position:absolute;inset:0;background:linear-gradient(85deg,#0009,transparent);z-index:-1}.mini small{font-size:8px;color:white}.mini strong{display:block;font:normal 28px/1.03 Georgia,serif;max-width:160px;margin-top:20px}.card-foot{display:flex;align-items:center;justify-content:space-between;padding:14px;gap:7px}.card-foot h4{margin:0;font-size:16px}.card-foot button{border:1px solid #d7d9d0;background:white;border-radius:7px;padding:6px 9px;font-size:12px}details{border-top:1px solid #dcded5;padding:16px 0}summary{font-weight:550;list-style:none;display:flex;justify-content:space-between}summary:after{content:"+";font-size:20px}details[open] summary:after{content:"−"}details p{max-width:780px}.cta{display:block;text-align:center;padding:45px 16px}.cta .section-label{justify-content:center}.cta h2{margin-bottom:12px}.cta a{display:inline-block;margin-top:18px}.banners{margin:15px 0 56px}.banners>*{display:flex;align-items:center;justify-content:space-between;background:white;padding:17px;text-align:left;font-size:15px}.banners b{color:#d75f30}footer{border-top:1px solid #dedfd8;padding:22px 0;font-size:12px;color:#71736a}dialog{border:1px solid #dddcd6;border-radius:15px;max-width:520px;width:calc(100% - 32px);padding:30px;color:#252620}dialog::backdrop{background:#23252177}.close{float:right;background:#f3f3ef;border:0;border-radius:50%;width:32px;height:32px;font-size:22px}.modal-body h2,dialog h2{letter-spacing:-.04em;line-height:1.15;margin:10px 0 16px}dialog p{margin:10px 0;color:#5d5e58}dialog img{width:100%;height:180px;object-fit:cover;border-radius:8px}.catalog{padding-top:50px}.catalog select{padding:9px;border-radius:7px}.navcta:hover,.dark:hover,.hero button:hover{background:#454740}
@media(max-width:800px){.nav,.wrap{width:calc(100% - 36px)}nav{display:none}.nav{height:62px}.hero{min-height:540px}.hero-inner{padding-top:60px}.steps,.cards{gap:9px}.steps article{padding:15px}.case{display:block}.metrics{margin-top:22px}.banners{grid-template-columns:1fr}.section{padding-top:48px}.card-foot{flex-wrap:wrap}}
@media(max-width:600px){.brand{font-size:23px}.navcta{font-size:12px;padding:8px 12px}.hero-inner{padding:48px 15px 142px}.hero h1{font-size:clamp(43px,10.6vw,62px)}.hero p{font-size:16px}.desktop{display:none}.hero form{flex-wrap:wrap;padding:7px}.hero input{font-size:16px}.hero button{width:100%;margin-top:5px}.hero{min-height:510px}.steps,.cards{grid-template-columns:1fr}.steps article{padding:19px 22px}.diagram{position:absolute;top:2px;right:10px;transform:scale(.55);transform-origin:right top}.steps h3{margin-top:14px}.row{align-items:flex-start;flex-wrap:wrap;margin-bottom:16px}.row h2{margin-bottom:0}.case{padding:22px}.metrics{gap:13px}.metrics div{padding-left:12px}.preview{height:190px}.catalog .cards{margin-top:16px}footer{flex-wrap:wrap}.cta p{font-size:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.hero #city{max-width:116px;border-left:1px solid #ddd;padding-left:12px}.hero form{max-width:700px}
@media(max-width:600px){.hero #city{max-width:85px}}
.demo-link .card-foot span{font-size:12px;border-bottom:1px solid #c7c8c1}.demo-link:hover{border-color:#c06d4b}

.format-shot{display:block;width:100%;aspect-ratio:11/7;object-fit:cover;object-position:top;border-bottom:1px solid #dedfd8}.demo-link{display:block}.demo-link .card-foot small{display:block;color:#686c61;letter-spacing:.04em;margin:0 0 4px}.demo-link .card-foot span{font-size:20px;border:0}.demo-link:hover .card-foot span{color:#c1613a}

.hero{height:100vh;height:100dvh;min-height:360px;display:grid;place-items:center;background-size:60px 60px}.hero .hero-inner{position:relative;width:100%;padding:20px 16px 7vh}.hero canvas{opacity:.38}.hero .hero-brand{justify-content:center;margin-bottom:7px}.hero h1{margin:14px 0 18px}.hero form{margin-top:24px}@media(max-height:450px){.hero .hero-inner{padding:8px}.hero h1{font-size:44px}.hero h1 br{display:none}.hero form{margin-top:10px}}

main > .hero + header{position:sticky;top:0;z-index:20;background:#fff}main > section[id]{scroll-margin-top:82px}

.hosting-intro,.hosting-note{max-width:70ch;color:#585c52}
.hosting-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:20px 0}
.hosting-options article{display:flex;flex-direction:column;padding:clamp(20px,3vw,32px);border:1px solid #dedfd8;border-radius:16px}
.hosting-options h3{font-size:clamp(20px,2.2vw,28px);letter-spacing:-.035em;margin:0}
.hosting-options p{line-height:1.5}
.hosting-options .hosting-price{margin:auto 0 0;padding-top:16px;border-top:1px solid #dedfd8}
.hosting-options article>p:first-of-type{margin:12px 0 22px}
.hosting-note{font-size:14px}
@media(max-width:650px){.hosting-options{grid-template-columns:1fr}}

/* Один пример проходит через подсказки, интенты и каталог. */
.seo-art{position:relative;display:flex;align-items:center;justify-content:center;height:136px;margin:12px 0 20px;overflow:hidden;border-radius:10px;background-color:#f3f3ed;background-image:radial-gradient(#ced0c5 .8px,transparent 1px);background-size:12px 12px;color:#353630;font-size:12px;line-height:1.25}
.art-query{flex-direction:column;gap:6px}
.query-field,.cluster-root,.cluster-leaves span,.art-window{background:#fff;border:1px solid #c7c8bd;box-shadow:0 3px 8px #25251a0b}
.query-field{display:flex;align-items:center;gap:9px;padding:10px 16px;border-radius:20px;font-weight:600}
.lens{position:relative;width:12px;height:12px;border:1.8px solid #c7562b;border-radius:50%}
.lens:after{content:"";position:absolute;width:6px;height:2px;background:#c7562b;right:-5px;bottom:-2px;transform:rotate(45deg)}
.art-caret{height:14px;width:1px;background:#c7562b}
.suggestion{background:#fdfdf9;padding:5px 9px;color:#66685f;border-radius:4px}
.cluster-root,.cluster-leaves span{border-radius:6px;padding:5px 9px}
.cluster-root{background:#fff1e8;border-color:#de9d80;font-weight:600}
.branch{width:clamp(18px,2vw,32px);height:62px;margin-left:18px;border:1px solid #b68466;border-right:0;border-radius:6px 0 0 6px;position:relative}
.branch:before{content:"";position:absolute;top:50%;left:-18px;width:calc(100% + 18px);border-top:1px solid #b68466}
.cluster-leaves{display:grid;gap:5px}
.art-window{width:162px;border-radius:8px;overflow:hidden;transform:rotate(-3deg)}
.window-bar{display:flex;gap:3px;padding:6px 8px;border-bottom:1px solid #d9d9ce}
.window-bar i{width:4px;height:4px;border-radius:50%;background:#babbb2}
.window-bar i:first-child{background:#e57543}
.window-body{padding:9px 12px}
.window-tiles{display:flex;gap:4px;margin-top:6px}
.window-tiles i{flex:1;height:30px;border-radius:3px;background-color:#f2e5d7;background-image:radial-gradient(ellipse at 48% 40%,#c98466 0 18%,transparent 20%),linear-gradient(70deg,transparent 49%,#8c9675 50% 53%,transparent 54%)}
.window-tiles i:nth-child(2){filter:hue-rotate(25deg)}
.window-tiles i:nth-child(3){filter:hue-rotate(-30deg)}
.hosting-symbol{width:40px;height:40px;display:grid;align-content:center;justify-items:center;gap:2px;border-radius:11px;background:#faf0e7;color:#a74c29;margin-bottom:15px}
.globe-icon i{position:relative;width:23px;height:23px;border:1.5px solid;border-radius:50%}
.globe-icon i:before{content:"";position:absolute;inset:0 5px;border:1px solid;border-radius:50%}
.globe-icon i:after{content:"";position:absolute;top:50%;left:0;right:0;border-top:1px solid}
.server-icon i{width:22px;height:8px;border:1.5px solid;border-radius:3px;background:radial-gradient(circle at 5px 50%,currentColor 1px,transparent 1.5px)}
@media(min-width:601px) and (max-width:970px){.art-cluster{font-size:10px}.branch{width:10px;margin-left:6px}.branch:before{left:-6px;width:calc(100% + 6px)}.cluster-root,.cluster-leaves span{padding:5px}}
@media(prefers-reduced-motion:no-preference){
 .steps article:is(:hover,:focus-within) .art-caret{animation:seo-caret .75s steps(2,end) 3}
 .steps article:hover .cluster-leaves span{animation:seo-highlight .8s ease both}
 .steps article:hover .cluster-leaves span:nth-child(2){animation-delay:.15s}
 .steps article:hover .cluster-leaves span:last-child{animation-delay:.3s}
 .art-window{transition:transform .35s ease}
 .steps article:hover .art-window{transform:rotate(0) translateY(-2px)}
}
@keyframes seo-caret{50%{opacity:0}}
@keyframes seo-highlight{45%{border-color:#db8b67;background:#fff1e8}}

.seo-explainer{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,72px);align-items:start}
.seo-definition p:first-child{font-size:clamp(19px,2vw,26px);line-height:1.4;letter-spacing:-.025em}
.seo-definition p+p{margin-top:16px;color:#595c54}
.seo-income{padding:clamp(18px,2.5vw,30px);background:#fafbf8;border:1px solid #dedfd8;border-radius:14px}
.seo-income ul{padding-left:1.15rem;margin:14px 0 0}
.seo-income li+li{margin-top:10px}
.seo-income li::marker{color:#cb6034}
@media(max-width:740px){.seo-explainer{grid-template-columns:1fr}}

.formula-intro,.formula-extra{max-width:76ch;color:#595c54}
.formula-board{display:grid;grid-template-columns:4fr 5fr;margin:24px 0;border:1px solid #dedfd8;border-radius:16px;overflow:hidden}
.formula-example,.formula-compare{padding:clamp(20px,3vw,36px)}
.formula-example{color:#f8f8f3;background-color:#292d29;background-image:radial-gradient(#434840 1px,transparent 1px);background-size:16px 16px}
.formula-query{display:inline-flex;align-items:center;gap:12px;border-radius:24px;background:#fff8f2;color:#35352e;padding:10px 16px;margin:22px 0 12px}
.formula-intent{color:#c6cac0;font-size:14px}
.formula-intent strong{display:block;color:white;font-size:17px}
.formula-tree{margin:18px 0 0;font-size:14px}
.formula-tree>*{display:table;position:relative;margin:9px 0;padding:4px 11px;border:1px solid #687264;border-radius:5px;background:#30352f}
.formula-tree>:nth-child(2){margin-left:23px}
.formula-tree>:last-child{margin-left:46px;border-color:#e6a17c;color:#ffd2b8}
.formula-tree>:not(:first-child):before{content:"";position:absolute;bottom:50%;right:100%;width:14px;height:23px;border:solid #a3ad9c;border-width:0 0 1px 1px}
.formula-compare dl{margin:12px 0 0}
.formula-compare dl>div{display:grid;grid-template-columns:minmax(115px,1fr) 1.65fr;gap:14px;border-bottom:1px solid #e5e6df;padding:10px 0;font-size:14px}
.formula-compare dt{font-weight:650}
.formula-compare dd{margin:0;color:#53564e}
.formula-compare dl>.formula-platform{margin-top:8px;padding:12px;background:#fff1e7;border:0;border-radius:8px}
.formula-clicks{list-style:none;counter-reset:click;display:flex;gap:18px;margin:14px 0;padding:0}
.formula-clicks li{counter-increment:click;display:flex;align-items:center;gap:9px;font-weight:550}
.formula-clicks li:before{content:counter(click);display:grid;place-items:center;flex:none;width:26px;height:26px;border:1px solid #dfb69c;border-radius:50%;color:#984621;font-size:13px}
.formula-extra{font-size:14px}
@media(max-width:800px){.formula-board{grid-template-columns:1fr}.formula-clicks{flex-wrap:wrap}}
@media(max-width:550px){.formula-compare dl>div{grid-template-columns:1fr;gap:3px}.formula-clicks{flex-direction:column;gap:10px}}