/* =========================================================
   MOVETIME Membership Benefit Page
   ========================================================= */
.mv-benefit-page{
    width:1400px;
    max-width:calc(100% - 32px);
    margin:32px auto 90px;
    color:#1b2b42;
    letter-spacing:-.04em;
}

.mv-benefit-page *{box-sizing:border-box;}

.mv-benefit-hero{
    position:relative;
    overflow:hidden;
    min-height:360px;
    border-radius:34px;
    border:1px solid rgba(207, 176, 112, .55);
    background:
        radial-gradient(circle at 12% 18%, rgba(139, 190, 235, .32), transparent 35%),
        radial-gradient(circle at 88% 4%, rgba(242, 200, 132, .34), transparent 36%),
        linear-gradient(135deg, #fffdf7 0%, #f5f8fb 45%, #f9efe0 100%);
    box-shadow:0 22px 60px rgba(13, 31, 55, .12), inset 0 1px 0 rgba(255,255,255,.9);
}

.mv-benefit-hero:before{
    content:"MOVETIME";
    position:absolute;
    right:-32px;
    top:16px;
    font-size:118px;
    line-height:1;
    font-family:Georgia, 'Times New Roman', serif;
    font-weight:900;
    color:rgba(13, 40, 74, .045);
    transform:rotate(-8deg);
    pointer-events:none;
    white-space:nowrap;
}

.mv-benefit-hero:after{
    content:"";
    position:absolute;
    left:-120px;
    bottom:-160px;
    width:560px;
    height:320px;
    border-radius:50%;
    background:rgba(255,255,255,.58);
    filter:blur(2px);
}

.mv-benefit-hero-glow{
    position:absolute;
    inset:0;
    background:linear-gradient(120deg, rgba(255,255,255,.68), transparent 48%, rgba(190,136,38,.12));
    pointer-events:none;
}

.mv-benefit-hero-inner{
    position:relative;
    z-index:2;
    width:900px;
    max-width:100%;
    padding:62px 58px 56px;
}

.mv-benefit-kicker,
.mv-benefit-section-head span{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 15px;
    border-radius:999px;
    background:#0d315c;
    color:#fff;
    font-size:12px;
    line-height:1;
    font-weight:900;
    letter-spacing:.08em;
}

.mv-benefit-hero h1{
    margin:22px 0 18px;
    color:#102747;
    font-size:48px;
    line-height:1.18;
    font-weight:950;
    letter-spacing:-.075em;
}

.mv-benefit-hero p{
    width:760px;
    max-width:100%;
    margin:0;
    color:#415067;
    font-size:18px;
    line-height:1.85;
    font-weight:700;
    word-break:keep-all;
}

.mv-benefit-actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:30px;
}

.mv-benefit-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:170px;
    min-height:52px;
    padding:0 26px;
    border-radius:15px;
    font-size:16px;
    font-weight:950;
    text-decoration:none !important;
    transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.mv-benefit-btn:hover{transform:translateY(-3px);}

