/* Alternate editorial direction. The liked version is kept at localhost:3011. */
/* Conversations live on the photograph, with no enclosing product panel. */
.hero .floating-product{width:440px;right:7%;bottom:155px;padding:0;border:0;border-radius:0;background:transparent;backdrop-filter:none;box-shadow:none;overflow:visible;}
.floating-product .hero-demo-panel{height:350px;position:relative;}
.floating-chat{position:relative;height:100%;}
.float-message{position:absolute;display:flex;align-items:flex-end;gap:9px;font-size:17px;line-height:1.25;opacity:0;transform:translateY(32px) scale(.95);transition:opacity .45s,transform .7s cubic-bezier(.16,1,.3,1);filter:drop-shadow(0 8px 18px #0002);}
.float-message>img{width:35px;height:35px;border:2px solid #ffffff99;object-fit:cover;border-radius:50%;flex-shrink:0;}
.float-message p{margin:0;}
.float-message small{display:block;font-size:10px;margin-bottom:5px;opacity:.75;}
.float-request{top:78px;left:0;max-width:85%;}
.float-request>div{background:#faf9f5;color:#111318;border-radius:20px 20px 20px 3px;padding:13px 18px;}
#hero-comment-keyword{display:inline-block;font-size:12px;font-weight:700;margin-top:7px;letter-spacing:.04em;}
.float-answer{display:block;background:#2459ce;padding:18px 20px;right:0;top:158px;max-width:88%;border-radius:23px 23px 3px 23px;}
.float-answer small{font:8px monospace;letter-spacing:.05em;opacity:.85;margin-bottom:9px;}
.float-answer p{font-size:20px;letter-spacing:-.025em;line-height:1.24;}
.float-link{display:flex;justify-content:space-between;gap:16px;margin-top:13px;background:#ffffff26;border-radius:10px;padding:12px 14px;font-size:14px;}
.float-thanks{left:24px;top:281px;font-size:15px;}
.float-thanks>div{background:#faf9f5;color:#111318;padding:13px 17px;border-radius:18px 18px 18px 3px;max-width:285px;}
.float-typing{position:absolute;right:32px;top:185px;background:#2459ce;border-radius:19px;padding:18px 23px;display:flex;gap:6px;opacity:0;transition:opacity .2s;}
.float-typing i{display:block;width:6px;height:6px;background:white;border-radius:50%;animation:demo-dot 1s infinite;}.float-typing i:nth-child(2){animation-delay:.15s}.float-typing i:nth-child(3){animation-delay:.3s}
.floating-product[data-step="0"] .float-request,.floating-product[data-step="1"] .float-request,.floating-product[data-step="2"] .float-request,.floating-product[data-step="3"] .float-request{opacity:1;transform:none;}
.floating-product[data-step="1"] .float-typing{opacity:1;}
.floating-product[data-step="2"] .float-answer,.floating-product[data-step="3"] .float-answer,.floating-product[data-step="3"] .float-thanks{opacity:1;transform:none;}
.floating-product[data-step="2"] .float-request,.floating-product[data-step="3"] .float-request{transform:translateY(-68px);}
.floating-product[data-step="3"] .float-answer{transform:translateY(-44px);}
.floating-product[data-step="3"] .float-thanks{transform:translateY(-5px);}
.floating-product .hero-demo-controls{border:0;margin:0;padding:5px 0;justify-content:flex-end;gap:8px;}
.floating-product .hero-demo-controls button{width:30px;height:30px;display:grid;place-items:center;border:1px solid #ffffff88;border-radius:50%;padding:0;font-size:16px;background:#11131833;}
.floating-product .hero-demo-controls #hero-demo-pause{width:30px;height:30px;font-size:10px;margin:0;}
/* Alternate product peeks keep the same airy composition. */
.floating-studio,.floating-posts{position:relative;height:100%;}
.float-brief{position:absolute;top:2%;left:0;padding:15px 21px;background:#faf9f5;color:#111318;border-radius:16px;z-index:2;rotate:-3deg;}
.float-brief small{font:8px monospace;}.float-brief p{font-size:20px;letter-spacing:-.025em;line-height:1.2;margin:7px 0 0;}
.float-art{position:absolute;width:37%;height:66%;object-fit:cover;box-shadow:0 12px 30px #0002;opacity:0;transform:translateY(70px) rotate(-8deg);transition:transform 1s cubic-bezier(.16,1,.3,1),opacity .5s;}
.art-one{left:2%;top:28%;rotate:-7deg;}.art-two{left:33%;top:19%;rotate:5deg;}.art-three{right:0;top:29%;rotate:12deg;}
.float-studio-note{position:absolute;bottom:0;right:0;background:#2459ce;padding:10px 15px;font-size:12px;border-radius:18px;opacity:0;transition:opacity .4s;}
.floating-product[data-step="1"] .art-one,.floating-product[data-step="2"] .art-one,.floating-product[data-step="3"] .float-art,.floating-product[data-step="2"] .art-two{opacity:1;transform:none;}
.floating-product[data-step="3"] .float-studio-note{opacity:1;}
.float-social{position:absolute;background:#fff;color:#111318;overflow:hidden;box-shadow:0 10px 35px #0003;opacity:0;transform:translateY(45px);transition:transform .9s cubic-bezier(.16,1,.3,1),opacity .5s;}
.float-social>span{display:flex;align-items:center;gap:7px;font-size:9px;padding:9px;}.float-social>span img{width:16px;height:16px;}.float-social>img{width:100%;height:calc(100% - 67px);object-fit:cover;}.float-social>p{font-size:10px;padding:9px;}
.social-one{top:6%;left:0;width:49%;height:80%;rotate:-5deg;border-radius:9px;opacity:1;transform:none;}
.social-two{top:23%;right:0;width:59%;height:52%;rotate:6deg;}.social-two>span img{background:#e31520;border-radius:3px;padding:2px;}.social-two>b{position:absolute;left:10px;bottom:18px;font:16px/.95 Archivo;color:white;text-shadow:0 2px 10px #000;max-width:140px;}
.social-three{bottom:3%;left:8%;width:88%;padding:14px;display:flex;gap:11px;align-items:center;rotate:-2deg;}.social-three>img{width:28px;height:28px;background:#0a66c2;border-radius:3px;padding:4px;}.social-three strong{font-size:12px;}.social-three p{font-size:10px;margin-top:4px;}
.floating-product[data-step="1"] .social-two,.floating-product[data-step="2"] .social-two,.floating-product[data-step="3"] .social-two,.floating-product[data-step="2"] .social-three,.floating-product[data-step="3"] .social-three{opacity:1;transform:none;}
/* A social post fills the phone, then makes room for the conversation. */
.autodm{min-height:900px;}.auto-copy{justify-content:center;padding:70px 10% 65px 12%;}.auto-copy h2{margin:30px 0;font-size:clamp(54px,5.1vw,91px);line-height:.99;}.auto-copy .pill{margin-top:38px;}.auto-copy .demo-hint{font-size:11px;}.demo-stage{padding:55px 6%;}.phone{width:390px;border-radius:39px;box-shadow:none;border-width:8px;}.phone-content{height:502px;min-height:0;padding:12px;overflow:hidden;}.post-mini{width:100%;height:420px;border-radius:6px;transition:height .9s cubic-bezier(.16,1,.3,1);}.post-mini img{object-position:72% 43%;transition:object-position 1s;}.post-mini>span{font-size:30px;left:18px;bottom:58px;max-width:85%;}.post-mini small{font-size:10px;left:18px;bottom:24px;max-width:85%;}.phone-messages{font-size:14px;gap:9px;}.demo-stage[data-phase="1"] .post-mini{height:328px;}.demo-stage[data-phase="2"] .post-mini{height:245px;}.demo-stage[data-phase="3"] .post-mini{height:218px;}.phone-messages [hidden]{display:none!important;}.phone-messages .incoming{font-size:14px;}.phone-messages .outgoing{font-size:14px;padding:14px;max-width:92%;}.phone-messages .outgoing button{font-size:13px;padding:10px;}.phone-messages>div:not([hidden]){animation:message-enter .6s cubic-bezier(.16,1,.3,1) both;}.stage-caption{max-width:390px;width:100%;padding:17px 12px;background:#2459ce;color:white;margin-top:12px;gap:20px;}.stage-caption button{color:white;}.stage-label{margin-bottom:25px;font-size:9px;}
@keyframes message-enter{from{opacity:0;transform:translateY(25px) scale(.96)}to{opacity:1;transform:none}}
/* Every feature has its own photographic layout, at a scale that reads on scroll. */
.workflow-block{min-height:880px;padding:68px 3% 68px 6%;grid-template-columns:43% 57%;}.workflow-visual{height:720px;}.workflow-copy h2{font-size:clamp(68px,6.5vw,112px);}.workflow-copy .feature-benefit{font-size:clamp(23px,2vw,31px);max-width:380px;}.workflow-description{font-size:17px;max-width:385px;}.photo-piece{padding:0;border:0;box-shadow:none;rotate:0deg;}.photo-piece>img{height:100%;}.photo-piece figcaption{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,#111318b0);color:white;padding:35px 17px 15px;font-size:12px;}.photo-piece figcaption img{background:transparent;filter:brightness(0) invert(1);width:20px;height:20px;padding:0;}
.collage-studio .piece-one{left:0;top:3%;width:59%;height:88%;--travel:-85px;}.collage-studio .piece-two{left:auto;right:0;top:0;width:38%;height:47%;--travel:70px;}.collage-studio .piece-three{left:auto;right:0;bottom:2%;width:38%;height:47%;--travel:-30px;}.collage-studio .piece-one>img{object-position:47%;}.collage-studio .piece-three>img{object-position:40%;}
/* Native post formats make the cross-platform outcome recognizable. */
.collage-posts .piece-one{left:0;top:2%;height:87%;width:49%;border-radius:27px;background:#111318;color:white;border:8px solid #111318;--travel:-90px;}.collage-posts .piece-one>img{height:100%;}.collage-posts .piece-one figcaption{padding:70px 14px 20px;font-size:14px;align-items:flex-start;}.collage-posts .piece-two{right:0;top:10%;height:36%;width:49%;background:#111318;border:7px solid #111318;border-radius:10px;--travel:70px;}.collage-posts .piece-two figcaption{font-size:11px;padding:25px 10px 12px;}.collage-posts .piece-three{right:0;bottom:8%;height:40%;width:49%;background:white;border:1px solid #d8dee9;--travel:-35px;}.collage-posts .piece-three>img{height:calc(100% - 65px);}.collage-posts .piece-three figcaption{background:white;color:#111318;font-size:12px;padding:14px;min-height:65px;}.collage-posts .piece-three figcaption img{filter:none;background:#0a66c2;padding:2px;flex-shrink:0;}
/* An actual week, rather than three tilted Polaroids. */
.collage-calendar{margin:0 2%;border-top:1px solid #11131830;border-bottom:1px solid #11131830;}.calendar-heading{left:0;right:0;top:4%;font-size:11px;}.calendar-heading>span{font-size:10px;}.calendar-piece{top:20%;height:68%;width:31.5%;padding:0;rotate:0deg;box-shadow:none;background:transparent;--travel:30px;}.calendar-piece.piece-one{left:0;top:20%;--travel:-85px;}.calendar-piece.piece-two{left:34.2%;top:20%;--travel:20px;}.calendar-piece.piece-three{right:0;top:20%;--travel:95px;}.calendar-day{border-top:1px solid #11131825;padding:15px 0;margin-bottom:4px;flex-direction:column;align-items:flex-start;gap:12px;}.calendar-day b{font-size:65px;line-height:.9;}.calendar-piece>img{height:58%;}.calendar-piece figcaption{font-size:12px;line-height:1.4;}.calendar-piece small{font-size:9px;}
/* Connections: one principal portrait, two people and a clear visual link. */
.collage-connect .piece-one{left:24%;top:0;width:60%;height:90%;border-radius:0;--travel:-75px;}.collage-connect .piece-one figcaption{display:none;}.collage-connect .piece-two{left:1%;right:auto;top:9%;width:26%;height:auto;aspect-ratio:1;border-radius:50%;border:6px solid #f4f3ed;z-index:2;--travel:90px;}.collage-connect .piece-two>img{aspect-ratio:1;}.collage-connect .piece-two figcaption{display:none;}.connection-portrait{left:auto;right:0;bottom:1%;width:30%;height:auto;aspect-ratio:1;rotate:0deg;border-radius:50%;border:6px solid #f4f3ed;box-shadow:none;translate:0 calc((var(--block-progress,.3) - .5) * 70px);}.connection-bridge{top:67%;left:4%;right:27%;padding:17px 26px;border-radius:45px;box-shadow:0 10px 40px #11131812;}.connection-bridge>img:first-child{width:90px;}.bridge-flow{font-size:23px;letter-spacing:5px;}.connection-caption{position:absolute;left:3%;bottom:4%;font:clamp(17px,2vw,29px)/1.05 Archivo;letter-spacing:-.05em;max-width:57%;color:#2459ce;}
/* Campaign imagery paired with the brand that ties it together. */
.collage-brand .piece-one{left:0;top:0;width:69%;height:88%;--travel:-80px;}.collage-brand .piece-two{right:0;top:12%;height:50%;width:39%;border:7px solid #f3e6ae;--travel:65px;}.collage-brand .piece-one figcaption{font-size:14px;}.collage-brand .piece-two figcaption{display:none;}.collage-brand .brand-identity{right:0;bottom:0;rotate:0deg;width:48%;padding:25px;box-shadow:none;background:#faf9f5;}.brand-identity>strong{font-size:108px;margin:16px 0;color:#2459ce;}.brand-identity>span{font-size:9px;}.brand-identity>small{font-size:8px;}
/* A single dedicated scroll moment: text grows through the viewport. */
.editorial-scroll{height:205svh;position:relative;}.editorial-scroll .editorial{position:sticky;top:0;height:100svh;min-height:560px;isolation:isolate;}.editorial-scroll .editorial>img{transform:scale(calc(1 + var(--zoom-progress,0) * .16));}.editorial-scroll .editorial h2,.editorial-scroll .editorial>p{opacity:clamp(0,calc(1 - var(--zoom-progress,0) * 4),1);}.expanding-word{position:absolute;left:50%;top:53%;transform:translate(-50%,-50%) scale(calc(.18 + var(--zoom-progress,0) * 4.3));font:clamp(130px,23vw,450px)/.8 Archivo;letter-spacing:-.075em;color:#f3e6ae;z-index:3;white-space:nowrap;opacity:clamp(0,calc((var(--zoom-progress,0) - .13) * 7),1);pointer-events:none;will-change:transform;}.zoom-scroll-note{position:absolute;bottom:29px;right:4%;z-index:4;font:10px monospace;color:white;opacity:clamp(0,calc(1 - var(--zoom-progress,0) * 3),1);}.editorial-scroll .editorial>p{bottom:30px;left:4%;right:auto;}.editorial-top{z-index:4;}
/* The display type expands; the VKIT logo keeps its true proportions. */
.film-make-big{padding:30px;background:#2459ce;}.film-make-big>.film-kicker{color:white;margin-top:0;}.footer-type-stage{position:absolute;inset:16% 0 12%;display:flex;align-items:center;justify-content:center;isolation:isolate;}.footer-type-stage>span{position:absolute;font:clamp(80px,11vw,180px)/.85 Archivo;letter-spacing:-.07em;opacity:0;}.film-make-big.active .footer-type-stage>span:first-child{animation:make-type 6.5s both;}.film-make-big.active .footer-type-stage>span:nth-child(2){animation:it-type 6.5s both;}.film-make-big.active .footer-type-stage>span:nth-child(3){animation:big-type 6.5s both;color:#f3e6ae;}.type-vkit{position:absolute;bottom:83px;right:25px;width:65px;height:36px;object-fit:contain;}
@keyframes make-type{0%{opacity:0;transform:translateY(90%) scale(.65)}10%,27%{opacity:1;transform:none}35%,100%{opacity:0;transform:translateY(-100%) scale(1.2)}}
@keyframes it-type{0%,27%{opacity:0;transform:translateY(90%) scale(.65)}38%,48%{opacity:1;transform:none}57%,100%{opacity:0;transform:translateY(-100%) scale(1.2)}}
@keyframes big-type{0%,47%{opacity:0;transform:scale(.1)}59%{opacity:1;transform:scale(.8)}75%{opacity:1;transform:scale(1)}100%{opacity:1;transform:scale(4.6)}}
@media(min-width:1800px){.hero .floating-product{width:500px;bottom:180px;right:10%;}.float-answer p{font-size:23px;}.float-message{font-size:20px;}.floating-product .hero-demo-panel{height:400px;}.float-thanks{top:310px;}.workflow-block{min-height:1020px;}.workflow-visual{height:850px;}.phone{width:430px;}.phone-content{height:530px;}.workflow-description{font-size:20px;}}
@media(min-width:761px) and (max-width:1100px){.hero .floating-product{width:36%;right:4%;bottom:175px;}.float-answer{padding:15px;max-width:94%;}.float-answer p{font-size:17px;}.float-message{font-size:14px;}.float-message>img{width:27px;height:27px;}.float-thanks{left:0;font-size:13px;}.float-request{max-width:95%;}.float-link{font-size:12px;}.workflow-block{min-height:720px;}.workflow-visual{height:570px;}.workflow-copy h2{font-size:clamp(51px,6.4vw,71px);}.workflow-copy .feature-benefit{font-size:23px;}.workflow-description{font-size:15px;}.calendar-day b{font-size:50px;}.brand-identity>strong{font-size:78px;}.collage-brand .brand-identity{padding:17px;}.connection-bridge{left:0;right:20%;padding:12px 18px;}.connection-bridge>img:first-child{width:70px;}.connection-bridge>img:last-child{width:26px;}.auto-copy h2{font-size:51px;}.phone{width:340px;}.phone-content{height:490px;}.post-mini>span{font-size:25px;}.photo-piece figcaption{font-size:10px;}.collage-posts .piece-one figcaption{font-size:11px;}.collage-posts .piece-three figcaption{font-size:10px;padding:10px;}}
@media(max-width:760px){.hero .floating-product{position:relative;right:auto;bottom:auto;width:88%;max-width:430px;margin:40px auto 30px;padding:0;}.floating-product .hero-demo-panel{height:345px;}.float-answer p{font-size:19px;}.float-message{font-size:16px;}.float-answer{max-width:91%;}.float-request{max-width:96%;}.float-thanks{left:0;font-size:14px;}.float-thanks>div{max-width:250px;}.hero .hero-image{top:280px;height:900px;object-position:65%;}.hero .hero-shade{background:linear-gradient(180deg,#131c25 0%,#131c25e0 26%,#131c2510 60%,#131c25c9 92%,#131c25 100%);}.auto-copy{padding:55px 6% 30px;}.auto-copy h2{font-size:clamp(51px,11.5vw,74px);margin:25px 0;}.auto-copy h2 span br{display:none;}.auto-copy .pill{margin-top:22px;}.demo-stage{padding:22px 6% 45px;}.phone{width:370px;}.phone-content{height:485px;}.post-mini{height:404px;}.post-mini>span{font-size:26px;}.post-mini small{font-size:9px;}.stage-caption{max-width:370px;}.workflow-block{min-height:0;padding:55px 0 32px;}.workflow-copy h2{font-size:clamp(57px,13vw,85px);}.workflow-copy .feature-benefit{font-size:25px;max-width:420px;}.workflow-description{font-size:16px;}.workflow-visual{height:540px;margin-top:37px;}.photo-collage{margin:0 6%;}.photo-piece figcaption{font-size:10px;padding:30px 11px 12px;}.collage-studio .piece-one{height:89%;}.collage-studio .piece-two{height:43%;top:1%;}.collage-studio .piece-three{height:44%;bottom:3%;}.collage-posts .piece-one{border-width:6px;border-radius:21px;}.collage-posts .piece-one figcaption{font-size:11px;padding:30px 10px 14px;}.collage-posts .piece-two{border-width:5px;top:12%;height:35%;}.collage-posts .piece-two figcaption{font-size:9px;padding:25px 8px 10px;}.collage-posts .piece-three{bottom:9%;height:39%;}.collage-posts .piece-three figcaption{font-size:10px;padding:10px;}.calendar-heading{top:4%;font-size:9px;}.calendar-heading>span{font-size:8px;}.calendar-day b{font-size:51px;}.calendar-day{font-size:8px;}.calendar-piece{height:68%;}.calendar-piece>img{height:55%;}.calendar-piece figcaption{font-size:10px;}.calendar-piece small{font-size:8px;}.connection-bridge{left:0;right:24%;padding:12px 17px;top:65%;}.connection-bridge>img:first-child{width:74px;height:40px;}.connection-bridge>img:last-child{width:27px;height:27px;}.bridge-flow{font-size:16px;letter-spacing:3px;}.connection-caption{font-size:24px;bottom:7%;}.collage-brand .brand-identity{padding:17px;width:49%;bottom:2%;}.brand-identity>strong{font-size:80px;}.brand-identity>span{font-size:7px;}.brand-identity>small{font-size:6px;}.editorial-scroll{height:170svh;}.editorial-scroll .editorial{min-height:500px;}.editorial-scroll .editorial h2{font-size:clamp(67px,14vw,108px);bottom:100px;}.expanding-word{font-size:44vw;transform:translate(-50%,-50%) scale(calc(.2 + var(--zoom-progress,0) * 6));}.editorial-scroll .editorial>p{font-size:13px;bottom:46px;}.zoom-scroll-note{font-size:8px;bottom:20px;}.footer-type-stage>span{font-size:29vw;}}
@media(max-width:380px){.float-answer p{font-size:16px;}.float-answer{padding:16px;}.float-message{font-size:14px;}.float-thanks{font-size:12px;}.float-link{font-size:12px;}.float-thanks>div{max-width:218px;}.workflow-visual{height:470px;}.workflow-copy h2{font-size:53px;}.workflow-copy .feature-benefit{font-size:22px;}.calendar-day b{font-size:44px;}.calendar-piece small{font-size:7px;}.collage-posts .piece-three figcaption{font-size:8px;}.photo-piece figcaption img{width:15px;height:15px;}.connection-caption{font-size:22px;}.brand-identity>strong{font-size:69px;}.post-mini>span{font-size:24px;}.phone-content{height:490px;}.phone-messages .outgoing{font-size:13px;}}
@media(prefers-reduced-motion:reduce){.floating-product *{transition:none!important;animation:none!important;}.editorial-scroll{height:auto;}.editorial-scroll .editorial{position:relative;height:700px;min-height:0;}.editorial-scroll .editorial>img{transform:none;}.editorial-scroll .editorial h2,.editorial-scroll .editorial>p{opacity:1;}.expanding-word,.zoom-scroll-note{display:none;}.footer-type-stage>span{opacity:0!important;}.footer-type-stage>span:nth-child(3){opacity:1!important;transform:none!important;}.phone *, .phone-messages>*{animation:none!important;transition:none!important;}}
.motion-paused .floating-product *,.motion-paused .brand-film *{animation-play-state:paused!important;}.motion-paused .phone *{animation:none!important;transition:none!important;}

@media(max-width:760px){.auto-copy h2{max-width:100%;font-size:clamp(42px,11.7vw,74px)}.auto-copy h2 span br{display:initial}}
/* Keep the pricing poster/comparison inside narrow phone viewports. */
.pricing-page main{overflow-x:clip;}
