/* ==========================================================
   JNR ZONE — PART 10
   Pricing, Scope Builder, FAQ & Conversion
========================================================== */

.jnr-pricing{
    --pricing-bg:#030a12;
    --pricing-panel:#07131d;
    --pricing-line:rgba(255,255,255,.065);
    --pricing-text:#f1f7fa;
    --pricing-muted:#6d8495;
    --pricing-blue:#63dcff;
    --pricing-purple:#806dff;
    position:relative;
    overflow:hidden;
    padding:125px 0;
    color:var(--pricing-text);
    background:
        radial-gradient(circle at 20% 12%,rgba(53,157,214,.08),transparent 28%),
        radial-gradient(circle at 88% 54%,rgba(116,75,232,.07),transparent 32%),
        var(--pricing-bg);
}

.jnr-pricing *,
.jnr-pricing *::before,
.jnr-pricing *::after{box-sizing:border-box}

.jnr-pricing__glow{
    position:absolute;
    width:500px;height:500px;
    border-radius:50%;
    filter:blur(120px);
    pointer-events:none;
}
.jnr-pricing__glow--one{left:-300px;top:18%;background:rgba(59,176,227,.07)}
.jnr-pricing__glow--two{right:-300px;bottom:8%;background:rgba(130,82,255,.06)}

.jnr-pricing__header{
    max-width:860px;
    margin:auto;
    text-align:center;
}

.jnr-pricing__eyebrow{
    display:inline-flex;
    align-items:center;
    gap:10px;
    color:#66ddff;
    font-size:.67rem;
    font-weight:800;
    letter-spacing:.15em;
}

