@charset "utf-8";
/* CSS Document */

        .section-scroll-wrapper {
            position: relative;
            height: 250vh;
            /* 스크롤 공간을 충분히 제공하여 모션 연출 */
            /* background-color: #0b0f17; */
        }

        /* 스크롤 동안 화면에 고정되는 컨테이너 */
        .sticky-container {
            position: sticky;
            top: 0;
            height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }

        /* 스크롤에 따라 확대/축소되는 article */
        .expand-article {
            position: relative;
            width: 70vw;
            /* 초기 가로 크기 */
            height: 60vh;
            border-radius: 40px;
            overflow: hidden;
            box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
            will-change: transform, width, height, border-radius;
            transition: transform 0.1s ease-out, width 0.1s ease-out, border-radius 0.1s ease-out;
        }

        /* 배경 이미지 및 암전 오버레이 */
        .article-bg {
            position: absolute;
            inset: 0;
            background-size: cover;
            background-position: center;
            transform: scale(1.1);
            transition: transform 0.1s ease-out;
        }

        .article-overlay {
            position: absolute;
            inset: 0;
            background: linear-gradient(180deg, rgba(15, 23, 42, 0.4) 0%, rgba(15, 23, 42, 0.85) 100%);
            z-index: 1;
        }

        /* article 내부 콘텐츠 */
        .article-content {
            position: relative;
            z-index: 2;
            height: 100%;
            padding: 60px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            color: #ffffff;
        }

        .recruit-badge {
            font-size: 0.95rem;
            font-weight: 800;
            color: var(--primary-color);
            letter-spacing: 2px;
        }

        .recruit-title {
            font-size: 2.5rem;
            font-weight: 800;
            line-height: 1.35;
            word-break: keep-all;
        }

        .btn-group-wrap {
            display: flex;
            gap: 16px;
            flex-wrap: wrap;
        }

        .btn-recruit-action {
            background: rgba(255, 255, 255, 0.12);
            border: 1px solid rgba(255, 255, 255, 0.25);
            backdrop-filter: blur(12px);
            color: #ffffff;
            padding: 16px 32px;
            border-radius: 50px;
            display: inline-flex;
            align-items: center;
            gap: 16px;
            text-decoration: none;
            font-weight: 600;
            transition: all 0.3s ease;
        }

        .btn-recruit-action:hover {
            background: #ffffff;
            color: #0f172a;
            transform: translateY(-3px);
        }