/* Shared card surface. Scope restricted to O que fazemos. */
.solutions .solution-card.ai-agent-card { grid-template-columns: 55% 45%; }
.solutions .solution-visual.ai-agent-visual { padding: 0; position: relative; }
.solutions .ai-agent-visual img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; display: block; }
.solutions .carousel { --card-width: min(960px, calc(100cqw - 64px)); container-type: inline-size; display: flex; flex-direction: column; }
.solutions .solution-track { gap: 24px; padding: 40px max(24px, calc((100% - var(--card-width)) / 2)) 16px; scroll-padding-inline: max(24px, calc((100vw - var(--card-width)) / 2)); }
.solutions .solution-card { flex-basis: var(--card-width); grid-template-columns: 1fr 1fr; height: 460px; min-height: 460px; background: var(--fishin-surface); border-color: var(--fishin-border); align-items: center; }
.solutions .solution-copy { padding: 42px 12px 42px 42px; min-width: 0; }
.solutions .solution-copy h3 { font-size: clamp(1.35rem, 2.1vw, 1.9rem); line-height: 1.2; }
.solutions .solution-copy h3 strong { display: inline; color: var(--fishin-accent); }
.solutions .solution-copy ul { margin-top: 28px; }
.solutions .solution-copy li { padding-left: 42px; font-size: 1rem; line-height: 1.6; margin-bottom: 22px; color: var(--fishin-secondary); }
.solutions .solution-copy li::before { width: 28px; height: 28px; top: 0; display: grid; place-items: center; border: 1px solid color-mix(in srgb,var(--fishin-accent) 40%,transparent); border-radius: 8px; background: color-mix(in srgb,var(--fishin-accent) 12%,transparent); color: var(--fishin-accent); }
.solutions .solution-visual { background: transparent; border: 0; min-height: 0; padding: 24px 24px 24px 8px; overflow: hidden; align-self: stretch; display: flex; align-items: center; }
.solutions .paid-media-art { display: block; width: 100%; height: auto; object-fit: contain; }
.solutions .solution-visual .demo-window { min-width: 0; width: 100%; }
.solutions .carousel { position: relative; }
.solutions .solution-track { overscroll-behavior-x: contain; }
.solutions .carousel-controls { position: absolute; inset: 40px 0 16px; margin: 0; pointer-events: none; }
.solutions .carousel-controls .round-button { position: absolute; top: 50%; transform: translate(-50%, -50%); width: 46px; height: 46px; padding: 12px; display: grid; place-items: center; pointer-events: auto; background: #101925; border: 1px solid #475261; box-shadow: 0 4px 16px #0004; transition: background .2s, border-color .2s; }
.solutions #previous-solution { left: max(23px, calc((100% - var(--card-width)) / 2 - 12px)); }
.solutions #next-solution { left: min(calc(100% - 23px), calc((100% + var(--card-width)) / 2 + 12px)); }
.solutions .round-button svg { display: block; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.solutions .round-button:hover { background: #233044; border-color: var(--fishin-accent); }
@media(max-width:760px) {
 .solutions .carousel { --card-width: calc(100cqw - 44px); }
 .solutions .solution-track { gap: 14px; padding-top: 20px; padding-inline: 22px; scroll-padding-inline: 22px; }
 .solutions .carousel-controls { inset: 20px 0 16px; margin: 0; }
 .solutions .carousel-controls .round-button { width: 40px; height: 40px; padding: 9px; }
 .solutions #previous-solution { left: 22px; }
 .solutions #next-solution { left: calc(100% - 22px); }
 .solutions .solution-card { grid-template-columns: 56% 44%; height: 360px; min-height: 360px; border-radius: 12px; }
 .solutions .solution-copy { padding: 22px 4px 22px 18px; }
 .solutions .solution-copy h3 { font-size: 1rem; letter-spacing: -.025em; overflow-wrap: break-word; }
 .solutions .solution-copy ul { margin-top: 18px; }
 .solutions .solution-copy li { font-size: .75rem; line-height: 1.5; padding-left: 21px; margin-bottom: 14px; }
 .solutions .solution-copy li::before { width: 15px; height: 17px; border-radius: 4px; font-size: .625rem; }
 .solutions .solution-visual { padding: 14px 10px 14px 0; min-height: 0; }
 .solutions .solution-visual .demo-window { padding: 8px; transform: none; }
 .solutions .solution-visual .window-top { font-size: .625rem; gap: 3px; overflow-wrap: anywhere; }
 .solutions .kanban { grid-template-columns: 1fr; }
 .solutions .mini-page { padding: 10px; }
 .solutions .mini-page > strong { font-size: 1rem; }
 .solutions .flow-node { padding: 6px; gap: 5px; font-size: .625rem; }
 .solutions .bar-chart { gap: 5px; }
}