:root{--bg:#fff;--alt:#f6f8ee;--ink:#12220c;--muted:#5d6f58;--line:#e1e8d9;--brand:#2b5a1c;--brand2:#15370d;--sage:#728e6d;--sand:#e5cd82;--cream:#fff2b4;--dark:#0d2108;--ok:#2b5a1c;--err:#dc2626;--r:16px;
--g1:#2b5a1c;--g2:#15370d;--tint:rgba(21,55,13,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans Bengali",sans-serif;color:var(--ink);background:var(--bg);overflow-x:hidden}
img{max-width:100%}a{color:var(--brand2);text-decoration:none}h1,h2,h3{line-height:1.25;margin:.2em 0 .5em}
.container{width:min(1140px,92%);margin:auto}.narrow{width:min(760px,92%);margin:auto}.center{text-align:center}.muted{color:var(--muted)}.between{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.logo{font-weight:800;font-size:1.6rem;color:var(--ink);letter-spacing:-.5px}.logo span{background:linear-gradient(135deg,#728e6d,#e5cd82);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- NAV ---------- */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);animation:dropIn .7s cubic-bezier(.2,.8,.2,1) both}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:66px}
.nav nav{display:flex;gap:4px;align-items:center}
.nav nav a{position:relative;padding:8px 13px;border-radius:9px;color:var(--ink);font-weight:500;transition:.25s}
.nav nav a:not(.btn):after{content:"";position:absolute;left:50%;bottom:3px;width:0;height:2px;background:linear-gradient(90deg,var(--g1),#e5cd82);transition:.3s;transform:translateX(-50%);border-radius:2px}
.nav nav a:not(.btn):hover,.nav nav a.active{color:var(--brand2)}.nav nav a:not(.btn):hover:after,.nav nav a.active:after{width:60%}
/* FIX: Get a Quote hover — gradient + white text stay visible */
.nav nav a.btn,.nav nav a.btn:hover,.nav nav a.btn:focus{color:#fff}
.nav nav a.btn:hover{background:linear-gradient(135deg,#15370d,#c9ae55);box-shadow:0 8px 22px rgba(79,107,74,.4);transform:translateY(-2px)}
.burger{display:none;background:none;border:0;font-size:1.6rem;cursor:pointer}

/* login button */
.nav nav a.btn-login{background:transparent;color:var(--brand2);border:1.5px solid var(--brand2);margin-left:4px}
.nav nav a.btn-login:hover{background:linear-gradient(135deg,#728e6d,#15370d);color:#fff;border-color:transparent;box-shadow:0 8px 22px rgba(21,55,13,.35);transform:translateY(-2px)}
/* ---------- BUTTONS ---------- */
.btn{position:relative;overflow:hidden;display:inline-block;background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;border:0;padding:12px 22px;border-radius:11px;font-weight:600;cursor:pointer;font-size:1rem;transition:.3s;background-size:150% 150%}
.btn:after{content:"";position:absolute;top:0;left:-80%;width:50%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg)}
.btn:hover{color:#fff;transform:translateY(-2px);box-shadow:0 10px 24px rgba(21,55,13,.35);background-position:100% 100%}.btn:hover:after{animation:shine .8s}
.btn-sm{padding:8px 15px;font-size:.9rem}.btn.block{display:block;width:100%;text-align:center;margin-top:10px}
.btn-ghost{background:transparent;color:var(--brand2);border:1.5px solid var(--brand2)}.btn-ghost:hover{background:linear-gradient(135deg,var(--brand),var(--brand2));border-color:transparent}
.btn-light{background:#fff;color:var(--brand2)}.btn-light:hover{color:var(--brand2);background:#fff}.btn-danger{background:linear-gradient(135deg,#ef4444,#b91c1c)}

/* ---------- HERO ---------- */
.hero{position:relative;overflow:hidden;color:#fff;padding:100px 0 130px;background:linear-gradient(120deg,#0d2108,#15370d,#2a5a1b,#0d2108);background-size:300% 300%;animation:gradShift 16s ease infinite}
.hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:46px 46px;mask-image:radial-gradient(circle at 50% 40%,#000,transparent 75%)}
.hero:after,.wave:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:70px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath fill='%23ffffff' d='M0 60 C240 120 480 0 720 40 C960 80 1200 110 1440 40 L1440 100 L0 100Z'/%3E%3C/svg%3E") bottom/100% 100% no-repeat}
.blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55;animation:float 9s ease-in-out infinite;pointer-events:none}
.b1{width:340px;height:340px;background:#728e6d;top:-80px;left:-60px}.b2{width:300px;height:300px;background:#e5cd82;right:-40px;top:20%;animation-delay:-3s}.b3{width:220px;height:220px;background:#e5cd82;bottom:-60px;left:42%;animation-delay:-6s;opacity:.35}
.hero-in{position:relative;z-index:2;display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:center}
.hero h1{font-size:clamp(2rem,4.5vw,3.3rem);animation:fadeUp .9s .1s both}.hero p{color:#d9e3d4;font-size:1.1rem;animation:fadeUp .9s .25s both}
.hero .pill{animation:fadeUp .9s both}.hero .actions{animation:fadeUp .9s .4s both}
.pill{display:inline-block;background:rgba(114,142,109,.15);color:#e5cd82;border:1px solid rgba(114,142,109,.35);padding:4px 14px;border-radius:99px;font-size:.85rem}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}.hero .btn-ghost{color:#fff;border-color:rgba(255,255,255,.4)}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.stat{background:rgba(255,255,255,.08);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.16);border-radius:var(--r);padding:22px;text-align:center;animation:popIn .8s both,bob 5s ease-in-out infinite}
.stat:nth-child(1){animation-delay:.3s,1.2s}.stat:nth-child(2){animation-delay:.45s,2s;margin-top:18px}.stat:nth-child(3){animation-delay:.6s,1.6s;margin-top:-18px}.stat:nth-child(4){animation-delay:.75s,2.4s}
.stat b{display:block;font-size:2.3rem;background:linear-gradient(135deg,#e5cd82,#fff2b4);-webkit-background-clip:text;background-clip:text;color:transparent}.stat span{color:#d9e3d4;font-size:.9rem}

/* ---------- SECTIONS + BACKGROUND DESIGNS ---------- */
.section{position:relative;overflow:hidden;padding:84px 0;isolation:isolate;
 background:radial-gradient(520px 320px at 0 0,rgba(114,142,109,.12),transparent 70%),radial-gradient(520px 320px at 100% 100%,rgba(229,205,130,.12),transparent 70%),#fff}
.section>.container,.section>.narrow,.section>.marquee{position:relative;z-index:2}
.section:before,.section:after{content:"";position:absolute;z-index:0;border-radius:50%;pointer-events:none}
.section:before{width:260px;height:260px;right:-70px;top:40px;background:radial-gradient(circle,rgba(114,142,109,.16),transparent 70%);animation:float 11s ease-in-out infinite}
.section:after{width:200px;height:200px;left:-60px;bottom:30px;background:radial-gradient(circle,rgba(229,205,130,.16),transparent 70%);animation:float 13s ease-in-out infinite reverse}
/* alt : blue-violet with dot pattern */
.section.alt{background:radial-gradient(rgba(21,55,13,.2) 1.3px,transparent 1.3px) 0 0/24px 24px,radial-gradient(circle at 12% 20%,rgba(114,142,109,.18),transparent 45%),linear-gradient(180deg,#eef3e8,#fbf6df)}
/* warm : peach / pink with diagonal stripes */
.section.warm{background:repeating-linear-gradient(45deg,rgba(229,205,130,.08) 0 2px,transparent 2px 18px),linear-gradient(135deg,#fff8d6,#fdf3c4 55%,#fbf0cf)}
.section.warm:before{background:radial-gradient(circle,rgba(229,205,130,.22),transparent 70%)}.section.warm:after{background:radial-gradient(circle,rgba(229,205,130,.2),transparent 70%)}
/* mint : teal / green with grid */
.section.mint{background:linear-gradient(rgba(114,142,109,.1) 1px,transparent 1px) 0 0/36px 36px,linear-gradient(90deg,rgba(114,142,109,.1) 1px,transparent 1px) 0 0/36px 36px,linear-gradient(160deg,#eef4ea,#f2f6ec 60%,#e9f1e4)}
.section.mint:before{background:radial-gradient(circle,rgba(114,142,109,.22),transparent 70%)}.section.mint:after{background:radial-gradient(circle,rgba(34,197,94,.2),transparent 70%)}
/* dark : navy glow */
.section.dark{color:#e1e8d9;background:radial-gradient(600px 360px at 10% 0,rgba(114,142,109,.3),transparent 70%),radial-gradient(600px 360px at 95% 100%,rgba(229,205,130,.32),transparent 70%),linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px) 0 0/42px 42px,linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px) 0 0/42px 42px,linear-gradient(160deg,#0d2108,#0f2a09)}
.section.dark .title{color:#fff}.section.dark .sub{color:#b5c7b0}
.title{text-align:center;font-size:2.05rem;margin-bottom:.3em}.title:after{content:"";display:block;width:64px;height:4px;margin:10px auto 0;border-radius:4px;background:linear-gradient(90deg,var(--brand),#e5cd82);animation:grow 1.2s both}
.sub{text-align:center;color:var(--muted);margin:0 auto 2.4em;max-width:620px}
.page-head{position:relative;overflow:hidden;color:#fff;padding:64px 0 90px;text-align:center;background:linear-gradient(120deg,#0d2108,#15370d,#2a5a1b);background-size:250% 250%;animation:gradShift 14s ease infinite}
.page-head:before{content:"";position:absolute;width:320px;height:320px;border-radius:50%;background:#728e6d;filter:blur(80px);opacity:.4;left:-60px;top:-100px;animation:float 9s ease-in-out infinite}
.page-head:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:60px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath fill='%23ffffff' d='M0 50 C300 110 600 0 900 50 C1150 90 1300 70 1440 40 L1440 100 L0 100Z'/%3E%3C/svg%3E") bottom/100% 100% no-repeat}
.page-head .container{position:relative;z-index:2}.page-head h1{font-size:clamp(1.8rem,4vw,2.6rem);animation:fadeUp .8s both}.page-head p{color:#d9e3d4;max-width:640px;margin:auto;animation:fadeUp .8s .15s both}.page-head .pill{animation:fadeUp .8s both}

/* ---------- GRID + GRADIENT CARDS ---------- */
.grid{display:grid;gap:22px}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}.g2-1{grid-template-columns:2fr 1fr;align-items:start}
.grid>.card:nth-child(6n+1){--g1:#2b5a1c;--g2:#15370d;--tint:rgba(21,55,13,.10)}
.grid>.card:nth-child(6n+2){--g1:#728e6d;--g2:#4f6b4a;--tint:rgba(114,142,109,.16)}
.grid>.card:nth-child(6n+3){--g1:#c9ae55;--g2:#9a7d28;--tint:rgba(229,205,130,.22)}
.grid>.card:nth-child(6n+4){--g1:#4f6b4a;--g2:#15370d;--tint:rgba(79,107,74,.14)}
.grid>.card:nth-child(6n+5){--g1:#e5cd82;--g2:#b8963a;--tint:rgba(229,205,130,.24)}
.grid>.card:nth-child(6n){--g1:#728e6d;--g2:#2b5a1c;--tint:rgba(114,142,109,.16)}
.card{position:relative;overflow:hidden;display:block;color:var(--ink);padding:26px;border-radius:var(--r);border:1px solid rgba(114,142,109,.22);
 background:linear-gradient(155deg,#fff 35%,var(--tint) 100%);box-shadow:0 2px 10px rgba(18,34,12,.04);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.card:before{content:"";position:absolute;left:0;top:0;right:0;height:4px;background:linear-gradient(90deg,var(--g1),var(--g2));transform-origin:left;transition:.4s}
.card:after{content:"";position:absolute;right:-50px;top:-50px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,var(--tint),transparent 70%);transition:.5s;pointer-events:none}
.grid>.card:hover{transform:translateY(-8px);box-shadow:0 22px 40px -12px var(--tint),0 14px 30px rgba(18,34,12,.1)}.card:hover:before{height:6px}.card:hover:after{transform:scale(1.8)}
.card h3{margin-top:.35em;position:relative;z-index:1}.card p{color:#3f5139;position:relative;z-index:1}.card>*{position:relative;z-index:1}
.section.dark .card{background:linear-gradient(155deg,rgba(255,255,255,.1),rgba(255,255,255,.03));border-color:rgba(255,255,255,.14);color:#fff;backdrop-filter:blur(6px)}.section.dark .card p{color:#d9e3d4}
.card.row{display:flex;gap:18px}
.ico{display:inline-grid;place-items:center;width:56px;height:56px;border-radius:16px;font-size:1.7rem;background:linear-gradient(135deg,var(--g1),var(--g2));box-shadow:0 10px 20px -6px var(--g2);transition:.45s}
.ico.big{width:68px;height:68px;font-size:2.1rem;flex:none}.card:hover .ico{transform:rotate(-8deg) scale(1.12);animation:bounce .7s}
.tag{display:inline-block;background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;font-size:.74rem;padding:3px 12px;border-radius:99px;font-weight:600;letter-spacing:.3px}
.price{font-size:1.3rem;font-weight:800;margin:8px 0;background:linear-gradient(135deg,#2b5a1c,#728e6d);-webkit-background-clip:text;background-clip:text;color:transparent}.price small{font-size:.75rem;color:var(--muted);font-weight:400;-webkit-text-fill-color:var(--muted)}.price.big{font-size:2.1rem}
.num{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;display:grid;place-items:center;font-weight:700;box-shadow:0 8px 16px -4px var(--g2)}.stars{color:#d4b24c;letter-spacing:2px}
.steps .card{text-align:center}.steps .num{margin:0 auto 8px}
.thumb{width:100%;height:170px;object-fit:cover;border-radius:12px;margin-bottom:10px}.thumb.sm{width:120px;height:80px}.hero-img{width:100%;border-radius:var(--r);margin-bottom:16px}
.avatar{width:92px;height:92px;border-radius:50%;object-fit:cover;margin:auto;display:block;box-shadow:0 0 0 4px #fff,0 0 0 7px var(--g1)}.avatar.ph{background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;display:grid;place-items:center;font-size:2rem;font-weight:700}
.checks{list-style:none;padding:0;columns:2}.checks li{margin-bottom:6px}.checks li:before{content:"✔ ";color:var(--ok)}.sticky{position:sticky;top:86px}

/* ---------- CLIENTS ---------- */
.marquee{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.mtrack{display:flex;gap:22px;width:max-content;animation:scroll 38s linear infinite;padding:10px 0}.marquee:hover .mtrack{animation-play-state:paused}
.mitem{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid rgba(114,142,109,.25);padding:12px 22px;border-radius:99px;box-shadow:0 6px 16px rgba(18,34,12,.06);font-weight:600;white-space:nowrap;color:var(--ink);transition:.3s}.mitem:hover{transform:translateY(-4px) scale(1.04);box-shadow:0 12px 24px rgba(79,107,74,.2)}
.mitem img{height:34px;width:auto;max-width:90px;object-fit:contain}
.cmark{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:12px;color:#fff;font-weight:800;background:linear-gradient(135deg,var(--g1),var(--g2))}
.clients-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.ctile{text-align:center;padding:30px 18px!important}.ctile .logo-box{height:84px;display:grid;place-items:center;margin-bottom:10px}
.ctile img{max-height:70px;max-width:80%;object-fit:contain;filter:grayscale(1);opacity:.8;transition:.4s}.ctile:hover img{filter:none;opacity:1;transform:scale(1.1)}
.ctile .cmark{width:70px;height:70px;font-size:1.8rem;border-radius:20px}.ctile h3{font-size:1.05rem;margin:.2em 0}.ctile a{font-size:.85rem}

/* ---------- FORMS / MISC ---------- */
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}.filters input,.filters select{flex:1;min-width:160px}
label{display:block;font-weight:600;font-size:.9rem;margin-bottom:14px}label.chk{display:flex;gap:8px;align-items:center;font-weight:500}
input,select,textarea{width:100%;padding:11px 13px;border:1px solid #d9e3d4;border-radius:10px;font:inherit;margin-top:5px;background:#fff;color:var(--ink);transition:.25s}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 4px rgba(114,142,109,.18)}input[type=checkbox]{width:auto;margin:0}
.two{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.hp{position:absolute;left:-9999px}
.msg{min-height:1.4em;margin:10px 0 0;font-weight:600}.msg.err,.alert.err{color:var(--err)}.msg.ok{color:var(--ok)}
.alert{padding:12px 16px;border-radius:10px;background:#e6eee1;color:#15370d;margin-bottom:16px;animation:fadeUp .4s}.alert.err{background:#fee2e2;color:#991b1b}
.done{text-align:center;padding:20px;animation:popIn .6s}.code{font:700 1.8rem/1 monospace;background:linear-gradient(135deg,#f3f7ee,#fdf6d8);border:2px dashed var(--brand);border-radius:12px;padding:16px;margin:12px 0;letter-spacing:2px;user-select:all}
.plain{padding-left:18px;color:#3f5139}hr{border:0;border-top:1px solid var(--line);margin:18px 0}
.faq{background:linear-gradient(135deg,#fff,rgba(246,248,238,.8));border:1px solid rgba(114,142,109,.25);border-radius:12px;padding:14px 18px;margin-bottom:10px;transition:.3s}.faq:hover{box-shadow:0 10px 24px rgba(79,107,74,.12)}.faq[open]{border-color:var(--brand)}.faq summary{cursor:pointer;font-weight:600}.faq[open] p{animation:fadeUp .4s}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}.chip{border:1px solid var(--line);background:#fff;padding:6px 16px;border-radius:99px;cursor:pointer}.chip.on{background:var(--brand2);color:#fff}
.cta{position:relative;overflow:hidden;color:#fff;padding:70px 0;background:linear-gradient(120deg,#15370d,#c9ae55,#b8963a,#15370d);background-size:300% 300%;animation:gradShift 10s ease infinite}
.cta:before,.cta:after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.12);animation:float 8s ease-in-out infinite}.cta:before{width:240px;height:240px;left:-60px;top:-80px}.cta:after{width:180px;height:180px;right:6%;bottom:-70px;animation-delay:-4s}
.cta .container{position:relative;z-index:2}.cta p{color:#e7efe2}.cta .btn-light{animation:pulseBtn 2.4s infinite}
.badge{display:inline-block;padding:3px 12px;border-radius:99px;font-size:.8rem;font-weight:700;background:#e1e8d9}
.s-new{background:#fff2b4;color:#7a5f10}.s-reviewing{background:#e6eee1;color:#2b5a1c}.s-quoted{background:#f6e9b8;color:#6b5314}.s-in_progress{background:#d5e2d0;color:#15370d}.s-testing{background:#ecdfa6;color:#5e4a0e}.s-completed{background:#cfe3c6;color:#15370d}.s-cancelled{background:#fee2e2;color:#991b1b}
.live{color:var(--ok);font-size:.85rem;font-weight:600;animation:blink 2s infinite}.live.off{color:var(--err);animation:none}
.timeline{border-left:3px solid var(--line);margin:18px 0 0 6px;padding-left:18px}.tl{position:relative;margin-bottom:16px;animation:fadeUp .5s both}.tl:before{content:"";position:absolute;left:-26px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 4px rgba(114,142,109,.2)}.tl p{margin:2px 0;color:#3f5139}

/* ---------- FOOTER / WA ---------- */
.footer{position:relative;background:radial-gradient(500px 260px at 90% 0,rgba(229,205,130,.25),transparent 70%),linear-gradient(160deg,#0d2108,#0d2108);color:#d9e3d4;padding:56px 0 24px}
.footer:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#728e6d,#e5cd82,#e5cd82,#728e6d);background-size:200% 100%;animation:gradShift 6s linear infinite}
.footer .logo{color:#fff}.footer a{display:block;color:#d9e3d4;margin:4px 0;transition:.25s}.footer a.logo{display:inline-block}.footer a:hover{color:#e5cd82;transform:translateX(5px)}.footer h4{color:#fff}.foot-grid{display:grid;grid-template-columns:2fr 1fr 2fr;gap:30px}
.wa{position:fixed;right:18px;bottom:18px;width:54px;height:54px;border-radius:50%;background:linear-gradient(135deg,#22c55e,#2b5a1c);display:grid;place-items:center;font-size:1.6rem;z-index:60;animation:ring 2.2s infinite}

/* ---------- SCROLL REVEAL (classes added by app.js) ---------- */
.rv{opacity:0;transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0s)!important}
.rv.up{transform:translateY(46px)}.rv.down{transform:translateY(-34px)}.rv.left{transform:translateX(-60px)}.rv.right{transform:translateX(60px)}.rv.zoom{transform:scale(.8)}.rv.flip{transform:perspective(900px) rotateX(22deg) translateY(34px)}.rv.spin{transform:rotate(-6deg) scale(.88)}
.rv.in{opacity:1;transform:none}

/* ---------- KEYFRAMES ---------- */
@keyframes fadeUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
@keyframes dropIn{from{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:none}}
@keyframes popIn{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}
@keyframes float{0%,100%{transform:translate(0,0)}50%{transform:translate(24px,-30px)}}
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes gradShift{0%{background-position:0 50%}50%{background-position:100% 50%}100%{background-position:0 50%}}
@keyframes shine{to{left:140%}}
@keyframes bounce{0%,100%{transform:rotate(-8deg) scale(1.12)}40%{transform:translateY(-8px) rotate(-8deg) scale(1.12)}}
@keyframes scroll{to{transform:translateX(-50%)}}
@keyframes grow{from{width:0}to{width:64px}}
@keyframes blink{50%{opacity:.4}}
@keyframes ring{0%{box-shadow:0 0 0 0 rgba(34,197,94,.55)}100%{box-shadow:0 0 0 22px rgba(34,197,94,0)}}
@keyframes pulseBtn{0%{box-shadow:0 0 0 0 rgba(255,255,255,.55)}100%{box-shadow:0 0 0 18px rgba(255,255,255,0)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}

/* ---------- RESPONSIVE ---------- */
@media(max-width:900px){.hero-in,.g2-1,.foot-grid{grid-template-columns:1fr}.g3,.g4,.clients-grid{grid-template-columns:1fr 1fr}.g2{grid-template-columns:1fr}.sticky{position:static}.stat:nth-child(n){margin-top:0}}
@media(max-width:640px){.burger{display:block}.nav nav{display:none;position:absolute;top:66px;left:0;right:0;background:#fff;flex-direction:column;padding:12px;border-bottom:1px solid var(--line)}.menu-open .nav nav{display:flex}
.g3,.g4,.two,.checks,.clients-grid{grid-template-columns:1fr;columns:1}.hero{padding:70px 0 110px}.card.row{flex-direction:column}.section{padding:60px 0}}

/* ---------- PALETTE OVERRIDES (deep green / sage / sand / cream) ---------- */
.logo span{background:linear-gradient(135deg,#15370d,#728e6d);-webkit-background-clip:text;background-clip:text;color:transparent}
.footer .logo span,.side .logo span{background:linear-gradient(135deg,#e5cd82,#fff2b4);-webkit-background-clip:text;background-clip:text;color:transparent}
.btn{background:linear-gradient(135deg,#2b5a1c,#15370d)}
.btn:hover{box-shadow:0 10px 24px rgba(21,55,13,.35)}
.nav nav a.btn:hover{background:linear-gradient(135deg,#e5cd82,#d4b24c);color:#15370d;box-shadow:0 8px 22px rgba(201,174,85,.45)}
.nav nav a.btn-login:hover{background:#15370d;color:#fff2b4}
.btn-ghost:hover{background:#15370d;color:#fff2b4}
.btn-light{background:#fff2b4;color:#15370d}.btn-light:hover{background:#e5cd82;color:#15370d}
.hero .btn-ghost:hover{background:#fff2b4;color:#15370d;border-color:transparent}
.hero .btn:not(.btn-ghost){background:linear-gradient(135deg,#e5cd82,#d4b24c);color:#15370d}
.hero .btn:not(.btn-ghost):hover{color:#15370d}
.title:after{background:linear-gradient(90deg,#15370d,#e5cd82)}
.stat b{background:linear-gradient(135deg,#e5cd82,#fff2b4);-webkit-background-clip:text;background-clip:text;color:transparent}
input:focus,select:focus,textarea:focus{outline:none;border-color:#728e6d;box-shadow:0 0 0 3px rgba(114,142,109,.25)}
::selection{background:#e5cd82;color:#15370d}
.code{background:#fff8d6;border-color:#728e6d}
.stars{color:#c9a227}

/* ---------- LOGO ---------- */
.logo{display:inline-flex;align-items:center}
.logo-img{margin-right:9px;height:38px;width:auto;max-width:90px;object-fit:contain;display:block;border-radius:9px}
.footer .logo-img{height:42px}
.side .logo-img,.footer .logo-img,.loginbg .logo-img{box-shadow:0 0 0 2px #e5cd82}

/* ---------- CODE WATERMARK BACKGROUNDS (frontend) ---------- */
:root{--wl1:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22520%22 height=%22380%22%3E%3Cg fill=%22%2315370d%22 fill-opacity=%220.065%22 font-family=%22Consolas,Menlo,DejaVu Sans Mono,monospace%22 font-size=%2215%22%3E%3Ctext x=%2222%22 y=%2234%22%3E%26lt%3Bsection%C2%A0class=%22hero%22%26gt%3B%3C/text%3E%3Ctext x=%2222%22 y=%2256%22%3E%C2%A0%C2%A0%26lt%3Bh1%26gt%3BHello,%C2%A0world%26lt%3B/h1%26gt%3B%3C/text%3E%3Ctext x=%2222%22 y=%2278%22%3E%C2%A0%C2%A0%26lt%3Ba%C2%A0href=%22/start%22%26gt%3BGo%26lt%3B/a%26gt%3B%3C/text%3E%3Ctext x=%2222%22 y=%22100%22%3E%26lt%3B/section%26gt%3B%3C/text%3E%3Ctext x=%2222%22 y=%22122%22%3E%3C/text%3E%3Ctext x=%2222%22 y=%22144%22%3E%26lt%3Bscript%C2%A0src=%22app.js%22%26gt%3B%26lt%3B/script%26gt%3B%3C/text%3E%3Ctext x=%22250%22 y=%22218%22%3E%26lt%3Bnav%C2%A0class=%22menu%22%26gt%3B%3C/text%3E%3Ctext x=%22250%22 y=%22240%22%3E%C2%A0%C2%A0%26lt%3Bul%26gt%3B...%26lt%3B/ul%26gt%3B%3C/text%3E%3Ctext x=%22250%22 y=%22262%22%3E%26lt%3B/nav%26gt%3B%3C/text%3E%3Ctext x=%22250%22 y=%22284%22%3E%26lt%3Bfooter%26gt%3B%C2%A9%C2%A02026%26lt%3B/footer%26gt%3B%3C/text%3E%3Ctext x=%22330%22 y=%2260%22 font-size=%2246%22 fill-opacity=%220.068%22%3E%26lt%3B/%26gt%3B%3C/text%3E%3Ctext x=%2240%22 y=%22300%22 font-size=%2240%22 fill-opacity=%220.068%22%3E%7B %7D%3C/text%3E%3Ctext x=%22440%22 y=%22340%22 font-size=%2234%22 fill-opacity=%220.068%22%3E%3B%3C/text%3E%3C/g%3E%3C/svg%3E");--wd1:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22520%22 height=%22380%22%3E%3Cg fill=%22%23e5cd82%22 fill-opacity=%220.11%22 font-family=%22Consolas,Menlo,DejaVu Sans Mono,monospace%22 font-size=%2215%22%3E%3Ctext x=%2222%22 y=%2234%22%3E%26lt%3Bsection%C2%A0class=%22hero%22%26gt%3B%3C/text%3E%3Ctext x=%2222%22 y=%2256%22%3E%C2%A0%C2%A0%26lt%3Bh1%26gt%3BHello,%C2%A0world%26lt%3B/h1%26gt%3B%3C/text%3E%3Ctext x=%2222%22 y=%2278%22%3E%C2%A0%C2%A0%26lt%3Ba%C2%A0href=%22/start%22%26gt%3BGo%26lt%3B/a%26gt%3B%3C/text%3E%3Ctext x=%2222%22 y=%22100%22%3E%26lt%3B/section%26gt%3B%3C/text%3E%3Ctext x=%2222%22 y=%22122%22%3E%3C/text%3E%3Ctext x=%2222%22 y=%22144%22%3E%26lt%3Bscript%C2%A0src=%22app.js%22%26gt%3B%26lt%3B/script%26gt%3B%3C/text%3E%3Ctext x=%22250%22 y=%22218%22%3E%26lt%3Bnav%C2%A0class=%22menu%22%26gt%3B%3C/text%3E%3Ctext x=%22250%22 y=%22240%22%3E%C2%A0%C2%A0%26lt%3Bul%26gt%3B...%26lt%3B/ul%26gt%3B%3C/text%3E%3Ctext x=%22250%22 y=%22262%22%3E%26lt%3B/nav%26gt%3B%3C/text%3E%3Ctext x=%22250%22 y=%22284%22%3E%26lt%3Bfooter%26gt%3B%C2%A9%C2%A02026%26lt%3B/footer%26gt%3B%3C/text%3E%3Ctext x=%22330%22 y=%2260%22 font-size=%2246%22 fill-opacity=%220.08800000000000001%22%3E%26lt%3B/%26gt%3B%3C/text%3E%3Ctext x=%2240%22 y=%22300%22 font-size=%2240%22 fill-opacity=%220.08800000000000001%22%3E%7B %7D%3C/text%3E%3Ctext x=%22440%22 y=%22340%22 font-size=%2234%22 fill-opacity=%220.08800000000000001%22%3E%3B%3C/text%3E%3C/g%3E%3C/svg%3E");--wl2:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22520%22 height=%22380%22%3E%3Cg fill=%22%2315370d%22 fill-opacity=%220.065%22 font-family=%22Consolas,Menlo,DejaVu Sans Mono,monospace%22 font-size=%2215%22%3E%3Ctext x=%2222%22 y=%2234%22%3E%26lt%3B%3Fphp%3C/text%3E%3Ctext x=%2222%22 y=%2256%22%3E%24pdo%C2%A0=%C2%A0new%C2%A0PDO(%24dsn,%C2%A0%24u,%C2%A0%24p)%3B%3C/text%3E%3Ctext x=%2222%22 y=%2278%22%3E%24rows%C2%A0=%C2%A0%24pdo-%26gt%3Bquery(%24sql)%3B%3C/text%3E%3Ctext x=%2222%22 y=%22100%22%3Eforeach%C2%A0(%24rows%C2%A0as%C2%A0%24r)%C2%A0%7B%3C/text%3E%3Ctext x=%2222%22 y=%22122%22%3E%C2%A0%C2%A0echo%C2%A0e(%24r%5B%22name%22%5D)%3B%3C/text%3E%3Ctext x=%2222%22 y=%22144%22%3E%7D%3C/text%3E%3Ctext x=%22250%22 y=%22218%22%3Efunction%C2%A0login(%24user)%C2%A0%7B%3C/text%3E%3Ctext x=%22250%22 y=%22240%22%3E%C2%A0%C2%A0session_start()%3B%3C/text%3E%3Ctext x=%22250%22 y=%22262%22%3E%C2%A0%C2%A0return%C2%A0true%3B%3C/text%3E%3Ctext x=%22250%22 y=%22284%22%3E%7D%3C/text%3E%3Ctext x=%22330%22 y=%2260%22 font-size=%2246%22 fill-opacity=%220.068%22%3E%26lt%3B/%26gt%3B%3C/text%3E%3Ctext x=%2240%22 y=%22300%22 font-size=%2240%22 fill-opacity=%220.068%22%3E%7B %7D%3C/text%3E%3Ctext x=%22440%22 y=%22340%22 font-size=%2234%22 fill-opacity=%220.068%22%3E%3B%3C/text%3E%3C/g%3E%3C/svg%3E");--wd2:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22520%22 height=%22380%22%3E%3Cg fill=%22%23e5cd82%22 fill-opacity=%220.11%22 font-family=%22Consolas,Menlo,DejaVu Sans Mono,monospace%22 font-size=%2215%22%3E%3Ctext x=%2222%22 y=%2234%22%3E%26lt%3B%3Fphp%3C/text%3E%3Ctext x=%2222%22 y=%2256%22%3E%24pdo%C2%A0=%C2%A0new%C2%A0PDO(%24dsn,%C2%A0%24u,%C2%A0%24p)%3B%3C/text%3E%3Ctext x=%2222%22 y=%2278%22%3E%24rows%C2%A0=%C2%A0%24pdo-%26gt%3Bquery(%24sql)%3B%3C/text%3E%3Ctext x=%2222%22 y=%22100%22%3Eforeach%C2%A0(%24rows%C2%A0as%C2%A0%24r)%C2%A0%7B%3C/text%3E%3Ctext x=%2222%22 y=%22122%22%3E%C2%A0%C2%A0echo%C2%A0e(%24r%5B%22name%22%5D)%3B%3C/text%3E%3Ctext x=%2222%22 y=%22144%22%3E%7D%3C/text%3E%3Ctext x=%22250%22 y=%22218%22%3Efunction%C2%A0login(%24user)%C2%A0%7B%3C/text%3E%3Ctext x=%22250%22 y=%22240%22%3E%C2%A0%C2%A0session_start()%3B%3C/text%3E%3Ctext x=%22250%22 y=%22262%22%3E%C2%A0%C2%A0return%C2%A0true%3B%3C/text%3E%3Ctext x=%22250%22 y=%22284%22%3E%7D%3C/text%3E%3Ctext x=%22330%22 y=%2260%22 font-size=%2246%22 fill-opacity=%220.08800000000000001%22%3E%26lt%3B/%26gt%3B%3C/text%3E%3Ctext x=%2240%22 y=%22300%22 font-size=%2240%22 fill-opacity=%220.08800000000000001%22%3E%7B %7D%3C/text%3E%3Ctext x=%22440%22 y=%22340%22 font-size=%2234%22 fill-opacity=%220.08800000000000001%22%3E%3B%3C/text%3E%3C/g%3E%3C/svg%3E");--wl3:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22520%22 height=%22380%22%3E%3Cg fill=%22%2315370d%22 fill-opacity=%220.065%22 font-family=%22Consolas,Menlo,DejaVu Sans Mono,monospace%22 font-size=%2215%22%3E%3Ctext x=%2222%22 y=%2234%22%3Econst%C2%A0res%C2%A0=%C2%A0await%C2%A0fetch(%22/api%22)%3B%3C/text%3E%3Ctext x=%2222%22 y=%2256%22%3Econst%C2%A0data%C2%A0=%C2%A0await%C2%A0res.json()%3B%3C/text%3E%3Ctext x=%2222%22 y=%2278%22%3Edata.forEach(item%C2%A0=%26gt%3B%C2%A0%7B%3C/text%3E%3Ctext x=%2222%22 y=%22100%22%3E%C2%A0%C2%A0render(item)%3B%3C/text%3E%3Ctext x=%2222%22 y=%22122%22%3E%7D)%3B%3C/text%3E%3Ctext x=%2222%22 y=%22144%22%3Eexport%C2%A0default%C2%A0app%3B%3C/text%3E%3Ctext x=%22250%22 y=%22218%22%3Eimport%C2%A0React%C2%A0from%C2%A0%22react%22%3B%3C/text%3E%3Ctext x=%22250%22 y=%22240%22%3EuseEffect(()%C2%A0=%26gt%3B%C2%A0%7B%7D,%C2%A0%5B%5D)%3B%3C/text%3E%3Ctext x=%22250%22 y=%22262%22%3Ereturn%C2%A0%26lt%3BApp%C2%A0/%26gt%3B%3B%3C/text%3E%3Ctext x=%22330%22 y=%2260%22 font-size=%2246%22 fill-opacity=%220.068%22%3E%26lt%3B/%26gt%3B%3C/text%3E%3Ctext x=%2240%22 y=%22300%22 font-size=%2240%22 fill-opacity=%220.068%22%3E%7B %7D%3C/text%3E%3Ctext x=%22440%22 y=%22340%22 font-size=%2234%22 fill-opacity=%220.068%22%3E%3B%3C/text%3E%3C/g%3E%3C/svg%3E");--wd3:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22520%22 height=%22380%22%3E%3Cg fill=%22%23e5cd82%22 fill-opacity=%220.11%22 font-family=%22Consolas,Menlo,DejaVu Sans Mono,monospace%22 font-size=%2215%22%3E%3Ctext x=%2222%22 y=%2234%22%3Econst%C2%A0res%C2%A0=%C2%A0await%C2%A0fetch(%22/api%22)%3B%3C/text%3E%3Ctext x=%2222%22 y=%2256%22%3Econst%C2%A0data%C2%A0=%C2%A0await%C2%A0res.json()%3B%3C/text%3E%3Ctext x=%2222%22 y=%2278%22%3Edata.forEach(item%C2%A0=%26gt%3B%C2%A0%7B%3C/text%3E%3Ctext x=%2222%22 y=%22100%22%3E%C2%A0%C2%A0render(item)%3B%3C/text%3E%3Ctext x=%2222%22 y=%22122%22%3E%7D)%3B%3C/text%3E%3Ctext x=%2222%22 y=%22144%22%3Eexport%C2%A0default%C2%A0app%3B%3C/text%3E%3Ctext x=%22250%22 y=%22218%22%3Eimport%C2%A0React%C2%A0from%C2%A0%22react%22%3B%3C/text%3E%3Ctext x=%22250%22 y=%22240%22%3EuseEffect(()%C2%A0=%26gt%3B%C2%A0%7B%7D,%C2%A0%5B%5D)%3B%3C/text%3E%3Ctext x=%22250%22 y=%22262%22%3Ereturn%C2%A0%26lt%3BApp%C2%A0/%26gt%3B%3B%3C/text%3E%3Ctext x=%22330%22 y=%2260%22 font-size=%2246%22 fill-opacity=%220.08800000000000001%22%3E%26lt%3B/%26gt%3B%3C/text%3E%3Ctext x=%2240%22 y=%22300%22 font-size=%2240%22 fill-opacity=%220.08800000000000001%22%3E%7B %7D%3C/text%3E%3Ctext x=%22440%22 y=%22340%22 font-size=%2234%22 fill-opacity=%220.08800000000000001%22%3E%3B%3C/text%3E%3C/g%3E%3C/svg%3E");--wl4:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22520%22 height=%22380%22%3E%3Cg fill=%22%2315370d%22 fill-opacity=%220.065%22 font-family=%22Consolas,Menlo,DejaVu Sans Mono,monospace%22 font-size=%2215%22%3E%3Ctext x=%2222%22 y=%2234%22%3ESELECT%C2%A0id,%C2%A0name,%C2%A0email%3C/text%3E%3Ctext x=%2222%22 y=%2256%22%3EFROM%C2%A0users%3C/text%3E%3Ctext x=%2222%22 y=%2278%22%3EWHERE%C2%A0active%C2%A0=%C2%A01%3C/text%3E%3Ctext x=%2222%22 y=%22100%22%3EORDER%C2%A0BY%C2%A0id%C2%A0DESC%3C/text%3E%3Ctext x=%2222%22 y=%22122%22%3ELIMIT%C2%A010%3B%3C/text%3E%3Ctext x=%2222%22 y=%22144%22%3ECOMMIT%3B%3C/text%3E%3Ctext x=%22250%22 y=%22218%22%3EINSERT%C2%A0INTO%C2%A0items%3C/text%3E%3Ctext x=%22250%22 y=%22240%22%3EVALUES%C2%A0(1,%C2%A0%22demo%22)%3B%3C/text%3E%3Ctext x=%22250%22 y=%22262%22%3EUPDATE%C2%A0items%C2%A0SET%C2%A0qty=2%3B%3C/text%3E%3Ctext x=%22330%22 y=%2260%22 font-size=%2246%22 fill-opacity=%220.068%22%3E%26lt%3B/%26gt%3B%3C/text%3E%3Ctext x=%2240%22 y=%22300%22 font-size=%2240%22 fill-opacity=%220.068%22%3E%7B %7D%3C/text%3E%3Ctext x=%22440%22 y=%22340%22 font-size=%2234%22 fill-opacity=%220.068%22%3E%3B%3C/text%3E%3C/g%3E%3C/svg%3E");--wd4:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22520%22 height=%22380%22%3E%3Cg fill=%22%23e5cd82%22 fill-opacity=%220.11%22 font-family=%22Consolas,Menlo,DejaVu Sans Mono,monospace%22 font-size=%2215%22%3E%3Ctext x=%2222%22 y=%2234%22%3ESELECT%C2%A0id,%C2%A0name,%C2%A0email%3C/text%3E%3Ctext x=%2222%22 y=%2256%22%3EFROM%C2%A0users%3C/text%3E%3Ctext x=%2222%22 y=%2278%22%3EWHERE%C2%A0active%C2%A0=%C2%A01%3C/text%3E%3Ctext x=%2222%22 y=%22100%22%3EORDER%C2%A0BY%C2%A0id%C2%A0DESC%3C/text%3E%3Ctext x=%2222%22 y=%22122%22%3ELIMIT%C2%A010%3B%3C/text%3E%3Ctext x=%2222%22 y=%22144%22%3ECOMMIT%3B%3C/text%3E%3Ctext x=%22250%22 y=%22218%22%3EINSERT%C2%A0INTO%C2%A0items%3C/text%3E%3Ctext x=%22250%22 y=%22240%22%3EVALUES%C2%A0(1,%C2%A0%22demo%22)%3B%3C/text%3E%3Ctext x=%22250%22 y=%22262%22%3EUPDATE%C2%A0items%C2%A0SET%C2%A0qty=2%3B%3C/text%3E%3Ctext x=%22330%22 y=%2260%22 font-size=%2246%22 fill-opacity=%220.08800000000000001%22%3E%26lt%3B/%26gt%3B%3C/text%3E%3Ctext x=%2240%22 y=%22300%22 font-size=%2240%22 fill-opacity=%220.08800000000000001%22%3E%7B %7D%3C/text%3E%3Ctext x=%22440%22 y=%22340%22 font-size=%2234%22 fill-opacity=%220.08800000000000001%22%3E%3B%3C/text%3E%3C/g%3E%3C/svg%3E");--wl5:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22520%22 height=%22380%22%3E%3Cg fill=%22%2315370d%22 fill-opacity=%220.065%22 font-family=%22Consolas,Menlo,DejaVu Sans Mono,monospace%22 font-size=%2215%22%3E%3Ctext x=%2222%22 y=%2234%22%3E.card%C2%A0%7B%3C/text%3E%3Ctext x=%2222%22 y=%2256%22%3E%C2%A0%C2%A0display:%C2%A0grid%3B%3C/text%3E%3Ctext x=%2222%22 y=%2278%22%3E%C2%A0%C2%A0gap:%C2%A016px%3B%3C/text%3E%3Ctext x=%2222%22 y=%22100%22%3E%C2%A0%C2%A0border-radius:%C2%A012px%3B%3C/text%3E%3Ctext x=%2222%22 y=%22122%22%3E%7D%3C/text%3E%3Ctext x=%2222%22 y=%22144%22%3E.card:hover%C2%A0%7B%C2%A0transform:%C2%A0none%3B%C2%A0%7D%3C/text%3E%3Ctext x=%22250%22 y=%22218%22%3E%40media%C2%A0(max-width:640px)%C2%A0%7B%3C/text%3E%3Ctext x=%22250%22 y=%22240%22%3E%C2%A0%C2%A0.grid%C2%A0%7B%C2%A0columns:%C2%A01%3B%C2%A0%7D%3C/text%3E%3Ctext x=%22250%22 y=%22262%22%3E%7D%3C/text%3E%3Ctext x=%22250%22 y=%22284%22%3Ea:hover%C2%A0%7B%C2%A0color:%C2%A0%2315370d%3B%C2%A0%7D%3C/text%3E%3Ctext x=%22330%22 y=%2260%22 font-size=%2246%22 fill-opacity=%220.068%22%3E%26lt%3B/%26gt%3B%3C/text%3E%3Ctext x=%2240%22 y=%22300%22 font-size=%2240%22 fill-opacity=%220.068%22%3E%7B %7D%3C/text%3E%3Ctext x=%22440%22 y=%22340%22 font-size=%2234%22 fill-opacity=%220.068%22%3E%3B%3C/text%3E%3C/g%3E%3C/svg%3E");--wd5:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22520%22 height=%22380%22%3E%3Cg fill=%22%23e5cd82%22 fill-opacity=%220.11%22 font-family=%22Consolas,Menlo,DejaVu Sans Mono,monospace%22 font-size=%2215%22%3E%3Ctext x=%2222%22 y=%2234%22%3E.card%C2%A0%7B%3C/text%3E%3Ctext x=%2222%22 y=%2256%22%3E%C2%A0%C2%A0display:%C2%A0grid%3B%3C/text%3E%3Ctext x=%2222%22 y=%2278%22%3E%C2%A0%C2%A0gap:%C2%A016px%3B%3C/text%3E%3Ctext x=%2222%22 y=%22100%22%3E%C2%A0%C2%A0border-radius:%C2%A012px%3B%3C/text%3E%3Ctext x=%2222%22 y=%22122%22%3E%7D%3C/text%3E%3Ctext x=%2222%22 y=%22144%22%3E.card:hover%C2%A0%7B%C2%A0transform:%C2%A0none%3B%C2%A0%7D%3C/text%3E%3Ctext x=%22250%22 y=%22218%22%3E%40media%C2%A0(max-width:640px)%C2%A0%7B%3C/text%3E%3Ctext x=%22250%22 y=%22240%22%3E%C2%A0%C2%A0.grid%C2%A0%7B%C2%A0columns:%C2%A01%3B%C2%A0%7D%3C/text%3E%3Ctext x=%22250%22 y=%22262%22%3E%7D%3C/text%3E%3Ctext x=%22250%22 y=%22284%22%3Ea:hover%C2%A0%7B%C2%A0color:%C2%A0%2315370d%3B%C2%A0%7D%3C/text%3E%3Ctext x=%22330%22 y=%2260%22 font-size=%2246%22 fill-opacity=%220.08800000000000001%22%3E%26lt%3B/%26gt%3B%3C/text%3E%3Ctext x=%2240%22 y=%22300%22 font-size=%2240%22 fill-opacity=%220.08800000000000001%22%3E%7B %7D%3C/text%3E%3Ctext x=%22440%22 y=%22340%22 font-size=%2234%22 fill-opacity=%220.08800000000000001%22%3E%3B%3C/text%3E%3C/g%3E%3C/svg%3E");--wl6:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22520%22 height=%22380%22%3E%3Cg fill=%22%2315370d%22 fill-opacity=%220.065%22 font-family=%22Consolas,Menlo,DejaVu Sans Mono,monospace%22 font-size=%2215%22%3E%3Ctext x=%2222%22 y=%2234%22%3Edef%C2%A0main():%3C/text%3E%3Ctext x=%2222%22 y=%2256%22%3E%C2%A0%C2%A0%C2%A0%C2%A0app%C2%A0=%C2%A0create_app()%3C/text%3E%3Ctext x=%2222%22 y=%2278%22%3E%C2%A0%C2%A0%C2%A0%C2%A0app.run(port=8000)%3C/text%3E%3Ctext x=%2222%22 y=%22100%22%3E%3C/text%3E%3Ctext x=%2222%22 y=%22122%22%3E%24%C2%A0npm%C2%A0run%C2%A0build%3C/text%3E%3Ctext x=%2222%22 y=%22144%22%3E%24%C2%A0git%C2%A0push%C2%A0origin%C2%A0main%3C/text%3E%3Ctext x=%22250%22 y=%22218%22%3Eclass%C2%A0User(Model):%3C/text%3E%3Ctext x=%22250%22 y=%22240%22%3E%C2%A0%C2%A0%C2%A0%C2%A0name%C2%A0=%C2%A0Field()%3C/text%3E%3Ctext x=%22250%22 y=%22262%22%3E%C2%A0%C2%A0%C2%A0%C2%A0def%C2%A0save(self):%C2%A0...%3C/text%3E%3Ctext x=%22250%22 y=%22284%22%3E%23%C2%A0TODO:%C2%A0deploy%3C/text%3E%3Ctext x=%22330%22 y=%2260%22 font-size=%2246%22 fill-opacity=%220.068%22%3E%26lt%3B/%26gt%3B%3C/text%3E%3Ctext x=%2240%22 y=%22300%22 font-size=%2240%22 fill-opacity=%220.068%22%3E%7B %7D%3C/text%3E%3Ctext x=%22440%22 y=%22340%22 font-size=%2234%22 fill-opacity=%220.068%22%3E%3B%3C/text%3E%3C/g%3E%3C/svg%3E");--wd6:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22520%22 height=%22380%22%3E%3Cg fill=%22%23e5cd82%22 fill-opacity=%220.11%22 font-family=%22Consolas,Menlo,DejaVu Sans Mono,monospace%22 font-size=%2215%22%3E%3Ctext x=%2222%22 y=%2234%22%3Edef%C2%A0main():%3C/text%3E%3Ctext x=%2222%22 y=%2256%22%3E%C2%A0%C2%A0%C2%A0%C2%A0app%C2%A0=%C2%A0create_app()%3C/text%3E%3Ctext x=%2222%22 y=%2278%22%3E%C2%A0%C2%A0%C2%A0%C2%A0app.run(port=8000)%3C/text%3E%3Ctext x=%2222%22 y=%22100%22%3E%3C/text%3E%3Ctext x=%2222%22 y=%22122%22%3E%24%C2%A0npm%C2%A0run%C2%A0build%3C/text%3E%3Ctext x=%2222%22 y=%22144%22%3E%24%C2%A0git%C2%A0push%C2%A0origin%C2%A0main%3C/text%3E%3Ctext x=%22250%22 y=%22218%22%3Eclass%C2%A0User(Model):%3C/text%3E%3Ctext x=%22250%22 y=%22240%22%3E%C2%A0%C2%A0%C2%A0%C2%A0name%C2%A0=%C2%A0Field()%3C/text%3E%3Ctext x=%22250%22 y=%22262%22%3E%C2%A0%C2%A0%C2%A0%C2%A0def%C2%A0save(self):%C2%A0...%3C/text%3E%3Ctext x=%22250%22 y=%22284%22%3E%23%C2%A0TODO:%C2%A0deploy%3C/text%3E%3Ctext x=%22330%22 y=%2260%22 font-size=%2246%22 fill-opacity=%220.08800000000000001%22%3E%26lt%3B/%26gt%3B%3C/text%3E%3Ctext x=%2240%22 y=%22300%22 font-size=%2240%22 fill-opacity=%220.08800000000000001%22%3E%7B %7D%3C/text%3E%3Ctext x=%22440%22 y=%22340%22 font-size=%2234%22 fill-opacity=%220.08800000000000001%22%3E%3B%3C/text%3E%3C/g%3E%3C/svg%3E");}
main>*:nth-child(6n+1){--wl:var(--wl1);--wd:var(--wd1)}
main>*:nth-child(6n+2){--wl:var(--wl2);--wd:var(--wd2)}
main>*:nth-child(6n+3){--wl:var(--wl3);--wd:var(--wd3)}
main>*:nth-child(6n+4){--wl:var(--wl4);--wd:var(--wd4)}
main>*:nth-child(6n+5){--wl:var(--wl5);--wd:var(--wd5)}
main>*:nth-child(6n){--wl:var(--wl6);--wd:var(--wd6)}
.section>.container:before,.section>.narrow:before,.hero-in:before,.page-head>.container:before,.cta>.container:before{content:"";position:absolute;z-index:-1;pointer-events:none;top:-140px;bottom:-140px;left:50%;width:100vw;margin-left:-50vw;background:var(--wl) 0 0/520px 380px repeat}
.hero-in:before,.page-head>.container:before,.cta>.container:before,.section.dark>.container:before{background-image:var(--wd)}

/* ---------- VISIBILITY FIXES ---------- */
.title{margin-bottom:1.4em}
.btn-ghost{background:transparent;color:#15370d;border:1.5px solid #15370d}
.btn-ghost:hover{background:#15370d;color:#fff2b4;border-color:#15370d}
.btn.btn-danger{background:linear-gradient(135deg,#ef4444,#b91c1c);color:#fff}
.hero .btn-ghost,.page-head .btn-ghost,.cta .btn-ghost,.section.dark .btn-ghost{background:transparent;color:#fff2b4;border-color:rgba(255,242,180,.6)}
.hero .btn-ghost:hover,.page-head .btn-ghost:hover,.cta .btn-ghost:hover,.section.dark .btn-ghost:hover{background:#fff2b4;color:#15370d;border-color:#fff2b4}
.btn-light{color:#15370d!important}
.cta{background:linear-gradient(120deg,#0d2108,#15370d,#2f5a22,#15370d);background-size:300% 300%}
.hero a:not(.btn),.page-head a:not(.btn),.cta a:not(.btn),.section.dark a:not(.btn){color:#e5cd82}
.hero a:not(.btn):hover,.page-head a:not(.btn):hover,.cta a:not(.btn):hover,.section.dark a:not(.btn):hover{color:#fff2b4}
.footer .muted,.section.dark .muted,.hero .muted,.cta .muted,.page-head .muted{color:#b5c7b0}
.section.dark .price{background:linear-gradient(135deg,#e5cd82,#fff2b4);-webkit-background-clip:text;background-clip:text;color:transparent}
.section.dark .card h3,.section.dark .card b{color:#fff}
.grid>.card:nth-child(6n+3){--g1:#a68a2f;--g2:#6f5714;--tint:rgba(229,205,130,.22)}
.grid>.card:nth-child(6n+5){--g1:#8f7420;--g2:#5e4a0e;--tint:rgba(229,205,130,.24)}
.tag,.num,.cmark,.avatar.ph{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.25)}
.chip:hover{border-color:#15370d;color:#15370d}.chip.on,.chip.on:hover{background:#15370d;color:#fff2b4}
.nav nav a.btn-login:hover{color:#fff2b4}

/* ---------- HERO STATS: clean 2x2 grid; app.js moves the cards round in a circle every few seconds ---------- */
.stats{grid-auto-rows:1fr;align-items:stretch}
.stat,.stat:nth-child(n){margin:0!important;display:flex;flex-direction:column;justify-content:center;animation:popIn .8s both;translate:0 0;will-change:translate}
.stat:nth-child(1){animation-delay:.3s}.stat:nth-child(2){animation-delay:.45s}.stat:nth-child(3){animation-delay:.6s}.stat:nth-child(4){animation-delay:.75s}
.stat:hover{background:rgba(255,255,255,.14)}

/* footer: logo + company name on one row */
.footer a.logo{display:inline-flex;align-items:center;flex-direction:row;white-space:nowrap}
.footer a.logo:hover{transform:none}

/* ---------- CARD HEAD: icon / number / tag / avatar sits in the same row as the title ---------- */
.chead{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.chead h3{margin:0;flex:1;min-width:0;line-height:1.25}
.chead .ico{flex:none;width:50px;height:50px;font-size:1.5rem;border-radius:14px}
.chead .num{flex:none;margin:0}
.chead .tag{flex:none}
.chead .avatar{flex:none;width:64px;height:64px;margin:0;font-size:1.5rem;box-shadow:0 0 0 3px #fff,0 0 0 5px var(--g1)}
.chead small{display:block}
.steps .card{text-align:left}.steps .num{margin:0}

/* ---------- underline bar under every menu-page heading (same as "What we do") ---------- */
.page-head h1:after{content:"";display:block;width:64px;height:4px;margin:12px auto 0;border-radius:4px;background:linear-gradient(90deg,#728e6d,#e5cd82,#fff2b4);animation:grow 1.2s both}
.page-head h1+p{margin-top:16px}

/* ---------- LANGUAGE TOGGLE + BANGLA FONT ---------- */
.lang{display:inline-flex;border:1.5px solid var(--brand2);border-radius:99px;overflow:hidden;flex:none}
.lang button{border:0;background:transparent;color:var(--brand2);padding:5px 12px;font:inherit;font-size:.8rem;font-weight:700;cursor:pointer;transition:.25s}
.lang button:hover{background:rgba(114,142,109,.2)}
.lang button.on,.lang button.on:hover{background:var(--brand2);color:#fff2b4}
html.bn body,html.bn input,html.bn select,html.bn textarea,html.bn button{font-family:"Hind Siliguri","Noto Sans Bengali","Nirmala UI","Vrinda",system-ui,sans-serif}
html.bn body{line-height:1.75}
html.bn h1,html.bn h2,html.bn h3{line-height:1.4}

/* ---- utility classes (replace inline style="" so the Content-Security-Policy can stay strict) ---- */
.u-inline{display:inline!important}
.u-mb14{margin-bottom:14px!important}
.u-mt12{margin-top:12px!important}
.u-mt18{margin-top:18px!important}
.u-mt26{margin-top:26px!important;position:relative;z-index:2}
.u-mt28{margin-top:28px!important}
.u-w46{width:46%!important}
.u-w100{width:100%!important}
.u-span{grid-column:1/-1!important}
.mitem.g0{--g1:#2b5a1c;--g2:#15370d}
.mitem.g1{--g1:#728e6d;--g2:#4f6b4a}
.mitem.g2{--g1:#c9ae55;--g2:#728e6d}
.mitem.g3{--g1:#4f6b4a;--g2:#15370d}
.mitem.g4{--g1:#e5cd82;--g2:#b8963a}
.mitem.g5{--g1:#15370d;--g2:#2b5a1c}

/* ---- /tec/ admin login: site topbar + footer, glass-card login in the middle ---- */
.loginwrap{position:relative;overflow:hidden;display:grid;place-items:center;min-height:max(540px,calc(100vh - 380px));padding:56px 0;background:linear-gradient(120deg,#0d2108,#15370d,#2a5a1b,#0d2108);background-size:300% 300%;animation:gradShift 16s ease infinite}
.loginwrap:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:46px 46px;mask-image:radial-gradient(circle at 50% 45%,#000,transparent 80%);-webkit-mask-image:radial-gradient(circle at 50% 45%,#000,transparent 80%)}
.loginwrap:after{content:"";position:absolute;inset:0;background:var(--wd1) 0 0/520px 380px repeat;pointer-events:none}
.loginwrap .login{position:relative;z-index:2;width:min(400px,92%);padding:34px 30px;margin:0;color:#fff;background:rgba(255,255,255,.08);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.18);border-top:3px solid #e5cd82;border-radius:var(--r);box-shadow:0 24px 60px -18px rgba(0,0,0,.55);animation:popIn .7s both}
.loginwrap .login:hover{transform:none}
.loginwrap .login:before{display:none}
.loginwrap .login h2{text-align:center;color:#fff;margin:.2em 0 1em}
.loginwrap .login label{color:#eef3e8}
.loginwrap .login input{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.28);color:#fff}
.loginwrap .login input::placeholder{color:#b5c7b0}
.loginwrap .login input:focus{border-color:#e5cd82;box-shadow:0 0 0 3px rgba(229,205,130,.28);background:rgba(255,255,255,.16)}
.loginwrap .login input:-webkit-autofill{-webkit-text-fill-color:#fff;transition:background-color 9999s}
.loginwrap .login .btn{background:linear-gradient(135deg,#e5cd82,#d4b24c);color:#15370d;font-weight:700}
.loginwrap .login .btn:hover{color:#15370d;box-shadow:0 10px 26px rgba(229,205,130,.4)}
.loginwrap .login .alert{background:rgba(229,205,130,.18);color:#fff2b4;border:1px solid rgba(229,205,130,.4)}
.loginwrap .login .alert.err{background:rgba(239,68,68,.18);color:#fecaca;border-color:rgba(239,68,68,.5)}