/* =========================================================
   TEXSOFT CARE - MASTER STYLESHEET
   Section 1-10 + Preloader + Dark Mode + AI Chat +
   Floating Buttons + Payment
========================================================= */

:root{
--navy:#07142B;
--navy2:#0B2A4A;
--gold:#F4A621;
--cyan:#06B6D4;
--white:#fff;
--text:#253047;
--muted:#697386;
--soft:#F5F7FB;
--border:#E6EAF0;
--card:#fff;
--shadow:0 15px 40px rgba(7,20,43,.10);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;font-family:Poppins,Arial,sans-serif;color:var(--text);background:#fff;transition:.3s}
a{text-decoration:none}
.section-padding{padding:100px 0}
.bg-soft{background:var(--soft)}
.dark-section{background:var(--navy);color:#fff}
.section-heading{margin-bottom:55px}
.section-heading h2{font-size:42px;font-weight:800;margin:12px 0}
.section-heading h2 span,.about-visual + div h2 span{color:var(--gold)}
.section-heading p{color:var(--muted)}
.section-tag,.eyebrow{color:var(--gold);font-weight:800;letter-spacing:2px;font-size:13px}

/* NAV */
.navbar{background:rgba(7,20,43,.92);backdrop-filter:blur(15px);padding:14px 0;box-shadow:0 4px 20px rgba(0,0,0,.08)}
.navbar-brand{font-size:28px;font-weight:800;color:#fff}
.navbar-brand span,.footer h3 span{color:var(--gold)}
.nav-link{color:#fff!important;margin-left:15px;font-weight:500}
.nav-link:hover{color:var(--gold)!important}
.navbar-toggler{border:1px solid #fff;color:#fff}
.theme-toggle{width:42px;height:42px;border:0;border-radius:50%;background:var(--gold);color:var(--navy);cursor:pointer}

/* HERO */
.hero-section{min-height:100vh;background:radial-gradient(circle at 80% 30%,rgba(244,166,33,.16),transparent 30%),linear-gradient(135deg,#061225,#0b2a4a);color:#fff;overflow:hidden}
.hero-section h1{font-size:clamp(42px,6vw,72px);font-weight:800;line-height:1.08;margin:18px 0}
.hero-section h1 span{color:var(--gold)}
.hero-section p{font-size:18px;color:#d9e1ed;line-height:1.8;max-width:680px}
.hero-actions{display:flex;gap:15px;flex-wrap:wrap;margin-top:30px}
.btn-gold{background:var(--gold);color:var(--navy);border:2px solid var(--gold);font-weight:800;padding:12px 26px;border-radius:999px}
.btn-gold:hover{background:#fff;border-color:#fff;color:var(--navy)}
.btn-darkblue{background:var(--navy);color:#fff;padding:12px 25px;border-radius:999px;font-weight:700}
.hero-card{padding:38px;border:1px solid rgba(255,255,255,.15);border-radius:28px;background:rgba(255,255,255,.08);backdrop-filter:blur(15px);box-shadow:0 30px 70px rgba(0,0,0,.25)}
.hero-icon{width:75px;height:75px;border-radius:20px;background:var(--gold);color:var(--navy);display:grid;place-items:center;font-size:32px;margin-bottom:20px}
.hero-card h3{font-weight:800}.hero-card p{font-size:15px}
.mini-service{padding:11px 0;border-top:1px solid rgba(255,255,255,.12);color:#eef3f8}
.mini-service i{color:var(--gold);margin-right:10px}

/* ABOUT */
.about-visual{min-height:420px;border-radius:35px;background:linear-gradient(145deg,var(--navy),var(--navy2));display:grid;place-items:center;position:relative;box-shadow:var(--shadow)}
.about-circle{width:210px;height:210px;border:2px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:var(--gold);font-size:90px;box-shadow:0 0 70px rgba(244,166,33,.15)}
.floating-badge{position:absolute;right:30px;bottom:30px;background:#fff;color:var(--navy);padding:15px 22px;border-radius:18px;box-shadow:var(--shadow);text-align:center}
.floating-badge strong{display:block;font-size:28px;color:var(--gold)}.floating-badge small{font-weight:700}
.about-visual + div p{line-height:1.9;color:var(--muted)}
.stat-mini{padding:20px;border:1px solid var(--border);border-radius:16px;text-align:center;background:var(--card)}
.stat-mini strong{display:block;font-size:32px;color:var(--gold)}.stat-mini small{color:var(--muted)}

/* SERVICES */
.service-box,.why-box{height:100%;padding:35px 28px;border-radius:22px;background:var(--card);box-shadow:var(--shadow);transition:.35s;border:1px solid var(--border)}
.service-box:hover,.why-box:hover{transform:translateY(-10px)}
.service-box:hover{background:var(--navy);color:#fff}
.service-box i,.why-box i{font-size:48px;color:var(--gold);margin-bottom:20px}
.service-box h4,.why-box h4{font-weight:800}.service-box p,.why-box p{line-height:1.8;color:var(--muted)}
.service-box:hover p{color:#dce5f1}
.service-box a{color:var(--gold);font-weight:700}

/* WHY + COUNTERS */
.why-box{background:#102848;border-color:rgba(255,255,255,.08);text-align:center;color:#fff}
.why-box p{color:#bfcce0}
.why-box:hover{background:var(--gold);color:var(--navy)}
.why-box:hover i,.why-box:hover p{color:var(--navy)}
.counter-box{padding:20px}.counter-box strong{font-size:48px;color:var(--gold);font-weight:800}.counter-box span{font-size:30px;color:var(--gold)}.counter-box p{margin:0;color:#c8d2e1}

/* PORTFOLIO */
.filter-buttons{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.filter-btn{border:1px solid var(--border);background:#fff;padding:9px 20px;border-radius:999px;font-weight:700;color:var(--navy)}
.filter-btn.active,.filter-btn:hover{background:var(--gold);border-color:var(--gold)}
.portfolio-item{height:280px;border-radius:22px;overflow:hidden;position:relative;background:linear-gradient(135deg,var(--navy),var(--navy2));box-shadow:var(--shadow)}
.portfolio-placeholder{height:100%;display:grid;place-items:center;font-size:85px;color:var(--gold)}
.portfolio-overlay{position:absolute;inset:0;background:rgba(7,20,43,.9);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:#fff;opacity:0;transition:.35s}
.portfolio-item:hover .portfolio-overlay{opacity:1}.portfolio-overlay h4{font-weight:800}

/* PRICING */
.price-card{height:100%;background:var(--card);padding:40px 30px;border-radius:25px;box-shadow:var(--shadow);position:relative;border:1px solid var(--border);transition:.35s}
.price-card:hover{transform:translateY(-10px)}.price-card.popular{background:var(--navy);color:#fff;transform:scale(1.03)}
.popular-badge{position:absolute;top:-14px;right:25px;background:var(--gold);color:var(--navy);padding:7px 16px;border-radius:999px;font-weight:800;font-size:11px}
.price-card h3{text-align:center;font-weight:800}.price{text-align:center;font-size:45px;font-weight:800;color:var(--gold);margin:20px 0}.price-card>p{text-align:center;color:var(--muted)}
.price-card ul{list-style:none;padding:0;margin:30px 0}.price-card li{padding:12px 0;border-bottom:1px solid var(--border)}.price-card.popular li{border-color:rgba(255,255,255,.13)}

/* PROCESS */
.process-box{height:100%;text-align:center;background:#102848;padding:25px 15px;border-radius:20px;border:1px solid rgba(255,255,255,.08);transition:.35s}
.process-box:hover{background:var(--gold);color:var(--navy);transform:translateY(-8px)}
.process-box i{display:grid;place-items:center;width:65px;height:65px;border-radius:50%;background:#fff;color:var(--navy);margin:0 auto 15px;font-size:25px}
.process-box b{display:block;color:var(--gold);font-size:20px}.process-box:hover b{color:var(--navy)}.process-box p{color:#bfcce0;font-size:13px}.process-box:hover p{color:var(--navy)}

/* TESTIMONIAL */
.testimonial-box{height:100%;text-align:center;padding:35px 25px;border:1px solid var(--border);border-radius:22px;box-shadow:var(--shadow);transition:.35s}
.testimonial-box:hover{transform:translateY(-8px);background:var(--navy);color:#fff}
.client-avatar{width:80px;height:80px;margin:auto;border-radius:50%;background:var(--gold);color:var(--navy);display:grid;place-items:center;font-weight:800;font-size:24px}
.testimonial-box small{color:var(--muted)}.testimonial-box:hover small{color:#d9e1ed}.stars{color:var(--gold);font-size:20px;letter-spacing:3px;margin:15px 0}.testimonial-box p{line-height:1.8;color:var(--muted)}.testimonial-box:hover p{color:#d9e1ed}

/* FAQ */
.accordion-item{border:0!important;margin-bottom:12px;border-radius:15px!important;overflow:hidden;box-shadow:0 7px 20px rgba(7,20,43,.07)}
.accordion-button{font-weight:700;padding:20px}.accordion-button:not(.collapsed){background:var(--navy);color:#fff}.accordion-button:focus{box-shadow:none}

/* PAYMENT */
.payment-section{background:linear-gradient(135deg,#eef3f9,#fff)}
.payment-summary,.payment-card{background:#fff;border:1px solid var(--border);padding:35px;border-radius:25px;box-shadow:var(--shadow);height:100%}
.total-line{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border);padding-top:20px;margin-top:25px}.total-line strong{font-size:30px;color:var(--gold)}
.small-note{font-size:13px;color:var(--muted);margin-top:15px}.payment-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-top:25px}
.pay-box{padding:20px;border:1px solid var(--border);border-radius:18px;text-align:center;transition:.3s}.pay-box:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.pay-logo{width:58px;height:58px;margin:0 auto 12px;border-radius:15px;display:grid;place-items:center;font-weight:900;font-size:20px;color:#fff}.qr{background:#111}.bkash{background:#e2136e}.nagad{background:#f28c28}.rocket{background:#6c2c91}.bank{background:#176b47}.stripe{background:#635bff}
.payment-info{padding:18px;border-radius:15px;background:#f6f8fb;color:var(--text);line-height:1.8}

/* CONTACT */
.contact-info{height:100%;padding:35px;background:#102848;border-radius:25px;color:#fff}
.contact-item{display:flex;gap:18px;align-items:flex-start;margin-bottom:25px}.contact-item i{width:50px;height:50px;flex:0 0 50px;display:grid;place-items:center;background:var(--gold);color:var(--navy);border-radius:50%;font-size:20px}.contact-item p{margin:4px 0 0;color:#c8d2e1}
.contact-form{background:#fff;padding:35px;border-radius:25px}.form-control{padding:13px 15px;border-radius:12px;border:1px solid var(--border)}.form-control:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(244,166,33,.15)}

/* FOOTER */
.footer{background:#040c19;color:#fff;padding:70px 0 20px}.footer h3{font-weight:800}.footer h5{font-weight:800;margin-bottom:20px}.footer p,.footer a{color:#b9c5d6;display:block;margin-bottom:11px}.footer a:hover{color:var(--gold)}.socials{display:flex;gap:10px}.socials a{width:42px;height:42px;border-radius:50%;background:#102848;display:grid;place-items:center}.socials a:hover{background:var(--gold);color:var(--navy)}.copyright{text-align:center;color:#9aa8ba}

/* PRELOADER */
#preloader{position:fixed;inset:0;background:var(--navy);z-index:999999;display:grid;place-items:center;transition:.7s}
#preloader.hide{opacity:0;visibility:hidden}.loader-content{text-align:center;color:#fff}.loader-content img{width:110px;max-height:110px;object-fit:contain}.loader-content h2{color:var(--gold);font-weight:800;margin-top:15px}.loader-content p{color:#cbd6e4}.loading-bar{width:250px;height:7px;background:rgba(255,255,255,.12);border-radius:20px;overflow:hidden;margin:25px auto}.loading-bar span{display:block;height:100%;background:var(--gold);animation:load 1.3s infinite}
@keyframes load{0%{width:0}100%{width:100%}}

/* FLOATING BUTTONS */
.floating-buttons{position:fixed;right:22px;bottom:95px;display:flex;flex-direction:column;gap:12px;z-index:9990}.float-btn{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:28px;box-shadow:0 10px 25px rgba(0,0,0,.25);transition:.3s}.float-btn:hover{transform:scale(1.12);color:#fff}.whatsapp{background:#25D366}.messenger{background:#0084FF}

/* CHAT */
#chat-widget{position:fixed;right:22px;bottom:22px;z-index:9998}#chat-toggle{width:60px;height:60px;border:0;border-radius:50%;background:var(--gold);color:var(--navy);font-size:25px;box-shadow:0 10px 25px rgba(0,0,0,.25)}
#chat-box{display:none;position:absolute;right:0;bottom:75px;width:350px;height:470px;background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 25px 60px rgba(0,0,0,.25)}#chat-box.open{display:block}
.chat-header{background:var(--navy);color:#fff;padding:16px;display:flex;justify-content:space-between}.chat-header small{display:block;color:#bfcce0}.chat-header button{background:none;border:0;color:#fff;font-size:20px}
#chat-body{height:350px;overflow:auto;padding:15px;background:#f6f8fb}.bot-message,.user-message{max-width:85%;padding:11px 13px;border-radius:13px;margin-bottom:10px;line-height:1.5}.bot-message{background:#e7edf7}.user-message{background:var(--gold);margin-left:auto}.chat-input{display:flex;gap:8px;padding:10px;border-top:1px solid var(--border)}.chat-input input{flex:1;border:1px solid var(--border);border-radius:10px;padding:10px}.chat-input button{border:0;border-radius:10px;background:var(--navy);color:#fff;padding:0 15px}

/* BACK TOP */
.back-top{position:fixed;right:22px;bottom:170px;width:45px;height:45px;border-radius:50%;background:var(--gold);color:var(--navy);display:grid;place-items:center;z-index:9980}

/* DARK MODE */
body.dark{background:#090f1b;color:#eaf0f7}
body.dark .bg-soft,body.dark .payment-section{background:#0d1625}
body.dark .service-box,body.dark .price-card,body.dark .testimonial-box,body.dark .stat-mini,body.dark .payment-summary,body.dark .payment-card,body.dark .contact-form{background:#121d2d;color:#eaf0f7;border-color:#26354a}
body.dark .section-heading p,body.dark .about-visual + div p,body.dark .service-box p,body.dark .testimonial-box p,body.dark .price-card>p{color:#b8c5d5}
body.dark .filter-btn{background:#121d2d;color:#fff;border-color:#26354a}
body.dark .accordion-item{background:#121d2d}.dark body .accordion-button{background:#121d2d}
body.dark .accordion-button.collapsed{background:#121d2d;color:#fff}
body.dark .accordion-body{background:#121d2d;color:#cbd6e4}
body.dark .payment-info{background:#0b1422;color:#dce5ef}
body.dark .form-control{background:#0b1422;color:#fff;border-color:#26354a}

/* RESPONSIVE */
@media(max-width:991px){
.navbar-nav{padding:15px 0}.nav-link{margin-left:0;padding:10px 0}
.hero-section h1{font-size:48px}.section-padding{padding:75px 0}
.price-card.popular{transform:none}
}
@media(max-width:575px){
.section-padding{padding:65px 0}.section-heading h2{font-size:32px}.hero-section h1{font-size:40px}.hero-section p{font-size:16px}
.hero-card{padding:25px}.about-visual{min-height:300px}.about-circle{width:160px;height:160px;font-size:65px}
.payment-grid{grid-template-columns:1fr}.chat-box{width:calc(100vw - 30px)}
#chat-box{width:min(350px,calc(100vw - 30px))}.floating-buttons{right:15px}.float-btn{width:52px;height:52px;font-size:24px}.back-top{right:15px}
}