
/* =========================================================
   ROOMALBA24 V46.10 - COMPANY INTRO REDESIGN
   /p/intro
   - 화이트 + 소프트 핑크 + 골드 포인트
   - 기존 회사 기본정보 유지
   - PC 중심, 모바일 반응형 최소 보정
   ========================================================= */

.content-container{
    width:100%;
    padding:0;
    flex-direction:column;
    gap:0;
    min-height:500px;
    display:inline-block;
}

.content-container section .swiper-mobile,
.content-container section .swiper-pc{
    display:none!important;
}

.l-container.roomalba-intro-page{
    position:relative;
    z-index:10;
    width:100%;
    background:#fff;
}

.roomalba-intro-page .l-contents{
    min-height:500px;
}

.roomalba-intro-page .intro__wrap{
    width:100%;
    background:
        radial-gradient(circle at 12% 2%, rgba(246,79,143,.055), transparent 27%),
        linear-gradient(180deg,#fff 0%,#fff 100%);
    color:#493b42;
    letter-spacing:-.35px;
}

.roomalba-intro-page *{
    box-sizing:border-box;
}

/* ---------- HERO ---------- */

.roomalba-intro-hero{
    width:100%;
    padding:28px 24px 24px;
}

.roomalba-intro-hero__inner{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,46%) minmax(0,54%);
    width:min(1320px,100%);
    min-height:392px;
    margin:0 auto;
    overflow:hidden;
    border:1px solid #f1dce6;
    border-radius:24px;
    background:#fff;
    box-shadow:0 18px 50px rgba(89,44,64,.08);
}

.roomalba-intro-hero__copy{
    position:relative;
    z-index:3;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:40px 42px 38px 46px;
    background:
        radial-gradient(circle at 0% 0%, rgba(251,96,155,.11), transparent 35%),
        linear-gradient(135deg,#fff 0%,#fff9fc 100%);
}

.roomalba-intro-eyebrow{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:13px;
    color:#c4882e;
    font-size:12px;
    line-height:18px;
    font-weight:900;
    letter-spacing:1.5px;
}

.roomalba-intro-eyebrow__line{
    display:inline-block;
    width:32px;
    height:2px;
    border-radius:2px;
    background:linear-gradient(90deg,#e83d82,#d7a13c);
}

.roomalba-intro-hero h1{
    margin:0;
    color:#3e3137;
    font-size:38px;
    line-height:1.2;
    font-weight:800;
    letter-spacing:-1.65px;
}

.roomalba-intro-hero h1 strong{
    display:inline-block;
    margin-top:2px;
    color:#d72d72;
    font-weight:900;
    background:linear-gradient(90deg,#d72870 0%,#e84b89 68%,#bc842f 100%);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
}

.roomalba-intro-lead{
    max-width:500px;
    margin:10px 0 0;
    color:#77646d;
    font-size:14px;
    line-height:1.72;
    font-weight:600;
    word-break:keep-all;
}

.roomalba-intro-tags{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}

.roomalba-intro-tags span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:31px;
    padding:0 13px;
    border:1px solid #efccdc;
    border-radius:999px;
    background:#fff;
    color:#bd356d;
    font-size:12px;
    line-height:29px;
    font-weight:800;
    box-shadow:0 4px 12px rgba(206,51,112,.04);
}

.roomalba-intro-hero__visual{
    position:relative;
    min-height:392px;
    overflow:hidden;
    background-image:url('/img/intro/company.jpg');
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover;
}

.roomalba-intro-hero__visual::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    background:
        linear-gradient(90deg,rgba(255,249,252,.72) 0%,rgba(255,247,251,.16) 29%,rgba(95,17,49,.08) 100%),
        linear-gradient(180deg,rgba(255,255,255,0) 35%,rgba(62,13,33,.28) 100%);
}

.roomalba-intro-hero__visual::after{
    content:"";
    position:absolute;
    right:-58px;
    top:-70px;
    z-index:2;
    width:210px;
    height:210px;
    border:1px solid rgba(231,167,62,.35);
    border-radius:50%;
    box-shadow:
        0 0 0 30px rgba(255,255,255,.06),
        0 0 0 60px rgba(232,58,128,.035);
}

.roomalba-intro-visual__shade{
    position:absolute;
    inset:auto 0 0 0;
    z-index:2;
    height:42%;
    background:linear-gradient(180deg,transparent 0%,rgba(64,20,37,.52) 100%);
}

.roomalba-intro-visual__brand{
    position:absolute;
    right:26px;
    bottom:24px;
    z-index:4;
    width:min(340px,calc(100% - 52px));
    padding:17px 19px 16px;
    border:1px solid rgba(255,255,255,.4);
    border-radius:15px;
    background:rgba(74,22,42,.52);
    box-shadow:0 12px 36px rgba(41,11,23,.18);
    backdrop-filter:blur(9px);
    -webkit-backdrop-filter:blur(9px);
    color:#fff;
}

.roomalba-intro-visual__brand small{
    display:block;
    margin-bottom:7px;
    color:#f8c969;
    font-size:11px;
    line-height:16px;
    font-weight:900;
    letter-spacing:1.2px;
}

.roomalba-intro-visual__brand strong{
    display:block;
    color:#fff;
    font-size:23px;
    line-height:29px;
    font-weight:900;
    letter-spacing:.2px;
}

.roomalba-intro-visual__brand span{
    display:block;
    margin-top:5px;
    color:rgba(255,255,255,.86);
    font-size:13px;
    line-height:19px;
    font-weight:600;
}

/* ---------- SECTION COMMON ---------- */

.roomalba-intro-values,
.roomalba-intro-profile,
.roomalba-intro-cta{
    width:min(1320px,calc(100% - 48px));
    margin-left:auto;
    margin-right:auto;
}

.roomalba-intro-values{
    padding:42px 0 34px;
}

.roomalba-intro-section-head{
    text-align:center;
}

.roomalba-intro-section-head > span{
    display:block;
    margin-bottom:7px;
    color:#d59035;
    font-size:12px;
    line-height:18px;
    font-weight:900;
    letter-spacing:1.6px;
}

.roomalba-intro-section-head h2{
    margin:0;
    color:#3d3137;
    font-size:26px;
    line-height:1.3;
    font-weight:900;
    letter-spacing:-1.25px;
}

.roomalba-intro-section-head p{
    margin:9px auto 0;
    color:#8b7881;
    font-size:14px;
    line-height:1.8;
    font-weight:600;
    word-break:keep-all;
}

/* ---------- VALUE CARDS ---------- */

.roomalba-intro-value-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    margin-top:22px;
}