.jnr-pricing__eyebrow i{
    display:block;
    width:24px;height:1px;
    background:linear-gradient(90deg,#66ddff,transparent);
}

.jnr-pricing__header h2{
    margin:20px 0 0;
    font-size:clamp(2.6rem,5vw,5rem);
    line-height:1;
    letter-spacing:-.065em;
}

.jnr-pricing__header h2 em{
    color:#7d91a0;
    font-style:normal;
}

.jnr-pricing__header p{
    max-width:720px;
    margin:24px auto 0;
    color:#788f9f;
    font-size:1rem;
    line-height:1.8;
}

.jnr-pricing__plans{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:17px;
    margin-top:60px;
}

.jnr-plan{
    position:relative;
    display:flex;
    flex-direction:column;
    min-width:0;
    padding:28px;
    border:1px solid rgba(255,255,255,.065);
    border-radius:22px;
    background:rgba(255,255,255,.018);
    transition:.26s ease;
}

.jnr-plan:hover{
    transform:translateY(-6px);
    border-color:rgba(95,215,255,.14);
    box-shadow:0 25px 60px rgba(0,0,0,.18);
}

.jnr-plan--featured{
    border-color:rgba(91,213,255,.17);
    background:
        radial-gradient(circle at 80% 4%,rgba(104,82,255,.12),transparent 35%),
        linear-gradient(145deg,rgba(51,168,225,.07),rgba(255,255,255,.018));
    box-shadow:0 28px 80px rgba(0,0,0,.24);
}

.jnr-plan__recommended{
    position:absolute;
    top:14px;right:14px;
    padding:6px 9px;
    border-radius:20px;
    color:#72e1ff;
    background:rgba(93,214,255,.08);
    font-size:.45rem;
    font-weight:900;
    letter-spacing:.08em;
}

.jnr-plan__top{
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.jnr-plan__label{
    color:#58d6ff;
    font-size:.56rem;
    font-weight:900;
    letter-spacing:.12em;
}

.jnr-plan__icon{
    display:grid;place-items:center;
    width:42px;height:42px;
    border:1px solid rgba(255,255,255,.06);
    border-radius:12px;
    color:#69dcff;
    background:rgba(90,211,255,.07);
}

.jnr-plan h3{
    margin:28px 0 0;
    font-size:1.35rem;
    letter-spacing:-.04em;
}

.jnr-plan>p{
    min-height:78px;
    margin:12px 0 0;
    color:#708797;
    font-size:.66rem;
    line-height:1.7;
}

.jnr-plan__price{
    padding:24px 0;
    border-bottom:1px solid rgba(255,255,255,.06);
}

.jnr-plan__price strong,
.jnr-plan__price span{display:block}

.jnr-plan__price strong{
    font-size:2rem;
    letter-spacing:-.05em;
}

.jnr-plan__price span{
    margin-top:5px;
    color:#587080;
    font-size:.54rem;
}

.jnr-plan ul{
    flex:1;
    margin:22px 0 0;
    padding:0;
    list-style:none;
}

.jnr-plan li{
    display:flex;
    align-items:center;
    gap:9px;
    margin:12px 0;
    color:#9db0bb;
    font-size:.70rem;
}

.jnr-plan li i{color:#58d99c}

.jnr-plan button{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    width:100%;
    min-height:46px;
    margin-top:24px;
    border:1px solid rgba(255,255,255,.075);
    border-radius:11px;
    color:#dce8ed;
    background:rgba(255,255,255,.025);
    font-size:.59rem;
    font-weight:900;
    cursor:pointer;
    transition:.2s ease;
}

.jnr-plan--featured button{
    color:#06131c;
    border:0;
    background:linear-gradient(135deg,#70e0ff,#548bff);
    box-shadow:0 14px 30px rgba(69,164,255,.17);
}

.jnr-plan button:hover{transform:translateY(-2px)}

.jnr-scope{
    margin-top:90px;
    padding:38px;
    border:1px solid rgba(255,255,255,.07);
    border-radius:25px;
    background:
        radial-gradient(circle at 10% 10%,rgba(64,175,229,.08),transparent 25%),
        rgba(255,255,255,.015);
}

.jnr-scope__intro{
    display:grid;
    grid-template-columns:.55fr .9fr 1fr .8fr;
    align-items:end;
    gap:26px;
}

.jnr-scope__intro h3{
    margin:0;
    font-size:1.7rem;
    letter-spacing:-.045em;
}

.jnr-scope__intro>p{
    margin:0;
    color:#6d8495;
    font-size:.68rem;
    line-height:1.7;
}

.jnr-scope__progress>div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:#668090;
    font-size:.51rem;
}

.jnr-scope__progress strong{color:#67d9ff}
.jnr-scope__progress>b{
    display:block;
    overflow:hidden;
    height:5px;
    margin-top:10px;
    border-radius:10px;
    background:rgba(255,255,255,.055);
}

.jnr-scope__progress b i{
    display:block;
    width:0;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,#59d8ff,#776dff);
    transition:width .4s cubic-bezier(.2,.8,.2,1);
}

.jnr-scope__builder{
    display:grid;
    grid-template-columns:minmax(0,1fr) 310px;
    gap:18px;
    margin-top:35px;
}

.jnr-scope__modules{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
}

.jnr-scope__modules button{
    position:relative;
    display:grid;
    grid-template-columns:37px minmax(0,1fr);
    gap:11px;
    min-width:0;
    min-height:92px;
    padding:15px;
    border:1px solid rgba(255,255,255,.055);
    border-radius:13px;
    color:#8196a4;
    background:rgba(255,255,255,.018);
    text-align:left;
    cursor:pointer;
    transition:.22s ease;
}

.jnr-scope__modules button:hover,
.jnr-scope__modules button.is-selected{
    color:#e5f1f6;
    border-color:rgba(89,214,255,.16);
    background:linear-gradient(140deg,rgba(65,183,239,.09),rgba(112,76,242,.035));
}

.jnr-scope__modules button>span{
    display:grid;place-items:center;
    width:37px;height:37px;
    border-radius:10px;
    color:#61d9ff;
    background:rgba(85,210,255,.075);
}

.jnr-scope__modules strong,
.jnr-scope__modules small{
    grid-column:2;
    display:block;
}

.jnr-scope__modules strong{
    align-self:end;
    font-size:.61rem;
}

.jnr-scope__modules small{
    margin-top:-3px;
    color:#526b7b;
    font-size:.47rem;
    line-height:1.35;
}

.jnr-scope__modules mark{
    position:absolute;
    top:10px;right:10px;
    display:grid;place-items:center;
    width:18px;height:18px;
    border-radius:50%;
    color:#06131c;
    background:#61d9ff;
    opacity:0;
    transform:scale(.7);
    transition:.2s ease;
    font-size:.42rem;
}

.jnr-scope__modules button.is-selected mark{
    opacity:1;
    transform:scale(1);
}

.jnr-scope__summary{
    position:sticky;
    top:20px;
    align-self:start;
    padding:23px;
    border:1px solid rgba(95,215,255,.12);
    border-radius:17px;
    background:
        radial-gradient(circle at 80% 0,rgba(102,83,255,.11),transparent 35%),
        #07141e;
}

.jnr-scope__summary-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.jnr-scope__summary-head span{
    color:#5cd8ff;
    font-size:.48rem;
    font-weight:900;
    letter-spacing:.1em;
}

.jnr-scope__summary-head strong{
    color:#dce9ef;
    font-size:.54rem;
}

.jnr-scope__selected{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    min-height:80px;
    margin-top:18px;
    padding:13px;
    border:1px solid rgba(255,255,255,.055);
    border-radius:11px;
    background:rgba(255,255,255,.018);
}

.jnr-scope__selected span{
    align-self:flex-start;
    padding:6px 8px;
    border-radius:20px;
    color:#76ddff;
    background:rgba(82,207,255,.08);
    font-size:.47rem;
}

.jnr-scope__summary dl{margin:18px 0 0}
.jnr-scope__summary dl>div{
    display:flex;
    justify-content:space-between;
    gap:18px;
    padding:10px 0;
    border-bottom:1px solid rgba(255,255,255,.045);
    font-size:.53rem;
}

.jnr-scope__summary dt{color:#587181}
.jnr-scope__summary dd{margin:0;color:#b9cad2}

.jnr-scope__summary>button{
    width:100%;
    min-height:46px;
    margin-top:20px;
    border:0;
    border-radius:11px;
    color:#06131c;
    background:linear-gradient(135deg,#70e0ff,#568eff);
    font-size:.57rem;
    font-weight:900;
    cursor:pointer;
}

.jnr-scope__summary>small{
    display:block;
    margin-top:10px;
    color:#526a79;
    font-size:.45rem;
    line-height:1.5;
    text-align:center;
}

.jnr-includes{
    margin-top:90px;
}

.jnr-includes>header{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:25px;
}

.jnr-includes h3{
    margin:0;
    font-size:1.65rem;
    letter-spacing:-.04em;
}

.jnr-includes>div{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    margin-top:28px;
}

.jnr-includes article{
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:14px;
    padding:21px;
    border:1px solid rgba(255,255,255,.055);
    border-radius:15px;
    background:rgba(255,255,255,.016);
}

.jnr-includes article>span{
    display:grid;place-items:center;
    width:42px;height:42px;
    border-radius:11px;
    color:#65daff;
    background:rgba(91,211,255,.075);
}

.jnr-includes strong{font-size:.67rem}
.jnr-includes p{
    grid-column:2;
    margin:7px 0 0;
    color:#61798a;
    font-size:.54rem;
    line-height:1.6;
}

.jnr-faq{
    display:grid;
    grid-template-columns:320px minmax(0,1fr);
    gap:60px;
    margin-top:100px;
}

.jnr-faq__intro h3{
    margin:16px 0 0;
    font-size:2rem;
    letter-spacing:-.05em;
}

.jnr-faq__intro p{
    margin:14px 0 0;
    color:#687f8f;
    font-size:.65rem;
    line-height:1.7;
}

.jnr-faq__intro a{
    display:inline-flex;
    align-items:center;
    gap:9px;
    margin-top:23px;
    color:#69dbff;
    font-size:.57rem;
    font-weight:800;
    text-decoration:none;
}

.jnr-faq__list{
    border-top:1px solid rgba(255,255,255,.065);
}

.jnr-faq__list article{
    border-bottom:1px solid rgba(255,255,255,.065);
}

.jnr-faq__list button{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    width:100%;
    min-height:74px;
    padding:0;
    border:0;
    color:#dfeaf0;
    background:transparent;
    font-size:.74rem;
    font-weight:800;
    text-align:left;
    cursor:pointer;
}

.jnr-faq__list button i{
    color:#68d9ff;
    font-size:.6rem;
}

.jnr-faq__answer{
    overflow:hidden;
}

.jnr-faq__answer p{
    max-width:760px;
    margin:0;
    padding:0 50px 23px 0;
    color:#687f8f;
    font-size:.62rem;
    line-height:1.75;
}

.jnr-conversion{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(440px,1.1fr);
    gap:55px;
    overflow:hidden;
    margin-top:100px;
    padding:48px;
    border:1px solid rgba(92,214,255,.11);
    border-radius:27px;
    background:
        radial-gradient(circle at 12% 50%,rgba(46,169,225,.12),transparent 34%),
        radial-gradient(circle at 90% 10%,rgba(117,77,236,.09),transparent 30%),
        rgba(255,255,255,.016);
}

.jnr-conversion__visual{
    position:relative;
    align-self:center;
    z-index:1;
}

.jnr-conversion__orb{
    position:absolute;
    left:-160px;top:-180px;
    width:380px;height:380px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(75,196,248,.12),transparent 68%);
    filter:blur(12px);
    pointer-events:none;
}

.jnr-conversion__badge{
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:8px 11px;
    border:1px solid rgba(97,216,255,.11);
    border-radius:20px;
    color:#65d9ff;
    background:rgba(83,204,255,.06);
    font-size:.5rem;
    font-weight:900;
    letter-spacing:.09em;
}

.jnr-conversion__visual h3{
    margin:23px 0 0;
    font-size:clamp(2rem,4vw,3.8rem);
    line-height:1.03;
    letter-spacing:-.06em;
}

.jnr-conversion__visual p{
    margin:18px 0 0;
    color:#6d8494;
    font-size:.68rem;
    line-height:1.8;
}

.jnr-conversion__visual ul{
    margin:24px 0 0;
    padding:0;
    list-style:none;
}

.jnr-conversion__visual li{
    display:flex;
    align-items:center;
    gap:9px;
    margin:11px 0;
    color:#9cb0bb;
    font-size:.59rem;
}

.jnr-conversion__visual li i{color:#57d99b}

.jnr-demo-form{
    position:relative;
    z-index:1;
    padding:25px;
    border:1px solid rgba(255,255,255,.07);
    border-radius:18px;
    background:#07131d;
    box-shadow:0 25px 70px rgba(0,0,0,.22);
}

.jnr-demo-form__row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.jnr-demo-form label{
    display:block;
    margin-bottom:13px;
}

.jnr-demo-form label>span{
    display:block;
    margin-bottom:7px;
    color:#7f96a5;
    font-size:.52rem;
    font-weight:700;
}

.jnr-demo-form input,
.jnr-demo-form select,
.jnr-demo-form textarea{
    width:100%;
    border:1px solid rgba(255,255,255,.065);
    border-radius:10px;
    outline:none;
    color:#e5eef2;
    background:rgba(255,255,255,.025);
    font:inherit;
    font-size:.59rem;
    transition:.2s ease;
}

.jnr-demo-form input,
.jnr-demo-form select{
    height:43px;
    padding:0 12px;
}

.jnr-demo-form textarea{
    resize:vertical;
    min-height:95px;
    padding:12px;
}

.jnr-demo-form input:focus,
.jnr-demo-form select:focus,
.jnr-demo-form textarea:focus{
    border-color:rgba(97,216,255,.28);
    box-shadow:0 0 0 3px rgba(91,210,255,.055);
}

.jnr-demo-form .is-invalid{
    border-color:rgba(255,100,100,.5);
}

.jnr-demo-form__scope{
    padding:12px;
    border:1px solid rgba(90,211,255,.09);
    border-radius:10px;
    background:rgba(76,195,255,.045);
}

.jnr-demo-form__scope span,
.jnr-demo-form__scope strong{display:block}

.jnr-demo-form__scope span{
    color:#5d7687;
    font-size:.47rem;
}

.jnr-demo-form__scope strong{
    margin-top:6px;
    color:#6bdcff;
    font-size:.55rem;
    line-height:1.5;
}

.jnr-demo-form>button{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    width:100%;
    min-height:48px;
    margin-top:15px;
    border:0;
    border-radius:11px;
    color:#06131c;
    background:linear-gradient(135deg,#70e0ff,#568eff);
    box-shadow:0 14px 30px rgba(69,164,255,.16);
    font-size:.59rem;
    font-weight:900;
    cursor:pointer;
}

.jnr-demo-form>small{
    display:block;
    margin-top:11px;
    color:#4f6777;
    font-size:.44rem;
    line-height:1.5;
    text-align:center;
}

.jnr-demo-form__message{
    min-height:18px;
    margin:10px 0 0;
    color:#61d99d;
    font-size:.53rem;
    text-align:center;
}

[data-pricing-reveal]{
    opacity:0;
    transform:translateY(24px);
    transition:opacity .75s ease,transform .75s cubic-bezier(.2,.8,.2,1);
}

[data-pricing-reveal].is-visible{
    opacity:1;
    transform:none;
}

@media(max-width:1050px){
    .jnr-pricing__plans{grid-template-columns:1fr 1fr}
    .jnr-plan--featured{grid-column:span 2}
    .jnr-scope__intro{grid-template-columns:1fr 1fr}
    .jnr-scope__builder{grid-template-columns:1fr}
    .jnr-scope__summary{position:static}
    .jnr-conversion{grid-template-columns:1fr}
}

@media(max-width:800px){
    .jnr-pricing{padding:90px 0}
    .jnr-pricing__plans{grid-template-columns:1fr}
    .jnr-plan--featured{grid-column:auto}
    .jnr-scope{padding:26px 18px}
    .jnr-scope__intro{grid-template-columns:1fr}
    .jnr-scope__modules{grid-template-columns:1fr 1fr}
    .jnr-includes>header{align-items:flex-start;flex-direction:column}
    .jnr-includes>div{grid-template-columns:1fr 1fr}
    .jnr-faq{grid-template-columns:1fr;gap:35px}
}

@media(max-width:600px){
    .jnr-pricing{padding:72px 0}
    .jnr-pricing__header h2{font-size:2.55rem}
    .jnr-pricing__header p{font-size:.8rem}
    .jnr-plan{padding:23px}
    .jnr-scope__modules{grid-template-columns:1fr}
    .jnr-includes>div{grid-template-columns:1fr}
    .jnr-conversion{padding:27px 18px}
    .jnr-demo-form{padding:18px}
    .jnr-demo-form__row{grid-template-columns:1fr}
}

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