/* SofolX homepage styles */
:root { 
        --bd-green: #008f68; 
        --bd-red: #e63946; 
        --text-dark: #1d3557;
        --bg-light: #f8f9fa;
        --transition-soft: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    }
    
    body {
        font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
        color: var(--text-dark);
        background-color: var(--bg-light);
    }

    /* === Hero Section === */
    .hero-wrapper {
        position: relative;
        padding: 120px 0 100px; /* লেখা যেন নিচে না নামে, তাই প্যাডিং কমানো হয়েছে */
        background: linear-gradient(135deg, #f0fdf4 0%, #fff1f2 100%);
        overflow: hidden;
        min-height: 85vh;
        display: flex;
        align-items: center;
    }
    
    .hero-bg-shapes {
        position: absolute;
        top: 0; left: 0; width: 100%; height: 100%; z-index: 1;
        overflow: hidden;
    }
    .shape-1 {
        position: absolute; top: -10%; left: -5%; width: 400px; height: 400px;
        background: radial-gradient(circle, rgba(0, 143, 104, 0.15) 0%, transparent 70%);
        border-radius: 50%;
        filter: blur(40px);
    }
    .shape-2 {
        position: absolute; bottom: -10%; right: -5%; width: 500px; height: 500px;
        background: radial-gradient(circle, rgba(230, 57, 70, 0.1) 0%, transparent 70%);
        border-radius: 50%;
        filter: blur(50px);
    }

    .hero-title { 
        font-size: clamp(2.8rem, 8vw, 5.5rem); 
        font-weight: 900; 
        line-height: 1.15; 
        margin-bottom: 30px; 
        color: var(--text-dark); 
        letter-spacing: -1.5px; 
    }
    .hero-title span.green { color: var(--bd-green); position: relative; display: inline-block;}
    .hero-title span.green::after {
        content: ''; position: absolute; left: 0; bottom: 8px; width: 100%; height: 12px;
        background: rgba(0, 143, 104, 0.2); z-index: -1; transform: skewX(-15deg);
    }
    .hero-title span.red { color: var(--bd-red); }

    .btn-luxury {
        background: linear-gradient(135deg, var(--bd-green) 0%, #006a4e 100%);
        color: #fff; padding: 18px 45px; border-radius: 50px; font-weight: 600; font-size: 1.1rem;
        text-decoration: none; display: inline-flex; align-items: center; gap: 10px;
        transition: var(--transition-soft);
        box-shadow: 0 10px 25px rgba(0, 143, 104, 0.3);
        border: none;
    }
    .btn-luxury:hover { 
        transform: translateY(-5px); 
        box-shadow: 0 15px 35px rgba(0, 143, 104, 0.4); 
        color: #fff; 
    }

    .btn-outline-custom {
        background: transparent; color: var(--text-dark); padding: 18px 45px; border-radius: 50px; 
        font-weight: 600; font-size: 1.1rem; text-decoration: none; border: 2px solid #e2e8f0;
        transition: var(--transition-soft);
    }
    .btn-outline-custom:hover {
        background: #fff; border-color: var(--bd-red); color: var(--bd-red);
        box-shadow: 0 10px 25px rgba(230, 57, 70, 0.15); transform: translateY(-5px);
    }

    /* === Section Headers === */
    .section-header h2 {
        font-size: 2.5rem; font-weight: 800; color: var(--text-dark); position: relative; padding-bottom: 15px; margin-bottom: 10px; text-transform: uppercase; letter-spacing: 1px;
    }
    .section-header h2::after {
        content: ''; position: absolute; display: block; width: 60px; height: 4px; background: var(--bd-green); bottom: 0; left: calc(50% - 30px); border-radius: 5px;
    }
    .section-header p { color: #64748b; font-size: 1.1rem; font-weight: 500; }

    /* === Cards === */
    .feature-card { 
        background: rgba(255, 255, 255, 0.8); backdrop-filter: blur(10px);
        padding: 50px 30px; border-radius: 24px; border: 1px solid rgba(255,255,255,0.5); 
        height: 100%; transition: var(--transition-soft); text-align: center;
        box-shadow: 0 10px 30px rgba(0,0,0,0.03);
    }
    .feature-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0,0,0,0.08); background: #fff;}
    .feature-card img { height: 80px; margin-bottom: 30px; filter: drop-shadow(0 10px 10px rgba(0,0,0,0.05)); transition: var(--transition-soft); }
    .feature-card:hover img { transform: scale(1.1); }
    .feature-card h4 { font-weight: 700; color: var(--text-dark); margin-bottom: 15px;}

    /* === Services Box === */
    .service-box {
        background: #fff; padding: 40px 30px; border-radius: 24px; text-align: center;
        transition: var(--transition-soft); border: 1px solid #f1f5f9;
        box-shadow: 0 5px 15px rgba(0,0,0,0.02); height: 100%;
    }
    .service-box:hover { transform: translateY(-8px); box-shadow: 0 15px 30px rgba(0,0,0,0.08); border-color: #e2e8f0;}
    .service-box i.icon { 
        font-size: 45px; margin-bottom: 25px; display: inline-flex; align-items: center; justify-content: center;
        width: 90px; height: 90px; border-radius: 50%; background: #f8fafc; transition: var(--transition-soft);
    }
    .service-box:hover i.icon { background: var(--bd-green); color: #fff !important; transform: rotateY(180deg);}
    .service-box h3 { font-size: 1.4rem; font-weight: 700; margin-bottom: 15px; }

    /* === Pricing Box === */
    .pricing .box {
        padding: 50px 35px; background: #fff; border-radius: 24px; position: relative; overflow: hidden;
        text-align: center; transition: var(--transition-soft); border: 1px solid #f1f5f9;
        box-shadow: 0 10px 30px rgba(0,0,0,0.03);
    }
    .pricing .box:hover { transform: scale(1.03); box-shadow: 0 20px 40px rgba(0, 143, 104, 0.1); border-color: rgba(0,143,104,0.2); }
    .pricing .badge { padding: 8px 15px; font-size: 0.85rem; letter-spacing: 1px; text-transform: uppercase; border-radius: 20px; }
    .pricing .btn-buy {
        background: #f8fafc; color: var(--text-dark); border: 1px solid #e2e8f0; transition: var(--transition-soft);
    }
    .pricing .box:hover .btn-buy { background: var(--text-dark); color: #fff; border-color: var(--text-dark); }

    /* === Accordion (FAQ) === */
    .accordion-item { border: none; border-radius: 16px !important; overflow: hidden; margin-bottom: 15px; background: #fff; box-shadow: 0 4px 15px rgba(0,0,0,0.02); }
    .accordion-button { font-weight: 600; color: var(--text-dark); padding: 20px 25px; background: #fff; box-shadow: none !important; }
    .accordion-button:not(.collapsed) { color: var(--bd-green); background: #f0fdf4; }
    .accordion-button::after { background-size: 1.2rem; }
    .accordion-body { padding: 0 25px 20px; color: #64748b; line-height: 1.7; background: #fff; }
    .accordion-button:not(.collapsed) + .accordion-collapse .accordion-body { background: #f0fdf4; }

    /* === Contact Info Box === */
    .contact .info-box { transition: var(--transition-soft); border: 1px solid transparent; }
    .contact .info-box:hover { transform: translateY(-5px); border-color: #e2e8f0; box-shadow: 0 15px 30px rgba(0,0,0,0.05) !important; }
    .contact .info-box i { width: 60px; height: 60px; display: inline-flex; align-items: center; justify-content: center; background: #f8fafc; border-radius: 50%; transition: var(--transition-soft); }
    .contact .info-box:hover i { transform: scale(1.1); }

@media (min-width: 992px) { .border-end-lg { border-right: 1px solid #f1f5f9; } }

.plan-feature-icon{width:32px;height:32px;min-width:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:#f1eaff;color:#7c3aed;margin-right:10px;box-shadow:0 3px 9px rgba(124,58,237,.14)}
.plan-feature-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.opacity-50 .plan-feature-icon{background:#e5e7eb;color:#9ca3af;box-shadow:none}
.pricing-cycle{position:relative;display:flex;max-width:620px;margin:0 auto 46px;padding:8px;border:5px solid transparent;border-radius:999px;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(90deg,#8b24e8,#ef2d92) border-box;box-shadow:0 12px 34px rgba(124,58,237,.12)}
.pricing-cycle button{position:relative;z-index:2;width:50%;border:0;border-radius:999px;padding:17px 12px;background:transparent;color:#14213a;font-size:22px;font-weight:800;transition:.25s}.pricing-cycle button.active{background:#e9eef6;box-shadow:0 8px 20px rgba(15,23,42,.1)}.pricing-cycle-save{position:absolute;right:-18px;top:-43px;transform:rotate(8deg);padding:8px 22px;border:4px solid #fff;border-radius:999px;background:#ed365d;color:#fff;font-size:17px;font-weight:900;box-shadow:0 8px 22px rgba(237,54,93,.3)}
.pricing-plan-item[hidden]{display:none!important}
.mbp-overlay{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(1,7,25,.82);backdrop-filter:blur(10px);font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}.mbp-overlay[hidden]{display:none}.mbp-modal{width:min(884px,100%);max-height:calc(100vh - 42px);overflow:auto;border:2px solid #16496b;border-radius:38px;background:#0d172d;color:#f5f8ff;box-shadow:0 32px 90px rgba(0,0,0,.62)}.mbp-head{position:relative;display:grid;grid-template-columns:125px 1fr 60px;align-items:center;gap:24px;padding:52px 52px 46px;background:linear-gradient(125deg,#2359e2 0%,#167bc1 56%,#079b7b 100%);overflow:hidden}.mbp-head:before,.mbp-head:after{content:'';position:absolute;border:2px solid rgba(255,255,255,.18);border-radius:50%}.mbp-head:before{width:250px;height:250px;right:-78px;top:-120px}.mbp-head:after{width:280px;height:280px;left:100px;bottom:-220px;background:rgba(255,255,255,.06)}.mbp-shield{position:relative;z-index:1;width:125px;height:125px;border-radius:38px;display:grid;place-items:center;background:rgba(255,255,255,.12);border:2px solid rgba(255,255,255,.17)}.mbp-shield svg{width:64px;height:64px}.mbp-heading{position:relative;z-index:1}.mbp-eyebrow{font-size:26px;font-weight:700;letter-spacing:3px}.mbp-title{margin:10px 0 0;color:#fff;font-family:'Poppins',sans-serif;font-size:52px;line-height:1.16;font-weight:900;white-space:pre-line}.mbp-x{position:relative;z-index:2;align-self:start;border:0;background:transparent;color:#dfeaff;font-size:58px;font-weight:900;line-height:1;cursor:pointer}.mbp-body{padding:54px 52px 50px}.mbp-intro{margin:0 0 44px;color:#d2daea;font-size:32px;line-height:1.5}.mbp-choice{padding:38px 40px;border-radius:32px;margin-bottom:30px;background:#102b32;border:2px solid #086856}.mbp-choice.yearly{background:#10273e;border-color:#0a5884}.mbp-choice-label{display:flex;align-items:center;gap:20px;color:#63e2b3;font-size:31px;font-weight:700}.mbp-choice.yearly .mbp-choice-label{color:#62c8f6}.mbp-check{width:64px;height:64px;min-width:64px;display:grid;place-items:center;border-radius:50%;background:#00a778;color:#fff;font-size:42px;font-weight:900}.mbp-choice.yearly .mbp-check{background:#078fd1}.mbp-days{margin:28px 0 8px;color:#fff;font-size:68px;font-weight:500;line-height:1.08}.mbp-suffix{color:#d0daea;font-size:31px}.mbp-note{margin:40px 0 48px;padding:35px 30px;border:2px solid #33445e;border-radius:28px;background:#172238;color:#d2daea;text-align:center;font-size:28px;line-height:1.5}.mbp-close{width:100%;padding:23px;border:2px solid #33445e;border-radius:25px;background:transparent;color:#fff;font-size:29px;font-weight:700;cursor:pointer}@media(max-width:650px){.pricing-cycle{margin-left:12px;margin-right:12px}.pricing-cycle button{font-size:17px;padding:14px 8px}.pricing-cycle-save{right:-8px;top:-35px;font-size:13px;padding:6px 14px}.mbp-overlay{padding:15px}.mbp-modal{border-radius:22px;max-height:calc(100vh - 30px)}.mbp-head{grid-template-columns:64px 1fr 34px;gap:14px;padding:30px 22px 26px}.mbp-shield{width:64px;height:64px;border-radius:20px}.mbp-shield svg{width:38px;height:38px}.mbp-eyebrow{font-size:15px;letter-spacing:2px}.mbp-title{font-size:30px}.mbp-x{font-size:38px}.mbp-body{padding:30px 22px 26px}.mbp-intro{font-size:20px;margin-bottom:25px}.mbp-choice{padding:22px 20px;border-radius:20px;margin-bottom:18px}.mbp-choice-label{gap:12px;font-size:20px}.mbp-check{width:43px;height:43px;min-width:43px;font-size:29px}.mbp-days{font-size:48px;margin-top:19px}.mbp-suffix{font-size:20px}.mbp-note{font-size:18px;margin:25px 0 28px;padding:22px 16px;border-radius:18px}.mbp-close{font-size:20px;padding:16px;border-radius:17px}}
/* Standard popup sizing: readable, centered and fully contained in every viewport. */
.mbp-overlay{padding:18px!important;overscroll-behavior:none}.mbp-modal{width:min(420px,calc(100vw - 54px))!important;max-height:none!important;border-radius:22px!important;overflow:hidden!important}.mbp-head{grid-template-columns:54px minmax(0,1fr) 30px!important;gap:11px!important;padding:17px!important}.mbp-shield{width:54px!important;height:54px!important;border-radius:15px!important}.mbp-shield svg{width:32px!important;height:32px!important}.mbp-heading{min-width:0!important}.mbp-eyebrow{font-size:12px!important;line-height:1.3!important;letter-spacing:.8px!important;overflow-wrap:break-word}.mbp-title{font-size:25px!important;line-height:1.05!important;letter-spacing:-.45px!important;overflow-wrap:normal!important;word-break:normal!important}.mbp-x{font-size:30px!important;width:30px!important;height:30px!important;padding:0!important}.mbp-body{padding:17px!important}.mbp-intro{margin:0 0 12px!important;font-size:14px!important;line-height:1.45!important;overflow-wrap:break-word}.mbp-choice{padding:11px 13px!important;margin-bottom:9px!important;border-radius:16px!important}.mbp-choice-label{gap:8px!important;font-size:15px!important;line-height:1.3!important}.mbp-check{width:31px!important;height:31px!important;min-width:31px!important;font-size:20px!important}.mbp-days{margin:7px 0 2px!important;font-size:30px!important;line-height:1.05!important}.mbp-suffix{font-size:13px!important;line-height:1.35!important}.mbp-note{margin:10px 0!important;padding:10px!important;border-radius:14px!important;font-size:12px!important;line-height:1.4!important}.mbp-close{padding:9px!important;border-radius:14px!important;font-size:14px!important;line-height:1.2!important}@media(max-width:420px){.mbp-modal{width:calc(100vw - 64px)!important;border-radius:19px!important}.mbp-head{grid-template-columns:44px minmax(0,1fr) 24px!important;gap:8px!important;padding:14px 12px!important}.mbp-shield{width:44px!important;height:44px!important;border-radius:13px!important}.mbp-shield svg{width:27px!important;height:27px!important}.mbp-eyebrow{font-size:10px!important;letter-spacing:.45px!important}.mbp-title{font-size:20px!important;letter-spacing:-.25px!important}.mbp-x{font-size:25px!important;width:24px!important;height:24px!important}.mbp-body{padding:13px 12px!important}.mbp-intro{font-size:12.5px!important;margin-bottom:10px!important}.mbp-choice{padding:9px 11px!important;margin-bottom:8px!important;border-radius:14px!important}.mbp-choice-label{font-size:13px!important}.mbp-check{width:27px!important;height:27px!important;min-width:27px!important;font-size:18px!important}.mbp-days{font-size:26px!important;margin-top:6px!important}.mbp-suffix{font-size:12px!important}.mbp-note{font-size:11px!important;margin:8px 0!important;padding:8px!important;border-radius:12px!important}.mbp-close{font-size:12px!important;padding:8px!important;border-radius:12px!important}}

/* SEO and performance classes previously expressed as inline styles */
.hero-content-layer{z-index:10}
.hero-badge{color:var(--bd-green);background:rgba(0,143,104,.1);letter-spacing:1px;font-size:14px}
.hero-kicker{display:block;margin:0 auto 14px;color:#73b9ff;font-size:clamp(.95rem,2vw,1.2rem);font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.hero-description{max-width:780px;line-height:1.8}
.hero-keyword-line{color:#86a7c7;letter-spacing:.02em}
.counter-green{color:var(--bd-green)}
.counter-dark{color:var(--text-dark)}
.counter-red{color:var(--bd-red)}
.seo-copy{line-height:1.85}
.plan-name{color:var(--text-dark)}
.platform-logo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;gap:28px;max-width:900px;margin:0 auto}
.platform-logo-item{min-height:82px;display:flex;align-items:center;justify-content:center;padding:14px 18px;border:1px solid rgba(148,163,184,.15);border-radius:16px;background:rgba(255,255,255,.03)}
.platform-logo-item img{max-width:100%;max-height:58px;width:auto;height:auto;object-fit:contain;filter:grayscale(1);opacity:.72;transition:filter .2s ease,opacity .2s ease,transform .2s ease}
.platform-logo-item:hover img{filter:none;opacity:1;transform:translateY(-2px)}
@media(max-width:767px){.platform-logo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.platform-logo-item{min-height:72px;padding:12px}.hero-kicker{letter-spacing:.05em}}