.woori_branch_banner { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); gap: 20px; align-items: start; }
.woori_branch_text { min-width: 0; }
.woori_branch_text h3 { margin: 0 0 24px; color: #0b2a6b; font-family: var(--woori-font-display); font-size: clamp(25px,2.1vw,40px); font-weight: 500; line-height: 1.35; word-break: keep-all; }
.woori_branch_text p { margin: 0; color: #3b3b3b; font-family: var(--woori-font-body); font-size: calc(var(--woori-small-size) + 2px + 1pt); font-weight: 600; line-height: 1.55; word-break: keep-all; }
.woori_branch_media { min-width: 0; height: 400px; }
.woori_branch_media img { display: block; width: 100%; height: 100%; object-fit: contain; }
.woori_branch_link { display: inline-flex; align-items: center; justify-content: center; gap: 16px; min-height: 56px; margin-top: 44px; padding: 14px 28px; box-sizing: border-box; border-radius: 40px; background: var(--woori-blue); color: #fff; font-family: var(--woori-font-body); font-size: var(--woori-button-size); font-weight: 700; line-height: 1.3; text-decoration: none; }
.woori_branch_link:hover { color: #fff; }
.woori_branch_link:focus-visible { outline: 2px solid var(--woori-navy); outline-offset: 4px; }
.woori_branch_banner.has-motion { opacity: 0; transform: translateY(36px); transition: opacity 700ms ease var(--branch-delay), transform 850ms cubic-bezier(.22,.61,.36,1) var(--branch-delay); }
.woori_branch_banner.has-motion.is-visible { opacity: 1; transform: none; }
@media (max-width: 1400px) { .woori_branch_media { height: 330px; } }
@media (max-width: 700px) { .woori_branch_banner { gap: 16px; } .woori_branch_media { height: 280px; } .woori_branch_link { min-height: 44px; margin-top: 24px; padding: 10px 16px; font-size: 15px; } }
@media (prefers-reduced-motion: reduce) { .woori_branch_banner.has-motion { opacity: 1; transform: none; transition: none; } }