:root{
    --p-blue:#0874ff;
    --p-dark:#071426;
    --p-muted:#708198;
    --p-line:#dce8f7;
    --p-soft:#f5f9ff;
}

.pricing-page{
    margin:0;
    background:#fff;
    color:var(--p-dark);
    overflow-x:hidden;
}

.pricing-header{
    height:72px;
    padding:0 clamp(28px,4.2vw,84px);
    display:flex;
    align-items:center;
    position:sticky;
    top:0;
    z-index:50;
    background:rgba(255,255,255,.94);
    backdrop-filter:blur(20px);
    border-bottom:1px solid #e9eff8;
}

.pricing-header nav{
    display:flex;
    gap:42px;
    margin-left:clamp(60px,8vw,150px);
    font-size:12px;
    font-weight:800;
}

.pricing-header-right{
    margin-left:auto;
    display:flex;
    align-items:center;
    gap:30px;
}

.pricing-contact{
    padding:11px 20px;
    border-radius:24px;
    background:var(--p-blue);
    color:#fff;
    font-size:11px;
    font-weight:800;
}

.pricing-contact b{margin-left:15px}

.pricing-hero{
    min-height:570px;
    position:relative;
    overflow:hidden;
    background:
        radial-gradient(circle at 76% 38%,#dcecff 0,transparent 28%),
        linear-gradient(120deg,#fff 0,#fff 48%,#f4f9ff 100%);
    border-bottom:1px solid var(--p-line);
}

.pricing-glow{
    position:absolute;
    width:700px;
    height:700px;
    right:-80px;
    top:-150px;
    border-radius:50%;
    background:
        radial-gradient(circle,#b8d9ff 0,#e8f3ff 25%,transparent 68%);
    opacity:.55;
}

.pricing-hero:after{
    content:"AI";
    position:absolute;
    right:5%;
    bottom:-105px;
    font-size:360px;
    line-height:1;
    font-weight:900;
    letter-spacing:-35px;
    color:transparent;
    -webkit-text-stroke:1px rgba(8,116,255,.10);
}

.pricing-hero-inner{
    position:relative;
    z-index:2;
    width:min(1400px,88%);
    margin:auto;
    padding-top:105px;
}

.pricing-eyebrow,.section-kicker{
    display:block;
    color:var(--p-blue);
    font-size:10px;
    font-weight:900;
    letter-spacing:4px;
}

.pricing-hero h1{
    margin:17px 0 20px;
    font-size:clamp(48px,5vw,76px);
    line-height:.98;
    letter-spacing:-4px;
}

.pricing-hero h1 em,
.plans-heading h2 em{
    color:var(--p-blue);
    font-style:normal;
}

.pricing-hero p{
    color:var(--p-muted);
    font-size:15px;
    line-height:1.7;
}

.setup-offer{
    width:min(820px,100%);
    min-height:105px;
    margin-top:40px;
    padding:17px 22px;
    display:flex;
    align-items:center;
    gap:24px;
    border:1px solid #cfe0f6;
    border-radius:18px;
    background:rgba(255,255,255,.88);
    box-shadow:0 15px 45px rgba(39,101,180,.10);
    backdrop-filter:blur(15px);
}

.setup-left span,
.setup-free small{
    display:block;
    color:#8393a8;
    font-size:9px;
    font-weight:800;
    letter-spacing:1px;
}

.setup-left strong{
    display:block;
    margin-top:4px;
    font-size:22px;
    text-decoration:line-through;
    color:#8493a6;
}

.setup-arrow{
    font-size:25px;
    color:#9ab4d4;
}

.setup-free strong{
    display:block;
    margin-top:3px;
    color:var(--p-blue);
    font-size:23px;
}

.setup-description{
    margin-left:auto;
    max-width:260px;
    padding-left:22px;
    border-left:1px solid #dbe6f4;
    color:#667991;
    font-size:11px;
    line-height:1.55;
}

.plans-section{
    padding:100px clamp(24px,4.5vw,90px) 110px;
}

.plans-heading{
    max-width:1500px;
    margin:0 auto 48px;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
}

.plans-heading h2{
    margin:12px 0 0;
    font-size:50px;
    line-height:1;
    letter-spacing:-2.5px;
}

.plans-heading>p{
    max-width:450px;
    color:#728198;
    font-size:13px;
    line-height:1.7;
}

.plans-heading>p b{color:var(--p-blue)}

.plans-grid{
    max-width:1500px;
    margin:auto;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
    align-items:start;
}

.plan-card{
    position:relative;
    min-height:690px;
    padding:27px 25px 30px;
    border:1px solid #dce7f5;
    border-radius:20px;
    background:#fff;
    transition:.25s;
}

.plan-card:hover{
    transform:translateY(-5px);
    border-color:#a9ccfb;
    box-shadow:0 22px 55px rgba(29,86,159,.10);
}

.plan-card.premium{
    border:1.5px solid var(--p-blue);
    box-shadow:0 18px 55px rgba(8,116,255,.11);
}

.plan-card.vvip{
    color:#fff;
    border-color:#10274b;
    background:
        radial-gradient(circle at 90% 5%,#174d9d 0,transparent 30%),
        linear-gradient(150deg,#071426,#0b2348);
}

.popular{
    position:absolute;
    right:18px;
    top:18px;
    padding:6px 9px;
    border-radius:12px;
    background:#eaf3ff;
    color:var(--p-blue);
    font-size:7px;
    font-weight:900;
    letter-spacing:1px;
}

.plan-number{
    color:#9aabc0;
    font-size:9px;
    font-weight:800;
}

.plan-top h3{
    margin:13px 0 6px;
    font-size:27px;
}

.plan-top p{
    min-height:38px;
    margin:0;
    color:#708198;
    font-size:11px;
    line-height:1.5;
}

.vvip .plan-top p{color:#a9bbd2}

.plan-price{
    margin:25px 0 20px;
    padding:20px 0;
    border-top:1px solid #e7edf6;
    border-bottom:1px solid #e7edf6;
}

.vvip .plan-price{
    border-color:#284264;
}

.normal-price{
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.normal-price small,
.contract-price small{
    color:#8a9aae;
    font-size:8px;
}

.normal-price del{
    color:#8c9bad;
    font-size:12px;
}

.contract-price{
    margin-top:13px;
}

.contract-price small{
    display:block;
    margin-bottom:3px;
    color:var(--p-blue);
    font-weight:800;
}

.contract-price strong{
    font-size:35px;
    letter-spacing:-2px;
}

.contract-price strong sup{
    font-size:14px;
    vertical-align:top;
    position:relative;
    top:7px;
    margin-right:2px;
}

.contract-price span{
    margin-left:3px;
    color:#8797aa;
    font-size:9px;
}

.vat{
    margin-top:6px;
    color:#9aa7b7;
    font-size:8px;
}

.plan-cta{
    height:47px;
    padding:0 16px;
    border-radius:24px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    background:#eef5ff;
    color:#1767cf;
    font-size:11px;
    font-weight:800;
}

.premium .plan-cta{
    background:var(--p-blue);
    color:#fff;
}

.vvip .plan-cta{
    background:#fff;
    color:#071426;
}

.plan-features{
    margin-top:22px;
}

.plan-features div{
    min-height:31px;
    display:flex;
    gap:9px;
    align-items:flex-start;
    font-size:10px;
    line-height:1.45;
}

.plan-features i{
    color:var(--p-blue);
    font-style:normal;
    font-weight:900;
}

.vvip .plan-features i{color:#67a8ff}
.vvip .plan-features span{color:#d5e0ed}

.plan-story{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border-top:1px solid #e5edf7;
    border-bottom:1px solid #e5edf7;
}

.story-item{
    min-height:190px;
    padding:38px clamp(20px,3vw,55px);
    border-right:1px solid #e5edf7;
    display:flex;
    flex-direction:column;
}

.story-item:last-child{border:0}

.story-item>span{
    color:#a5b4c6;
    font-size:9px;
}

.story-item small{
    margin-top:auto;
    color:var(--p-blue);
    font-size:9px;
    font-weight:900;
    letter-spacing:2px;
}

.story-item strong{
    margin-top:7px;
    font-size:17px;
    line-height:1.35;
}

.compare-section{
    padding:105px clamp(24px,7vw,130px);
    background:#f8fbff;
}

.compare-heading{
    margin-bottom:38px;
}

.compare-heading h2{
    margin:10px 0 5px;
    font-size:43px;
    letter-spacing:-2px;
}

.compare-heading p{
    color:#74849a;
    font-size:12px;
}

.compare-wrap{
    overflow:auto;
    border:1px solid #dce7f5;
    border-radius:18px;
    background:#fff;
}

.compare-wrap table{
    width:100%;
    min-width:720px;
    border-collapse:collapse;
}

.compare-wrap th,
.compare-wrap td{
    height:54px;
    padding:0 20px;
    border-bottom:1px solid #edf2f8;
    text-align:center;
    font-size:11px;
}

.compare-wrap thead th{
    height:62px;
    color:#718298;
    font-size:9px;
    letter-spacing:1px;
}

.compare-wrap th:first-child{
    text-align:left;
}

.compare-wrap tbody th{
    color:#40546d;
    font-weight:600;
}

.compare-wrap td{
    color:var(--p-blue);
    font-weight:800;
}

.compare-wrap td:nth-child(5){
    background:#f5f9ff;
}

.pricing-final{
    min-height:350px;
    padding:70px clamp(28px,7vw,130px);
    display:flex;
    align-items:center;
    gap:45px;
    color:#fff;
    background:
        radial-gradient(circle at 15% 50%,#124d9d 0,transparent 27%),
        #06152d;
}

.final-orb{
    flex:0 0 120px;
    width:120px;
    height:120px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:
        radial-gradient(circle at 45% 38%,#fff,#6daaff 16%,#1766dc 38%,#071b40 72%);
    box-shadow:0 0 45px #1d75ff77;
}

.final-orb span{
    font-size:22px;
    font-weight:900;
}

.pricing-final h2{
    margin:9px 0;
    font-size:45px;
    letter-spacing:-2px;
}

.pricing-final p{
    max-width:600px;
    color:#9eb0c8;
    font-size:13px;
    line-height:1.7;
}

.pricing-final>a{
    margin-left:auto;
    min-width:200px;
    height:54px;
    padding:0 22px;
    border-radius:28px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    background:#0874ff;
    font-size:11px;
    font-weight:800;
}

.pricing-footer{
    min-height:130px;
    height:auto;
    padding:30px clamp(28px,5vw,90px);
}

@media(max-width:1100px){
    .plans-grid{
        grid-template-columns:1fr 1fr;
    }

    .plan-card{min-height:650px}

    .pricing-header nav{display:none}
}

@media(max-width:700px){

    .pricing-header{
        height:68px;
        padding:0 20px;
    }

    .pricing-header-right .langs{
        display:none;
    }

    .pricing-contact{
        padding:10px 16px;
    }

    .pricing-hero{
        min-height:610px;
    }

    .pricing-hero-inner{
        width:auto;
        padding:75px 22px 45px;
    }

    .pricing-hero h1{
        font-size:44px;
        letter-spacing:-2.5px;
    }

    .pricing-hero p{
        font-size:13px;
    }

    .setup-offer{
        margin-top:32px;
        padding:18px;
        display:grid;
        grid-template-columns:1fr 25px 1fr;
        gap:12px;
    }

    .setup-description{
        grid-column:1/4;
        margin:4px 0 0;
        padding:14px 0 0;
        border-left:0;
        border-top:1px solid #e2ebf6;
        max-width:none;
    }

    .plans-section{
        padding:70px 16px;
    }

    .plans-heading{
        display:block;
        margin-bottom:30px;
    }

    .plans-heading h2{
        font-size:39px;
    }

    .plans-heading>p{
        margin-top:22px;
    }

    .plans-grid{
        grid-template-columns:1fr;
        gap:13px;
    }

    .plan-card{
        min-height:0;
        padding:25px 22px;
    }

    .plan-top p{
        min-height:0;
    }

    .plan-story{
        grid-template-columns:1fr 1fr;
    }

    .story-item{
        min-height:160px;
        border-bottom:1px solid #e5edf7;
    }

    .compare-section{
        padding:70px 16px;
    }

    .compare-heading h2{
        font-size:36px;
    }

    .pricing-final{
        min-height:430px;
        padding:55px 24px;
        display:block;
    }

    .final-orb{
        width:90px;
        height:90px;
        margin-bottom:32px;
    }

    .pricing-final h2{
        font-size:38px;
    }

    .pricing-final>a{
        margin:27px 0 0;
        width:100%;
    }

    .pricing-footer{
        padding:30px 24px;
    }
}


/* =========================================================
   L2B PRICING V2
   ========================================================= */

.pricing-mobile-lang{
    display:none;
}


/* ----- discount ----- */

.contract-label-row{
    margin-top:13px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}

.contract-label-row small{
    color:var(--p-blue);
    font-size:8px;
    font-weight:900;
}

.discount-badge{
    display:inline-flex;
    align-items:center;
    height:20px;
    padding:0 8px;
    border-radius:10px;
    background:#eaf3ff;
    color:#0874ff;
    font-size:7px;
    font-weight:900;
    letter-spacing:.5px;
}

.vvip .discount-badge{
    background:#174782;
    color:#9bc8ff;
}


/* ----- annual summary ----- */

.annual-summary{
    margin-top:15px;
    padding:12px 0 3px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    border-top:1px dashed #dce6f2;
}

.annual-summary>div{
    min-width:0;
}

.annual-summary>div+div{
    padding-left:9px;
    border-left:1px solid #e3ebf5;
}

.annual-summary small{
    display:block;
    margin-bottom:4px;
    color:#96a4b5;
    font-size:7px;
}

.annual-summary b{
    display:block;
    color:#445b76;
    font-size:9px;
    white-space:nowrap;
}

.setup-free-mini em{
    color:#0874ff;
    font-style:normal;
    font-weight:900;
}

.vvip .annual-summary{
    border-color:#294665;
}

.vvip .annual-summary>div+div{
    border-color:#294665;
}

.vvip .annual-summary b{
    color:#d7e3f1;
}


/* ----- premium ----- */

.recommended-ribbon{
    position:absolute;
    top:-11px;
    left:24px;
    height:22px;
    padding:0 11px;
    display:flex;
    align-items:center;
    border-radius:11px;
    background:#0874ff;
    color:#fff;
    box-shadow:0 6px 15px rgba(8,116,255,.20);
    font-size:7px;
    font-weight:900;
}

.plan-card.premium{
    transform:translateY(-7px);
}

.plan-card.premium:hover{
    transform:translateY(-11px);
}


/* ----- comparison mobile controls ----- */

.mobile-compare-tabs{
    display:none;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:700px){

    /* header */

    .pricing-header{
        gap:10px;
    }

    .pricing-header .brand{
        flex:0 0 auto;
    }

    .pricing-mobile-lang{
        display:block;
        margin-left:auto;
    }

    .pricing-mobile-lang select{
        height:36px;
        padding:0 23px 0 10px;
        border:1px solid #dbe7f5;
        border-radius:18px;
        outline:0;
        background:#fff;
        color:#526981;
        font-size:10px;
        font-weight:800;
    }

    .pricing-header-right{
        margin-left:0;
    }


    /* HERO 압축 */

    .pricing-hero{
        min-height:500px;
    }

    .pricing-hero-inner{
        padding-top:58px;
        padding-bottom:35px;
    }

    .pricing-hero h1{
        margin-top:14px;
        font-size:40px;
        line-height:1.01;
    }

    .pricing-hero p{
        margin-top:20px;
        line-height:1.65;
    }

    .pricing-hero:after{
        right:-15%;
        bottom:-80px;
        font-size:270px;
    }


    /* setup promotion */

    .setup-offer{
        min-height:0;
        margin-top:28px;
    }

    .setup-left strong{
        font-size:19px;
    }

    .setup-free strong{
        font-size:20px;
        line-height:1.2;
        white-space:nowrap;
    }


    /* plan heading */

    .plans-section{
        padding-top:58px;
    }

    .plans-heading h2{
        font-size:36px;
        line-height:1.03;
        letter-spacing:-2px;
    }


    /* cards */

    .plans-grid{
        gap:24px;
    }

    .plan-card{
        border-radius:18px;
    }

    .plan-card.premium{
        transform:none;
        margin-top:5px;
    }

    .plan-card.premium:hover{
        transform:none;
    }

    .plan-top h3{
        font-size:25px;
    }

    .plan-price{
        margin-top:21px;
    }

    .contract-price strong{
        font-size:38px;
    }

    .discount-badge{
        height:22px;
        padding:0 9px;
        font-size:8px;
    }

    .annual-summary{
        margin-top:16px;
        padding-top:14px;
    }

    .annual-summary small{
        font-size:8px;
    }

    .annual-summary b{
        font-size:10px;
    }

    .plan-cta{
        height:51px;
        margin-top:2px;
    }

    .plan-features div{
        min-height:34px;
        font-size:11px;
    }

    .popular{
        top:20px;
    }

    .recommended-ribbon{
        left:20px;
        top:-11px;
    }


    /* story */

    .plan-story{
        margin-top:10px;
    }

    .story-item{
        padding:27px 20px;
    }

    .story-item strong{
        font-size:15px;
    }


    /* -----------------------------------------------------
       MOBILE COMPARISON
       feature + selected plan only
       ----------------------------------------------------- */

    .mobile-compare-tabs{
        display:grid;
        grid-template-columns:repeat(4,1fr);
        gap:5px;
        margin:25px 0 13px;
        padding:5px;
        border:1px solid #dbe7f5;
        border-radius:16px;
        background:#fff;
    }

    .mobile-compare-tabs button{
        height:39px;
        padding:0 3px;
        border:0;
        border-radius:12px;
        background:transparent;
        color:#77889d;
        font-size:8px;
        font-weight:900;
        cursor:pointer;
    }

    .mobile-compare-tabs button.active{
        background:#0874ff;
        color:#fff;
        box-shadow:0 5px 15px rgba(8,116,255,.18);
    }

    .compare-wrap{
        overflow:hidden;
    }

    .compare-wrap table{
        min-width:0;
        width:100%;
        table-layout:fixed;
    }

    .compare-wrap th,
    .compare-wrap td{
        padding:0 16px;
    }

    .compare-wrap thead th:first-child,
    .compare-wrap tbody th{
        width:68%;
    }

    .compare-wrap thead th:not(:first-child),
    .compare-wrap tbody td{
        display:none;
        width:32%;
    }

    #compareTable[data-mobile-plan="1"] tr>*:nth-child(2),
    #compareTable[data-mobile-plan="2"] tr>*:nth-child(3),
    #compareTable[data-mobile-plan="3"] tr>*:nth-child(4),
    #compareTable[data-mobile-plan="4"] tr>*:nth-child(5){
        display:table-cell;
    }

    .compare-wrap thead th{
        height:55px;
    }

    .compare-wrap tbody th{
        font-size:10px;
    }

    .compare-wrap tbody td{
        font-size:14px;
    }

}


/* very small */

@media(max-width:390px){

    .pricing-header{
        padding-left:16px;
        padding-right:16px;
    }

    .pricing-header .brand{
        font-size:26px;
    }

    .pricing-contact{
        padding:9px 12px;
        font-size:9px;
    }

    .pricing-contact b{
        margin-left:8px;
    }

    .pricing-mobile-lang select{
        width:54px;
        padding-left:8px;
    }

    .pricing-hero h1{
        font-size:36px;
    }

    .setup-free strong{
        font-size:18px;
    }

    .annual-summary b{
        font-size:9px;
    }

}


/* =========================================================
   L2B PRICING V2.1 — PRICE CLARITY
   ========================================================= */

.plan-price{
    margin:24px 0 20px;
    padding:19px 0 17px;
}


/* 정상 월 가격 */

.regular-price{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:10px;
    margin-bottom:18px;
}

.regular-price>span{
    color:#657991;
    font-size:10px;
    font-weight:700;
}

.regular-price>div{
    display:flex;
    align-items:baseline;
    gap:4px;
}

.regular-price del{
    color:#6f8094;
    font-size:15px;
    font-weight:800;
    text-decoration-thickness:1.5px;
}

.regular-price small{
    color:#8d9bad;
    font-size:8px;
}


/* 계약 가격 */

.contract-offer{
    padding:15px 16px 16px;
    border:1px solid #d4e5fb;
    border-radius:13px;
    background:#f6faff;
}

.contract-offer-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:7px;
}

.contract-offer-head>span{
    color:#176bd4;
    font-size:10px;
    font-weight:900;
}

.contract-offer-head>b{
    padding:5px 8px;
    border-radius:12px;
    background:#0874ff;
    color:#fff;
    font-size:8px;
    font-weight:900;
}

.main-price{
    display:flex;
    align-items:baseline;
}

.main-price sup{
    margin-right:2px;
    color:#071426;
    font-size:16px;
    font-weight:900;
}

.main-price strong{
    color:#071426;
    font-size:37px;
    line-height:1;
    letter-spacing:-2px;
}

.main-price>span{
    margin-left:5px;
    color:#708198;
    font-size:9px;
}


/* 매월 절약 */

.saving-line{
    min-height:39px;
    padding:10px 4px 8px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px dashed #dce7f4;
}

.saving-line span{
    color:#71839a;
    font-size:9px;
}

.saving-line strong{
    color:#0874ff;
    font-size:12px;
}


/* 상세 */

.price-detail{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0;
    padding-top:12px;
}

.price-detail>div{
    min-width:0;
}

.price-detail>div+div{
    padding-left:12px;
    border-left:1px solid #e2eaf4;
}

.price-detail small{
    display:block;
    min-height:22px;
    color:#8b9aad;
    font-size:8px;
    line-height:1.35;
}

.price-detail strong{
    display:block;
    margin-top:4px;
    color:#344a64;
    font-size:11px;
}

.setup-zero{
    display:flex!important;
    align-items:center;
    flex-wrap:wrap;
    gap:5px;
}

.setup-zero del{
    color:#98a6b6;
    font-size:9px;
}

.setup-zero em{
    color:#0874ff;
    font-size:13px;
    font-style:normal;
    font-weight:900;
}

.price-note{
    margin-top:11px;
    color:#9aa8b8;
    font-size:8px;
}


/* PREMIUM */

.premium .contract-offer{
    border-color:#9ec7ff;
    background:#f0f7ff;
}


/* VVIP */

.vvip .regular-price>span,
.vvip .regular-price del{
    color:#afbed0;
}

.vvip .contract-offer{
    border-color:#31577f;
    background:rgba(22,65,112,.50);
}

.vvip .contract-offer-head>span{
    color:#84baff;
}

.vvip .main-price sup,
.vvip .main-price strong{
    color:#fff;
}

.vvip .main-price>span{
    color:#a9bad0;
}

.vvip .saving-line{
    border-color:#294765;
}

.vvip .saving-line span{
    color:#9db0c7;
}

.vvip .saving-line strong{
    color:#70adff;
}

.vvip .price-detail>div+div{
    border-color:#294765;
}

.vvip .price-detail strong{
    color:#dbe6f2;
}

.vvip .setup-zero del{
    color:#91a4ba;
}

.vvip .setup-zero em{
    color:#70adff;
}


/* PC에서도 너무 작았던 기능 글씨 확대 */

.plan-features div{
    min-height:34px;
    font-size:11px;
}

.plan-features i{
    font-size:11px;
}

.plan-top p{
    font-size:12px;
}

.vat,
.price-note{
    font-size:9px;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:700px){

    .regular-price{
        margin-bottom:16px;
    }

    .regular-price>span{
        font-size:11px;
    }

    .regular-price del{
        font-size:17px;
    }

    .contract-offer{
        padding:16px;
    }

    .contract-offer-head>span{
        font-size:11px;
    }

    .contract-offer-head>b{
        padding:6px 9px;
        font-size:9px;
    }

    .main-price strong{
        font-size:42px;
    }

    .main-price sup{
        font-size:17px;
    }

    .main-price>span{
        font-size:10px;
    }

    .saving-line{
        min-height:44px;
    }

    .saving-line span{
        font-size:10px;
    }

    .saving-line strong{
        font-size:14px;
    }

    .price-detail{
        padding-top:14px;
    }

    .price-detail small{
        min-height:25px;
        font-size:9px;
    }

    .price-detail strong{
        font-size:12px;
    }

    .setup-zero del{
        font-size:10px;
    }

    .setup-zero em{
        font-size:14px;
    }

    .price-note{
        margin-top:13px;
        font-size:9px;
    }

    .plan-top p{
        font-size:12px;
    }

    .plan-features div{
        min-height:36px;
        font-size:11.5px;
    }

}


/* =========================================================
   L2B PRICING — PREMIUM BADGE VISIBILITY
   ========================================================= */

/* 가장 많이 선택하는 플랜 */
.recommended-ribbon{
    top:-15px !important;
    left:22px !important;
    height:30px !important;
    padding:0 15px !important;
    border-radius:15px !important;

    font-size:10px !important;
    font-weight:900 !important;
    letter-spacing:-.1px !important;

    background:#0874ff !important;
    color:#fff !important;

    box-shadow:
        0 7px 18px rgba(8,116,255,.24) !important;
}

/* 우측 MOST POPULAR */
.popular{
    top:18px !important;
    right:18px !important;

    min-height:25px !important;
    padding:0 10px !important;

    display:flex !important;
    align-items:center !important;

    border-radius:13px !important;

    font-size:8px !important;
    font-weight:900 !important;
    letter-spacing:.7px !important;
}

/* PREMIUM 제목과 배지가 너무 붙지 않게 */
.plan-card.premium .plan-top{
    padding-top:8px;
}


/* 모바일에서는 더 크게 */
@media(max-width:700px){

    .recommended-ribbon{
        top:-16px !important;
        left:20px !important;

        height:32px !important;
        padding:0 16px !important;

        border-radius:16px !important;

        font-size:11px !important;
    }

    .popular{
        top:19px !important;
        right:18px !important;

        min-height:27px !important;
        padding:0 10px !important;

        font-size:8.5px !important;
    }

    .plan-card.premium .plan-top{
        padding-top:12px;
    }

}


/* =========================================================
   L2B PRICING V3 — INQUIRY SYSTEM
   ========================================================= */

body.inquiry-open{
    overflow:hidden;
}


/* buttons reset */

button.pricing-contact,
button.plan-cta,
button.pricing-final-contact{
    font-family:inherit;
    cursor:pointer;
}

button.pricing-contact{
    border:0;
}

button.plan-cta{
    width:100%;
    border:0;
}

.pricing-final-contact{
    margin-left:auto;
    min-width:220px;
    height:56px;
    padding:0 23px;
    border:0;
    border-radius:28px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    background:#0874ff;
    color:#fff;

    font-size:11px;
    font-weight:900;
}


/* backdrop */

.inquiry-backdrop{
    position:fixed;
    inset:0;

    z-index:200;

    background:rgba(5,18,38,.34);
    backdrop-filter:blur(4px);

    opacity:0;
    visibility:hidden;

    transition:
        opacity .28s ease,
        visibility .28s ease;
}

.inquiry-backdrop.open{
    opacity:1;
    visibility:visible;
}


/* drawer */

.inquiry-drawer{
    position:fixed;
    right:0;
    top:0;

    z-index:201;

    width:min(540px,96vw);
    height:100dvh;

    display:flex;
    flex-direction:column;

    background:#fff;

    box-shadow:
        -30px 0 80px rgba(10,43,83,.20);

    transform:translateX(105%);

    transition:
        transform .36s cubic-bezier(.22,.8,.24,1);
}

.inquiry-drawer.open{
    transform:none;
}


/* head */

.inquiry-head{
    flex:0 0 auto;

    min-height:92px;

    padding:19px 25px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    border-bottom:1px solid #e8eef7;
}

.inquiry-head span{
    display:block;

    color:#0874ff;

    font-size:9px;
    font-weight:900;
    letter-spacing:2.5px;
}

.inquiry-head h2{
    margin:5px 0 0;

    font-size:24px;
    letter-spacing:-1px;
}

.inquiry-close{
    width:42px;
    height:42px;

    border:0;
    border-radius:50%;

    background:#f2f6fb;

    color:#23374f;

    font-size:27px;
    line-height:1;

    cursor:pointer;
}


/* body */

.inquiry-body{
    flex:1;

    overflow-y:auto;

    padding:
        20px 25px
        calc(30px + env(safe-area-inset-bottom));
}


/* intro */

.inquiry-intro{
    padding:15px;

    display:flex;
    gap:11px;

    border-radius:15px;

    background:#f5f9ff;
}

.inquiry-status-dot{
    flex:0 0 8px;

    width:8px;
    height:8px;

    margin-top:5px;

    border-radius:50%;

    background:#22c55e;

    box-shadow:
        0 0 0 5px rgba(34,197,94,.10);
}

.inquiry-intro strong{
    display:block;

    color:#28415f;

    font-size:12px;
}

.inquiry-intro p{
    margin:5px 0 0;

    color:#71849c;

    font-size:10px;
    line-height:1.55;
}


/* selected plan */

.selected-plan-box{
    margin:16px 0 20px;

    padding:17px 18px;

    position:relative;

    overflow:hidden;

    border:1px solid #cfe1f8;
    border-radius:16px;

    background:
        linear-gradient(
            130deg,
            #fff,
            #f1f7ff
        );
}

.selected-plan-box:after{
    content:"AI";

    position:absolute;

    right:-8px;
    bottom:-23px;

    color:transparent;

    font-size:75px;
    font-weight:900;

    -webkit-text-stroke:
        1px rgba(8,116,255,.08);
}

.selected-plan-box small{
    display:block;

    color:#7b8da4;

    font-size:8px;
    font-weight:900;
    letter-spacing:1.5px;
}

.selected-plan-box strong{
    display:block;

    margin-top:6px;

    color:#071426;

    font-size:22px;
}

.selected-plan-box span{
    display:block;

    margin-top:4px;

    color:#0874ff;

    font-size:11px;
    font-weight:800;
}


/* fields */

.inquiry-row{
    display:grid;
    grid-template-columns:1fr 1fr;

    gap:10px;
}

.inquiry-field{
    margin-bottom:14px;
}

.inquiry-field label{
    display:block;

    margin:0 0 7px 2px;

    color:#455c76;

    font-size:10px;
    font-weight:800;
}

.inquiry-field label b{
    color:#0874ff;
}

.inquiry-field input,
.inquiry-field textarea{
    width:100%;

    border:1px solid #d5e3f4;
    border-radius:13px;

    outline:0;

    background:#fff;

    color:#142840;

    font:inherit;
    font-size:13px;

    transition:
        border-color .2s,
        box-shadow .2s;
}

.inquiry-field input{
    height:49px;

    padding:0 14px;
}

.inquiry-field textarea{
    min-height:115px;

    padding:13px 14px;

    resize:vertical;

    line-height:1.55;
}

.inquiry-field input:focus,
.inquiry-field textarea:focus{
    border-color:#78aff8;

    box-shadow:
        0 0 0 3px rgba(8,116,255,.07);
}

.inquiry-field input::placeholder,
.inquiry-field textarea::placeholder{
    color:#a5b1c0;
}


/* honeypot */

.inquiry-hp{
    position:absolute!important;

    width:1px!important;
    height:1px!important;

    left:-10000px!important;

    opacity:0!important;

    pointer-events:none!important;
}


/* agree */

.inquiry-agree{
    margin:2px 1px 14px;

    display:flex;
    align-items:flex-start;
    gap:8px;

    color:#6d7e93;

    font-size:10px;
    line-height:1.45;

    cursor:pointer;
}

.inquiry-agree input{
    margin-top:1px;

    accent-color:#0874ff;
}


/* errors */

.inquiry-error{
    min-height:18px;

    margin-bottom:6px;

    color:#d74242;

    font-size:10px;
}


/* submit */

.inquiry-submit{
    width:100%;
    height:56px;

    padding:0 19px;

    border:0;
    border-radius:28px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    background:#0874ff;

    color:#fff;

    font-size:12px;
    font-weight:900;

    box-shadow:
        0 12px 28px rgba(8,116,255,.20);

    cursor:pointer;
}

.inquiry-submit:disabled{
    opacity:.55;
    cursor:wait;
}

.inquiry-submit b{
    font-size:18px;
}


/* success */

.inquiry-success{
    padding:70px 15px 30px;

    text-align:center;
}

.success-mark{
    width:66px;
    height:66px;

    margin:0 auto 23px;

    display:grid;
    place-items:center;

    border-radius:50%;

    background:#eaf4ff;

    color:#0874ff;

    font-size:28px;
    font-weight:900;
}

.inquiry-success>span{
    color:#0874ff;

    font-size:9px;
    font-weight:900;
    letter-spacing:2px;
}

.inquiry-success h3{
    margin:12px 0;

    color:#071426;

    font-size:32px;
    line-height:1.08;

    letter-spacing:-1.5px;
}

.inquiry-success p{
    color:#718198;

    font-size:12px;
    line-height:1.6;
}

.inquiry-success small{
    display:block;

    margin-top:18px;

    color:#8798ac;

    font-size:9px;
}

.inquiry-success button{
    width:170px;
    height:48px;

    margin-top:25px;

    border:0;
    border-radius:24px;

    background:#0874ff;

    color:#fff;

    font-weight:900;

    cursor:pointer;
}


/* mobile sticky CTA */

.mobile-pricing-cta{
    display:none;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:700px){

    .inquiry-drawer{
        width:100vw;
        max-width:none;
    }

    .inquiry-head{
        min-height:78px;

        padding:
            14px 19px;
    }

    .inquiry-head h2{
        font-size:21px;
    }

    .inquiry-body{
        padding:
            17px 18px
            calc(100px + env(safe-area-inset-bottom));
    }

    .inquiry-intro{
        padding:14px;
    }

    .inquiry-intro strong{
        font-size:11px;
    }

    .inquiry-intro p{
        font-size:9.5px;
    }

    .selected-plan-box{
        margin-top:13px;
    }

    .selected-plan-box strong{
        font-size:21px;
    }

    .inquiry-row{
        grid-template-columns:1fr;
        gap:0;
    }

    .inquiry-field{
        margin-bottom:12px;
    }

    .inquiry-field label{
        font-size:10.5px;
    }

    .inquiry-field input{
        height:51px;

        font-size:16px;
    }

    .inquiry-field textarea{
        font-size:16px;
    }

    .inquiry-agree{
        font-size:10px;
    }

    .pricing-final-contact{
        width:100%;

        margin:27px 0 0;
    }


    /* sticky */

    .mobile-pricing-cta{
        position:fixed;

        left:10px;
        right:10px;
        bottom:
            calc(
                10px +
                env(safe-area-inset-bottom)
            );

        z-index:80;

        min-height:66px;

        padding:9px 9px 9px 15px;

        display:flex;
        align-items:center;
        justify-content:space-between;

        border:1px solid rgba(201,220,244,.9);
        border-radius:20px;

        background:
            rgba(255,255,255,.94);

        backdrop-filter:blur(18px);

        box-shadow:
            0 14px 40px
            rgba(22,61,110,.17);
    }

    .mobile-pricing-cta small{
        display:block;

        color:#0874ff;

        font-size:7px;
        font-weight:900;
        letter-spacing:1.4px;
    }

    .mobile-pricing-cta strong{
        display:block;

        margin-top:3px;

        color:#071426;

        font-size:12px;
    }

    .mobile-pricing-cta button{
        height:47px;

        padding:0 16px;

        border:0;
        border-radius:24px;

        background:#0874ff;

        color:#fff;

        font-size:10px;
        font-weight:900;

        cursor:pointer;
    }

    .mobile-pricing-cta button span{
        margin-left:8px;
    }

    body.inquiry-open
    .mobile-pricing-cta{
        display:none;
    }

    .pricing-footer{
        padding-bottom:
            calc(
                115px +
                env(safe-area-inset-bottom)
            );
    }

}


/* =========================================================
   PRICING V3 · AI SALES EXPERIENCE
   ========================================================= */

.pricing-ai{
    padding:110px 24px;

    background:
        radial-gradient(
            circle at 82% 15%,
            rgba(38,128,255,.22),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #071424,
            #0a1d32 60%,
            #092541
        );

    color:#fff;
}


.pricing-ai-shell{
    width:min(1240px,100%);
    margin:auto;

    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:70px;
    align-items:center;
}


.pricing-ai-eyebrow{
    color:#61a9ff;

    font-size:12px;
    font-weight:900;
    letter-spacing:1.5px;
}


.pricing-ai-copy h2{
    margin:17px 0;

    font-size:48px;
    line-height:1.12;
    letter-spacing:-2px;
}


.pricing-ai-copy h2 em{
    color:#55a6ff;
    font-style:normal;
}


.pricing-ai-copy>p{
    max-width:520px;

    color:#aebfd0;

    font-size:16px;
    line-height:1.8;
}


.pricing-ai-suggestions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;

    margin-top:28px;
}


.pricing-ai-suggestions button{
    padding:10px 13px;

    border:1px solid
        rgba(255,255,255,.13);

    border-radius:999px;

    background:
        rgba(255,255,255,.055);

    color:#c9d8e6;

    font:inherit;
    font-size:12px;

    cursor:pointer;
}


.pricing-ai-suggestions button:hover{
    border-color:#3e9cff;
    color:#fff;
}


/* AI Console */

.pricing-ai-console{
    overflow:hidden;

    border:1px solid
        rgba(108,173,255,.24);

    border-radius:24px;

    background:
        rgba(6,18,32,.78);

    box-shadow:
        0 30px 90px
        rgba(0,0,0,.32);

    backdrop-filter:blur(20px);
}


.pricing-ai-console-head{
    display:flex;
    align-items:center;
    justify-content:space-between;

    padding:17px 20px;

    border-bottom:1px solid
        rgba(255,255,255,.08);
}


.pricing-ai-console-head>div{
    display:flex;
    align-items:center;
    gap:10px;
}


.pricing-ai-console-head>div>span{
    width:9px;
    height:9px;

    border-radius:50%;

    background:#34d399;

    box-shadow:
        0 0 15px #34d399;
}


.pricing-ai-console-head small{
    display:block;

    color:#66809a;

    font-size:8px;
    font-weight:900;
    letter-spacing:1px;
}


.pricing-ai-console-head strong{
    display:block;

    margin-top:2px;

    font-size:13px;
}


.pricing-ai-console-head>b{
    color:#34d399;

    font-size:9px;
    letter-spacing:1px;
}


.pricing-ai-messages{
    height:360px;

    overflow-y:auto;

    padding:22px;

    scroll-behavior:smooth;
}


.pricing-ai-message{
    max-width:88%;

    margin-bottom:16px;
}


.pricing-ai-message.user{
    margin-left:auto;
}


.pricing-ai-message small{
    display:block;

    margin-bottom:5px;

    color:#5980a6;

    font-size:8px;
    font-weight:900;
    letter-spacing:1px;
}


.pricing-ai-message p{
    margin:0;

    padding:12px 14px;

    border-radius:
        4px 15px 15px 15px;

    background:
        rgba(255,255,255,.07);

    color:#dce8f3;

    font-size:13px;
    line-height:1.7;
}


.pricing-ai-message.user p{
    border-radius:
        15px 4px 15px 15px;

    background:#0874ff;
    color:#fff;
}


.pricing-ai-message.user small{
    text-align:right;
}


.pricing-ai-actions{
    display:flex;
    flex-wrap:wrap;
    gap:7px;

    margin-top:8px;
}


.pricing-ai-actions button{
    padding:8px 11px;

    border:1px solid
        rgba(72,157,255,.35);

    border-radius:8px;

    background:
        rgba(8,116,255,.12);

    color:#79b7ff;

    font:inherit;
    font-size:10px;
    font-weight:800;

    cursor:pointer;
}


.pricing-ai-form{
    display:flex;
    gap:8px;

    margin:0 15px 15px;
    padding:7px;

    border:1px solid
        rgba(255,255,255,.11);

    border-radius:16px;

    background:
        rgba(255,255,255,.055);
}


.pricing-ai-form textarea{
    flex:1;

    min-height:44px;
    max-height:130px;

    padding:11px 10px;

    border:0;
    outline:0;

    resize:none;

    background:transparent;

    color:#fff;

    font:inherit;
    font-size:13px;
    line-height:1.5;
}


.pricing-ai-form textarea::placeholder{
    color:#64798d;
}


.pricing-ai-form button{
    align-self:flex-end;

    width:44px;
    height:44px;

    border:0;
    border-radius:12px;

    background:#0874ff;
    color:#fff;

    font-size:20px;

    cursor:pointer;
}


.pricing-ai-foot{
    padding:0 20px 15px;

    color:#587086;

    text-align:center;

    font-size:9px;
}


.pricing-ai-message.thinking p{
    display:flex;
    gap:4px;
    width:max-content;
}


.pricing-ai-message.thinking p span{
    width:5px;
    height:5px;

    border-radius:50%;
    background:#67aefb;

    animation:
        pricingThinking 1s infinite alternate;
}


.pricing-ai-message.thinking p span:nth-child(2){
    animation-delay:.15s;
}


.pricing-ai-message.thinking p span:nth-child(3){
    animation-delay:.3s;
}


@keyframes pricingThinking{
    to{
        opacity:.25;
        transform:translateY(-3px);
    }
}


/* =========================================================
   USE CASES
   ========================================================= */

.pricing-cases{
    width:min(1240px,calc(100% - 48px));

    margin:auto;

    padding:120px 0;
}


.pricing-cases-head{
    display:grid;
    grid-template-columns:1.25fr .75fr;
    gap:60px;

    margin-bottom:50px;
}


.pricing-cases-head small,
.pricing-case-copy>small{
    color:#0874ff;

    font-size:10px;
    font-weight:900;
    letter-spacing:1.4px;
}


.pricing-cases-head h2{
    margin:10px 0 0;

    font-size:40px;
    line-height:1.2;
    letter-spacing:-1.5px;
}


.pricing-cases-head h2 em{
    color:#0874ff;
    font-style:normal;
}


.pricing-cases-head>p{
    align-self:end;

    margin:0;

    color:#73869a;

    font-size:13px;
    line-height:1.8;
}


.pricing-case{
    position:relative;

    padding:28px;

    border:1px solid #e0e9f1;
    border-radius:22px;

    background:#fff;
}


.pricing-case.featured{
    display:grid;
    grid-template-columns:50px 1fr 1.15fr;
    gap:30px;

    padding:38px;

    margin-bottom:14px;
}


.pricing-case-number{
    color:#a6b5c3;

    font-size:11px;
    font-weight:900;
}


.pricing-case-copy h3{
    margin:9px 0 12px;

    color:#223c54;

    font-size:24px;
    line-height:1.25;
}


.pricing-case-copy p{
    margin:0;

    color:#718598;

    font-size:13px;
    line-height:1.75;
}


.pricing-case-tags{
    display:flex;
    flex-wrap:wrap;
    gap:6px;

    margin-top:18px;
}


.pricing-case-tags span{
    padding:6px 8px;

    border-radius:7px;

    background:#f0f7ff;
    color:#0874ff;

    font-size:9px;
    font-weight:800;
}


.pricing-case-flow{
    display:flex;
    align-items:center;
    gap:13px;

    padding:24px;

    border-radius:17px;

    background:#f5f9fd;
}


.pricing-case-flow>div{
    flex:1;
}


.pricing-case-flow small{
    display:block;

    margin-bottom:10px;

    color:#8194a6;

    font-size:9px;
    font-weight:900;
}


.pricing-case-flow strong,
.pricing-case-flow span{
    display:inline-block;

    color:#4a6175;

    font-size:11px;
}


.pricing-case-flow span{
    margin:0 5px;
}


.pricing-case-flow .after small,
.pricing-case-flow .after strong{
    color:#0874ff;
}


.pricing-case-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
}


.pricing-before-after{
    display:grid;
    grid-template-columns:1fr 120px 1fr;
    gap:30px;
    align-items:center;

    margin-top:60px;
    padding:38px;

    border-radius:24px;

    background:#07182a;
    color:#fff;
}


.pricing-before-after small{
    color:#607d99;

    font-size:9px;
    font-weight:900;
}


.pricing-before-after h3{
    margin:8px 0 17px;

    font-size:22px;
}


.pricing-before-after ul{
    margin:0;
    padding-left:18px;

    color:#91a6ba;

    font-size:12px;
    line-height:2;
}


.pricing-before-after .after h3{
    color:#66adff;
}


.pricing-transform{
    text-align:center;
}


.pricing-transform span{
    display:block;

    color:#4e83b9;

    font-size:28px;
}


.pricing-transform strong{
    display:block;

    margin-top:8px;

    color:#5da9ff;

    font-size:11px;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width:900px){

    .pricing-ai{
        padding:80px 20px;
    }

    .pricing-ai-shell{
        grid-template-columns:1fr;
        gap:45px;
    }

    .pricing-ai-copy h2{
        font-size:40px;
    }

    .pricing-cases-head{
        grid-template-columns:1fr;
        gap:20px;
    }

    .pricing-case.featured{
        grid-template-columns:40px 1fr;
    }

    .pricing-case-flow{
        grid-column:1/-1;
    }

    .pricing-case-grid{
        grid-template-columns:1fr;
    }

}


@media(max-width:600px){

    .pricing-ai{
        padding:65px 16px;
    }

    .pricing-ai-copy h2{
        font-size:32px;
        letter-spacing:-1px;
    }

    .pricing-ai-messages{
        height:330px;
        padding:16px;
    }

    .pricing-ai-message{
        max-width:94%;
    }

    .pricing-cases{
        width:calc(100% - 32px);
        padding:80px 0;
    }

    .pricing-cases-head h2{
        font-size:31px;
    }

    .pricing-case.featured{
        display:block;
        padding:25px;
    }

    .pricing-case.featured
    .pricing-case-number{
        margin-bottom:18px;
    }

    .pricing-case-flow{
        margin-top:25px;

        flex-direction:column;
        align-items:stretch;
    }

    .pricing-case-flow>b{
        text-align:center;
    }

    .pricing-before-after{
        grid-template-columns:1fr;
        gap:25px;

        padding:28px;
    }

    .pricing-transform span{
        transform:rotate(90deg);
    }

}


/* =========================================================
   PRICING V3.1 FINAL POLISH
   ========================================================= */


/* AI section transition */

.pricing-ai{
    position:relative;

    padding-top:125px;
    padding-bottom:125px;

    border-top:1px solid #e4edf6;
}


.pricing-ai::before{
    content:"";

    position:absolute;
    left:0;
    right:0;
    top:0;

    height:90px;

    pointer-events:none;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.07),
            transparent
        );
}


/* Give the AI product more visual weight */

.pricing-ai-shell{
    grid-template-columns:
        minmax(360px,.82fr)
        minmax(560px,1.18fr);

    gap:78px;
}


.pricing-ai-console{
    min-height:510px;
}


.pricing-ai-messages{
    height:385px;
}


.pricing-ai-message p{
    font-size:14px;
    line-height:1.75;
}


.pricing-ai-message.assistant p strong{
    color:#fff;
    font-weight:900;
}


.pricing-ai-line{
    display:block;
}


.pricing-ai-message p ul{
    margin:7px 0 9px;
    padding-left:19px;
}


.pricing-ai-message p li{
    margin:4px 0;
    color:#dce8f3;
}


.pricing-ai-message p br + br{
    display:none;
}


/* Suggestions */

.pricing-ai-suggestions button{
    min-height:38px;
    padding:9px 14px;

    font-size:12px;
}


/* ---------------------------------------------------------
   Use Case heading disclosure
   --------------------------------------------------------- */

.pricing-cases-head{
    position:relative;
}


.pricing-case-disclosure{
    grid-column:1/-1;

    width:max-content;
    max-width:100%;

    margin-top:-25px;

    padding:7px 10px;

    border:1px solid #dce9f7;
    border-radius:999px;

    background:#f6faff;
    color:#64809a;

    font-size:10px;
    font-weight:800;
}


/* ---------------------------------------------------------
   Real customer question examples
   --------------------------------------------------------- */

.pricing-case-question{
    margin-top:19px;
    padding:13px 14px;

    border-left:2px solid #1680ff;
    border-radius:0 10px 10px 0;

    background:#f7faff;
}


.pricing-case-question small{
    display:block;

    margin-bottom:7px;

    color:#1680ff;

    font-size:8px;
    font-weight:900;
    letter-spacing:1px;
}


.pricing-case-question strong{
    display:block;

    margin:4px 0;

    color:#3b5268;

    font-size:11px;
    line-height:1.45;
}


/* ---------------------------------------------------------
   Commerce flow
   --------------------------------------------------------- */

.pricing-case-flow{
    min-height:165px;

    padding:27px 25px;

    gap:18px;
}


.pricing-case-flow>div{
    padding:5px;
}


.pricing-case-flow small{
    margin-bottom:14px;

    font-size:9px;
    letter-spacing:.7px;
}


.pricing-case-flow strong{
    padding:7px 9px;

    border-radius:8px;

    background:#fff;

    box-shadow:
        0 4px 14px
        rgba(22,61,99,.055);

    font-size:11px;
}


.pricing-case-flow .after strong{
    background:#eaf4ff;
}


.pricing-case-flow> b{
    color:#1680ff;
    font-size:18px;
}


/* ---------------------------------------------------------
   Before / After
   --------------------------------------------------------- */

.pricing-before-after{
    min-height:190px;

    padding:44px 42px;

    box-shadow:
        0 24px 70px
        rgba(7,24,42,.11);
}


.pricing-before-after h3{
    font-size:24px;
    line-height:1.35;
}


.pricing-transform span{
    font-size:38px;
    color:#55a7ff;
}


.pricing-transform strong{
    margin-top:10px;

    font-size:12px;
    letter-spacing:.8px;
}


/* ---------------------------------------------------------
   Desktop visual balance
   --------------------------------------------------------- */

@media(min-width:1200px){

    .pricing-ai-copy h2{
        font-size:52px;
    }

    .pricing-ai-copy>p{
        font-size:17px;
    }

}


/* ---------------------------------------------------------
   Tablet
   --------------------------------------------------------- */

@media(max-width:1050px){

    .pricing-ai-shell{
        grid-template-columns:1fr;
        gap:48px;
    }

    .pricing-ai-console{
        min-height:auto;
    }

    .pricing-ai-messages{
        height:370px;
    }

}


/* ---------------------------------------------------------
   Mobile
   --------------------------------------------------------- */

@media(max-width:600px){

    .pricing-ai{
        padding-top:72px;
        padding-bottom:72px;
    }

    .pricing-ai-shell{
        display:block;
    }

    .pricing-ai-console{
        margin-top:38px;

        border-radius:19px;
    }

    .pricing-ai-messages{
        height:350px;
    }

    .pricing-ai-message p{
        font-size:13px;
    }

    .pricing-ai-suggestions{
        display:grid;
        grid-template-columns:1fr 1fr;
    }

    .pricing-ai-suggestions button{
        width:100%;
    }

    .pricing-case-disclosure{
        width:auto;
        margin-top:0;
    }

    .pricing-case-question strong{
        font-size:11px;
    }

    .pricing-before-after{
        min-height:0;
        padding:29px 25px;
    }

}


/* =========================================================
   PRICING V3.2 · AI CHAT UX FINAL
   ========================================================= */


/* Desktop console */

.pricing-ai-console{
    min-height:0 !important;
}


.pricing-ai-messages{
    height:auto !important;
    min-height:250px;
    max-height:430px;

    overflow-y:auto;

    scrollbar-width:thin;
    scrollbar-color:
        rgba(105,160,215,.45)
        transparent;
}


.pricing-ai-messages::-webkit-scrollbar{
    width:5px;
}


.pricing-ai-messages::-webkit-scrollbar-track{
    background:transparent;
}


.pricing-ai-messages::-webkit-scrollbar-thumb{
    border-radius:10px;
    background:rgba(105,160,215,.38);
}


/* More readable answer */

.pricing-ai-message{
    max-width:92%;
}


.pricing-ai-message.assistant{
    max-width:94%;
}


.pricing-ai-message p{
    padding:14px 16px;

    font-size:13px !important;
    line-height:1.72;
}


.pricing-ai-message p ul{
    margin:8px 0 10px;
    padding-left:20px;
}


.pricing-ai-message p li{
    margin:5px 0;
    line-height:1.55;
}


.pricing-ai-message p strong{
    display:inline;
    line-height:1.55;
}


/* Input must never show its own scrollbar */

.pricing-ai-form textarea{
    overflow-y:hidden !important;

    min-height:44px;
    max-height:92px !important;

    scrollbar-width:none;
}


.pricing-ai-form textarea::-webkit-scrollbar{
    display:none;
}


/* Action buttons */

.pricing-ai-actions{
    margin-top:11px;
}


.pricing-ai-actions button{
    min-height:34px;

    padding:8px 12px;

    font-size:10px;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:600px){

    .pricing-ai{
        padding:
            68px 16px
            58px !important;
    }


    .pricing-ai-copy h2{
        max-width:390px;

        font-size:34px !important;
        line-height:1.12 !important;
        letter-spacing:-1.3px !important;

        word-break:keep-all;
    }


    .pricing-ai-copy>p{
        font-size:14px !important;
        line-height:1.75;

        word-break:keep-all;
    }


    .pricing-ai-suggestions{
        gap:8px;
        margin-top:27px;
    }


    .pricing-ai-suggestions button{
        min-height:39px;

        padding:8px 9px;

        font-size:11px;
    }


    .pricing-ai-console{
        margin-top:38px;

        border-radius:18px;
    }


    .pricing-ai-console-head{
        padding:15px 16px;
    }


    .pricing-ai-messages{
        min-height:180px !important;
        max-height:390px !important;

        padding:15px !important;
    }


    .pricing-ai-message{
        max-width:100% !important;
    }


    .pricing-ai-message p{
        padding:12px 13px;

        font-size:13px !important;
        line-height:1.65;
    }


    .pricing-ai-message p ul{
        padding-left:18px;
    }


    .pricing-ai-message p li{
        margin:4px 0;
    }


    .pricing-ai-form{
        margin:
            0 14px
            13px;

        padding:6px;
    }


    .pricing-ai-form textarea{
        min-width:0;
        height:44px !important;
        min-height:44px !important;
        max-height:72px !important;

        padding:11px 8px;

        overflow:hidden !important;

        font-size:12px !important;
    }


    .pricing-ai-form button{
        flex:0 0 44px;

        width:44px;
        height:44px;
    }


    .pricing-ai-foot{
        padding-bottom:14px;

        font-size:8px;
    }

}


/* =========================================================
   PRICING V3.2 · AI CHAT UX FINAL
   ========================================================= */

.pricing-ai-console{
    min-height:0 !important;
}

.pricing-ai-messages{
    height:auto !important;
    min-height:250px;
    max-height:430px;
    overflow-y:auto;
    scrollbar-width:thin;
    scrollbar-color:rgba(105,160,215,.45) transparent;
}

.pricing-ai-messages::-webkit-scrollbar{
    width:5px;
}

.pricing-ai-messages::-webkit-scrollbar-track{
    background:transparent;
}

.pricing-ai-messages::-webkit-scrollbar-thumb{
    border-radius:10px;
    background:rgba(105,160,215,.38);
}

.pricing-ai-message{
    max-width:92%;
}

.pricing-ai-message.assistant{
    max-width:94%;
}

.pricing-ai-message p{
    padding:14px 16px;
    font-size:13px !important;
    line-height:1.72;
}

.pricing-ai-message p ul{
    margin:8px 0 10px;
    padding-left:20px;
}

.pricing-ai-message p li{
    margin:5px 0;
    line-height:1.55;
}

.pricing-ai-message p strong{
    display:inline;
    line-height:1.55;
}

.pricing-ai-form textarea{
    overflow-y:hidden !important;
    min-height:44px;
    max-height:92px !important;
    scrollbar-width:none;
}

.pricing-ai-form textarea::-webkit-scrollbar{
    display:none;
}

.pricing-ai-actions{
    margin-top:11px;
}

.pricing-ai-actions button{
    min-height:34px;
    padding:8px 12px;
    font-size:10px;
}


/* MOBILE */

@media(max-width:600px){

    .pricing-ai{
        padding:68px 16px 58px !important;
    }

    .pricing-ai-copy h2{
        max-width:390px;
        font-size:34px !important;
        line-height:1.12 !important;
        letter-spacing:-1.3px !important;
        word-break:keep-all;
    }

    .pricing-ai-copy>p{
        font-size:14px !important;
        line-height:1.75;
        word-break:keep-all;
    }

    .pricing-ai-suggestions{
        gap:8px;
        margin-top:27px;
    }

    .pricing-ai-suggestions button{
        min-height:39px;
        padding:8px 9px;
        font-size:11px;
    }

    .pricing-ai-console{
        margin-top:38px;
        border-radius:18px;
    }

    .pricing-ai-console-head{
        padding:15px 16px;
    }

    .pricing-ai-messages{
        min-height:180px !important;
        max-height:390px !important;
        padding:15px !important;
    }

    .pricing-ai-message{
        max-width:100% !important;
    }

    .pricing-ai-message p{
        padding:12px 13px;
        font-size:13px !important;
        line-height:1.65;
    }

    .pricing-ai-message p ul{
        padding-left:18px;
    }

    .pricing-ai-message p li{
        margin:4px 0;
    }

    .pricing-ai-form{
        margin:0 14px 13px;
        padding:6px;
    }

    .pricing-ai-form textarea{
        min-width:0;
        height:44px !important;
        min-height:44px !important;
        max-height:72px !important;
        padding:11px 8px;
        overflow:hidden !important;
        font-size:12px !important;
    }

    .pricing-ai-form button{
        flex:0 0 44px;
        width:44px;
        height:44px;
    }

    .pricing-ai-foot{
        padding-bottom:14px;
        font-size:8px;
    }
}


/* =========================================================
   PRICING V3.3 · KOREAN TYPOGRAPHY / WRAP FIX
   ========================================================= */

/*
 * Korean copy should wrap by words, not individual syllables.
 * Do not globally shrink typography to solve wrapping.
 */

.pricing-ai-copy h2,
.pricing-ai-copy > p,

.pricing-cases-head h2,
.pricing-cases-head > p,

.pricing-case-copy h3,
.pricing-case-copy p,

.pricing-case-question strong,

.pricing-before-after h3,
.pricing-before-after li,

.plan-story h2,
.plan-story h3,
.plan-story p,

.plan-card h2,
.plan-card h3,
.plan-card p,

.final-cta h2,
.final-cta p{
    word-break:keep-all !important;
    overflow-wrap:normal;
}


/* ---------------------------------------------------------
   AI hero
   --------------------------------------------------------- */

.pricing-ai-copy{
    min-width:0;
}

.pricing-ai-copy h2{
    max-width:620px;
}


/* ---------------------------------------------------------
   Use case heading
   --------------------------------------------------------- */

.pricing-cases-head{
    grid-template-columns:
        minmax(0,1.35fr)
        minmax(300px,.65fr);
}

.pricing-cases-head > div{
    min-width:0;
}

.pricing-cases-head h2{
    max-width:720px;
}


/* ---------------------------------------------------------
   Use case cards
   --------------------------------------------------------- */

.pricing-case-copy{
    min-width:0;
}

.pricing-case-copy h3{
    letter-spacing:-.45px;
}

.pricing-case-grid{
    grid-template-columns:
        repeat(3,minmax(0,1fr));
}

.pricing-case-grid .pricing-case{
    min-width:0;
}


/*
 * The three lower cards were losing the last Korean syllable.
 * Give headings a little more usable horizontal room.
 */

.pricing-case-grid .pricing-case{
    padding-left:24px;
    padding-right:24px;
}

.pricing-case-grid .pricing-case-copy h3{
    font-size:22px;
    line-height:1.32;
}


/* Customer question text */

.pricing-case-question{
    overflow:hidden;
}

.pricing-case-question strong{
    width:100%;
}


/* ---------------------------------------------------------
   Before / After
   --------------------------------------------------------- */

.pricing-before-after > div{
    min-width:0;
}

.pricing-before-after h3{
    word-break:keep-all !important;
}


/* ---------------------------------------------------------
   AI answer typography
   --------------------------------------------------------- */

.pricing-ai-message p,
.pricing-ai-message li,
.pricing-ai-message strong,
.pricing-ai-message .pricing-ai-line{
    word-break:keep-all !important;
    overflow-wrap:break-word;
}


/* ---------------------------------------------------------
   Medium desktop
   --------------------------------------------------------- */

@media(max-width:1250px) and (min-width:901px){

    .pricing-case-grid{
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }

    .pricing-case-grid .pricing-case-copy h3{
        font-size:20px;
    }

}


/* ---------------------------------------------------------
   Tablet
   --------------------------------------------------------- */

@media(max-width:900px){

    .pricing-cases-head{
        grid-template-columns:1fr;
    }

    .pricing-case-grid{
        grid-template-columns:1fr;
    }

    .pricing-case-grid .pricing-case-copy h3{
        font-size:23px;
    }

}


/* ---------------------------------------------------------
   Mobile
   --------------------------------------------------------- */

@media(max-width:600px){

    .pricing-ai-copy h2{
        max-width:none;

        font-size:32px !important;
        line-height:1.18 !important;

        word-break:keep-all !important;
    }

    .pricing-ai-copy > p{
        word-break:keep-all !important;
    }

    .pricing-cases-head h2{
        font-size:30px;
        line-height:1.24;

        word-break:keep-all !important;
    }

    .pricing-case-copy h3{
        font-size:21px !important;
        line-height:1.35;

        word-break:keep-all !important;
    }

    .pricing-case-copy p{
        word-break:keep-all !important;
    }

    .pricing-case-question strong{
        word-break:keep-all !important;
    }

    .pricing-before-after h3{
        font-size:22px;
        word-break:keep-all !important;
    }

}


/* Very narrow phones */

@media(max-width:390px){

    .pricing-ai-copy h2{
        font-size:30px !important;
        letter-spacing:-1px !important;
    }

    .pricing-case-copy h3{
        font-size:20px !important;
    }

}


/* =========================================================
   PRICING V3.4 · AI FIRST + MOBILE PLAN COMPACT
   ========================================================= */


/* Toggle exists only for mobile */

.mobile-plan-toggle{
    display:none;
}


/* AI now acts as the primary consultation experience */

.pricing-hero + .pricing-ai{
    border-top:1px solid #e5edf6;
}


/* =========================================================
   MOBILE PLAN COMPACT
   ========================================================= */

@media(max-width:700px){

    /*
     * Previous CSS versions imposed large minimum heights.
     * Mobile cards should size themselves by content.
     */

    .plans-grid{
        gap:14px !important;
    }

    .plan-card{
        min-height:0 !important;
        height:auto !important;

        padding:
            25px 20px
            20px !important;

        border-radius:18px;
    }


    .plan-top{
        margin-bottom:20px !important;
    }

    .plan-top h3{
        margin-top:8px;
        margin-bottom:5px;

        font-size:25px !important;
        line-height:1.15;
    }

    .plan-top p{
        margin:0;

        font-size:12px !important;
        line-height:1.55;
    }


    /* Price block */

    .plan-price{
        margin-top:0 !important;
    }

    .regular-price{
        padding-bottom:12px !important;
    }

    .contract-offer{
        padding:14px 15px !important;
        margin-top:10px !important;
    }

    .contract-offer-head{
        margin-bottom:8px !important;
    }

    .main-price strong{
        font-size:32px !important;
    }

    .saving-line{
        padding:
            11px 2px !important;
    }


    /*
     * Secondary price information is useful,
     * but does not need excessive vertical space.
     */

    .price-detail{
        gap:8px !important;
        margin-top:4px !important;
    }

    .price-detail > div{
        min-height:0 !important;
        padding:10px 8px !important;
    }

    .price-detail small{
        font-size:8px !important;
        line-height:1.35;
    }

    .price-detail strong{
        margin-top:4px;
        font-size:11px !important;
    }


    /* Feature list */

    .plan-features{
        position:relative;

        margin-top:15px !important;

        max-height:148px;
        overflow:hidden;

        transition:
            max-height .38s ease;
    }

    .plan-features::after{
        content:"";

        position:absolute;
        left:0;
        right:0;
        bottom:0;

        height:40px;

        pointer-events:none;

        background:
            linear-gradient(
                to bottom,
                rgba(255,255,255,0),
                rgba(255,255,255,1)
            );
    }

    .plan-card.vvip .plan-features::after{
        background:
            linear-gradient(
                to bottom,
                rgba(12,43,82,0),
                rgba(12,43,82,1)
            );
    }

    .plan-features div{
        min-height:0 !important;

        padding:
            7px 0 !important;

        font-size:11px !important;
        line-height:1.4;
    }


    /* Expanded state */

    .plan-card.mobile-features-open
    .plan-features{
        max-height:1200px;
    }

    .plan-card.mobile-features-open
    .plan-features::after{
        display:none;
    }


    /* Toggle */

    .mobile-plan-toggle{
        display:flex;

        width:100%;

        align-items:center;
        justify-content:space-between;

        margin-top:13px;
        padding:11px 13px;

        border:1px solid #dbe8f5;
        border-radius:11px;

        background:#f6faff;
        color:#126ee8;

        font-family:inherit;
        font-size:11px;
        font-weight:800;

        cursor:pointer;
    }

    .mobile-plan-toggle b{
        font-size:16px;
        font-weight:500;
        line-height:1;

        transition:
            transform .25s ease;
    }

    .plan-card.mobile-features-open
    .mobile-plan-toggle b{
        transform:rotate(45deg);
    }


    .plan-card.vvip .mobile-plan-toggle{
        border-color:
            rgba(100,165,255,.25);

        background:
            rgba(30,111,222,.12);

        color:#75b3ff;
    }


    /*
     * Keep CTA compact but clearly visible.
     */

    .plan-card .plan-cta,
    .plan-card .plan-button{
        margin-top:16px !important;
    }

}


/* Narrow mobile */

@media(max-width:390px){

    .plan-card{
        padding:
            22px 17px
            18px !important;
    }

    .main-price strong{
        font-size:29px !important;
    }

}


/* =========================================================
   PRICING V3.4 · AI FIRST + MOBILE PLAN COMPACT
   ========================================================= */


/* Toggle exists only for mobile */

.mobile-plan-toggle{
    display:none;
}


/* AI now acts as the primary consultation experience */

.pricing-hero + .pricing-ai{
    border-top:1px solid #e5edf6;
}


/* =========================================================
   MOBILE PLAN COMPACT
   ========================================================= */

@media(max-width:700px){

    /*
     * Previous CSS versions imposed large minimum heights.
     * Mobile cards should size themselves by content.
     */

    .plans-grid{
        gap:14px !important;
    }

    .plan-card{
        min-height:0 !important;
        height:auto !important;

        padding:
            25px 20px
            20px !important;

        border-radius:18px;
    }


    .plan-top{
        margin-bottom:20px !important;
    }

    .plan-top h3{
        margin-top:8px;
        margin-bottom:5px;

        font-size:25px !important;
        line-height:1.15;
    }

    .plan-top p{
        margin:0;

        font-size:12px !important;
        line-height:1.55;
    }


    /* Price block */

    .plan-price{
        margin-top:0 !important;
    }

    .regular-price{
        padding-bottom:12px !important;
    }

    .contract-offer{
        padding:14px 15px !important;
        margin-top:10px !important;
    }

    .contract-offer-head{
        margin-bottom:8px !important;
    }

    .main-price strong{
        font-size:32px !important;
    }

    .saving-line{
        padding:
            11px 2px !important;
    }


    /*
     * Secondary price information is useful,
     * but does not need excessive vertical space.
     */

    .price-detail{
        gap:8px !important;
        margin-top:4px !important;
    }

    .price-detail > div{
        min-height:0 !important;
        padding:10px 8px !important;
    }

    .price-detail small{
        font-size:8px !important;
        line-height:1.35;
    }

    .price-detail strong{
        margin-top:4px;
        font-size:11px !important;
    }


    /* Feature list */

    .plan-features{
        position:relative;

        margin-top:15px !important;

        max-height:148px;
        overflow:hidden;

        transition:
            max-height .38s ease;
    }

    .plan-features::after{
        content:"";

        position:absolute;
        left:0;
        right:0;
        bottom:0;

        height:40px;

        pointer-events:none;

        background:
            linear-gradient(
                to bottom,
                rgba(255,255,255,0),
                rgba(255,255,255,1)
            );
    }

    .plan-card.vvip .plan-features::after{
        background:
            linear-gradient(
                to bottom,
                rgba(12,43,82,0),
                rgba(12,43,82,1)
            );
    }

    .plan-features div{
        min-height:0 !important;

        padding:
            7px 0 !important;

        font-size:11px !important;
        line-height:1.4;
    }


    /* Expanded state */

    .plan-card.mobile-features-open
    .plan-features{
        max-height:1200px;
    }

    .plan-card.mobile-features-open
    .plan-features::after{
        display:none;
    }


    /* Toggle */

    .mobile-plan-toggle{
        display:flex;

        width:100%;

        align-items:center;
        justify-content:space-between;

        margin-top:13px;
        padding:11px 13px;

        border:1px solid #dbe8f5;
        border-radius:11px;

        background:#f6faff;
        color:#126ee8;

        font-family:inherit;
        font-size:11px;
        font-weight:800;

        cursor:pointer;
    }

    .mobile-plan-toggle b{
        font-size:16px;
        font-weight:500;
        line-height:1;

        transition:
            transform .25s ease;
    }

    .plan-card.mobile-features-open
    .mobile-plan-toggle b{
        transform:rotate(45deg);
    }


    .plan-card.vvip .mobile-plan-toggle{
        border-color:
            rgba(100,165,255,.25);

        background:
            rgba(30,111,222,.12);

        color:#75b3ff;
    }


    /*
     * Keep CTA compact but clearly visible.
     */

    .plan-card .plan-cta,
    .plan-card .plan-button{
        margin-top:16px !important;
    }

}


/* Narrow mobile */

@media(max-width:390px){

    .plan-card{
        padding:
            22px 17px
            18px !important;
    }

    .main-price strong{
        font-size:29px !important;
    }

}


/* PRICING V3.4 · SECTION NAVIGATION */

html{
    scroll-behavior:smooth;
}

#plans{
    scroll-margin-top:90px;
}

#pricing-ai{
    scroll-margin-top:90px;
}


/* =========================================================
   L2B PRICING V3.5 · MOCKUP REDESIGN
   ========================================================= */
html{scroll-behavior:smooth} #plans,#pricing-ai,#cases{scroll-margin-top:88px}

/* AI sales hero */
.pricing-ai{position:relative;overflow:hidden;padding:96px 0!important;border:0!important;
background:radial-gradient(circle at 85% 18%,rgba(28,127,255,.24),transparent 35%),linear-gradient(135deg,#06192b,#08223d 55%,#0a315d)}
.pricing-ai-shell{position:relative;z-index:2;width:min(1180px,calc(100% - 48px));margin:auto;display:grid;
grid-template-columns:minmax(350px,.9fr) minmax(540px,1.1fr);gap:64px;align-items:center}
.pricing-ai-copy h2{color:#fff!important;font-size:46px!important;line-height:1.15!important;letter-spacing:-1.8px;word-break:keep-all!important}
.pricing-ai-copy h2 em{color:#4b9fff;font-style:normal}.pricing-ai-copy>p{color:#b9cce0!important;word-break:keep-all!important}
.pricing-ai-suggestions{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.pricing-ai-suggestions button{border:1px solid rgba(143,192,239,.25)!important;border-radius:999px!important;background:rgba(255,255,255,.05)!important;color:#e0edf8!important}
.pricing-ai-console{min-height:0!important;overflow:hidden;border:1px solid rgba(116,178,236,.34)!important;border-radius:22px!important;
background:rgba(3,21,38,.84)!important;box-shadow:0 28px 75px rgba(0,0,0,.25);backdrop-filter:blur(16px)}
.pricing-ai-console-head{padding:14px 18px!important;border-bottom:1px solid rgba(133,184,230,.14)!important}
.pricing-ai-messages{height:auto!important;min-height:220px!important;max-height:360px!important;padding:18px!important;overflow-y:auto}
.pricing-ai-message{max-width:92%!important}.pricing-ai-message.user{margin-left:auto}
.pricing-ai-message p{padding:12px 14px!important;border-radius:13px!important;font-size:12px!important;line-height:1.68!important;word-break:keep-all!important}
.pricing-ai-message.assistant p{background:rgba(255,255,255,.075)!important;color:#edf6ff!important}
.pricing-ai-message.user p{background:linear-gradient(135deg,#0875ef,#1688ff)!important;color:#fff!important}
.pricing-ai-form{margin:0 15px 14px!important;padding:6px!important;border:1px solid rgba(133,184,230,.2)!important;border-radius:14px!important;background:rgba(255,255,255,.055)!important}
.pricing-ai-form textarea{min-height:44px!important;max-height:80px!important;overflow:hidden!important;color:#fff!important;scrollbar-width:none}
.pricing-ai-form textarea::-webkit-scrollbar{display:none}.pricing-ai-form button{width:44px!important;height:44px!important;border-radius:12px!important}

/* Real cases */
.real-cases{padding:88px 0 96px;background:#fff}.real-cases-inner{width:min(1180px,calc(100% - 48px));margin:auto}
.real-cases-head{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:end;margin-bottom:32px}
.real-cases-head small,.real-case-card>small{color:#1680ff;font-size:9px;font-weight:900;letter-spacing:1.2px}
.real-cases-head h2{margin:8px 0 0;color:#08192b;font-size:38px;letter-spacing:-1.5px;word-break:keep-all}
.real-cases-head h2 em{color:#1680ff;font-style:normal}.real-cases-head p{margin:0;color:#718398;font-size:13px;line-height:1.75;word-break:keep-all}
.real-cases-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.real-case-card{min-width:0;padding:24px;border:1px solid #dce8f4;border-radius:18px;background:#fff;box-shadow:0 14px 40px rgba(31,77,120,.045)}
.real-case-no{display:block;margin-bottom:13px;color:#9eb0c2;font-size:10px;font-weight:800}
.real-case-card h3{margin:9px 0 7px;color:#091b2d;font-size:23px}.real-case-card>strong{display:block;min-height:42px;color:#334b62;font-size:13px;line-height:1.5;word-break:keep-all}
.real-case-card>p{min-height:72px;margin:11px 0 17px;color:#718398;font-size:11px;line-height:1.7;word-break:keep-all}
.real-case-preview{display:block;overflow:hidden;height:188px;border:1px solid #dce8f4;border-radius:12px;background:#edf4fa;text-decoration:none}
.real-browser{display:flex;align-items:center;gap:5px;height:24px;padding:0 9px;background:#f5f8fb;border-bottom:1px solid #dce6ef}
.real-browser i{width:5px;height:5px;border-radius:50%;background:#b5c3d0}.real-browser i:first-child{background:#ff7469}.real-browser i:nth-child(2){background:#ffc95d}.real-browser i:nth-child(3){background:#5ad087}
.real-browser b{margin-left:6px;color:#93a4b4;font-size:7px}.real-stage{position:relative;display:block;height:164px;overflow:hidden}
.real-stage iframe{position:absolute;top:0;left:0;width:1280px;height:800px;border:0;pointer-events:none;transform:scale(.255);transform-origin:top left;background:#fff}
.real-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:13px}.real-tags span{padding:6px 8px;border:1px solid #e2edf7;border-radius:999px;background:#f6faff;color:#3974ad;font-size:8px;font-weight:700}
.real-live{display:block;margin-top:17px;text-align:right;color:#1680ff;font-size:10px;font-weight:900;text-decoration:none}

/* Compact mobile plans */
.mobile-plan-toggle{display:none}
@media(max-width:700px){
 .plans-grid{gap:14px!important}.plan-card{min-height:0!important;height:auto!important;padding:23px 18px 18px!important}
 .plan-features{position:relative;max-height:145px;overflow:hidden;transition:max-height .35s ease}
 .plan-features::after{content:"";position:absolute;left:0;right:0;bottom:0;height:38px;pointer-events:none;background:linear-gradient(to bottom,rgba(255,255,255,0),#fff)}
 .plan-card.vvip .plan-features::after{background:linear-gradient(to bottom,rgba(12,43,82,0),#0c2b52)}
 .plan-card.mobile-features-open .plan-features{max-height:1400px}.plan-card.mobile-features-open .plan-features::after{display:none}
 .mobile-plan-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:12px;padding:11px 13px;border:1px solid #dbe8f5;border-radius:11px;background:#f6faff;color:#126ee8;font:800 11px inherit}
 .plan-card.vvip .mobile-plan-toggle{background:rgba(30,111,222,.12);color:#75b3ff;border-color:rgba(100,165,255,.25)}
}

@media(max-width:980px){
 .pricing-ai-shell{grid-template-columns:1fr;gap:40px}.real-cases-head{grid-template-columns:1fr;gap:14px}.real-cases-grid{grid-template-columns:1fr}
 .real-case-card>strong,.real-case-card>p{min-height:0}.real-case-preview{height:250px}.real-stage{height:226px}.real-stage iframe{transform:scale(.42)}
}
@media(max-width:600px){
 .pricing-ai{padding:60px 0 56px!important}.pricing-ai-shell{width:calc(100% - 32px);gap:32px}
 .pricing-ai-copy h2{font-size:34px!important;line-height:1.15!important}.pricing-ai-suggestions{display:grid;grid-template-columns:1fr 1fr}
 .pricing-ai-messages{min-height:170px!important;max-height:320px!important;padding:13px!important}
 .real-cases{padding:64px 0 70px}.real-cases-inner{width:calc(100% - 32px)}.real-cases-head h2{font-size:31px}
 .real-case-card{padding:19px}.real-case-preview{height:200px}.real-stage{height:176px}.real-stage iframe{transform:scale(.30)}
}


/* =========================================================
   L2B PRICING V3.6 · AI CONSOLE FINAL
   ========================================================= */

/*
 * Final override layer.
 * Previous pricing AI generations intentionally remain intact,
 * but everything visible in the current AI console is normalized
 * here so old borders / shadows cannot leak through.
 */

#pricing-ai{
    scroll-margin-top:82px;
}

#cases{
    scroll-margin-top:82px;
}


/* ---------- AI section proportions ---------- */

.pricing-ai{
    padding:72px 0 70px !important;
}

.pricing-ai-shell{
    width:min(1240px,calc(100% - 56px)) !important;
    grid-template-columns:
        minmax(350px,.82fr)
        minmax(600px,1.18fr) !important;
    gap:68px !important;
    align-items:center !important;
}


/* ---------- Copy ---------- */

.pricing-ai-copy h2{
    max-width:520px;
    font-size:44px !important;
    line-height:1.12 !important;
    letter-spacing:-1.8px !important;
    word-break:keep-all !important;
}

.pricing-ai-copy>p{
    max-width:520px;
    font-size:14px !important;
    line-height:1.8 !important;
}


/* ---------- Console ---------- */

.pricing-ai-console{
    width:100% !important;
    min-height:0 !important;
    border:1px solid rgba(118,181,240,.28) !important;
    border-radius:22px !important;
    outline:0 !important;

    background:
        linear-gradient(
            180deg,
            rgba(3,21,38,.94),
            rgba(3,18,33,.96)
        ) !important;

    box-shadow:
        0 30px 80px rgba(0,0,0,.24) !important;

    overflow:hidden !important;
}

.pricing-ai-console-head{
    min-height:58px;
    padding:14px 19px !important;
}


/* ---------- Messages ---------- */

.pricing-ai-messages{
    min-height:270px !important;
    max-height:410px !important;
    padding:20px !important;
    gap:13px !important;
}

.pricing-ai-message{
    max-width:88% !important;

    border:0 !important;
    outline:0 !important;
    box-shadow:none !important;

    background:transparent !important;
}

.pricing-ai-message.assistant{
    margin-right:auto !important;
}

.pricing-ai-message.user{
    margin-left:auto !important;
    margin-right:0 !important;

    border:0 !important;
    outline:0 !important;
    box-shadow:none !important;

    background:transparent !important;
}


/* ---------- ALL bubbles reset ---------- */

.pricing-ai-message p{
    margin:0 !important;
    padding:13px 15px !important;

    border:0 !important;
    outline:0 !important;

    border-radius:14px !important;

    font-size:13px !important;
    line-height:1.7 !important;

    word-break:keep-all !important;
    overflow-wrap:break-word !important;

    box-shadow:none !important;
}


/* AI bubble */

.pricing-ai-message.assistant p{
    color:#edf6ff !important;

    border:0 !important;
    outline:0 !important;

    background:
        rgba(255,255,255,.075) !important;

    box-shadow:none !important;
}


/* USER bubble
   IMPORTANT:
   one blue surface only.
   no cyan border, inset line, outline or glow.
*/

.pricing-ai-message.user p{
    color:#fff !important;

    border:0 !important;
    border-width:0 !important;
    border-color:transparent !important;

    outline:0 !important;

    background:#147df5 !important;

    box-shadow:none !important;

    -webkit-box-shadow:none !important;
    filter:none !important;
}


/* prevent pseudo-elements from creating a second frame */

.pricing-ai-message.user p::before,
.pricing-ai-message.user p::after,
.pricing-ai-message.user::before,
.pricing-ai-message.user::after{
    content:none !important;
    display:none !important;
}


/* labels */

.pricing-ai-message small{
    margin-bottom:6px !important;
    font-size:9px !important;
    opacity:.58;
}


/* lists */

.pricing-ai-message p ul{
    margin:9px 0 2px 18px !important;
    padding:0 !important;
}

.pricing-ai-message p li{
    margin:4px 0 !important;
    font-size:13px !important;
    line-height:1.62 !important;
}


/* ---------- Action buttons ---------- */

.pricing-ai-actions{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:7px !important;

    margin-top:10px !important;
}

.pricing-ai-actions button{
    min-height:34px !important;
    padding:7px 11px !important;

    border:1px solid rgba(72,155,244,.48) !important;
    border-radius:8px !important;

    background:rgba(12,73,132,.25) !important;
    color:#78b9ff !important;

    box-shadow:none !important;

    font-size:10px !important;
    font-weight:800 !important;
}

.pricing-ai-actions button:hover{
    background:rgba(21,126,245,.18) !important;
    border-color:rgba(77,166,255,.72) !important;
}


/* ---------- Input ---------- */

.pricing-ai-form{
    margin:0 16px 15px !important;
    padding:6px !important;

    border:1px solid rgba(133,184,230,.18) !important;
    border-radius:15px !important;

    background:rgba(255,255,255,.055) !important;

    box-shadow:none !important;
}

.pricing-ai-form textarea{
    min-height:46px !important;
    max-height:92px !important;

    border:0 !important;
    outline:0 !important;

    background:transparent !important;

    box-shadow:none !important;

    font-size:12px !important;
    line-height:1.55 !important;
}

.pricing-ai-form button{
    width:46px !important;
    height:46px !important;

    border:0 !important;
    border-radius:12px !important;

    box-shadow:none !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1050px){

    .pricing-ai-shell{
        width:calc(100% - 40px) !important;
        grid-template-columns:1fr !important;
        gap:38px !important;
    }

    .pricing-ai-copy{
        max-width:720px;
    }

    .pricing-ai-copy h2,
    .pricing-ai-copy>p{
        max-width:none;
    }

    .pricing-ai-console{
        max-width:760px;
        margin:auto;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:600px){

    .pricing-ai{
        padding:52px 0 48px !important;
    }

    .pricing-ai-shell{
        width:calc(100% - 28px) !important;
        gap:28px !important;
    }

    .pricing-ai-copy h2{
        font-size:32px !important;
        line-height:1.13 !important;
        letter-spacing:-1.2px !important;
    }

    .pricing-ai-copy>p{
        font-size:13px !important;
        line-height:1.72 !important;
    }

    .pricing-ai-suggestions{
        margin-top:21px !important;
        gap:7px !important;
    }

    .pricing-ai-console{
        border-radius:18px !important;
    }

    .pricing-ai-console-head{
        min-height:54px;
        padding:12px 14px !important;
    }

    .pricing-ai-messages{
        min-height:220px !important;
        max-height:350px !important;
        padding:13px !important;
    }

    .pricing-ai-message{
        max-width:94% !important;
    }

    .pricing-ai-message p{
        padding:11px 12px !important;
        border-radius:12px !important;

        font-size:12.5px !important;
        line-height:1.62 !important;
    }

    .pricing-ai-message p li{
        font-size:12.5px !important;
        line-height:1.58 !important;
    }

    .pricing-ai-form{
        margin:0 11px 11px !important;
    }

    .pricing-ai-form textarea{
        font-size:12px !important;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media(max-width:390px){

    .pricing-ai-shell{
        width:calc(100% - 22px) !important;
    }

    .pricing-ai-copy h2{
        font-size:29px !important;
    }

    .pricing-ai-message{
        max-width:96% !important;
    }

}


/* =========================================================
   L2B PRICING V3.7 · READABILITY FINAL
   ========================================================= */


/* ---------------------------------------------------------
   1. AI SECTION
   --------------------------------------------------------- */

.pricing-ai{
    padding:78px 0 76px !important;
}

.pricing-ai-shell{
    width:min(1280px,calc(100% - 56px)) !important;

    grid-template-columns:
        minmax(390px,.78fr)
        minmax(660px,1.22fr) !important;

    gap:72px !important;
}


/* ---------------------------------------------------------
   2. LEFT COPY
   --------------------------------------------------------- */

.pricing-ai-copy{
    min-width:0;
}

.pricing-ai-eyebrow{
    margin-bottom:14px !important;

    font-size:11px !important;
    font-weight:900 !important;

    letter-spacing:1.5px !important;
}

.pricing-ai-copy h2{
    max-width:570px !important;

    margin:0 0 22px !important;

    font-size:48px !important;
    line-height:1.13 !important;

    letter-spacing:-2px !important;

    word-break:keep-all !important;
}

.pricing-ai-copy>p{
    max-width:570px !important;

    margin:0 !important;

    font-size:15px !important;
    line-height:1.85 !important;

    color:#c2d2e2 !important;

    word-break:keep-all !important;
}

.pricing-ai-suggestions{
    margin-top:28px !important;
}

.pricing-ai-suggestions button{
    min-height:40px !important;

    padding:9px 15px !important;

    font-size:11px !important;
    font-weight:700 !important;
}


/* ---------------------------------------------------------
   3. AI CONSOLE
   --------------------------------------------------------- */

.pricing-ai-console{
    width:100% !important;

    min-height:480px !important;

    border-radius:22px !important;

    box-shadow:
        0 34px 90px rgba(0,0,0,.27) !important;
}


/* ---------------------------------------------------------
   4. CONSOLE HEADER
   --------------------------------------------------------- */

.pricing-ai-console-head{
    min-height:64px !important;

    padding:15px 20px !important;
}

.pricing-ai-console-head strong{
    font-size:14px !important;
    line-height:1.25 !important;
}

.pricing-ai-console-head small{
    font-size:8px !important;

    letter-spacing:1px !important;
}

.pricing-ai-status{
    font-size:9px !important;
    letter-spacing:1px !important;
}


/* ---------------------------------------------------------
   5. MESSAGE AREA
   --------------------------------------------------------- */

.pricing-ai-messages{
    min-height:320px !important;
    max-height:430px !important;

    padding:22px 22px 18px !important;

    scrollbar-width:thin;
}


/* ---------------------------------------------------------
   6. MESSAGE LABEL
   --------------------------------------------------------- */

.pricing-ai-message small{
    display:block !important;

    margin:0 0 7px !important;

    font-size:9px !important;
    font-weight:900 !important;

    letter-spacing:1.1px !important;

    color:#63809b !important;

    opacity:1 !important;
}

.pricing-ai-message.user small{
    text-align:right !important;

    color:#4f779b !important;
}


/* ---------------------------------------------------------
   7. MESSAGE WIDTH
   --------------------------------------------------------- */

.pricing-ai-message{
    max-width:94% !important;

    margin-bottom:18px !important;
}

.pricing-ai-message.assistant{
    margin-right:auto !important;
}

.pricing-ai-message.user{
    max-width:86% !important;

    margin-left:auto !important;
    margin-right:0 !important;
}


/* ---------------------------------------------------------
   8. MESSAGE TYPOGRAPHY
   --------------------------------------------------------- */

.pricing-ai-message p{
    padding:15px 17px !important;

    font-size:14px !important;
    font-weight:500 !important;

    line-height:1.75 !important;

    letter-spacing:-.15px !important;

    word-break:keep-all !important;
    overflow-wrap:break-word !important;
}


/* AI */

.pricing-ai-message.assistant p{
    color:#edf5fc !important;

    background:
        rgba(255,255,255,.08) !important;
}


/* USER */

.pricing-ai-message.user p{
    color:#fff !important;

    background:#147df5 !important;

    border:0 !important;
    outline:0 !important;

    box-shadow:none !important;
}


/* ---------------------------------------------------------
   9. AI GENERATED HEADINGS
   --------------------------------------------------------- */

.pricing-ai-message strong{
    color:#fff !important;

    font-weight:850 !important;
}

.pricing-ai-message.assistant p > strong:first-child{
    display:block;

    margin-bottom:10px;

    font-size:14px !important;
    font-weight:900 !important;

    color:#fff !important;
}


/* ---------------------------------------------------------
   10. LIST READABILITY
   --------------------------------------------------------- */

.pricing-ai-message ul,
.pricing-ai-message ol{
    margin:12px 0 6px !important;

    padding-left:21px !important;
}

.pricing-ai-message li{
    margin:7px 0 !important;

    padding-left:2px !important;

    font-size:14px !important;
    line-height:1.65 !important;

    color:#eef6fd !important;

    word-break:keep-all !important;
}

.pricing-ai-message li::marker{
    color:#66adff;
}


/* ---------------------------------------------------------
   11. PARAGRAPH SPACING
   --------------------------------------------------------- */

.pricing-ai-line{
    display:block !important;

    margin-top:5px !important;

    line-height:1.72 !important;
}

.pricing-ai-line + .pricing-ai-line{
    margin-top:7px !important;
}


/* ---------------------------------------------------------
   12. ACTIONS
   --------------------------------------------------------- */

.pricing-ai-actions{
    gap:8px !important;

    margin-top:13px !important;
}

.pricing-ai-actions button{
    min-height:36px !important;

    padding:8px 13px !important;

    font-size:11px !important;
    font-weight:850 !important;

    border-radius:9px !important;
}


/* ---------------------------------------------------------
   13. INPUT
   --------------------------------------------------------- */

.pricing-ai-form{
    margin:0 17px 16px !important;

    padding:7px !important;

    min-height:60px !important;
}

.pricing-ai-form textarea{
    min-height:46px !important;

    padding:11px 10px !important;

    font-size:13px !important;
    line-height:1.55 !important;

    color:#edf6ff !important;
}

.pricing-ai-form textarea::placeholder{
    color:#71889e !important;

    opacity:1 !important;
}

.pricing-ai-form button{
    flex:0 0 46px !important;

    width:46px !important;
    height:46px !important;
}


/* ---------------------------------------------------------
   14. FOOTNOTE
   --------------------------------------------------------- */

.pricing-ai-foot{
    padding:0 17px 15px !important;

    font-size:9px !important;

    color:#607a91 !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1100px){

    .pricing-ai-shell{
        width:calc(100% - 44px) !important;

        grid-template-columns:1fr !important;

        gap:42px !important;
    }

    .pricing-ai-copy{
        max-width:760px !important;

        margin:auto !important;
    }

    .pricing-ai-console{
        max-width:780px !important;

        margin:auto !important;
    }

}


/* =========================================================
   MOBILE READABILITY
   ========================================================= */

@media(max-width:600px){

    #pricing-ai{
        scroll-margin-top:76px !important;
    }

    .pricing-ai{
        padding:52px 0 50px !important;
    }

    .pricing-ai-shell{
        width:calc(100% - 28px) !important;

        gap:30px !important;
    }


    /* LEFT */

    .pricing-ai-eyebrow{
        font-size:10px !important;
    }

    .pricing-ai-copy h2{
        max-width:none !important;

        margin-bottom:18px !important;

        font-size:32px !important;
        line-height:1.16 !important;

        letter-spacing:-1.3px !important;
    }

    .pricing-ai-copy>p{
        max-width:none !important;

        font-size:14px !important;
        line-height:1.75 !important;
    }


    /* Suggestions */

    .pricing-ai-suggestions{
        display:grid !important;

        grid-template-columns:
            repeat(2,minmax(0,1fr)) !important;

        gap:8px !important;

        margin-top:23px !important;
    }

    .pricing-ai-suggestions button{
        min-width:0 !important;

        min-height:43px !important;

        padding:8px 7px !important;

        font-size:11px !important;
    }


    /* Console */

    .pricing-ai-console{
        min-height:0 !important;

        border-radius:18px !important;
    }

    .pricing-ai-console-head{
        min-height:58px !important;

        padding:13px 14px !important;
    }

    .pricing-ai-console-head strong{
        font-size:14px !important;
    }


    /* Messages */

    .pricing-ai-messages{
        min-height:310px !important;
        max-height:440px !important;

        padding:16px 14px 18px !important;
    }

    .pricing-ai-message{
        max-width:100% !important;

        margin-bottom:18px !important;
    }

    .pricing-ai-message.user{
        max-width:88% !important;
    }

    .pricing-ai-message small{
        margin-bottom:7px !important;

        font-size:9px !important;
    }


    /* Bubbles */

    .pricing-ai-message p{
        padding:13px 14px !important;

        font-size:14px !important;
        line-height:1.7 !important;

        letter-spacing:-.15px !important;
    }

    .pricing-ai-message.user p{
        border-radius:13px !important;
    }


    /* Lists */

    .pricing-ai-message ul,
    .pricing-ai-message ol{
        margin:12px 0 5px !important;

        padding-left:20px !important;
    }

    .pricing-ai-message li{
        margin:8px 0 !important;

        font-size:14px !important;
        line-height:1.62 !important;
    }


    /* Actions */

    .pricing-ai-actions{
        gap:7px !important;
    }

    .pricing-ai-actions button{
        min-height:37px !important;

        padding:8px 11px !important;

        font-size:10.5px !important;
    }


    /* Input */

    .pricing-ai-form{
        min-height:58px !important;

        margin:0 11px 11px !important;

        padding:6px !important;
    }

    .pricing-ai-form textarea{
        min-height:44px !important;

        padding:10px 9px !important;

        font-size:13px !important;
        line-height:1.5 !important;
    }

    .pricing-ai-form button{
        flex-basis:44px !important;

        width:44px !important;
        height:44px !important;
    }

    .pricing-ai-foot{
        padding:0 12px 13px !important;

        font-size:8px !important;
    }


    /* -----------------------------------------------------
       MOBILE PLAN COMPRESSION
       ----------------------------------------------------- */

    .plans-section{
        padding-top:62px !important;
        padding-bottom:68px !important;
    }

    .plans-grid{
        gap:13px !important;
    }

    .plan-card{
        min-height:0 !important;

        padding:22px 18px 18px !important;
    }

    .plan-top{
        margin-bottom:14px !important;
    }

    .plan-top h3{
        margin-bottom:5px !important;
    }

    .plan-top p{
        margin-bottom:0 !important;

        line-height:1.5 !important;
    }

    .plan-price{
        margin-top:13px !important;
    }

    .contract-offer{
        margin-top:10px !important;

        padding:12px 13px !important;
    }

    .saving-line{
        margin-top:9px !important;
    }

    .price-detail{
        margin-top:10px !important;
    }

    .plan-features{
        max-height:116px !important;

        margin-top:10px !important;
    }

    .plan-card.mobile-features-open
    .plan-features{
        max-height:1600px !important;
    }

    .plan-features div{
        min-height:0 !important;

        padding:5px 0 !important;

        line-height:1.45 !important;
    }

    .mobile-plan-toggle{
        margin-top:10px !important;

        min-height:42px !important;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media(max-width:390px){

    .pricing-ai-shell{
        width:calc(100% - 22px) !important;
    }

    .pricing-ai-copy h2{
        font-size:29px !important;
    }

    .pricing-ai-copy>p{
        font-size:13.5px !important;
    }

    .pricing-ai-message p,
    .pricing-ai-message li{
        font-size:13.5px !important;
    }

    .pricing-ai-message.user{
        max-width:90% !important;
    }

}

/* =========================================================
   L2B PRICING V3.8 · AI SALES AGENT
   ========================================================= */

/* One-step font reduction */
.pricing-ai-message p,
.pricing-ai-message li{
    font-size:13px !important;
}
.pricing-ai-form textarea{
    font-size:12.5px !important;
}

/* In-chat sales card */
.pricing-ai-sales-wrap{max-width:96% !important}
.pricing-ai-sales-card{
    width:min(100%,560px);
    padding:18px;
    border:1px solid rgba(102,173,255,.26);
    border-radius:16px;
    background:linear-gradient(180deg,rgba(10,36,61,.98),rgba(6,28,49,.98));
    box-shadow:0 18px 44px rgba(0,0,0,.18);
}
.pricing-ai-sales-head{
    display:flex;flex-direction:column;gap:4px;margin-bottom:16px
}
.pricing-ai-sales-head span{
    color:#69b1ff;font-size:9px;font-weight:900;letter-spacing:1.1px
}
.pricing-ai-sales-head strong{
    color:#fff;font-size:15px !important;line-height:1.45
}
.pricing-ai-sales-grid{
    display:grid;grid-template-columns:1fr 1fr;gap:10px
}
.pricing-ai-sales-grid label{
    display:flex;flex-direction:column;gap:6px;min-width:0
}
.pricing-ai-sales-grid label.wide{grid-column:1/-1}
.pricing-ai-sales-grid label>span{
    color:#9db3c8;font-size:10px;font-weight:800
}
.pricing-ai-sales-grid input{
    width:100%;height:42px;padding:0 12px;
    border:1px solid rgba(145,183,218,.18);
    border-radius:10px;outline:0;
    background:rgba(255,255,255,.055);
    color:#f5f9fd;font:inherit;font-size:12px;box-shadow:none
}
.pricing-ai-sales-grid input:focus{
    border-color:rgba(73,158,246,.68);
    background:rgba(255,255,255,.075)
}
.pricing-ai-sales-grid input::placeholder{color:#627b92}
.pricing-ai-sales-context{
    margin-top:13px;padding:11px 12px;border-radius:10px;
    background:rgba(255,255,255,.045)
}
.pricing-ai-sales-context span{
    display:block;margin-bottom:4px;color:#79b9ff;
    font-size:9px;font-weight:900
}
.pricing-ai-sales-context p{
    padding:0 !important;margin:0 !important;border:0 !important;
    background:transparent !important;color:#a9bdcf !important;
    font-size:11px !important;line-height:1.55 !important
}
.pricing-ai-sales-consent{
    display:flex;align-items:flex-start;gap:8px;margin-top:13px;cursor:pointer
}
.pricing-ai-sales-consent input{
    width:16px;height:16px;margin:1px 0 0;accent-color:#147df5;flex:0 0 auto
}
.pricing-ai-sales-consent span{
    color:#b8c9d8;font-size:10.5px;line-height:1.5
}
.pricing-ai-sales-error{
    min-height:0;margin-top:8px;color:#ff9c9c;font-size:10.5px;line-height:1.5
}
.pricing-ai-sales-error:empty{display:none}
.pricing-ai-sales-submit{
    width:100%;min-height:44px;margin-top:13px;border:0;border-radius:11px;
    background:#147df5;color:#fff;font-size:12px;font-weight:900;
    cursor:pointer;box-shadow:none
}
.pricing-ai-sales-submit:hover{background:#278cff}
.pricing-ai-sales-submit:disabled{opacity:.65;cursor:wait}
.pricing-ai-sales-card.is-complete{padding:22px}
.pricing-ai-sales-success{
    display:flex;flex-direction:column;align-items:flex-start
}
.pricing-ai-sales-check{
    display:grid;place-items:center;width:34px;height:34px;margin-bottom:12px;
    border-radius:50%;background:#147df5;color:#fff;font-size:17px;font-weight:900
}
.pricing-ai-sales-success strong{color:#fff;font-size:15px !important}
.pricing-ai-sales-success span{
    margin-top:6px;color:#70b6ff;font-size:11px;font-weight:800
}
.pricing-ai-sales-success p{
    margin:9px 0 0 !important;padding:0 !important;border:0 !important;
    background:transparent !important;color:#a9bdcf !important;
    font-size:11.5px !important;line-height:1.65 !important
}

@media(max-width:600px){
    .pricing-ai-message p,
    .pricing-ai-message li{font-size:13px !important}
    .pricing-ai-sales-wrap{max-width:100% !important}
    .pricing-ai-sales-card{width:100%;padding:15px;border-radius:14px}
    .pricing-ai-sales-grid{grid-template-columns:1fr;gap:9px}
    .pricing-ai-sales-grid label.wide{grid-column:auto}
    .pricing-ai-sales-grid input{height:43px;font-size:12.5px}
    .pricing-ai-sales-submit{min-height:45px;font-size:12px}
}

/* =========================================================
   L2B PRICING V3.9 · CONVERSATIONAL LEAD CAPTURE
   ========================================================= */

/* Prevent old message bubble rules from painting blocks inside cards */
.pricing-ai-sales-card p,
.pricing-ai-confirm-card p,
.pricing-ai-sales-success p{
    background:transparent !important;
    border:0 !important;
    outline:0 !important;
    box-shadow:none !important;
    filter:none !important;
    border-radius:0 !important;
}

/* Compact completed card */
.pricing-ai-sales-card.is-complete{
    padding:18px !important;
}
.pricing-ai-sales-card.is-complete .pricing-ai-sales-success{
    min-height:0 !important;
}
.pricing-ai-sales-card.is-complete .pricing-ai-sales-success p{
    display:block !important;
    width:auto !important;
    min-height:0 !important;
    margin:8px 0 0 !important;
    padding:0 !important;
}

/* Confirmation */
.pricing-ai-confirm-card{
    width:min(100%,520px);
}
.pricing-ai-confirm-list{
    overflow:hidden;
    margin-top:4px;
    border:1px solid rgba(145,183,218,.13);
    border-radius:11px;
    background:rgba(255,255,255,.035);
}
.pricing-ai-confirm-row{
    display:grid;
    grid-template-columns:92px minmax(0,1fr);
    gap:12px;
    align-items:center;
    min-height:39px;
    padding:8px 11px;
    border-bottom:1px solid rgba(145,183,218,.09);
}
.pricing-ai-confirm-row:last-child{border-bottom:0}
.pricing-ai-confirm-row span{
    color:#7f9bb4;
    font-size:10px;
    font-weight:800;
}
.pricing-ai-confirm-row strong{
    min-width:0;
    color:#eef7ff !important;
    font-size:11.5px !important;
    font-weight:750 !important;
    line-height:1.45;
    overflow-wrap:anywhere;
}
.pricing-ai-confirm-actions{
    display:grid;
    grid-template-columns:100px 1fr;
    gap:8px;
    margin-top:13px;
}
.pricing-ai-confirm-actions .pricing-ai-sales-submit{
    margin-top:0;
}
.pricing-ai-sales-edit{
    min-height:44px;
    border:1px solid rgba(128,174,216,.24);
    border-radius:11px;
    background:rgba(255,255,255,.055);
    color:#b9cede;
    font-size:11px;
    font-weight:800;
    cursor:pointer;
}
.pricing-ai-sales-edit:hover{
    background:rgba(255,255,255,.085);
}

/* Cleaner conversational messages */
.pricing-ai-message p{
    font-size:13px !important;
    line-height:1.68 !important;
}
.pricing-ai-message li{
    font-size:13px !important;
    line-height:1.62 !important;
}

/* Remove accidental pseudo decoration inside sales cards */
.pricing-ai-sales-card *::before,
.pricing-ai-sales-card *::after{
    box-shadow:none;
}

/* Mobile */
@media(max-width:600px){
    .pricing-ai-messages{
        max-height:470px !important;
    }
    .pricing-ai-confirm-card{
        width:100%;
    }
    .pricing-ai-confirm-row{
        grid-template-columns:78px minmax(0,1fr);
        gap:8px;
        min-height:37px;
        padding:7px 9px;
    }
    .pricing-ai-confirm-row strong{
        font-size:11px !important;
    }
    .pricing-ai-confirm-actions{
        grid-template-columns:90px 1fr;
    }
}