.elementor-3339 .elementor-element.elementor-element-3f66b3c7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3339 .elementor-element.elementor-element-3f66b3c7:not(.elementor-motion-effects-element-type-background), .elementor-3339 .elementor-element.elementor-element-3f66b3c7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#0088BA;}.elementor-3339 .elementor-element.elementor-element-da9520e0{margin-top:100px;margin-bottom:100px;}.elementor-3339 .elementor-element.elementor-element-0cfe699{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:77px;--margin-bottom:150px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:35px;--padding-right:35px;}.elementor-3339 .elementor-element.elementor-element-383d80f{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:18px;--padding-right:18px;}.elementor-3339 .elementor-element.elementor-element-383d80f.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-3339 .elementor-element.elementor-element-7d1867c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}@media(min-width:768px){.elementor-3339 .elementor-element.elementor-element-0cfe699{--content-width:1170px;}.elementor-3339 .elementor-element.elementor-element-383d80f{--width:100.111%;}}@media(max-width:1024px) and (min-width:768px){.elementor-3339 .elementor-element.elementor-element-383d80f{--width:100%;}}@media(max-width:1024px){.elementor-3339 .elementor-element.elementor-element-da9520e0{margin-top:50px;margin-bottom:50px;padding:0px 20px 0px 20px;}.elementor-3339 .elementor-element.elementor-element-0cfe699{--flex-wrap:wrap;--margin-top:100px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3339 .elementor-element.elementor-element-383d80f{--padding-top:0px;--padding-bottom:0px;--padding-left:18px;--padding-right:18px;}}@media(max-width:767px){.elementor-3339 .elementor-element.elementor-element-0cfe699{--margin-top:100px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3339 .elementor-element.elementor-element-383d80f{--padding-top:0px;--padding-bottom:0px;--padding-left:15px;--padding-right:15px;}}/* Start custom CSS for html, class: .elementor-element-b6880fd */:root {
    --swing-blue: #3b82f6;
    --swing-purple: #8b5cf6;
    --swing-green: #22c55e;
    --swing-text: #1e293b;
    --swing-light-bg: #f8fafc;
}

.swing-container {
    display: flex;
    gap: 60px;
    align-items: center;
    font-family: 'Inter', sans-serif;
    padding: 40px;
    max-width: 1100px;
    margin: 0 auto;
}

/* Left Visual Box */
.swing-visual-box {
    flex: 1;
    background: var(--swing-light-bg);
    border: 1px solid #e2e8f0;
    border-radius: 32px;
    padding: 60px 40px;
    min-height: 500px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
}

.diagram-canvas {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
}

.diagram-card {
    width: 160px;
    border-radius: 20px;
    padding: 24px 15px;
    text-align: center;
    color: white;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}

.purple-card { background: linear-gradient(135deg, #a78bfa, #7c3aed); }
.blue-card { background: linear-gradient(135deg, #60a5fa, #2563eb); }

.diagram-card h3 { color: white; margin: 10px 0 5px; font-size: 18px; font-weight: 700; }
.diagram-card p { color: rgba(255,255,255,0.8); font-size: 12px; margin: 0; }

.diagram-arrows {
    display: flex;
    flex-direction: column;
    gap: 15px;
    color: var(--swing-green);
    font-size: 24px;
    font-weight: bold;
}

.diagram-footer {
    text-align: center;
    margin-top: 40px;
}

.diagram-footer h4 { margin: 0; font-size: 18px; color: var(--swing-text); }
.diagram-footer p { margin: 5px 0 0; color: #64748b; font-size: 14px; }

/* Right Content Area */
.swing-content {
    flex: 1;
    position: relative;
}

.step-badge {
    display: inline-flex;
    align-items: center;
    padding: 8px 20px 8px 8px;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 50px;
    color: #2563eb;
    font-weight: 600;
    margin-bottom: 24px;
}

.step-num {
    background: #3b82f6;
    color: white;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin-right: 10px;
}

.swing-title {
    font-size: 48px;
    line-height: 1.1;
    color: #0f172a;
    margin-bottom: 24px;
    font-weight: 800;
}

.swing-desc {
    color: #475569;
    font-size: 18px;
    line-height: 1.6;
    margin-bottom: 32px;
}

.feature-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.tag {
    background: #f0fdf4;
    border: 1px solid #bbfcce;
    color: #166534;
    padding: 10px 20px;
    border-radius: 50px;
    font-weight: 600;
    display: flex;
    align-items: center;
}

.tag .check { margin-right: 8px; font-weight: bold; }

/* Decorative Dots */
.dot-pattern {
    position: absolute;
    top: -20px;
    right: -20px;
    width: 80px;
    height: 80px;
    background-image: radial-gradient(#cbd5e1 2px, transparent 2px);
    background-size: 10px 10px;
    z-index: -1;
}

/* Responsive */
@media (max-width: 768px) {
    .swing-container { flex-direction: column; padding: 20px; }
    .swing-title { font-size: 32px; }
    .diagram-canvas { transform: scale(0.8); }
}/* End custom CSS */