/* Price page CSS moved from resources/views/price.blade.php */
:root {
            --primary-green: #34a853;
            --dark-green: #1f873f;
            --deep-green: #0f6b2d;
            --light-green: #eaf7ef;
            --soft-green: #f6fcf8;
            --black: #101010;
            --dark-text: #202124;
            --text: #4f555c;
            --muted: #6f757d;
            --border: #e2ebe5;
            --danger: #ef4444;
            --danger-soft: #fff2f2;
            --white: #ffffff;
            --heading-font: 'Kreon', serif;
            --body-font: 'Raleway', sans-serif;
        }

     

        .fontset {
            font-family: var(--body-font);
        }

        /* HERO SECTION - SAME */
        .blog-hero {
            background: linear-gradient(to bottom, #f7f7f7, #efefef);
            padding: 80px 0 60px;
            position: relative;
            overflow: hidden;
        }

        .blog-hero h1 {
            font-size: 60px;
            font-weight: 600;
            color: #111;
            position: relative;
            display: inline-block;
            z-index: 2;
        }

        .blog-hero h1::after {
            content: "";
            position: absolute;
            left: 50%;
            bottom: 0px;
            transform: translateX(-50%) rotate(-1deg);
            width: 115%;
            height: 15px;
            background: #18c15e;
            border-radius: 50px;
            z-index: -1;
            clip-path: polygon(
                0% 65%,
                8% 55%,
                18% 60%,
                28% 48%,
                40% 58%,
                52% 45%,
                66% 57%,
                78% 50%,
                90% 60%,
                100% 52%,
                100% 100%,
                0% 100%
            );
        }

        .blog-hero p {
            font-size: 22px;
            color: #666;
            max-width: 700px;
            margin: 25px auto 0;
            line-height: 1.7;
        }

        .hero-shape-left,
        .hero-shape-right {
            position: absolute;
            opacity: 1;
            width: 17%;
        }

        .hero-shape-left {
            left: 5%;
            top: 25%;
        }

        .hero-shape-right {
            right: 5%;
            top: 12%;
        }

        /* PRICE PAGE */
        .price-page {
            background:
                radial-gradient(circle at top left, rgba(52,168,83,0.13), transparent 30%),
                radial-gradient(circle at bottom right, rgba(52,168,83,0.10), transparent 34%),
                #ffffff;
            padding: 80px 0 95px;
            overflow: hidden;
        }

        .price-wide-container {
            width: 100%;
            max-width: 1780px;
            margin: 0 auto;
            padding: 0 28px;
        }

        .price-top-box {
            background: linear-gradient(135deg, #15803d 0%, #34a853 58%, #72d18a 100%);
            border-radius: 34px;
            padding: 55px 26px 135px;
            position: relative;
            overflow: hidden;
            text-align: center;
            box-shadow: 0 28px 80px rgba(52, 168, 83, 0.22);
        }

        .price-top-box::before,
        .price-top-box::after {
            content: "";
            position: absolute;
            width: 280px;
            height: 280px;
            border-radius: 45px;
            background: rgba(255, 255, 255, 0.13);
            transform: rotate(45deg);
        }

        .price-top-box::before {
            left: -105px;
            bottom: -125px;
        }

        .price-top-box::after {
            right: -95px;
            top: -125px;
        }

        .price-badge {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 10px 20px;
            border-radius: 100px;
            background: rgba(255, 255, 255, 0.18);
            color: #fff;
            font-size: 14px;
            font-weight: 600;
            margin-bottom: 18px;
            position: relative;
            z-index: 2;
        }

        .price-top-box h2 {
            font-family: var(--heading-font);
            font-size: 54px;
            font-weight: 700;
            color: #fff;
            margin-bottom: 14px;
            position: relative;
            z-index: 2;
        }

        .price-top-box p {
            max-width: 760px;
            margin: 0 auto 30px;
            color: rgba(255, 255, 255, 0.94);
            font-size: 17px;
            line-height: 1.7;
            position: relative;
            z-index: 2;
        }

        .price-tabs {
            width: fit-content;
            margin: 0 auto;
            background: #fff;
            padding: 8px;
            border-radius: 100px;
            display: flex;
            gap: 7px;
            box-shadow: 0 14px 35px rgba(0,0,0,0.15);
            position: relative;
            z-index: 3;
        }

        .price-tab-btn {
            border: none;
            outline: none;
            background: transparent;
            color: #333;
            padding: 12px 26px;
            border-radius: 100px;
            font-size: 14px;
            font-weight: 600;
            transition: 0.3s ease;
            white-space: nowrap;
        }

        .price-tab-btn.active,
        .price-tab-btn:hover {
            background: var(--primary-green);
            color: #fff;
        }

        .pricing-grid-wrap {
            margin-top: -92px;
            position: relative;
            z-index: 5;
        }

        .pricing-grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 10px;
            align-items: start;
        }

        .price-card {
            background: #fff;
            border: 1px solid var(--border);
            border-radius: 28px;
            padding: 28px 24px 26px;
            min-height: 100%;
            box-shadow: 0 16px 48px rgba(0, 0, 0, 0.075);
            position: relative;
            overflow: hidden;
            transition: all 0.35s ease;
            display: flex;
            flex-direction: column;
        }

        .price-card::before {
            content: "";
            position: absolute;
            top: 0;
            left: 22px;
            right: 22px;
            height: 5px;
            background: linear-gradient(90deg, transparent, rgba(52,168,83,0.85), transparent);
            border-radius: 0 0 40px 40px;
        }

        .price-card:hover {
            transform: translateY(-8px);
            border-color: rgba(52,168,83,0.48);
            box-shadow: 0 28px 75px rgba(52,168,83,0.17);
        }

        .price-card.popular {
            border: 2px solid var(--primary-green);
            transform: translateY(-34px);
            padding-top: 75px;
            box-shadow: 0 32px 90px rgba(52,168,83,0.27);
            background:
                linear-gradient(#ffffff, #ffffff) padding-box,
                linear-gradient(135deg, #34a853, #0f6b2d) border-box;
        }

        .price-card.popular:hover {
            transform: translateY(-44px);
        }

        .popular-top {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 54px;
            background: linear-gradient(135deg, #0f6b2d, #34a853);
            color: #fff;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 14px;
            font-weight: 600;
            letter-spacing: 0.8px;
            text-transform: uppercase;
        }

        .plan-icon {
            width: 58px;
            height: 58px;
            border-radius: 18px;
            background: var(--light-green);
            color: var(--primary-green);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 27px;
            margin-bottom: 18px;
        }

        .price-card h3 {
            color: var(--dark-text);
            font-size: 25px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.4px;
            margin-bottom: 15px;
            line-height: 1.2;
        }

        .plan-price {
            display: flex;
            align-items: flex-end;
            gap: 9px;
            margin-bottom: 16px;
            flex-wrap: wrap;
        }

        .plan-price strong {
            color: #050505;
            font-size: 44px;
            font-weight: 600;
            line-height: 0.95;
            letter-spacing: -1px;
        }

        .plan-price span {
            color: #50565e;
            font-size: 15px;
            font-weight: 600;
            margin-bottom: 5px;
        }

        .plan-short {
            color: var(--dark-text);
            font-size: 16px;
            font-weight: 600;
            line-height: 1.55;
            margin-bottom: 20px;
            min-height: 74px;
        }

        .plan-meta {
            background: var(--soft-green);
            border: 1px solid #dcebe2;
            border-radius: 18px;
            padding: 14px 16px;
            margin-bottom: 22px;
        }

        .plan-meta p {
            margin: 0 0 8px;
            color: #34383d;
            font-size: 15px;
            line-height: 1.45;
            font-weight: 500;
        }

        .plan-meta p:last-child {
            margin-bottom: 0;
        }

        .plan-meta strong {
            color: #111;
            font-weight: 600;
        }

        .feature-block {
            margin-bottom: 20px;
        }

        .feature-title {
            color: #111;
            font-size: 18px;
            font-weight: 600;
            margin-bottom: 12px;
        }

        .included-box,
        .not-included-box {
            border-radius: 18px;
            padding: 12px 12px 4px;
        }

        .included-box {
            background: #fbfffc;
            border: 1px solid #e5efe9;
        }

        .not-included-box {
            background: #fffafa;
            border: 1px dashed rgba(239,68,68,0.35);
        }

        .price-features {
            list-style: none;
            margin: 0;
            padding: 0;
        }

        .price-features li {
            display: flex;
            align-items: flex-start;
            gap: 10px;
            color: #3f454b;
            font-size: 15.5px;
            font-weight: 600;
            line-height: 1.55;
            margin-bottom: 12px;
        }

        .price-features li i {
            width: 22px;
            height: 22px;
            min-width: 22px;
            border-radius: 50%;
            background: var(--light-green);
            color: var(--primary-green);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 12px;
            margin-top: 1px;
        }

        .price-features.not-included li {
            color: #555b62;
        }

        .price-features.not-included li i {
            background: var(--danger-soft);
            color: var(--danger);
        }

        .best-for {
            color: #3f454b;
            font-size: 15px;
            font-weight: 600;
            line-height: 1.65;
            margin: 6px 0 24px;
        }

        .best-for strong {
            color: #111;
            font-weight: 600;
        }

        .price-btn {
            margin-top: auto;
            width: 100%;
            height: 54px;
            border-radius: 15px;
            border: 1px solid var(--primary-green);
            background: var(--primary-green);
            color: #fff;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            text-decoration: none;
            font-size: 16px;
            font-weight: 600;
            transition: 0.3s ease;
            box-shadow: 0 12px 28px rgba(52,168,83,0.22);
        }

        .price-btn:hover {
            background: var(--dark-green);
            border-color: var(--dark-green);
            color: #fff;
            transform: translateY(-2px);
        }

        .price-btn.outline {
            background: #fff;
            color: var(--primary-green);
            box-shadow: none;
        }

        .price-btn.outline:hover {
            background: var(--primary-green);
            color: #fff;
        }

        /* SECTIONS */
        .section-gap {
            padding-top: 75px;
        }

        .section-small-title {
            text-align: center;
            color: var(--primary-green);
            font-size: 14px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 1px;
            margin-bottom: 10px;
        }

        .section-main-title {
            text-align: center;
            font-family: var(--heading-font);
            color: #111;
            font-size: 46px;
            font-weight: 700;
            margin-bottom: 14px;
        }

        .section-desc {
            max-width: 780px;
            margin: 0 auto 38px;
            text-align: center;
            color: #555;
            font-size: 16.5px;
            line-height: 1.75;
            font-weight: 500;
        }

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

        .benefit-card {
            background: #fff;
            border: 1px solid var(--border);
            border-radius: 24px;
            padding: 28px 24px;
            box-shadow: 0 16px 40px rgba(0,0,0,0.05);
            transition: 0.3s ease;
        }

        .benefit-card:hover {
            transform: translateY(-8px);
            border-color: rgba(52,168,83,0.4);
        }

        .benefit-card i {
            width: 52px;
            height: 52px;
            border-radius: 17px;
            background: var(--light-green);
            color: var(--primary-green);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 24px;
            margin-bottom: 18px;
        }

        .benefit-card h4 {
            color: #111;
            font-size: 20px;
            font-weight: 600;
            margin-bottom: 10px;
        }

        .benefit-card p {
            color: #4f555c;
            font-size: 15px;
            line-height: 1.7;
            font-weight: 500;
            margin: 0;
        }

        /* COMPARE TABLE */
        .compare-table-wrap {
            background: #fff;
            border: 1px solid var(--border);
            border-radius: 30px;
            overflow: hidden;
            box-shadow: 0 22px 70px rgba(0,0,0,0.08);
        }

        .compare-table {
            width: 100%;
            border-collapse: collapse;
            margin: 0;
        }

        .compare-table thead th {
            background: #f3faf6;
            color: #111;
            padding: 24px 20px;
            font-size: 16px;
            font-weight: 600;
            border-bottom: 1px solid var(--border);
            white-space: nowrap;
            text-align: left;
        }

        .compare-table thead th:not(:first-child),
        .compare-table td:not(:first-child) {
            text-align: center;
        }

        .compare-table tbody td {
            padding: 19px 20px;
            border-bottom: 1px solid #e9efeb;
            color: #36404a;
            font-size: 15.5px;
            font-weight: 600;
            vertical-align: middle;
        }

        .compare-table tbody tr:last-child td {
            border-bottom: none;
        }

        .compare-table td:first-child {
            color: #111;
            font-weight: 600;
            min-width: 230px;
        }

        .compare-table tbody tr:hover td {
            background: #fbfffc;
        }

        .compare-table .scale-col {
            background: #f2fbf5;
        }

        .compare-plan-head {
            display: inline-flex;
            flex-direction: column;
            gap: 6px;
            align-items: center;
        }

        .compare-badge {
            background: var(--primary-green);
            color: #fff;
            padding: 5px 10px;
            border-radius: 100px;
            font-size: 10px;
            font-weight: 600;
            letter-spacing: 0.5px;
        }

        .status-icon {
            width: 28px;
            height: 28px;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            font-size: 14px;
            font-weight: 600;
        }

        .status-icon.yes {
            background: var(--primary-green);
            box-shadow: 0 7px 18px rgba(52,168,83,0.24);
        }

        .status-icon.no {
            background: var(--danger);
            box-shadow: 0 7px 18px rgba(239,68,68,0.22);
        }

        .feature-label {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 8px 14px;
            border-radius: 100px;
            background: #f2f5f3;
            color: #2f363d;
            font-size: 14px;
            font-weight: 600;
        }

        .feature-label.green {
            background: var(--light-green);
            color: var(--deep-green);
        }

        .feature-label.red {
            background: var(--danger-soft);
            color: #c53030;
        }

        /* FAQ */
        .faq-wrap {
            max-width: 960px;
            margin: 0 auto;
        }

        .faq-item {
            background: #fff;
            border: 1px solid var(--border);
            border-radius: 20px;
            margin-bottom: 16px;
            overflow: hidden;
            box-shadow: 0 12px 30px rgba(0,0,0,0.04);
        }

        .faq-question {
            width: 100%;
            border: none;
            background: #fff;
            padding: 22px 24px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 18px;
            color: #111;
            text-align: left;
            font-size: 17px;
            font-weight: 600;
        }

        .faq-question i {
            width: 34px;
            height: 34px;
            min-width: 34px;
            border-radius: 50%;
            background: var(--light-green);
            color: var(--primary-green);
            display: flex;
            align-items: center;
            justify-content: center;
            transition: 0.3s ease;
        }

        .faq-item.active .faq-question i {
            background: var(--primary-green);
            color: #fff;
            transform: rotate(45deg);
        }

        .faq-answer {
            display: none;
            padding: 0 24px 22px;
            color: #4f555c;
            font-size: 15.5px;
            font-weight: 500;
            line-height: 1.75;
        }

        .faq-item.active .faq-answer {
            display: block;
        }

        .pricing-cta-box {
            margin-top: 75px;
            background: linear-gradient(135deg, #101010, #252525);
            border-radius: 34px;
            padding: 48px 35px;
            text-align: center;
            position: relative;
            overflow: hidden;
        }

        .pricing-cta-box::after {
            content: "";
            position: absolute;
            width: 260px;
            height: 260px;
            border-radius: 50%;
            background: rgba(52,168,83,0.20);
            top: -95px;
            right: -80px;
        }

        .pricing-cta-box h3 {
            font-family: var(--heading-font);
            color: #fff;
            font-size: 42px;
            font-weight: 700;
            margin-bottom: 12px;
            position: relative;
            z-index: 2;
        }

        .pricing-cta-box p {
            max-width: 720px;
            margin: 0 auto 28px;
            color: rgba(255,255,255,0.78);
            font-size: 16px;
            line-height: 1.75;
            position: relative;
            z-index: 2;
        }

        .pricing-cta-box .price-btn {
            max-width: 240px;
            margin: 0 auto;
            position: relative;
            z-index: 2;
        }

        /* RESPONSIVE */
        @media (max-width: 1500px) {
            .price-wide-container {
                max-width: 1320px;
            }

            .pricing-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 16px;
            }

            .price-card.popular {
                transform: translateY(0);
            }

            .price-card.popular:hover {
                transform: translateY(-8px);
            }

            .plan-short {
                min-height: auto;
            }
        }

        @media (max-width: 991px) {
            .price-page {
                padding: 60px 0 80px;
            }

            .price-wide-container {
                padding: 0 20px;
            }

            .price-top-box {
                padding: 48px 22px 115px;
                border-radius: 30px;
            }

            .price-top-box h2 {
                font-size: 42px;
            }

            .pricing-grid-wrap {
                margin-top: -76px;
            }

            .benefit-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .compare-table-wrap {
                overflow-x: auto;
            }

            .compare-table {
                min-width: 980px;
            }
        }

        @media (max-width: 767px) {
            .blog-hero {
                padding: 58px 0 42px;
            }

            .blog-hero h1 {
                font-size: 42px;
            }

            .blog-hero p {
                font-size: 17px;
                padding: 0 15px;
            }

            .hero-shape-left,
            .hero-shape-right {
                width: 26%;
                opacity: 0.5;
            }

            .price-page {
                padding: 42px 0 65px;
            }

            .price-wide-container {
                padding: 0 14px;
            }

            .price-top-box {
                padding: 40px 16px 105px;
                border-radius: 26px;
            }

            .price-top-box h2 {
                font-size: 34px;
                line-height: 1.15;
            }

            .price-top-box p {
                font-size: 15px;
            }

            .price-tabs {
                width: 100%;
                max-width: 360px;
                overflow-x: auto;
                justify-content: flex-start;
                border-radius: 18px;
            }

            .price-tab-btn {
                padding: 10px 18px;
                font-size: 13px;
            }

            .pricing-grid {
                grid-template-columns: 1fr;
                gap: 18px;
            }

            .pricing-grid-wrap {
                margin-top: -68px;
            }

            .price-card {
                border-radius: 24px;
                padding: 26px 18px 24px;
            }

            .price-card.popular {
                padding-top: 72px;
            }

            .plan-icon {
                width: 54px;
                height: 54px;
                font-size: 24px;
            }

            .price-card h3 {
                font-size: 23px;
            }

            .plan-price strong {
                font-size: 39px;
            }

            .plan-short {
                font-size: 15.5px;
                min-height: auto;
            }

            .plan-meta {
                padding: 13px 14px;
            }

            .included-box,
            .not-included-box {
                padding: 11px 10px 3px;
            }

            .price-features li {
                font-size: 15px;
                gap: 9px;
            }

            .section-gap {
                padding-top: 56px;
            }

            .section-main-title {
                font-size: 34px;
            }

            .section-desc {
                font-size: 15px;
            }

            .benefit-grid {
                grid-template-columns: 1fr;
            }

            .faq-question {
                font-size: 15.5px;
                padding: 19px;
            }

            .faq-answer {
                padding: 0 19px 19px;
                font-size: 14.5px;
            }

            .pricing-cta-box {
                margin-top: 58px;
                padding: 38px 20px;
                border-radius: 26px;
            }

            .pricing-cta-box h3 {
                font-size: 32px;
            }
        }

        @media (max-width: 420px) {
            .price-top-box h2 {
                font-size: 30px;
            }

            .plan-price strong {
                font-size: 35px;
            }

            .plan-price span {
                font-size: 13px;
            }

            .price-card h3 {
                font-size: 22px;
            }
        }

.price-hero-title-strong{font-weight:800;}