
.price-page{
    --green:#0d3b30;
    --green-2:#117a59;
    --mint:#eaf6f1;
    --cream:#f7f5ee;
    --text:#13251f;
    --muted:#61716b;
    --line:#d8e5df;
    color:var(--text);
    overflow:hidden;
}

.price-page *{box-sizing:border-box}

.price-hero{
    max-width:1200px;
    margin:42px auto 0;
    padding:0 24px 62px;
    display:grid;
    grid-template-columns:1.02fr .98fr;
    gap:56px;
    align-items:center;
}

.price-eyebrow{
    display:block;
    color:var(--green-2);
    font-size:12px;
    line-height:1.2;
    font-weight:800;
    letter-spacing:.13em;
}

.price-hero h1{
    margin:16px 0 20px;
    color:var(--green);
    font-size:clamp(42px,5.5vw,70px);
    line-height:1.02;
    letter-spacing:-.045em;
}

.price-hero h1 em{
    color:var(--green-2);
    font-style:normal;
}

.price-lead{
    max-width:650px;
    margin:0;
    color:var(--muted);
    font-size:18px;
    line-height:1.7;
}

.price-highlights{
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin:25px 0;
}

.price-highlights span{
    padding:9px 12px;
    border:1px solid #cfe2da;
    border-radius:999px;
    background:#f4faf7;
    color:var(--green);
    font-size:13px;
    font-weight:750;
}

.price-actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:27px;
}

.price-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:50px;
    padding:0 20px;
    border:1px solid transparent;
    border-radius:11px;
    font-weight:800;
    text-decoration:none;
    transition:.18s ease;
}

.price-button:hover{
    transform:translateY(-2px);
    box-shadow:0 9px 22px rgba(13,59,48,.14);
}