.roomalba-intro-value-card{
    position:relative;
    min-height:166px;
    padding:22px 22px 20px;
    overflow:hidden;
    border:1px solid #f0dce5;
    border-radius:17px;
    background:
        radial-gradient(circle at 100% 0%,rgba(247,79,143,.08),transparent 40%),
        #fff;
    box-shadow:0 10px 25px rgba(86,46,64,.045);
    transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}

.roomalba-intro-value-card:hover{
    transform:translateY(-3px);
    border-color:#eabed1;
    box-shadow:0 15px 32px rgba(86,46,64,.075);
}

.roomalba-intro-value-no{
    position:absolute;
    right:20px;
    top:18px;
    color:#ead0dc;
    font-size:12px;
    line-height:18px;
    font-weight:900;
    letter-spacing:1px;
}

.roomalba-intro-value-icon{
    display:flex;
    align-items:center;
    justify-content:center;
    width:36px;
    height:36px;
    margin-bottom:13px;
    border:1px solid #f1c8da;
    border-radius:11px;
    background:linear-gradient(145deg,#fff 0%,#fff1f7 100%);
    color:#d92e73;
    font-size:15px;
    line-height:1;
    font-weight:900;
    box-shadow:0 7px 16px rgba(214,45,113,.08);
}

.roomalba-intro-value-card h3{
    margin:0;
    color:#483a41;
    font-size:15px;
    line-height:24px;
    font-weight:900;
    letter-spacing:-.6px;
}

.roomalba-intro-value-card p{
    margin:7px 0 0;
    color:#88757e;
    font-size:13px;
    line-height:1.62;
    font-weight:600;
    word-break:keep-all;
}

/* ---------- COMPANY PROFILE ---------- */

.roomalba-intro-profile{
    display:grid;
    grid-template-columns:285px minmax(0,1fr);
    overflow:hidden;
    margin-top:4px;
    margin-bottom:26px;
    border:1px solid #eed9e3;
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 28px rgba(86,46,64,.05);
}

.roomalba-intro-profile__title{
    position:relative;
    padding:27px 28px 25px;
    overflow:hidden;
    background:
        radial-gradient(circle at 100% 0%,rgba(255,255,255,.16),transparent 42%),
        linear-gradient(145deg,#d72e73 0%,#be2e67 68%,#a56d2c 155%);
    color:#fff;
}

.roomalba-intro-profile__title::after{
    content:"";
    position:absolute;
    right:-42px;
    bottom:-52px;
    width:150px;
    height:150px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:50%;
}

.roomalba-intro-profile__title > span{
    display:block;
    margin-bottom:7px;
    color:#ffd67f;
    font-size:11px;
    line-height:17px;
    font-weight:900;
    letter-spacing:1.6px;
}

.roomalba-intro-profile__title h2{
    margin:0;
    color:#fff;
    font-size:23px;
    line-height:29px;
    font-weight:900;
    letter-spacing:-1px;
}

.roomalba-intro-profile__title p{
    position:relative;
    z-index:2;
    margin:10px 0 0;
    color:rgba(255,255,255,.84);
    font-size:13px;
    line-height:1.62;
    font-weight:600;
}

.roomalba-intro-profile__table{
    padding:8px 24px;
    background:linear-gradient(180deg,#fff 0%,#fffbfd 100%);
}

.roomalba-intro-profile-row{
    display:grid;
    grid-template-columns:190px minmax(0,1fr);
    align-items:center;
    min-height:54px;
    border-bottom:1px solid #f0e3e9;
}

.roomalba-intro-profile-row:last-child{
    border-bottom:0;
}

.roomalba-intro-profile-row span{
    color:#9b7f8b;
    font-size:13px;
    line-height:20px;
    font-weight:700;
}

.roomalba-intro-profile-row strong{
    color:#46383f;
    font-size:14px;
    line-height:21px;
    font-weight:900;
    word-break:break-all;
}

/* ---------- CTA ---------- */

.roomalba-intro-cta{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    margin-top:12px;
    margin-bottom:42px;
    padding:24px 28px;
    overflow:hidden;
    border:1px solid #f0d7e2;
    border-radius:18px;
    background:
        radial-gradient(circle at 94% 5%,rgba(216,162,54,.12),transparent 28%),
        linear-gradient(120deg,#fff6fa 0%,#fff 58%,#fffaf3 100%);
}

.roomalba-intro-cta__eyebrow{
    display:block;
    margin-bottom:6px;
    color:#d08b2f;
    font-size:11px;
    line-height:17px;
    font-weight:900;
    letter-spacing:1.4px;
}

.roomalba-intro-cta h2{
    margin:0;
    color:#403239;
    font-size:21px;
    line-height:28px;
    font-weight:900;
    letter-spacing:-.85px;
}

.roomalba-intro-cta p{
    margin:7px 0 0;
    color:#8b7780;
    font-size:13px;
    line-height:1.65;
    font-weight:600;
}

.roomalba-intro-cta__buttons{
    display:flex;
    flex:0 0 auto;
    gap:8px;
}

.roomalba-intro-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:13px;
    min-width:138px;
    min-height:42px;
    padding:0 17px;
    border-radius:999px;
    font-size:13px;
    line-height:40px;
    font-weight:900;
    text-decoration:none!important;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}

.roomalba-intro-btn span{
    font-size:16px;
    line-height:1;
}

.roomalba-intro-btn--primary{
    border:1px solid #d92e74;
    background:linear-gradient(90deg,#d92d73 0%,#ec4489 100%);
    color:#fff!important;
    box-shadow:0 9px 22px rgba(213,45,113,.18);
}

.roomalba-intro-btn--primary:hover{
    transform:translateY(-1px);
    color:#fff!important;
    box-shadow:0 12px 28px rgba(213,45,113,.25);
}

.roomalba-intro-btn--light{
    border:1px solid #e9cbd8;
    background:#fff;
    color:#b6386c!important;
}

.roomalba-intro-btn--light:hover{
    transform:translateY(-1px);
    border-color:#db9db8;
    color:#b6386c!important;
    box-shadow:0 9px 20px rgba(91,45,65,.07);
}

/* ---------- RESPONSIVE ---------- */

@media all and (max-width:1100px){
    .roomalba-intro-hero__inner{
        grid-template-columns:1fr 1fr;
    }

    .roomalba-intro-hero__copy{
        padding:48px 34px 48px 40px;
    }

    .roomalba-intro-hero h1{
        font-size:40px;
    }

    .roomalba-intro-profile{
        grid-template-columns:280px minmax(0,1fr);
    }

    .roomalba-intro-profile-row{
        grid-template-columns:185px minmax(0,1fr);
    }
}

@media all and (max-width:820px){
    .roomalba-intro-hero{
        padding:18px 14px 25px;
    }

    .roomalba-intro-hero__inner{
        display:flex;
        flex-direction:column;
        min-height:0;
        border-radius:18px;
    }

    .roomalba-intro-hero__copy{
        padding:36px 24px 32px;
    }

    .roomalba-intro-hero h1{
        font-size:34px;
        line-height:1.22;
        letter-spacing:-1.5px;
    }

    .roomalba-intro-lead{
        font-size:14px;
        line-height:1.62;
    }

    .roomalba-intro-hero__visual{
        min-height:310px;
        background-position:center center;
    }

    .roomalba-intro-visual__brand{
        right:18px;
        bottom:18px;
        width:calc(100% - 36px);
        padding:17px 18px;
    }

    .roomalba-intro-values,
    .roomalba-intro-profile,
    .roomalba-intro-cta{
        width:calc(100% - 28px);
    }

    .roomalba-intro-values{
        padding:42px 0 38px;
    }

    .roomalba-intro-section-head h2{
        font-size:25px;
    }

    .roomalba-intro-value-grid{
        grid-template-columns:1fr;
        gap:10px;
        margin-top:22px;
    }

    .roomalba-intro-value-card{
        min-height:0;
        padding:23px 21px;
    }

    .roomalba-intro-profile{
        display:block;
        border-radius:18px;
    }

    .roomalba-intro-profile__title{
        padding:27px 24px 24px;
    }

    .roomalba-intro-profile__title p br{
        display:none;
    }

    .roomalba-intro-profile__table{
        padding:8px 19px;
    }

    .roomalba-intro-profile-row{
        grid-template-columns:1fr;
        gap:3px;
        min-height:74px;
        padding:13px 0;
    }

    .roomalba-intro-cta{
        display:block;
        margin-bottom:36px;
        padding:25px 22px;
    }

    .roomalba-intro-cta h2{
        font-size:21px;
    }

    .roomalba-intro-cta__buttons{
        margin-top:19px;
    }

    .roomalba-intro-btn{
        flex:1 1 50%;
        min-width:0;
        padding:0 13px;
        font-size:12px;
    }
}

@media all and (max-width:480px){
    .roomalba-intro-hero h1{
        font-size:31px;
    }

    .roomalba-intro-tags span{
        min-height:31px;
        padding:0 12px;
        line-height:29px;
    }

    .roomalba-intro-hero__visual{
        min-height:270px;
    }

    .roomalba-intro-visual__brand strong{
        font-size:23px;
        line-height:29px;
    }

    .roomalba-intro-cta__buttons{
        flex-direction:column;
    }

    .roomalba-intro-btn{
        width:100%;
        flex:none;
    }
}

/* =========================================================
   ROOMALBA24 V46.11 - INTRO SCALE COMPACT
   메인 홈의 정보 밀도와 어울리도록 회사소개 전체 스케일 축소
   ========================================================= */
@media all and (min-width:821px){
    .roomalba-intro-page .intro__wrap{
        padding-bottom:1px;
    }

    .roomalba-intro-hero__inner{
        max-height:392px;
    }

    .roomalba-intro-hero__copy,
    .roomalba-intro-hero__visual{
        min-height:392px;
    }

    .roomalba-intro-section-head p{
        max-width:690px;
    }

    .roomalba-intro-value-card p{
        max-width:360px;
    }

    .roomalba-intro-profile{
        margin-bottom:18px;
    }

    .roomalba-intro-cta{
        min-height:112px;
    }
}