.mv-benefit-btn-primary{
    color:#fff !important;
    background:linear-gradient(135deg, #071d3b 0%, #103d70 100%);
    box-shadow:0 14px 28px rgba(7, 29, 59, .24), inset 0 0 0 1px rgba(255,255,255,.15);
}

.mv-benefit-btn-light{
    color:#102747 !important;
    background:rgba(255,255,255,.72);
    border:1px solid rgba(192,151,76,.5);
    box-shadow:0 10px 22px rgba(38, 54, 75, .08), inset 0 1px 0 rgba(255,255,255,.85);
}

.mv-benefit-section-head{
    margin:64px 0 24px;
    text-align:center;
}

.mv-benefit-section-head span{background:#b0832f;}

.mv-benefit-section-head h2{
    margin:18px 0 10px;
    color:#102747;
    font-size:34px;
    line-height:1.25;
    font-weight:950;
}

.mv-benefit-section-head p{
    margin:0 auto;
    width:760px;
    max-width:100%;
    color:#667184;
    font-size:16px;
    line-height:1.75;
    font-weight:700;
}

.mv-benefit-core-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:18px;
}

.mv-benefit-core-card{
    min-height:238px;
    padding:30px 24px 26px;
    border-radius:24px;
    background:linear-gradient(180deg, #fff 0%, #faf7ef 100%);
    border:1px solid rgba(214, 190, 146, .65);
    box-shadow:0 14px 34px rgba(13, 31, 55, .07), inset 0 1px 0 rgba(255,255,255,.9);
    text-align:center;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.mv-benefit-core-card:hover{
    transform:translateY(-5px);
    border-color:rgba(177, 125, 43, .78);
    box-shadow:0 20px 42px rgba(13, 31, 55, .12);
}

.mv-benefit-icon{
    display:flex;
    align-items:center;
    justify-content:center;
    width:62px;
    height:62px;
    margin:0 auto 18px;
    border-radius:20px;
    background:linear-gradient(135deg, #0d315c, #174a84);
    color:#fff;
    font-size:18px;
    line-height:1;
    font-weight:950;
    box-shadow:0 12px 24px rgba(7, 29, 59, .22);
}

.mv-benefit-core-card:nth-child(2) .mv-benefit-icon{background:linear-gradient(135deg, #9f7022, #d3a64f); color:#081d3a;}
.mv-benefit-core-card:nth-child(3) .mv-benefit-icon{background:linear-gradient(135deg, #203b64, #83a9d4);}
.mv-benefit-core-card:nth-child(4) .mv-benefit-icon{background:linear-gradient(135deg, #2e4a3d, #8bb892);}

.mv-benefit-core-card h3{
    margin:0 0 12px;
    color:#102747;
    font-size:22px;
    line-height:1.3;
    font-weight:950;
}

.mv-benefit-core-card p{
    margin:0;
    color:#5f6a79;
    font-size:15px;
    line-height:1.75;
    font-weight:700;
    word-break:keep-all;
}

.mv-benefit-grade{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
    margin-top:64px;
}

.mv-benefit-grade-card{
    position:relative;
    overflow:hidden;
    padding:38px 36px;
    border-radius:28px;
    border:1px solid rgba(204, 176, 122, .58);
    background:#fff;
    box-shadow:0 16px 38px rgba(13, 31, 55, .08);
}

.mv-benefit-grade-normal{
    background:linear-gradient(135deg, #ffffff 0%, #f4f8fc 100%);
}

.mv-benefit-grade-vip{
    background:linear-gradient(135deg, #071d3b 0%, #123e70 100%);
    border-color:rgba(218, 176, 83, .76);
}

.mv-benefit-grade-card:after{
    content:"";
    position:absolute;
    right:-80px;
    top:-80px;
    width:220px;
    height:220px;
    border-radius:50%;
    background:rgba(196, 148, 52, .13);
}

.mv-benefit-grade-top{position:relative; z-index:2;}

.mv-benefit-grade-top span{
    display:inline-block;
    margin-bottom:12px;
    color:#b0832f;
    font-size:13px;
    font-weight:950;
    letter-spacing:.12em;
}

.mv-benefit-grade-top h3{
    margin:0 0 22px;
    color:#102747;
    font-size:30px;
    font-weight:950;
}

.mv-benefit-grade-vip .mv-benefit-grade-top span{color:#ffe4a0;}
.mv-benefit-grade-vip .mv-benefit-grade-top h3{color:#fff;}

.mv-benefit-grade-card ul{
    position:relative;
    z-index:2;
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    gap:12px;
}

.mv-benefit-grade-card li{
    position:relative;
    padding:14px 16px 14px 42px;
    border-radius:14px;
    background:rgba(255,255,255,.78);
    color:#26344a;
    font-size:15px;
    line-height:1.45;
    font-weight:800;
}

.mv-benefit-grade-card li:before{
    content:"✓";
    position:absolute;
    left:15px;
    top:50%;
    transform:translateY(-50%);
    color:#b0832f;
    font-weight:950;
}

.mv-benefit-grade-vip li{
    background:rgba(255,255,255,.1);
    color:#fff;
    border:1px solid rgba(255,255,255,.13);
}

.mv-benefit-grade-vip li:before{color:#ffe4a0;}

.mv-benefit-time-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:18px;
}

.mv-benefit-time-item{
    padding:30px 26px;
    border-radius:24px;
    background:#fff;
    border:1px solid #e8dfd2;
    box-shadow:0 12px 32px rgba(13, 31, 55, .06);
}

.mv-benefit-time-item b{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    margin-bottom:17px;
    border-radius:14px;
    background:#102747;
    color:#fff;
    font-size:14px;
    font-weight:950;
}

.mv-benefit-time-item strong{
    display:block;
    margin-bottom:10px;
    color:#102747;
    font-size:21px;
    font-weight:950;
}

.mv-benefit-time-item p{
    margin:0;
    color:#606b7a;
    font-size:15px;
    line-height:1.75;
    font-weight:700;
}

.mv-benefit-info{
    margin-top:58px;
}

.mv-benefit-info-box{
    padding:34px 38px;
    border-radius:26px;
    background:linear-gradient(135deg, #fffaf0 0%, #f7f2e7 100%);
    border:1px solid rgba(198, 160, 88, .5);
    box-shadow:0 14px 34px rgba(13, 31, 55, .06);
}

.mv-benefit-info-box h2{
    margin:0 0 18px;
    color:#102747;
    font-size:27px;
    font-weight:950;
    text-align:center;
}

.mv-benefit-info-box ul{
    margin:0;
    padding:0;
    list-style:none;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.mv-benefit-info-box li{
    position:relative;
    padding:15px 16px 15px 38px;
    border-radius:14px;
    background:rgba(255,255,255,.72);
    color:#4e5969;
    font-size:14px;
    line-height:1.65;
    font-weight:750;
}

.mv-benefit-info-box li:before{
    content:"!";
    position:absolute;
    left:14px;
    top:15px;
    display:flex;
    align-items:center;
    justify-content:center;
    width:18px;
    height:18px;
    border-radius:50%;
    background:#b0832f;
    color:#fff;
    font-size:12px;
    font-weight:950;
}

.mv-benefit-bottom-cta{
    margin-top:44px;
    padding:42px 36px;
    border-radius:30px;
    background:linear-gradient(135deg, #0a2344 0%, #123f73 100%);
    color:#fff;
    text-align:center;
    box-shadow:0 20px 48px rgba(7, 29, 59, .22);
}

.mv-benefit-bottom-cta h2{
    margin:0 0 12px;
    color:#fff;
    font-size:34px;
    font-weight:950;
}

.mv-benefit-bottom-cta p{
    margin:0 auto;
    width:780px;
    max-width:100%;
    color:#dbe8f8;
    font-size:16px;
    line-height:1.75;
    font-weight:700;
}

.mv-benefit-actions-bottom{
    justify-content:center;
}

.mv-benefit-bottom-cta .mv-benefit-btn-light{
    background:rgba(255,255,255,.12);
    color:#fff !important;
    border-color:rgba(255,255,255,.24);
}

@media (max-width:1100px){
    .mv-benefit-core-grid{grid-template-columns:repeat(2, 1fr);}
    .mv-benefit-grade{grid-template-columns:1fr;}
}

@media (max-width:768px){
    .mv-benefit-page{max-width:calc(100% - 20px); margin-top:18px;}
    .mv-benefit-hero{border-radius:22px; min-height:auto;}
    .mv-benefit-hero-inner{padding:38px 22px 34px;}
    .mv-benefit-hero h1{font-size:31px;}
    .mv-benefit-hero p{font-size:15px;}
    .mv-benefit-actions{display:grid; grid-template-columns:1fr;}
    .mv-benefit-btn{width:100%;}
    .mv-benefit-section-head{margin-top:42px;}
    .mv-benefit-section-head h2{font-size:25px;}
    .mv-benefit-core-grid,
    .mv-benefit-time-grid,
    .mv-benefit-info-box ul{grid-template-columns:1fr;}
    .mv-benefit-grade-card,
    .mv-benefit-info-box,
    .mv-benefit-bottom-cta{padding:28px 20px; border-radius:22px;}
    .mv-benefit-bottom-cta h2{font-size:25px;}
}

/* =========================================================
   SNS Channel Benefit Section
   ========================================================= */
.mv-benefit-sns{
    margin-top:70px;
    padding:1px 0 0;
}

.mv-benefit-sns-head{
    margin-top:0;
}

.mv-benefit-sns-head span{
    background:linear-gradient(135deg, #102747, #1f6da7);
}

.mv-benefit-sns-hero{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    padding:34px 38px;
    border-radius:30px;
    background:
        radial-gradient(circle at 84% 22%, rgba(255,230,149,.32), transparent 36%),
        linear-gradient(135deg, #081f3f 0%, #143f72 58%, #0b284e 100%);
    color:#fff;
    border:1px solid rgba(255,222,148,.42);
    box-shadow:0 22px 54px rgba(7, 29, 59, .22);
    overflow:hidden;
    position:relative;
}

.mv-benefit-sns-hero:before{
    content:"SNS BENEFIT";
    position:absolute;
    right:20px;
    top:-8px;
    font-size:76px;
    font-weight:950;
    letter-spacing:-.05em;
    color:rgba(255,255,255,.045);
    white-space:nowrap;
}

.mv-benefit-sns-hero > div{
    position:relative;
    z-index:2;
}

.mv-benefit-sns-hero b{
    display:inline-flex;
    padding:8px 14px;
    border-radius:999px;
    background:rgba(255,255,255,.13);
    color:#ffe7a2;
    font-size:12px;
    line-height:1;
    font-weight:950;
    letter-spacing:.1em;
}

.mv-benefit-sns-hero h3{
    margin:16px 0 10px;
    color:#fff;
    font-size:34px;
    line-height:1.25;
    font-weight:950;
}

.mv-benefit-sns-hero h3 strong{
    color:#ffe7a2;
    font-size:46px;
    letter-spacing:-.05em;
}

.mv-benefit-sns-hero p{
    margin:0;
    color:#dceafd;
    font-size:16px;
    line-height:1.7;
    font-weight:750;
}

.mv-benefit-sns-total{
    min-width:210px;
    min-height:92px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:24px;
    color:#0a2344;
    background:linear-gradient(135deg, #fff 0%, #ffe29a 100%);
    font-size:34px;
    font-weight:950;
    box-shadow:0 14px 34px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.9);
}

.mv-benefit-sns-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:18px;
    margin-top:22px;
}

.mv-benefit-sns-card{
    position:relative;
    overflow:hidden;
    min-height:318px;
    padding:28px 22px 24px;
    border-radius:26px;
    background:linear-gradient(180deg, #fff 0%, #faf7ef 100%);
    border:1px solid rgba(214, 190, 146, .72);
    box-shadow:0 14px 34px rgba(13, 31, 55, .08), inset 0 1px 0 rgba(255,255,255,.9);
    text-align:center;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.mv-benefit-sns-card:hover{
    transform:translateY(-5px);
    border-color:rgba(177, 125, 43, .82);
    box-shadow:0 22px 48px rgba(13, 31, 55, .13);
}

.mv-benefit-sns-card:before{
    content:"";
    position:absolute;
    right:-50px;
    top:-50px;
    width:140px;
    height:140px;
    border-radius:50%;
    background:rgba(54, 121, 190, .09);
}

.mv-benefit-sns-icon{
    position:relative;
    z-index:2;
    width:64px;
    height:64px;
    margin:0 auto 17px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:21px;
    background:linear-gradient(135deg, #0d315c, #174a84);
    color:#fff;
    font-size:18px;
    font-weight:950;
    box-shadow:0 13px 26px rgba(7, 29, 59, .22);
}

.mv-benefit-sns-kakao .mv-benefit-sns-icon{
    background:linear-gradient(135deg, #fee500, #f7c834);
    color:#2b2111;
}

.mv-benefit-sns-youtube .mv-benefit-sns-icon{
    background:linear-gradient(135deg, #ed1c24, #a80f18);
    color:#fff;
}

.mv-benefit-sns-talk .mv-benefit-sns-icon{
    width:76px;
    background:linear-gradient(135deg, #102747, #2f7cb8);
    font-size:13px;
}

.mv-benefit-sns-bonus .mv-benefit-sns-icon{
    background:linear-gradient(135deg, #b0832f, #f0cb76);
    color:#102747;
}

.mv-benefit-sns-card span{
    position:relative;
    z-index:2;
    display:block;
    color:#647083;
    font-size:13px;
    font-weight:950;
    letter-spacing:.02em;
}

.mv-benefit-sns-card h3{
    position:relative;
    z-index:2;
    margin:9px 0 12px;
    color:#102747;
    font-size:31px;
    line-height:1.2;
    font-weight:950;
    letter-spacing:-.055em;
}

.mv-benefit-sns-card p{
    position:relative;
    z-index:2;
    min-height:78px;
    margin:0 0 18px;
    color:#5f6a79;
    font-size:14px;
    line-height:1.72;
    font-weight:750;
    word-break:keep-all;
}

.mv-benefit-sns-card a{
    position:relative;
    z-index:2;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-height:48px;
    border-radius:14px;
    color:#fff !important;
    background:linear-gradient(135deg, #0d315c, #174a84);
    font-size:15px;
    font-weight:950;
    text-decoration:none !important;
    box-shadow:0 10px 22px rgba(13, 49, 92, .18);
    transition:transform .18s ease, box-shadow .18s ease;
}

.mv-benefit-sns-card a:hover{
    transform:translateY(-2px);
    box-shadow:0 14px 26px rgba(13, 49, 92, .24);
}

.mv-benefit-sns-kakao a{
    background:linear-gradient(135deg, #fee500, #f5c93b);
    color:#2b2111 !important;
}

.mv-benefit-sns-youtube a{
    background:linear-gradient(135deg, #ed1c24, #a80f18);
}

.mv-benefit-sns-bonus a{
    background:linear-gradient(135deg, #b0832f, #e8c16d);
    color:#102747 !important;
}

.mv-benefit-sns-auth{
    display:grid;
    grid-template-columns:.95fr 1.25fr;
    gap:22px;
    margin-top:24px;
    padding:30px 32px;
    border-radius:28px;
    background:linear-gradient(135deg, #ffffff 0%, #f4f8fc 100%);
    border:1px solid rgba(199, 176, 133, .55);
    box-shadow:0 14px 34px rgba(13, 31, 55, .07);
}

.mv-benefit-sns-auth-left span{
    display:inline-block;
    margin-bottom:11px;
    color:#b0832f;
    font-size:12px;
    font-weight:950;
    letter-spacing:.1em;
}

.mv-benefit-sns-auth-left h3{
    margin:0 0 12px;
    color:#102747;
    font-size:27px;
    font-weight:950;
}

.mv-benefit-sns-auth-left p{
    margin:0;
    color:#5f6a79;
    font-size:15px;
    line-height:1.8;
    font-weight:750;
    word-break:keep-all;
}

.mv-benefit-sns-auth ol{
    margin:0;
    padding:0;
    list-style:none;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.mv-benefit-sns-auth li{
    display:flex;
    align-items:center;
    gap:12px;
    padding:13px 14px;
    border-radius:15px;
    background:#fff;
    border:1px solid #e4eaf3;
    color:#26344a;
    font-size:14px;
    font-weight:850;
}

.mv-benefit-sns-auth li strong{
    flex:0 0 32px;
    height:32px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:11px;
    background:#102747;
    color:#fff;
    font-size:13px;
    font-weight:950;
}

.mv-benefit-btn-gold{
    color:#102747 !important;
    background:linear-gradient(135deg, #f8df9c 0%, #d7a94f 100%);
    box-shadow:0 14px 28px rgba(176, 131, 47, .25), inset 0 1px 0 rgba(255,255,255,.5);
}

@media (max-width:1100px){
    .mv-benefit-sns-grid{grid-template-columns:repeat(2, 1fr);}
    .mv-benefit-sns-auth{grid-template-columns:1fr;}
}

@media (max-width:768px){
    .mv-benefit-sns{margin-top:46px;}
    .mv-benefit-sns-hero{display:block; padding:28px 22px; border-radius:22px;}
    .mv-benefit-sns-hero h3{font-size:26px;}
    .mv-benefit-sns-hero h3 strong{font-size:35px;}
    .mv-benefit-sns-total{margin-top:18px; min-width:0; width:100%; min-height:76px; font-size:28px;}
    .mv-benefit-sns-grid{grid-template-columns:1fr;}
    .mv-benefit-sns-card{min-height:auto; padding:26px 20px; border-radius:22px;}
    .mv-benefit-sns-card p{min-height:0;}
    .mv-benefit-sns-auth{padding:26px 20px; border-radius:22px;}
    .mv-benefit-sns-auth ol{grid-template-columns:1fr;}
}