.visuals { background: #f5f9fd; padding: 112px 0; }
.visuals-head { align-items: end; display: flex; justify-content: space-between; gap: 30px; margin-bottom: 42px; }
.visuals h2 { color: #081a38; font-size: clamp(44px, 5vw, 68px); }
.visuals-head > p { color: #60708c; font-size: 13px; line-height: 1.8; margin: 0; max-width: 340px; }
.visual-grid { display: grid; gap: 14px; grid-template-columns: 1.28fr .72fr; }
.visual-card { background: #061a3b; margin: 0; min-height: 260px; overflow: hidden; position: relative; }
.visual-card:first-child { grid-row: span 2; min-height: 534px; }
.visual-card img { display: block; height: 100%; object-fit: cover; position: absolute; transition: transform .5s ease; width: 100%; }
.visual-card:hover img { transform: scale(1.035); }
.visual-card::after { background: linear-gradient(180deg, transparent 42%, rgba(2,13,38,.86)); content: ''; inset: 0; position: absolute; }
.visual-card figcaption { bottom: 0; color: white; left: 0; padding: 25px; position: absolute; right: 0; z-index: 1; }
.visual-card strong { display: block; font-family: Rajdhani, Arial, sans-serif; font-size: 24px; letter-spacing: .3px; text-transform: uppercase; }
.visual-card small { color: #b8cee9; display: block; font-size: 9px; margin-top: 5px; }
.visual-card small a { color: #b8cee9; text-decoration: none; }
@media (max-width: 800px) { .visuals { padding: 75px 0; } .visuals-head { align-items: start; flex-direction: column; gap: 20px; margin-bottom: 28px; } .visual-grid { grid-template-columns: 1fr; } .visual-card, .visual-card:first-child { min-height: 250px; } }