/* HostBlue: dimensional product storytelling, progressively enhanced. */
:root{--hb-sky:#49cfff;--hb-depth-shadow:0 24px 55px -30px #063a7755}
.hero.hb-real-hero{isolation:isolate;background:radial-gradient(ellipse at 75% 35%,#104b73 0,transparent 52%),linear-gradient(130deg,#061525,#092b4b);overflow:hidden}
.hb-hero-copy{position:relative;z-index:2}.hero.hb-real-hero h1{letter-spacing:-.045em}.hero.hb-real-hero h1 span{background:linear-gradient(100deg,#69ddff,#19a9f5);background-clip:text;-webkit-background-clip:text;color:transparent}
.hb-depth-scene{position:relative;perspective:1400px;padding:25px 0 32px;isolation:isolate}
.hb-depth-halo{position:absolute;width:85%;aspect-ratio:1;border:1px solid #64cbff22;border-radius:50%;left:12%;top:-14%;background:radial-gradient(circle,#1ba8ed17,transparent 65%);z-index:-1;pointer-events:none}
.hb-depth-halo:before,.hb-depth-halo:after{content:"";position:absolute;inset:10%;border:1px solid #64cbff16;border-radius:50%;transform:rotateX(55deg) rotateZ(-25deg)}.hb-depth-halo:after{inset:-8%;transform:rotateY(55deg) rotateZ(25deg)}
.hb-depth-scene .hb-panel-window{transform:rotateY(-7deg) rotateX(3deg);box-shadow:-12px 14px 0 -6px #1b54774d,-24px 28px 0 -15px #25688940,0 38px 75px -25px #0009;transition:transform .35s ease,box-shadow .35s ease;position:relative;z-index:1}
.hb-depth-chip{position:absolute;z-index:3;display:flex;align-items:center;gap:10px;padding:13px 17px;background:linear-gradient(135deg,#fff,#eaf6ff);color:#153552;border:1px solid #ffffffb0;border-radius:14px;box-shadow:0 15px 30px -15px #0008;font-size:10px;pointer-events:none}
.hb-depth-chip>span{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#d8f6f0;color:#069b7e;font-size:20px}.hb-depth-chip strong{display:block;font-size:9px;font-weight:500;color:#6a8299;margin-top:4px}
.hb-depth-chip-top{right:-12px;top:0;transform:rotate(3deg)}.hb-depth-chip-bottom{left:-22px;bottom:45px;transform:rotate(-3deg)}.hb-depth-chip-bottom>span{background:#e1efff;color:#048ddb}
.hb-hero-product-label{position:relative;z-index:2}.hb-hero-product-note{margin-top:32px}.hb-hero-actions .button.primary{background:linear-gradient(135deg,#15b5fc,#078ad7);box-shadow:inset 0 1px 0 #fff5,0 12px 30px -14px #11b9ffcc}
.hb-hero-features>div{transition:translate .2s ease}.hb-current-panel .real-panel-frame{box-shadow:var(--hb-depth-shadow);transform:perspective(1200px) rotateY(4deg);transition:transform .3s ease}
#beneficios .bento-card,.mobile-plan,.plugin-card{box-shadow:0 5px 8px #15395503,0 18px 40px -30px #15395555;transition:translate .2s ease,box-shadow .2s ease}
.hb-cloner-visual{perspective:1200px;box-shadow:var(--hb-depth-shadow)}
@media(hover:hover) and (pointer:fine){.hb-depth-scene .hb-panel-window:hover{transform:rotateY(0) rotateX(0) translateY(-3px)}.hb-current-panel .real-panel-frame:hover{transform:perspective(1200px) rotateY(0)}.hb-hero-features>div:hover{translate:0 -3px}.mobile-plan:hover,.plugin-card:hover{translate:0 -4px;box-shadow:var(--hb-depth-shadow)}}
@media(min-width:801px) and (prefers-reduced-motion:no-preference){.hb-depth-scene{animation:hb-product-enter .65s ease-out both}@keyframes hb-product-enter{from{opacity:.5;translate:0 12px}to{opacity:1;translate:0 0}}}
@media(max-width:1050px){.hb-depth-chip{padding:10px 12px;font-size:9px}.hb-depth-chip-bottom{left:-8px;bottom:38px}}
@media(max-width:800px){.hb-depth-scene{padding:20px 8px 35px}.hb-depth-scene .hb-panel-window{transform:perspective(1200px) rotateY(-3deg) rotateX(2deg)}.hb-depth-chip-top{right:0;top:0}.hb-depth-chip-bottom{left:0;bottom:42px}.hb-current-panel .real-panel-frame{transform:none}}
@media(max-width:480px){.hb-depth-chip{padding:8px 10px;border-radius:10px;font-size:8px;gap:7px}.hb-depth-chip strong{font-size:7px}.hb-depth-chip>span{width:25px;height:25px;font-size:16px}.hb-depth-chip-top{top:3px}.hb-depth-chip-bottom{bottom:36px}.hb-hero-product-label{margin-bottom:20px}.hb-hero-product-label small{max-width:90px;text-align:right}.hb-depth-halo{top:0}.hb-hero-product-note{margin-top:32px}.hb-depth-scene .hb-panel-window{transform:none;box-shadow:0 18px 35px -15px #0008}}
@media(prefers-reduced-motion:reduce){.hb-depth-scene,.hb-depth-scene .hb-panel-window,.hb-current-panel .real-panel-frame,.hb-hero-features>div,.mobile-plan,.plugin-card{animation:none!important;transition:none!important;transform:none!important;translate:none!important}}

.hb-scroll-story{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;padding-bottom:35px}.hb-scroll-step{padding:18px 0;color:#d9e9f6;border-top:1px solid #61caff44}.hb-scroll-step small{font-size:9px;letter-spacing:2px;color:#67d6ff}.hb-scroll-step h2{font-size:21px;line-height:1.25;margin:12px 0}.hb-scroll-step p{font-size:12px;line-height:1.7;color:#9eb7cd}
@media(min-width:1000px) and (prefers-reduced-motion:no-preference){.hb-scroll-hero.is-scroll-ready{height:240vh;overflow:clip;padding-top:0!important;padding-bottom:0!important}.hb-scroll-hero.is-scroll-ready .hb-scroll-stage{position:sticky;top:0;min-height:100vh;padding:125px 0 25px;display:flex;flex-direction:column;justify-content:center}.hb-scroll-hero.is-scroll-ready .hb-hero-grid{width:100%;flex-shrink:0}.hb-scroll-hero.is-scroll-ready .hb-scroll-story{position:relative;min-height:115px;margin-top:20px;padding-bottom:0;display:block}.is-scroll-ready .hb-scroll-step{position:absolute;inset:0 auto auto 0;max-width:530px;border:0;padding:0;opacity:0;visibility:hidden;transition:opacity .2s,translate .2s;translate:0 9px}.is-scroll-ready .hb-scroll-step.is-current{opacity:1;visibility:visible;translate:0 0}.is-scroll-ready .hb-scroll-step h2{margin:8px 0;font-size:24px}.hb-scroll-hero.is-scroll-ready .hb-hero-features{position:absolute;bottom:0;left:50%;transform:translateX(-50%);margin:0;opacity:0;pointer-events:none}.is-scroll-ready .hb-depth-scene .hb-panel-window{transform:perspective(1400px) rotateY(var(--scroll-y,-7deg)) rotateX(var(--scroll-x,3deg)) translateY(var(--scroll-lift,0px));transition:none}.is-scroll-ready .hb-hero-product-note{margin-top:24px}}
@media(max-width:800px){.hb-scroll-story{grid-template-columns:1fr;gap:4px}.hb-scroll-step{padding:17px 0}.hb-scroll-step h2{font-size:20px}.hb-scroll-story{padding-bottom:0}}
@media(min-width:1000px) and (prefers-reduced-motion:no-preference){.hb-scroll-hero.is-scroll-ready .hb-scroll-stage{height:100vh;min-height:0;padding:105px 0 20px;justify-content:center;gap:14px}.hb-scroll-hero.is-scroll-ready .hb-hero-grid{width:calc(100% - 84px);gap:35px}.hb-scroll-hero.is-scroll-ready .hb-depth-scene{padding:15px 0 25px}.hb-scroll-hero.is-scroll-ready .hb-panel-window>img{max-height:39vh;object-fit:contain;background:#f5f7fb}.hb-scroll-hero.is-scroll-ready .hb-hero-copy>p{margin:16px 0;font-size:14px}.hb-scroll-hero.is-scroll-ready h1{font-size:clamp(34px,3.6vw,49px)}.hb-scroll-hero.is-scroll-ready .hb-scroll-story{width:calc(100% - 84px);min-height:100px;margin-top:0}.is-scroll-ready .hb-scroll-step{max-width:700px}.hb-scroll-hero.is-scroll-ready .hb-hero-actions{margin:20px 0 12px}}

@media(min-width:1000px) and (prefers-reduced-motion:no-preference){.hb-scroll-hero.is-scroll-ready .hb-panel-window{width:min(100%,540px);margin-inline:auto}.hb-scroll-hero.is-scroll-ready .hb-panel-window>img{max-height:none;height:auto;object-fit:initial}.hb-scroll-hero.is-scroll-ready .hb-hero-product{min-width:0}.hb-scroll-hero.is-scroll-ready .hb-depth-scene{max-width:580px;width:100%;justify-self:center}}

.hb-screen-stack{position:relative;aspect-ratio:16/9;width:100%;overflow:hidden;background:#f5f7fb}.hb-screen-stack .hb-screen-shot{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transform:scale(1.015);transition:opacity .4s ease,transform .55s cubic-bezier(.2,.7,.2,1);pointer-events:none}.hb-screen-stack .hb-screen-shot.is-visible{opacity:1;transform:scale(1)}.hb-depth-scene .hb-panel-window{will-change:transform}.is-scroll-ready .hb-scroll-step{transition:opacity .3s ease,translate .35s ease}.hb-scroll-step.is-current{translate:0 0}
@media(prefers-reduced-motion:reduce){.hb-screen-stack .hb-screen-shot{transition:none;transform:none}.hb-depth-scene .hb-panel-window{will-change:auto}}