/* PROCESS 4 - SPLIT IMAGE */
.process-4 { padding: 100px 5%; background: var(--white); }
.process-4 .container { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; max-width: 1200px; margin: 0 auto; align-items: center; }
.process-4 .image { position: relative; height: 600px; }
.process-4 .image img { width: 100%; height: 100%; object-fit: cover; }
.process-4 .image-badge { position: absolute; bottom: 30px; left: -30px; background: var(--accent); color: var(--black); padding: 24px; text-align: center; }
.process-4 .image-badge .value { font-family: var(--font-heading); font-size: 3rem; line-height: 1; }
.process-4 .image-badge .label { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.1em; }
.process-4 .content .eyebrow { font-size: 0.85rem; font-weight: 600; color: var(--accent); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 16px; }
.process-4 .content h2 { font-family: var(--font-display); font-size: clamp(2rem, 3.5vw, 2.5rem); color: var(--gray-900); margin-bottom: 40px; }
.process-4 .steps { display: flex; flex-direction: column; gap: 30px; }
.process-4 .step { display: flex; gap: 24px; }
.process-4 .step-number { flex-shrink: 0; width: 50px; height: 50px; background: var(--gray-100); display: flex; align-items: center; justify-content: center; font-family: var(--font-heading); font-size: 1.5rem; color: var(--accent); transition: all 0.3s; }
.process-4 .step:hover .step-number { background: var(--accent); color: var(--white); }
.process-4 .step-content h3 { font-size: 1.1rem; font-weight: 700; color: var(--gray-900); margin-bottom: 8px; }
.process-4 .step-content p { font-size: 0.9rem; color: var(--gray-600); line-height: 1.6; }
@media (max-width: 1024px) { .process-4 .container { grid-template-columns: 1fr; gap: 40px; } .process-4 .image { height: 400px; } .process-4 .image-badge { left: 20px; } }