/* 02. Keep the site assets that already work */
.agency-widget--intro,
.agency-widget--intro *,
.agency-widget--intro *::before,
.agency-widget--intro *::after {box-sizing: border-box;}

.agency-widget--intro {
    --agency-intro-ink: #191f28;
    --agency-intro-soft: #4e5968;
    --agency-intro-muted: #718096;
    --agency-intro-line: #e3e8ed;
    --agency-intro-blue: var(--rb-main-color, #2167ff);
    --agency-intro-width: var(--rb-main-width, 1200px);
    padding: 146px 0 138px;
    color: var(--agency-intro-ink);
    background: #fff;
    font-family: Pretendard, "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
}

.agency-widget--intro h2,
.agency-widget--intro h3,
.agency-widget--intro p {margin: 0;}
.agency-widget--intro .agency-shell {width: min(var(--agency-intro-width), calc(100% - 48px)); margin: 0 auto;}

.agency-widget--intro .agency-intro__heading {display: grid; grid-template-columns: minmax(0, 1.16fr) minmax(270px, .64fr); align-items: end; gap: clamp(40px, 6vw, 100px);}
.agency-widget--intro .agency-section-index {margin: 0;}
.agency-widget--intro h2 {max-width: 750px; margin-top: 19px; color: var(--agency-intro-ink); font-size: clamp(38px, 4.15vw, 56px); font-weight: 800; letter-spacing: -.078em; line-height: 1.14; word-break: keep-all;}
.agency-widget--intro .agency-intro__heading > p {max-width: 385px; margin-bottom: 4px; color: var(--agency-intro-soft); font-size: 16px; font-weight: 500; letter-spacing: -.035em; line-height: 1.75; word-break: keep-all;}

.agency-widget--intro .agency-intro__body {display: grid; grid-template-columns: minmax(250px, .84fr) minmax(0, 1.16fr); gap: clamp(38px, 6vw, 96px); margin-top: 67px; padding-top: 24px; border-top: 1px solid var(--agency-intro-line);}

.agency-widget--intro .agency-intro__manifesto {position: relative; min-height: 394px; padding: 29px; overflow: hidden; background: var(--agency-intro-ink); color: #fff;}
.agency-widget--intro .agency-intro__manifesto::before {position: absolute; top: 29px; right: 29px; width: 38px; height: 1px; background: var(--agency-intro-blue); content: '';}
.agency-widget--intro .agency-intro__manifesto::after {position: absolute; right: -65px; bottom: -65px; width: 190px; height: 190px; border: 1px solid rgba(255, 255, 255, .18); border-radius: 50%; box-shadow: 0 0 0 30px rgba(255, 255, 255, .035); content: '';}
.agency-widget--intro .agency-intro__manifesto > p {position: relative; z-index: 1; color: #a9d3ff; font-size: 10px; font-weight: 800; letter-spacing: .105em; line-height: 1;}
.agency-widget--intro .agency-intro__manifesto strong {position: relative; z-index: 1; display: block; margin-top: 53px; color: #fff; font-size: clamp(37px, 3.55vw, 51px); font-weight: 800; letter-spacing: -.095em; line-height: .91;}
.agency-widget--intro .agency-intro__manifesto > span {position: absolute; z-index: 1; right: 29px; bottom: 27px; left: 29px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .18); color: rgba(255, 255, 255, .68); font-size: 13px; font-weight: 500; letter-spacing: -.035em; line-height: 1.65; word-break: keep-all;}

.agency-widget--intro .agency-intro__inventory {margin: 0; padding: 0; border-top: 1px solid var(--agency-intro-line); list-style: none;}
.agency-widget--intro .agency-intro__inventory li {display: grid; grid-template-columns: 48px minmax(0, 1fr) 38px; align-items: start; gap: 15px; min-height: 106px; padding: 22px 0 20px; border-bottom: 1px solid var(--agency-intro-line);}
.agency-widget--intro .agency-intro__inventory li > span {display: inline-flex; align-items: center; justify-content: center; min-width: 37px; height: 25px; margin-top: 2px; border: 1px solid #d6e7fb; color: var(--agency-intro-blue); font-size: 10px; font-weight: 800; letter-spacing: .055em; line-height: 1;}
.agency-widget--intro .agency-intro__inventory h3 {color: var(--agency-intro-ink); font-size: 22px; font-weight: 800; letter-spacing: -.06em; line-height: 1.25; word-break: keep-all;}
.agency-widget--intro .agency-intro__inventory p {max-width: 465px; margin-top: 9px; color: var(--agency-intro-muted); font-size: 14px; font-weight: 500; letter-spacing: -.025em; line-height: 1.58; word-break: keep-all;}
.agency-widget--intro .agency-intro__state {justify-self: end; margin-top: 6px; color: var(--agency-intro-blue); font-size: 8px; font-weight: 800; letter-spacing: .1em; line-height: 1;}

.agency-widget--intro .agency-intro__footnote {display: flex; align-items: flex-start; gap: 25px; margin-top: 47px; padding-top: 19px; border-top: 1px solid var(--agency-intro-line);}
.agency-widget--intro .agency-intro__footnote span {flex: 0 0 auto; color: var(--agency-intro-blue); font-size: 9px; font-weight: 800; letter-spacing: .105em; line-height: 1.55;}
.agency-widget--intro .agency-intro__footnote strong {color: var(--agency-intro-ink); font-size: 15px; font-weight: 700; letter-spacing: -.04em; line-height: 1.55; word-break: keep-all;}

.agency-widget--intro.is-motion-ready [data-agency-intro-reveal] {opacity: 0; transform: translateY(21px); transition: opacity .65s ease var(--agency-intro-delay, 0ms), transform .65s cubic-bezier(.2,.75,.2,1) var(--agency-intro-delay, 0ms);}
.agency-widget--intro.is-motion-ready [data-agency-intro-reveal].is-inview {opacity: 1; transform: translateY(0);}

@media (max-width: 1024px) {
    .agency-widget--intro {padding: 107px 0 101px;}
    .agency-widget--intro .agency-intro__heading {grid-template-columns: 1fr; gap: 23px;}
    .agency-widget--intro .agency-intro__heading > p {max-width: 590px; margin-bottom: 0;}
    .agency-widget--intro .agency-intro__body {grid-template-columns: minmax(230px, .76fr) minmax(0, 1.24fr); gap: 39px; margin-top: 51px;}
    .agency-widget--intro .agency-intro__manifesto {min-height: 366px;}
}

@media (max-width: 640px) {
    .agency-widget--intro {padding: 79px 0 74px;}
    .agency-widget--intro .agency-shell {width: min(100% - 40px, 520px);}
    .agency-widget--intro h2 {font-size: 38px;}
    .agency-widget--intro .agency-intro__heading > p {font-size: 15px;}
    .agency-widget--intro .agency-intro__body {grid-template-columns: 1fr; gap: 37px; margin-top: 38px; padding-top: 18px;}
    .agency-widget--intro .agency-intro__manifesto {min-height: 297px; padding: 24px;}
    .agency-widget--intro .agency-intro__manifesto::before {top: 24px; right: 24px;}
    .agency-widget--intro .agency-intro__manifesto strong {margin-top: 38px; font-size: 43px;}
    .agency-widget--intro .agency-intro__manifesto > span {right: 24px; bottom: 22px; left: 24px; font-size: 12px;}
    .agency-widget--intro .agency-intro__inventory li {grid-template-columns: 40px minmax(0, 1fr) 31px; gap: 10px; min-height: 0; padding: 18px 0;}
    .agency-widget--intro .agency-intro__inventory li > span {min-width: 32px; height: 23px; font-size: 9px;}
    .agency-widget--intro .agency-intro__inventory h3 {font-size: 19px;}
    .agency-widget--intro .agency-intro__inventory p {margin-top: 7px; font-size: 13px;}
    .agency-widget--intro .agency-intro__state {margin-top: 5px; font-size: 7px;}
    .agency-widget--intro .agency-intro__footnote {display: grid; gap: 8px; margin-top: 34px; padding-top: 16px;}
    .agency-widget--intro .agency-intro__footnote strong {font-size: 14px;}
}

@media (prefers-reduced-motion: reduce) {
    .agency-widget--intro *,
    .agency-widget--intro *::before,
    .agency-widget--intro *::after {scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important;}
}