.price-button.primary{background:var(--green-2);color:#fff}
.price-button.secondary{background:#fff;color:var(--green);border-color:#bcd1c8}
.price-button.dark{background:var(--green);color:#fff;width:100%}
.price-button.white{background:#fff;color:var(--green)}
.price-button.outline{color:#fff;border-color:rgba(255,255,255,.48)}
.price-button.outline:hover{color:#fff}

.price-hero-image{
    position:relative;
    min-height:500px;
}

.price-hero-image img{
    width:100%;
    height:500px;
    object-fit:cover;
    border-radius:28px;
    box-shadow:0 22px 55px rgba(13,59,48,.17);
}

.price-floating-card{
    position:absolute;
    left:-30px;
    bottom:28px;
    width:250px;
    padding:18px 20px;
    border:1px solid rgba(255,255,255,.7);
    border-radius:16px;
    background:rgba(255,255,255,.94);
    box-shadow:0 14px 35px rgba(13,59,48,.2);
    backdrop-filter:blur(10px);
}

.price-floating-card small,
.price-floating-card span{
    display:block;
    color:var(--muted);
    font-size:12px;
}

.price-floating-card strong{
    display:block;
    margin:5px 0;
    color:var(--green-2);
    font-size:24px;
}

.price-intro{
    max-width:760px;
    margin:0 auto;
    padding:72px 24px 32px;
    text-align:center;
}

.price-intro.compact{padding-top:0}

.price-intro h2,
.earnings-heading h2,
.price-protection h2{
    margin:12px 0;
    color:var(--green);
    font-size:clamp(30px,4vw,45px);
    line-height:1.12;
    letter-spacing:-.03em;
}

.price-intro p,
.earnings-heading p,
.price-protection-copy > p{
    color:var(--muted);
    font-size:17px;
    line-height:1.65;
}

.price-plans{
    max-width:1040px;
    margin:0 auto;
    padding:0 24px 85px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
}

.price-plan{
    position:relative;
    padding:34px;
    border:1px solid var(--line);
    border-radius:23px;
    background:#fff;
    box-shadow:0 15px 40px rgba(13,59,48,.07);
}

.price-plan.professional{
    border:2px solid var(--green-2);
    box-shadow:0 18px 46px rgba(17,122,89,.13);
}

.price-popular{
    position:absolute;
    top:18px;
    right:18px;
    padding:7px 10px;
    border-radius:999px;
    background:#dff5eb;
    color:var(--green-2);
    font-size:10px;
    font-weight:900;
    letter-spacing:.08em;
}

.price-plan-icon{
    display:flex;
    align-items:center;
    justify-content:center;
    width:46px;
    height:46px;
    margin-bottom:20px;
    border-radius:13px;
    background:var(--mint);
    color:var(--green-2);
    font-size:17px;
    font-weight:900;
}

.price-plan-label{
    color:var(--green-2);
    font-size:11px;
    font-weight:900;
    letter-spacing:.11em;
}

.price-plan h2{
    margin:9px 0 18px;
    color:var(--green);
    font-size:28px;
}

.price-rate{
    display:flex;
    align-items:end;
    gap:10px;
    margin-bottom:18px;
}

.price-rate strong{
    color:var(--green-2);
    font-size:54px;
    line-height:1;
}

.price-rate span{
    padding-bottom:7px;
    color:var(--muted);
    font-weight:700;
}

.price-plan > p{
    min-height:72px;
    color:var(--muted);
    line-height:1.55;
}

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

.price-plan li{
    position:relative;
    margin:12px 0;
    padding-left:25px;
    line-height:1.45;
}

.price-plan li::before{
    position:absolute;
    left:0;
    content:"✓";
    color:var(--green-2);
    font-weight:900;
}

.price-example{
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px 18px;
    margin:25px 0;
    padding:18px;
    border-radius:14px;
    background:#f4f8f6;
}

.price-example span{color:var(--muted);font-size:13px}
.price-example b{color:var(--green);font-size:14px}
.price-example .price-keep{color:var(--green-2);font-size:17px}

.earnings-section{
    padding:80px 24px;
    background:var(--green);
}

.earnings-heading{
    max-width:760px;
    margin:0 auto 32px;
    text-align:center;
}

.earnings-heading .price-eyebrow{color:#73e7b9}
.earnings-heading h2{color:#fff}
.earnings-heading p{color:#d7e6e1}

.earnings-calculator{
    max-width:960px;
    margin:auto;
    display:grid;
    grid-template-columns:1.1fr .9fr;
    border-radius:22px;
    overflow:hidden;
    background:#fff;
    box-shadow:0 22px 55px rgba(0,0,0,.22);
}

.earnings-controls{padding:36px}
.earnings-controls label{
    display:block;
    margin-bottom:32px;
    color:var(--green);
    font-weight:800;
}

.range-line{
    display:grid;
    grid-template-columns:1fr 90px;
    gap:18px;
    align-items:center;
    margin-top:15px;
}

.range-line input{width:100%;accent-color:var(--green-2)}
.range-line output{
    padding:9px;
    border-radius:9px;
    background:var(--mint);
    color:var(--green);
    text-align:center;
    font-size:13px;
}

.earnings-results{
    padding:36px;
    background:#f1f8f5;
}

.earnings-results > div{
    display:flex;
    justify-content:space-between;
    gap:20px;
    padding:14px 0;
    border-bottom:1px solid #d7e5df;
}

.earnings-results span{color:var(--muted);font-size:14px}
.earnings-results strong{color:var(--green);font-size:18px}

.earnings-main-result{
    display:block!important;
    margin-top:15px;
    padding:20px!important;
    border:0!important;
    border-radius:14px;
    background:var(--green-2);
}

.earnings-main-result span,
.earnings-main-result strong{
    display:block;
    color:#fff;
}

.earnings-main-result strong{
    margin-top:6px;
    font-size:35px;
}

.earnings-disclaimer{
    max-width:800px;
    margin:22px auto 0;
    color:#bcd1ca;
    font-size:12px;
    line-height:1.55;
    text-align:center;
}

.earning-examples{
    max-width:1100px;
    margin:0 auto;
    padding:85px 24px;
}

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

.earning-example-grid article{
    padding:27px;
    border:1px solid var(--line);
    border-radius:18px;
    background:#fff;
}

.earning-example-grid article.featured{
    border-color:var(--green-2);
    background:#f3faf7;
    transform:translateY(-8px);
}

.earning-example-grid article > span{
    color:var(--green-2);
    font-size:11px;
    font-weight:900;
    letter-spacing:.08em;
}

.earning-example-grid h3{
    margin:9px 0 18px;
    color:var(--green);
    font-size:22px;
}

.earning-example-grid dl{margin:0}
.earning-example-grid dl div{
    display:flex;
    justify-content:space-between;
    padding:10px 0;
    border-bottom:1px solid #e5ece9;
}

.earning-example-grid dt{color:var(--muted)}
.earning-example-grid dd{margin:0;color:var(--green);font-weight:850}
.earning-example-grid dl div:last-child dd{color:var(--green-2);font-size:19px}

.earning-note{
    margin:22px 0 0;
    color:var(--muted);
    font-size:12px;
    text-align:center;
}

.price-protection{
    max-width:1120px;
    margin:0 auto 90px;
    padding:25px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:45px;
    align-items:center;
    border-radius:25px;
    background:var(--cream);
}

.price-protection-image img{
    width:100%;
    height:430px;
    object-fit:cover;
    border-radius:18px;
}

.price-protection-copy{padding:25px 25px 25px 0}
.price-protection ul{padding:0;list-style:none}
.price-protection li{margin:14px 0;color:#344b43}
.price-protection li b{margin-right:9px;color:var(--green-2)}

.price-faq{
    max-width:900px;
    margin:0 auto;
    padding:0 24px 90px;
}

.price-faq-grid{display:grid;gap:12px}
.price-faq details{
    padding:18px 21px;
    border:1px solid var(--line);
    border-radius:13px;
    background:#fff;
}

.price-faq summary{
    color:var(--green);
    font-weight:800;
    cursor:pointer;
}

.price-faq details p{
    margin:14px 0 2px;
    color:var(--muted);
    line-height:1.6;
}

.price-final{
    padding:75px 24px;
    background:linear-gradient(135deg,#0d3b30,#126249);
    color:#fff;
    text-align:center;
}

.price-final .light{color:#78e7bc}
.price-final h2{
    max-width:720px;
    margin:12px auto;
    color:#fff;
    font-size:clamp(31px,4vw,47px);
}

.price-final p{color:#d8e8e2}
.price-actions.centre{justify-content:center}

@media(max-width:850px){
    .price-hero,
    .price-plans,
    .earnings-calculator,
    .price-protection{
        grid-template-columns:1fr;
    }

    .price-hero{gap:30px;margin-top:25px}
    .price-hero-image,.price-hero-image img{min-height:0;height:420px}
    .price-floating-card{left:18px}
    .price-plan > p{min-height:0}
    .earnings-results{padding-top:10px}
    .earning-example-grid{grid-template-columns:1fr}
    .earning-example-grid article.featured{transform:none}
    .price-protection-copy{padding:10px}
}

@media(max-width:560px){
    .price-hero{padding-left:16px;padding-right:16px}
    .price-hero h1{font-size:40px}
    .price-hero-image,.price-hero-image img{height:340px}
    .price-floating-card{left:12px;right:12px;width:auto;bottom:12px}
    .price-actions{display:grid}
    .price-button{width:100%}
    .price-plans{padding-left:15px;padding-right:15px}
    .price-plan{padding:25px 20px}
    .price-rate strong{font-size:46px}
    .earnings-section{padding:60px 15px}
    .earnings-controls,.earnings-results{padding:25px 19px}
    .range-line{grid-template-columns:1fr 75px;gap:10px}
    .earning-examples{padding-left:15px;padding-right:15px}
    .price-protection{margin-left:15px;margin-right:15px;padding:15px}
    .price-protection-image img{height:300px}
}
