/* Three deliberate art directions, shared accessible interactions. */
.variant { --accent: #7162f5; --accent-soft: #ece9ff; --bg: #faf9ff; --bg-soft: #fff; --ink: #19172e; --gray-100: #f0eef8; --gray-200: #deddea; --gray-300: #c6c3d9; --gray-500: #716b84; --gray-600: #59556b; --gray-700: #302b42; background: var(--bg); color: var(--gray-700); }
.variant .header, .variant .header.is-scrolled { background: var(--bg); border-color: var(--gray-200); }
.variant .nav__link, .variant .language-switcher__btn { color: var(--gray-600); }
.variant .language-switcher { background: var(--bg-soft); border-color: var(--gray-200); }
.variant .language-switcher__btn.is-active { color: #fff; background: var(--accent); }
.variant .btn--primary { background: var(--accent); color: #fff; box-shadow: none; }
.variant .btn--primary:hover { filter: brightness(1.1); transform: translateY(-3px); }
.variant .btn--ghost { color: var(--ink); background: transparent; border-color: var(--gray-300); }
.variant .text-gradient { background: none; color: var(--accent); -webkit-text-fill-color: currentColor; }
.variant .eyebrow { color: var(--accent); }
.variant .hero { background: var(--bg); }
.variant .hero__title { font-weight: 600; letter-spacing: -.065em; line-height: .99; }
.variant .hero__subtitle { color: var(--gray-600); }
.variant .ecosystem { margin: 0; max-width: none; }
.variant .ecosystem__paths, .variant .ecosystem__paths ellipse { stroke: var(--gray-300); }
.variant .ecosystem__paths .beam { stroke: var(--accent); stroke-width: 2.5; stroke-dasharray: 35 365; animation: wire-flow 3.8s linear infinite; animation-play-state: paused; filter: drop-shadow(0 0 5px var(--accent)); }
.variant .eco-node { animation: none; background: var(--bg-soft); border-color: var(--gray-300); min-width: 150px; padding: 12px; gap: 8px; transition: border-color .5s, box-shadow .5s; }
.variant .eco-node strong { font-size: 12px; }
.variant .eco-node small { font-size: 9px; }
.variant .eco-icon { background: var(--accent-soft); color: var(--accent); flex-shrink: 0; }
.variant .node-copy { min-width: 0; transition: opacity .25s, transform .25s; }
.variant .eco-node strong { overflow-wrap: anywhere; }
.variant .eco-node.is-changing .node-copy { opacity: 0; transform: translateY(8px); }
.variant .eco-node.is-active { border-color: var(--accent); box-shadow: 0 0 28px color-mix(in srgb,var(--accent) 20%, transparent); }
.variant .eco-node--code { top: 17%; left: 0; }
.variant .eco-node--ai { top: 17%; right: 0; }
.variant .eco-node--flow { bottom: 17%; left: 0; }
.variant .eco-node--product { bottom: 17%; right: 0; }
.variant .eco-node--cloud { top: 0; left: 50%; transform: translateX(-50%); }
.variant .eco-node--automation { bottom: 0; left: 50%; transform: translateX(-50%); }
.variant .ecosystem__core { width: 22%; box-shadow: 0 0 0 12px color-mix(in srgb,var(--accent) 6%, transparent),0 0 100px color-mix(in srgb,var(--accent) 20%, transparent); z-index: 2; }
.variant .ecosystem__caption { bottom: -10%; }
.network-orbit { position: absolute; border: 1px dashed var(--gray-300); width: 64%; aspect-ratio: 1; top: 50%; left: 50%; border-radius: 50%; transform: translate(-50%,-50%); animation: orbit-spin 35s linear infinite; animation-play-state: paused; opacity: .5; }
.network-orbit--two { width: 83%; animation-direction: reverse; border-style: solid; opacity: .2; }
.network-index { position: absolute; top: 48%; right: 2%; font: 10px ui-monospace, monospace; color: var(--gray-500); }
.motion-enabled .variant .ecosystem.is-in-view .beam, .motion-enabled .variant .ecosystem.is-in-view .network-orbit { animation-play-state: running; }
.variant .card, .variant .product, .variant .stat, .variant .faq-item { background: var(--bg-soft); border-color: var(--gray-200); }
.variant .stat { background: transparent; }
.variant .product-art { filter: none; }
.variant .product__link { color: var(--accent); }
.variant .section--alt, .variant #solucoes { background: var(--bg); }
.variant .section__title { font-size: clamp(34px,4.5vw,62px); letter-spacing: -.055em; }
.variant .section--dark .eyebrow, .variant .cta .eyebrow { color: #b4c5ff; }
.variant .cta__form-wrapper { background: var(--bg-soft); }
.variant .form-group input, .variant .form-group textarea { background: var(--bg); color: var(--ink); border-color: var(--gray-300); }
.variant .back-to-top { background: var(--bg-soft); color: var(--ink); }
.variant .kinetic-strip { overflow: hidden; background: var(--accent); color: #fff; padding: 24px 0; }
.kinetic-strip__track { display: flex; width: max-content; animation: ticker-slide 30s linear infinite; animation-play-state: paused; }
.kinetic-strip__track > span { display: flex; align-items: center; gap: 38px; padding-right: 38px; font-size: clamp(22px,3vw,44px); font-weight: 600; letter-spacing: -.025em; white-space: nowrap; }
.kinetic-strip i { font-style: normal; opacity: .5; }
.motion-enabled .kinetic-strip.is-in-view .kinetic-strip__track { animation-play-state: running; }
.variant .scroll-reveal { opacity: 1; }
.motion-enabled .variant .scroll-reveal.is-entering { animation: section-arrive .85s cubic-bezier(.16,1,.3,1) both; }
@keyframes ticker-slide { to { transform: translateX(-50%); } }
@keyframes wire-flow { from { stroke-dashoffset: 400; } to { stroke-dashoffset: 0; } }
@keyframes orbit-spin { to { transform: translate(-50%,-50%) rotate(360deg); } }
@keyframes section-arrive { from { opacity: .3; transform: translateY(45px); } to { opacity: 1; transform: none; } }

/* PULSE: luminous network, oversized type, midnight surfaces. */
.variant--pulse { --accent: #bcff6b; --accent-soft: #bcff6b15; --bg: #080d13; --bg-soft: #111a22; --ink: #f2f6f5; --gray-100: #1a262d; --gray-200: #263239; --gray-300: #334850; --gray-500: #9aaeb7; --gray-600: #b2bfc5; --gray-700: #d1dbdf; }
.variant--pulse .hero { padding-top: 95px; background: radial-gradient(ellipse at 90% 45%,#1d353430,transparent 65%); }
.variant--pulse .hero__inner { grid-template-columns: 1.04fr 1fr; gap: 45px; }
.variant--pulse .hero__title { font-size: clamp(52px,6.4vw,92px); margin-bottom: 32px; }
.variant--pulse .hero__subtitle { max-width: 445px; }
.variant--pulse .btn--primary, .variant--pulse .language-switcher__btn.is-active { color: #14210c; }
.variant--pulse .hero__grid { background-image: radial-gradient(#87bba432 1px,transparent 1px); background-size: 24px 24px; opacity: .5; }
.variant--pulse .ecosystem__grid { inset: -10%; background: radial-gradient(ellipse,#58c79820,transparent 65%); }
.variant--pulse .eco-node { border-radius: 6px; background: #101b22; }
.variant--pulse .ecosystem__core { border-radius: 50%; }
.variant--pulse .hero__bottom { margin-top: 90px; }
.variant--pulse .portfolio-strip { background: #0c131b; }
.variant--pulse .kinetic-strip { color: #14210c; margin: 35px 0; }
.variant--pulse .manifesto { background: #bcff6b; color: #10200b; }
.variant--pulse .manifesto__light { background: #cdfc94; }
.variant--pulse .manifesto h2, .variant--pulse .manifesto em { color: #10200b; }
.variant--pulse .manifesto p, .variant--pulse .manifesto__label { color: #314527; }
.variant--pulse .manifesto h2 { font-size: clamp(42px,6vw,80px); }
.variant--pulse .card { border-radius: 4px; padding: 36px; }
.variant--pulse .card__icon { color: var(--accent); background: #bcff6b0c; }
.variant--pulse .product { border-radius: 10px; }
.variant--pulse .section--dark, .variant--pulse .cta__card { background: #111c25; }
.variant--pulse .feature__number { color: var(--accent); }
.variant--pulse .footer { background: #080d13; }

/* FLOW: bright cinematic opening and a scroll-driven product journey. */
.variant--flow .hero { padding-top: 65px; background: radial-gradient(ellipse at 50% 30%,#e9e4ff,transparent 60%); }
.variant--flow .hero__inner { display: flex; flex-direction: column; gap: 65px; }
.variant--flow .hero__content { text-align: center; max-width: 1060px; }
.variant--flow .hero__title { max-width: 1060px; font-size: clamp(54px,7.8vw,110px); letter-spacing: -.07em; }
.variant--flow .hero__subtitle { max-width: 535px; margin: 25px auto; }
.variant--flow .hero__actions { justify-content: center; }
.variant--flow .hero__title .text-gradient { background: linear-gradient(100deg,#4369ef,#9c49de); background-clip: text; -webkit-text-fill-color: transparent; }
.variant--flow .ecosystem { width: min(740px,100%); aspect-ratio: 740/370; margin: 0 auto 30px; }
.variant--flow .ecosystem__core { width: 105px; }
.variant--flow .network-orbit { width: 40%; }
.variant--flow .network-orbit--two { width: 65%; aspect-ratio: 1.6; }
.variant--flow .eco-node--code, .variant--flow .eco-node--ai { top: 12%; }
.variant--flow .eco-node--flow, .variant--flow .eco-node--product { bottom: 12%; }
.variant--flow .ecosystem__caption { bottom: -13%; }
.variant--flow .hero__bottom { margin-top: 55px; }
.variant--flow .kinetic-strip { background: #201637; }
.variant--flow .journey { height: 190vh; height: 190svh; background: #201637; color: #fff; position: relative; }
.journey__sticky { position: sticky; top: var(--header-h); height: calc(100svh - var(--header-h)); min-height: 540px; display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; }
.journey h2 { color: #fff; font-size: clamp(40px,5vw,72px); line-height: 1.05; letter-spacing: -.06em; font-weight: 500; }
.journey h2 em { color: #c3b3ff; font-style: normal; }
.journey .eyebrow { color: #c3b3ff; }
.journey__steps { display: grid; gap: 18px; margin-top: 35px; }
.journey__steps li { display: flex; gap: 18px; padding-left: 15px; border-left: 2px solid #ffffff20; opacity: .45; transition: opacity .35s,border-color .35s; }
.journey__steps li.is-current { opacity: 1; border-color: #bc9fff; }
.journey__steps li > span { font-size: 11px; color: #bda7fb; padding-top: 5px; }
.journey h3 { color: #fff; font-size: 20px; font-weight: 500; }
.journey p { font-size: 13px; color: #cfc8e2; margin-top: 4px; }
.journey__visual { position: relative; width: 100%; aspect-ratio: 1; display: grid; place-items: center; }
.journey__visual svg { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: #ffffff15; stroke-width: 1; transform: rotate(-90deg); }
.journey__visual .journey__progress { stroke: #c3b3ff; stroke-width: 2; stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--journey-progress, .04)); filter: drop-shadow(0 0 6px #bf90ff); }
.journey__halo { position: absolute; inset: 13%; border-radius: 50%; background: radial-gradient(circle,#965fea55,transparent 70%); transform: scale(calc(.8 + var(--journey-progress,0)*.5)); }
.journey__logo { width: 28%; aspect-ratio: 1; background: #fff; border-radius: 26%; display: grid; place-items: center; transform: rotate(calc(var(--journey-progress,0)*90deg)); }
.journey__logo img { width: 65%; }
.journey__number { position: absolute; bottom: 11%; font-size: 12px; color: #c3b3ff; }
.journey__caption { position: absolute; top: 11%; font-size: 9px; color: #c3b3ff; letter-spacing: .18em; }
.variant--flow .manifesto { border-radius: 28px; margin: 15px 24px; }
.variant--flow .products--stack { display: block; }
.variant--flow .product { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto 1fr auto; column-gap: 45px; padding: 30px; margin-bottom: 35px; min-height: 380px; position: sticky; top: calc(var(--header-h) + 20px); box-shadow: 0 -10px 45px #21144910; }
.variant--flow .product-art { grid-row: 1/5; height: 100%; min-height: 300px; margin: 0; border-radius: 12px; }
.variant--flow .product__head { grid-column: 2; margin-top: 30px; }
.variant--flow .product__title, .variant--flow .product__text, .variant--flow .product__link { grid-column: 2; }
.variant--flow .product__title { font-size: 36px; }
.variant--flow .product__link { justify-self: start; }

/* STUDIO: editorial typography, paper, ink, orange, linear product rows. */
.variant--studio { --accent: #d54b22; --accent-soft: #fae4d8; --bg: #f4f0e7; --bg-soft: #fffdf8; --ink: #22231f; --gray-100: #ebe6da; --gray-200: #d9d4c7; --gray-300: #c4beae; --gray-500: #746e63; --gray-600: #605b51; --gray-700: #35332d; }
.variant--studio .btn { border-radius: 0; }
.variant--studio .header { border-bottom: 1px solid #292821; }
.variant--studio .hero { padding-top: 55px; }
.variant--studio .hero__inner { grid-template-columns: 1.1fr 1fr; gap: 65px; align-items: center; }
.studio-index { display: block; font: 9px ui-monospace,monospace; letter-spacing: .12em; color: #776f61; margin-bottom: 45px; }
.variant--studio .hero .eyebrow { display: none; }
.variant--studio .hero__title { font-size: clamp(48px,6.1vw,86px); line-height: 1.02; font-weight: 500; }
.variant--studio .hero__title .text-gradient { font-family: Georgia,serif; font-style: italic; letter-spacing: -.065em; }
.variant--studio .hero__subtitle { font-size: 16px; max-width: 430px; }
.variant--studio .ecosystem { aspect-ratio: 1; background: #e8e1d2; border: 1px solid #c9c0ac; border-radius: 50% 50% 6px 6px; }
.variant--studio .ecosystem__grid { background: radial-gradient(ellipse,#df714030,transparent 65%); }
.variant--studio .eco-node { min-width: 140px; border-radius: 0; border-color: #bfb6a4; background: #fffaf0; box-shadow: 5px 5px 0 #afa18b15; }
.variant--studio .eco-node--code { left: -5%; top: 21%; }
.variant--studio .eco-node--ai { right: -5%; top: 21%; }
.variant--studio .eco-node--flow { left: -5%; bottom: 18%; }
.variant--studio .eco-node--product { right: -5%; bottom: 18%; }
.variant--studio .eco-node--cloud { top: 3%; }
.variant--studio .eco-node--automation { bottom: -4%; }
.variant--studio .ecosystem__core { border-radius: 8px; }
.variant--studio .network-orbit { width: 74%; border-color: #a78e6c; }
.variant--studio .network-orbit--two { width: 88%; }
.variant--studio .network-index { right: 5%; }
.variant--studio .hero__bottom { margin-top: 75px; }
.variant--studio .portfolio-strip { border-color: #27241d; }
.variant--studio .kinetic-strip { background: #282922; padding: 18px 0; }
.variant--studio .kinetic-strip__track > span { font-weight: 400; font-family: Georgia,serif; font-style: italic; font-size: 33px; }
.variant--studio .section__title { font-weight: 400; }
.variant--studio .cards { grid-template-columns: 1fr 1fr; gap: 0; counter-reset: solution; border-top: 1px solid var(--gray-300); }
.variant--studio .card { counter-increment: solution; background: transparent; border: 0; border-radius: 0; border-bottom: 1px solid var(--gray-300); padding: 35px; }
.variant--studio .card:nth-child(odd) { border-right: 1px solid var(--gray-300); }
.variant--studio .card::after { content: '0' counter(solution); position: absolute; top: 30px; right: 30px; color: var(--gray-500); font: 12px ui-monospace,monospace; }
.variant--studio .card__icon { border-radius: 0; background: var(--accent-soft); color: var(--accent); }
.variant--studio .manifesto { background: #d54b22; }
.variant--studio .manifesto__light { background: #e15e32; }
.variant--studio .manifesto h2 { font-family: Georgia,serif; font-weight: 400; }
.variant--studio .manifesto em { color: #ffdac0; }
.variant--studio .manifesto p, .variant--studio .manifesto__label { color: #fff4e9; }
.variant--studio .products--editorial { display: block; }
.variant--studio .product { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto 1fr auto; gap: 0 60px; border: 0; border-top: 1px solid var(--gray-300); border-radius: 0; padding: 40px 0; background: transparent; }
.variant--studio .product-art { grid-row: 1/5; margin: 0; height: 300px; }
.variant--studio .product__head, .variant--studio .product__title, .variant--studio .product__text, .variant--studio .product__link { grid-column: 2; }
.variant--studio .product__title { font-size: 38px; font-weight: 500; }
.variant--studio .product__head { margin-top: 30px; }
.variant--studio .product__link { justify-self: start; }
.variant--studio .product:hover { transform: none; box-shadow: none; }
.variant--studio .section--dark, .variant--studio .cta__card { background: #292a23; }
.variant--studio .cta__card, .variant--studio .cta__form-wrapper { border-radius: 0; }

@media (max-width: 1180px) {
  .variant .nav { background: var(--bg-soft); }
  .variant .eco-node { min-width: 125px; padding: 9px; }
  .variant .eco-node strong { font-size: 10px; }
  .variant .eco-node small { font-size: 8px; }
  .variant--studio .hero__inner { gap: 35px; }
}
@media (max-width: 900px) {
  .variant--pulse .hero__inner, .variant--studio .hero__inner { grid-template-columns: 1fr; gap: 65px; }
  .variant--pulse .hero__title, .variant--studio .hero__title { font-size: clamp(50px,9vw,80px); }
  .variant--pulse .ecosystem, .variant--studio .ecosystem { max-width: 570px; margin: 0 auto; }
  .variant--studio .ecosystem { width: 85%; }
  .variant .hero__subtitle { margin-inline: auto; }
  .journey__sticky { gap: 15px; }
  .journey__steps li { gap: 10px; }
  .variant--flow .product { gap: 0 25px; }
}
@media (max-width: 600px) {
  .variant .hero { padding-top: 48px; }
  .variant .hero__content { text-align: left; }
  .variant .hero__title { font-size: clamp(43px,11vw,66px); line-height: 1.02; }
  .variant .hero__subtitle { font-size: 15px; margin-inline: 0; }
  .variant .hero__inner { gap: 48px; }
  .variant .eco-node { min-width: 0; width: 106px; padding: 8px; gap: 5px; }
  .variant .eco-node strong { font-size: 9px; line-height: 1.3; }
  .variant .eco-node small { display: none; }
  .variant .eco-icon { width: 23px; height: 23px; font-size: 13px; }
  .variant .ecosystem { aspect-ratio: 1.1; }
  .variant .ecosystem__core { width: 23%; }
  .variant .network-index { right: 0; font-size: 8px; }
  .variant .ecosystem__caption { font-size: 7px; bottom: -12%; }
  .variant .hero__bottom { margin-top: 55px; }
  .variant .hero__bottom > span { max-width: 145px; }
  .variant .section__title { font-size: 36px; }
  .variant .kinetic-strip { padding: 18px 0; }
  .kinetic-strip__track > span { gap: 24px; padding-right: 24px; font-size: 26px; }
  .variant--pulse .hero { padding-top: 55px; }
  .variant--pulse .hero__title { font-size: clamp(48px,12vw,70px); }
  .variant--pulse .card { padding: 27px; }
  .variant--flow .hero__content { text-align: center; }
  .variant--flow .hero__subtitle { margin-inline: auto; }
  .variant--flow .hero-note { margin-inline: auto; }
  .variant--flow .ecosystem { width: 100%; margin-bottom: 10px; }
  .variant--flow .eco-node--code, .variant--flow .eco-node--ai { top: 20%; }
  .variant--flow .eco-node--flow, .variant--flow .eco-node--product { bottom: 20%; }
  .variant--flow .manifesto { margin-inline: 10px; border-radius: 16px; }
  .variant--flow .manifesto .container { width: calc(100% - 40px); }
  .variant--flow .journey { height: 165svh; }
  .journey__sticky { display: flex; flex-direction: column; justify-content: center; gap: 12px; min-height: 570px; }
  .journey__copy { width: 100%; }
  .journey h2 { font-size: 36px; }
  .journey .eyebrow { margin-bottom: 15px; font-size: 9px; }
  .journey__steps { margin-top: 25px; gap: 14px; }
  .journey h3 { font-size: 16px; }
  .journey p { font-size: 11px; }
  .journey__visual { width: 180px; flex-shrink: 0; }
  .journey__caption { font-size: 6px; }
  .variant--flow .product, .variant--studio .product { display: flex; position: relative; top: auto; padding: 0 22px 25px; gap: 0; min-height: 0; }
  .variant--flow .product-art, .variant--studio .product-art { height: 200px; min-height: 0; margin: 0 -22px 25px; border-radius: 0; }
  .variant--flow .product__head, .variant--studio .product__head { margin-top: 0; }
  .variant--flow .product__title, .variant--studio .product__title { font-size: 28px; }
  .variant--flow .product__link, .variant--studio .product__link { align-self: start; }
  .variant--studio .studio-index { font-size: 8px; margin-bottom: 25px; }
  .variant--studio .ecosystem { width: 90%; aspect-ratio: 1; }
  .variant--studio .eco-node--code, .variant--studio .eco-node--flow { left: -5%; }
  .variant--studio .eco-node--ai, .variant--studio .eco-node--product { right: -5%; }
  .variant--studio .cards { grid-template-columns: 1fr; }
  .variant--studio .card { padding: 30px 0; }
  .variant--studio .card:nth-child(odd) { border-right: 0; }
  .variant--studio .product { padding-top: 25px; }
  .variant--studio .product-art { margin-top: 0; }
}
@media (max-height: 680px) {
  .variant--flow .journey { height: auto; }
  .journey__sticky { position: relative; top: auto; min-height: 0; height: auto; padding-block: 50px; }
}
.motion-off .journey { height: auto; }
.motion-off .journey__sticky { position: relative; top: auto; height: auto; padding-block: 60px; }
.motion-off .journey__steps li { opacity: 1; }
.motion-off .variant .products--stack .product { position: relative; top: auto; }
@media (prefers-reduced-motion: reduce) {
  .variant--flow .journey { height: auto; }
  .journey__sticky { position: relative; top: auto; height: auto; padding-block: 60px; }
  .journey__steps li { opacity: 1; }
  .variant--flow .product { position: relative; top: auto; }
}