.woori_intro_skin { max-width: 1440px; margin: 0 auto; }
.woori_intro_layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 680px);
    align-items: center;
    gap: 80px;
}
.woori_intro_text { position: relative; z-index: 1; min-width: 0; }
.woori_intro_logo { display: block; width: 300px; max-width: 85%; height: auto; margin-bottom: 38px; }
.woori_intro_heading {
    margin: 0;
    color: var(--woori-text);
    font-family: var(--woori-font-display);
    font-size: clamp(28px, 2.15vw, 42px);
    font-weight: 500;
    line-height: 1.4;
    word-break: keep-all;
}
.woori_intro_line { display: block; overflow: hidden; }
.woori_intro_line > span { display: block; }
.woori_intro_description { margin-top: 24px; font-size: var(--woori-description-size); line-height: 1.5; }
.woori_intro_arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 64px;
    height: 64px;
    margin-top: 40px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--woori-teal);
    color: #fff;
    font-family: sans-serif;
    font-size: 32px;
    line-height: 1;
    text-decoration: none;
}
.woori_intro_arrow:hover { color: #fff; }
.woori_intro_arrow:focus-visible { outline: 2px solid var(--woori-navy); outline-offset: 4px; }
.woori_intro_art { position: relative; display: grid; align-items: center; min-width: 0; height: 480px; isolation: isolate; }
.woori_intro_art > img { position: relative; display: block; width: 100%; height: 100%; object-fit: contain; }
.woori_intro_circle {
    position: absolute;
    z-index: -1;
    top: 50%; left: 50%;
    width: 460px; max-width: 90%; aspect-ratio: 1;
    border-radius: 50%; background: #eaf1fa;
    transform: translate(-50%, -50%);
}
[data-intro-ready]:not(.is-visible) .woori_intro_circle { transform: translate(-50%, -50%) scale(.25); }
[data-intro-ready]:not(.is-visible) .woori_intro_line > span { opacity: 0; transform: translateY(105%); }
[data-intro-ready] .woori_intro_circle { transition: transform 1200ms cubic-bezier(.22,.61,.36,1); }
[data-intro-ready] .woori_intro_line > span { transition: transform 850ms cubic-bezier(.22,.61,.36,1) var(--intro-delay), opacity 650ms ease var(--intro-delay); }
@media (max-width: 1000px) {
    .woori_intro_layout { gap: 32px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .woori_intro_art { height: 360px; }
}
@media (max-width: 700px) {
    .woori_intro_layout { grid-template-columns: 1fr; gap: 32px; }
    .woori_intro_art { height: 300px; }
    .woori_intro_logo { width: 240px; margin-bottom: 24px; }
    .woori_intro_arrow { margin-top: 28px; width: 56px; height: 56px; }
}
@media (prefers-reduced-motion: reduce) {
    [data-intro-ready] .woori_intro_circle { transform: translate(-50%, -50%) !important; transition: none; }
    [data-intro-ready] .woori_intro_line > span { opacity: 1 !important; transform: none !important; transition: none; }
}