.problem-section { display: grid; grid-template-columns: minmax(0, var(--split-media)) minmax(0, var(--split-text)); align-items: stretch; background: var(--surface-muted); }
.problem-visual { position: relative; min-height: 0; margin: var(--section-space-y) 0 var(--section-space-y) 2vw; overflow: hidden; }
.problem-visual::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(22,18,27,.52), transparent 38%); pointer-events: none; }
.problem-visual img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; filter: saturate(.72) contrast(1.04); transition: transform .8s ease; }
.problem-visual:hover img { transform: scale(1.018); }
.problem-visual-tag { position: absolute; z-index: 2; left: 30px; right: 30px; bottom: 26px; display: flex; justify-content: space-between; gap: 20px; color: #fff; font-size: 9px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.problem-content { display: flex; flex-direction: column; justify-content: flex-start; padding: var(--section-space-y) 7vw var(--section-space-y) 8vw; }
.problem-content h2 {max-width: 720px; margin: 34px 0 24px; letter-spacing: -.06em; font-family:var(--display);font-size:var(--type-h2);font-weight:600;line-height:.98;}
.problem-subtitle { max-width: 650px; margin: 0 0 42px; font: 500 clamp(18px,1.55vw,23px)/1.46 var(--display); letter-spacing: -.025em; }
.problem-copy { max-width: 630px; padding-left: 68px; border-left: 1px solid rgba(61,35,124,.3); color: #5d5961; font-size: 15px; line-height: 1.72; }
.problem-copy p { margin: 0 0 24px; }
.problem-copy p:last-child { margin-bottom: 0; }
.problem-copy .problem-pivot { margin: 32px 0; color: var(--violet); font: 600 clamp(24px,2.1vw,34px)/1.2 var(--display); letter-spacing: -.04em; }
@media (max-width: 900px) { .problem-section { grid-template-columns: 1fr; } .problem-visual { min-height: 560px; margin: 18px 18px 0; } .problem-content { padding: 75px 7vw 85px; } .problem-copy { padding-left: 30px; } }
@media (max-width: 560px) { .problem-visual { min-height: 430px; } .problem-visual-tag span:last-child { display: none; } .problem-content h2 { font-family:var(--display);font-size:var(--type-h2);font-weight:600;line-height:.98;} .problem-copy { padding-left: 20px; font-size: 14px; } }
