/* Build the explanation next to the content, never over the project screenshot. */
#solucoes .solution-stage{--route-a:#67e8f9;--route-b:#a855f7;background:radial-gradient(ellipse at 80% 25%,rgba(103,232,249,.055),transparent 55%);border:0;border-top:1px solid rgba(103,232,249,.18);border-radius:0;box-shadow:none;padding:42px 0 0;overflow:visible}
#solucoes .solution-stage::before,#solucoes .solution-stage::after{display:none}
#solucoes .solution-stage[data-route="oferta"]{--route-a:#c4b5fd;--route-b:#67e8f9}
#solucoes .solution-stage[data-route="digital"]{--route-a:#67e8f9;--route-b:#8b5cf6}
#solucoes .solution-layout{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:24px 44px;align-items:start}
#solucoes .solution-content{grid-column:1;grid-row:1/3}
#solucoes .solution-media{grid-column:2;grid-row:1;min-height:300px;margin:30px 8px 18px 0;isolation:isolate}
#solucoes .solution-screen{transform:perspective(1100px) rotateY(calc(-3deg + var(--preview-x,0deg))) rotateX(var(--preview-y,0deg));transition:transform .35s ease}
#solucoes .solution-phone{right:-8px;bottom:-15px;width:25%}
#solucoes .solution-meta{display:none}
.solution-blueprint{grid-column:2;grid-row:2;min-width:0}
.solution-blueprint__label{margin:0 0 18px;font-size:.85rem;color:var(--muted);font-weight:500}
.solution-blueprint__nodes{position:relative;display:grid;grid-template-columns:repeat(var(--route-count,3),minmax(0,1fr));gap:10px;isolation:isolate}
.solution-blueprint__nodes::before{content:"";position:absolute;z-index:-1;left:8%;right:8%;top:30px;height:1px;background:linear-gradient(90deg,var(--route-a),var(--route-b));opacity:.4}
.solution-blueprint__node{position:relative;display:flex;flex-direction:column;align-items:center;gap:12px;padding:0 3px 10px;min-width:0;border:0;background:transparent;cursor:pointer;color:var(--muted);font-size:.82rem;line-height:1.4}
.solution-blueprint__node svg{width:60px;height:60px;padding:16px;stroke:currentColor;stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round;border:1px solid rgba(255,255,255,.14);border-radius:16px;background:#090616;transition:border-color .25s,box-shadow .25s,transform .25s}
.solution-blueprint__node:hover svg{transform:translateY(-3px);border-color:var(--route-a)}
.solution-blueprint__node[aria-pressed="true"]{color:#f3f4ff}
.solution-blueprint__node[aria-pressed="true"] svg{color:var(--route-a);border-color:var(--route-a);box-shadow:0 0 25px rgba(103,232,249,.12)}
.solution-blueprint__detail{min-height:112px;margin-top:15px;padding:15px 0 0;border-top:1px solid rgba(255,255,255,.09)}
.solution-blueprint__detail strong{display:block;font-size:.88rem;font-weight:600;color:var(--route-a)}
.solution-blueprint__detail p{margin:7px 0 0;color:var(--muted);font-size:.87rem;line-height:1.65}
#solucoes .choice-tab{position:relative;border-radius:12px;background:rgba(10,8,25,.45)}
#solucoes .choice-tab.is-active{border-color:rgba(103,232,249,.38);background:rgba(103,232,249,.045);box-shadow:none}
@media(max-width:900px){
  #solucoes .solution-stage{padding:28px 0 0}
  #solucoes .solution-layout{display:flex;flex-direction:column;gap:24px}
  #solucoes .solution-content,#solucoes .solution-media,.solution-blueprint{width:100%}
  #solucoes .solution-media{display:block;min-height:0;margin:0 0 20px}
  #solucoes .solution-screen{transform:none}
  #solucoes .solution-phone{right:0}
  .solution-blueprint__nodes{gap:6px}
  .solution-blueprint__node{font-size:.82rem}
  .solution-blueprint__node svg{width:54px;height:54px;padding:14px}
  .solution-blueprint__nodes::before{top:27px}
  .solution-blueprint__detail{min-height:124px}
}
@media(prefers-reduced-motion:reduce){#solucoes .solution-screen{transform:none;transition:none}.solution-blueprint__node svg{transition:none}.solution-blueprint__node:hover svg{transform:none}}