/* Qumaipiao EN — shared design system */
:root{
  --green:#2CB364;--green-strong:#1F9D57;--green-bright:#3ED27C;--green-deep:#127A42;
  --pine:#08251A;--pine-2:#0E3627;--sky:#1E88C7;--amber:#E8B04B;--violet:#5A6BD8;
  --ink:#0C1E15;--text:#465A50;--muted:#728579;
  --bg:#FBFDFB;--bg-soft:#EFF6F1;--card:#FFFFFF;--line:#E4EDE7;
  --shadow-sm:0 1px 2px rgba(8,37,26,.05),0 8px 20px -12px rgba(8,37,26,.18);
  --shadow:0 2px 4px rgba(8,37,26,.05),0 24px 48px -20px rgba(8,37,26,.28);
  --shadow-lg:0 4px 8px rgba(8,37,26,.06),0 44px 80px -28px rgba(8,37,26,.4);
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue","PingFang SC",Arial,sans-serif;
  --serif:ui-serif,"New York",Georgia,"Times New Roman",serif;
  --r:20px;--maxw:1180px;
}
@media (prefers-color-scheme:dark){:root{--ink:#EAF4EE;--text:#B0C2B8;--muted:#88998F;--bg:#061109;--bg-soft:#0B1C13;--card:#0E2318;--line:#1B3325;--green:#3ED27C;--green-strong:#2CB364;--green-bright:#54E08D;--shadow-sm:0 1px 2px rgba(0,0,0,.4),0 10px 24px -14px rgba(0,0,0,.7);--shadow:0 2px 4px rgba(0,0,0,.5),0 30px 56px -22px rgba(0,0,0,.8);--shadow-lg:0 4px 8px rgba(0,0,0,.55),0 50px 90px -30px rgba(0,0,0,.9);}}
:root[data-theme="light"]{--ink:#0C1E15;--text:#465A50;--muted:#728579;--bg:#FBFDFB;--bg-soft:#EFF6F1;--card:#FFFFFF;--line:#E4EDE7;--green:#2CB364;--green-strong:#1F9D57;--green-bright:#3ED27C;}
:root[data-theme="dark"]{--ink:#EAF4EE;--text:#B0C2B8;--muted:#88998F;--bg:#061109;--bg-soft:#0B1C13;--card:#0E2318;--line:#1B3325;--green:#3ED27C;--green-strong:#2CB364;--green-bright:#54E08D;--shadow:0 2px 4px rgba(0,0,0,.5),0 30px 56px -22px rgba(0,0,0,.8);}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--bg);color:var(--text);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
h1,h2,h3{color:var(--ink);line-height:1.08;letter-spacing:-.022em;text-wrap:balance;font-weight:680}
a{color:inherit;text-decoration:none}
svg{display:block}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:650;letter-spacing:.14em;text-transform:uppercase;color:var(--green-strong)}
.eyebrow:before{content:"";width:22px;height:2px;border-radius:2px;background:var(--green)}
.lead{font-size:clamp(16px,1.4vw,18.5px);color:var(--text)}
.center{text-align:center}

.btn{display:inline-flex;align-items:center;gap:9px;font-weight:600;font-size:15px;padding:13px 24px;border-radius:12px;border:1px solid transparent;cursor:pointer;transition:.24s}
.btn-primary{background:linear-gradient(135deg,var(--green),var(--green-strong));color:#fff;box-shadow:0 10px 24px -10px rgba(31,157,87,.8)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 34px -10px rgba(31,157,87,.85)}
.btn-ghost{background:var(--card);color:var(--ink);border-color:var(--line);box-shadow:var(--shadow-sm)}
.btn-ghost:hover{border-color:var(--green);color:var(--green-strong);transform:translateY(-2px)}
.btn-light{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.3)}
.btn-light:hover{background:rgba(255,255,255,.2);transform:translateY(-2px)}
.btn svg{width:17px;height:17px}

/* nav */
header{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:saturate(160%) blur(16px);-webkit-backdrop-filter:saturate(160%) blur(16px);border-bottom:1px solid transparent;transition:.3s}
header.stuck{border-bottom-color:var(--line);box-shadow:0 6px 30px -20px rgba(8,37,26,.4)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:11px;font-weight:730;color:var(--ink);font-size:20px;letter-spacing:-.02em}
.mark{width:36px;height:36px;border-radius:11px;background:linear-gradient(140deg,var(--green-bright),var(--green-strong));display:grid;place-items:center;box-shadow:0 8px 18px -6px rgba(31,157,87,.8)}
.mark svg{width:20px;height:20px}
.nav-links{display:flex;gap:30px;align-items:center}
.nav-links>a,.has-drop>span{font-size:15px;color:var(--text);font-weight:500;transition:.2s;cursor:pointer;display:inline-flex;align-items:center;gap:5px}
.nav-links>a:hover,.has-drop:hover>span,.nav-links>a.on{color:var(--green-strong)}
.has-drop{position:relative}
.has-drop>span svg{width:13px;height:13px;transition:.2s}.has-drop:hover>span svg{transform:rotate(180deg)}
.drop{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(8px);background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:12px;width:520px;display:grid;grid-template-columns:1fr 1fr;gap:4px;opacity:0;visibility:hidden;transition:.24s}
.has-drop:hover .drop{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.drop:before{content:"";position:absolute;top:-16px;left:0;right:0;height:16px}
.drop a{display:flex;gap:11px;align-items:flex-start;padding:11px 12px;border-radius:11px;transition:.18s}
.drop a:hover{background:var(--bg-soft)}
.drop a .di{width:34px;height:34px;border-radius:9px;flex:none;display:grid;place-items:center;color:#fff}
.drop a .di svg{width:17px;height:17px}
.drop a b{display:block;font-size:14px;color:var(--ink);font-weight:600}
.drop a span{font-size:12px;color:var(--muted);line-height:1.4}
.nav-right{display:flex;gap:13px;align-items:center}
.lang{font-size:14px;font-weight:600;color:var(--muted);padding:8px 13px;border-radius:10px;border:1px solid var(--line)}
.lang:hover{color:var(--green-strong);border-color:var(--green)}
.menu-btn{display:none;background:none;border:none;cursor:pointer;color:var(--ink)}

/* page hero (sub pages) */
.phero{position:relative;padding:clamp(52px,7vw,88px) 0 clamp(40px,5vw,60px);overflow:hidden;background:var(--bg-soft);border-bottom:1px solid var(--line)}
.phero:before{content:"";position:absolute;inset:0;background:radial-gradient(50% 70% at 85% 0%,color-mix(in srgb,var(--green) 16%,transparent),transparent 60%)}
.phero .wrap{position:relative}
.crumb{font-size:13px;color:var(--muted);margin-bottom:16px}.crumb a:hover{color:var(--green-strong)}
.phero h1{font-size:clamp(30px,4.4vw,52px);margin:14px 0 18px;font-weight:700}
.phero .lead{max-width:58ch}
.phero .pcta{margin-top:26px;display:flex;gap:13px;flex-wrap:wrap}

/* hero (home) */
.hero{position:relative;padding:clamp(48px,7vw,86px) 0 clamp(56px,7vw,88px);overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(60% 50% at 82% 8%,color-mix(in srgb,var(--green) 20%,transparent),transparent 60%),radial-gradient(50% 45% at 8% 90%,color-mix(in srgb,var(--sky) 12%,transparent),transparent 60%)}
.blob{position:absolute;border-radius:50%;filter:blur(46px);opacity:.5;animation:drift 16s ease-in-out infinite}
.blob.b1{width:340px;height:340px;background:radial-gradient(circle,var(--green-bright),transparent 68%);top:-60px;right:6%}
.blob.b2{width:300px;height:300px;background:radial-gradient(circle,#57C7E8,transparent 68%);bottom:-70px;left:-40px;animation-delay:-6s}
@keyframes drift{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(24px,-22px) scale(1.08)}}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.04fr .96fr;gap:52px;align-items:center}
.badge{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--green-strong);background:color-mix(in srgb,var(--green) 12%,transparent);border:1px solid color-mix(in srgb,var(--green) 26%,transparent);padding:7px 14px;border-radius:30px;margin-bottom:22px}
.badge i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 0 rgba(44,179,100,.6);animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(44,179,100,.5)}70%{box-shadow:0 0 0 9px rgba(44,179,100,0)}100%{box-shadow:0 0 0 0 rgba(44,179,100,0)}}
.hero h1{font-size:clamp(35px,5.4vw,64px);margin:0 0 22px;font-weight:700}
.hero h1 em{font-style:normal;background:linear-gradient(120deg,var(--green-strong),var(--sky));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .lead{max-width:52ch}
.hero-cta{display:flex;gap:14px;margin:32px 0 24px;flex-wrap:wrap}
.avstack{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--muted)}
.avs{display:flex}.avs span{width:32px;height:32px;border-radius:50%;border:2px solid var(--bg);margin-left:-10px;background:linear-gradient(135deg,var(--green-bright),var(--green-strong));display:grid;place-items:center;color:#fff;font-size:12px;font-weight:700}
.avs span:first-child{margin-left:0}.avstack b{color:var(--ink)}
.scene{position:relative;aspect-ratio:1/.92;width:100%}.scene>svg{width:100%;height:100%;overflow:visible}
.cloud{animation:cloud 22s linear infinite}.cloud.c2{animation-duration:30s;animation-delay:-8s}
@keyframes cloud{from{transform:translateX(-30px)}to{transform:translateX(30px)}}
.beam{animation:beam 4.5s ease-in-out infinite}@keyframes beam{0%,100%{opacity:.15}50%{opacity:.5}}
.chip{position:absolute;background:var(--card);border:1px solid var(--line);border-radius:15px;box-shadow:var(--shadow);padding:12px 15px;display:flex;align-items:center;gap:11px}
.chip .ci{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:none}.chip .ci svg{width:18px;height:18px}
.chip .ct b{display:block;font-size:13.5px;color:var(--ink);font-weight:660;line-height:1.2}.chip .ct span{font-size:11.5px;color:var(--muted)}
.chip.k1{top:6%;left:-4%;animation:floaty 5s ease-in-out infinite}.chip.k2{bottom:16%;right:-6%;animation:floaty 6s ease-in-out infinite;animation-delay:-2s}.chip.k3{bottom:-2%;left:12%;animation:floaty 5.5s ease-in-out infinite;animation-delay:-1s}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}

/* channel strip */
.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg-soft)}
.strip .wrap{padding:22px 24px;display:flex;align-items:center;gap:30px;flex-wrap:wrap;justify-content:space-between}
.strip .cap{font-size:13px;color:var(--muted);font-weight:600}
.chan{display:flex;gap:26px;flex-wrap:wrap}.chan .c{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--text)}.chan .c svg{width:19px;height:19px;color:var(--green-strong)}

/* sections */
.sec{padding:clamp(66px,8vw,110px) 0;position:relative}
.sec.soft{background:var(--bg-soft)}
.sec-head{text-align:center;max-width:680px;margin:0 auto 52px;display:flex;flex-direction:column;align-items:center;gap:16px}
.sec-head h2{font-size:clamp(28px,3.6vw,45px)}.sec-head .lead{color:var(--text)}
.grid{display:grid;gap:20px}.g4{grid-template-columns:repeat(4,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:28px;transition:.28s;position:relative;overflow:hidden}
.card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:color-mix(in srgb,var(--green) 40%,var(--line))}
.ico{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;margin-bottom:20px;color:#fff;box-shadow:0 10px 20px -10px rgba(31,157,87,.6)}.ico svg{width:26px;height:26px}
.i-green{background:linear-gradient(135deg,#3ED27C,#1F9D57)}.i-sky{background:linear-gradient(135deg,#4FC3E8,#1E88C7)}.i-amber{background:linear-gradient(135deg,#F1C46A,#D9962E)}.i-violet{background:linear-gradient(135deg,#8E9BF0,#5A6BD8)}
.card h3{font-size:18.5px;margin-bottom:8px;font-weight:660}.card p{font-size:14.5px;color:var(--text)}
.card .arrow{margin-top:16px;display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;color:var(--green-strong);opacity:0;transform:translateX(-6px);transition:.25s}
.card:hover .arrow{opacity:1;transform:none}.card .arrow svg{width:15px;height:15px}
.card.link:hover{cursor:pointer}

/* feature split (alternating) */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.split.rev .st{order:2}
.split .st .eyebrow{margin-bottom:16px}
.split .st h2{font-size:clamp(25px,3vw,38px);margin-bottom:16px}
.split .st p{font-size:16px;color:var(--text);margin-bottom:12px}
.split .ul{list-style:none;margin-top:18px;display:flex;flex-direction:column;gap:12px}
.split .ul li{display:flex;gap:11px;align-items:flex-start;font-size:15px;color:var(--text)}
.split .ul li svg{width:20px;height:20px;color:var(--green-strong);flex:none;margin-top:1px}
.split .viz{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:26px;position:relative;overflow:hidden;min-height:300px}
.split .viz:before{content:"";position:absolute;inset:0;background:radial-gradient(90% 80% at 90% 0%,color-mix(in srgb,var(--green) 14%,transparent),transparent 60%)}
.split .viz>svg{width:100%;height:auto;position:relative}

/* stat band */
.statband{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.statband>div{background:var(--card);padding:30px 26px;text-align:center}
.statband .n{font-family:var(--serif);font-size:clamp(28px,3.4vw,40px);color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.statband .n span{color:var(--green-strong);font-size:.62em}
.statband .l{color:var(--muted);font-size:13.5px;margin-top:8px}

/* dark section */
.dark{background:var(--pine-2);color:#DCEBE2;overflow:hidden;position:relative}
.dark h2{color:#fff}.dark .eyebrow{color:var(--green-bright)}.dark .lead{color:#A9C3B6}
.dark-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;position:relative;z-index:1}
.caps{display:flex;flex-direction:column;gap:16px;margin-top:26px}
.cap{display:flex;gap:15px;align-items:flex-start}
.cap .ck{flex:none;width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,rgba(62,210,124,.25),rgba(62,210,124,.1));color:var(--green-bright);display:grid;place-items:center;border:1px solid rgba(62,210,124,.25)}.cap .ck svg{width:19px;height:19px}
.cap b{color:#fff;font-weight:640;font-size:16px}.cap span{display:block;color:#9DBAAC;font-size:13.5px;margin-top:3px}
.statwall{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.sw{background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.1);border-radius:18px;padding:26px 24px}
.sw .n{font-family:var(--serif);font-size:clamp(30px,4.4vw,46px);color:#fff;font-weight:600;line-height:1;font-variant-numeric:tabular-nums}.sw .n span{color:var(--green-bright);font-size:.6em}
.sw .l{color:#9DBAAC;font-size:13px;margin-top:10px}

/* industries */
.ind{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.indc{position:relative;border-radius:var(--r);overflow:hidden;min-height:260px;display:flex;flex-direction:column;justify-content:flex-end;padding:24px;color:#fff;transition:.3s}
.indc:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.indc .art{position:absolute;inset:0;z-index:0}.indc .art svg{width:100%;height:100%}
.indc .gr{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 30%,rgba(6,20,13,.82) 100%)}
.indc .tx{position:relative;z-index:2}.indc h3{color:#fff;font-size:20px;margin-bottom:5px}.indc p{color:#D3E4DA;font-size:13.5px}
.indc .pill{position:absolute;top:18px;left:18px;z-index:2;background:rgba(255,255,255,.16);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.25);border-radius:9px;width:40px;height:40px;display:grid;place-items:center}.indc .pill svg{width:20px;height:20px}

/* logos */
.logos{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.logo{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:650;color:var(--ink);font-size:14.5px;min-height:78px;transition:.25s}
.logo:hover{border-color:color-mix(in srgb,var(--green) 40%,var(--line));box-shadow:var(--shadow-sm);transform:translateY(-3px)}

/* faq */
.faq{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.qa{background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.qa summary{list-style:none;cursor:pointer;padding:20px 22px;font-weight:600;color:var(--ink);font-size:16px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.qa summary::-webkit-details-marker{display:none}
.qa summary:after{content:"+";font-size:22px;color:var(--green-strong);transition:.2s}
.qa[open] summary:after{transform:rotate(45deg)}
.qa .a{padding:0 22px 20px;font-size:15px;color:var(--text)}

/* pricing */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:start}
.plan{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:30px;display:flex;flex-direction:column;gap:14px}
.plan.feat{border-color:var(--green);box-shadow:var(--shadow);position:relative}
.plan.feat:before{content:"Most popular";position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--green-strong);color:#fff;font-size:11.5px;font-weight:700;padding:5px 14px;border-radius:20px;letter-spacing:.03em}
.plan .pn{font-size:14px;font-weight:700;color:var(--green-strong);text-transform:uppercase;letter-spacing:.05em}
.plan .pp{font-family:var(--serif);font-size:36px;color:var(--ink);font-weight:600}.plan .pp small{font-size:15px;color:var(--muted);font-family:var(--sans)}
.plan .pd{font-size:14px;color:var(--muted)}
.plan ul{list-style:none;display:flex;flex-direction:column;gap:11px;margin:8px 0}
.plan ul li{display:flex;gap:10px;font-size:14.5px;color:var(--text)}.plan ul li svg{width:18px;height:18px;color:var(--green-strong);flex:none}
.plan .btn{justify-content:center;margin-top:auto}

/* contact */
.cgrid{display:grid;grid-template-columns:1fr 1.1fr;gap:44px;align-items:start}
.cinfo .ci-row{display:flex;gap:15px;align-items:flex-start;margin-bottom:24px}
.cinfo .ci-row .ck{width:44px;height:44px;border-radius:12px;flex:none;display:grid;place-items:center;color:#fff}.cinfo .ci-row .ck svg{width:21px;height:21px}
.cinfo .ci-row b{display:block;color:var(--ink);font-size:15px;font-weight:640}.cinfo .ci-row span{color:var(--muted);font-size:14px}
.cform{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:30px;box-shadow:var(--shadow-sm)}
.cform label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin:14px 0 7px}
.cform input,.cform textarea,.cform select{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:11px;background:var(--bg);color:var(--ink);font-family:inherit;font-size:14.5px}
.cform input:focus,.cform textarea:focus,.cform select:focus{outline:none;border-color:var(--green)}
.cform .btn{width:100%;justify-content:center;margin-top:22px}

/* news list */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.post{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:.28s;display:flex;flex-direction:column}
.post:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.post .thumb{height:170px;position:relative;overflow:hidden}.post .thumb svg{width:100%;height:100%}
.post .pc{padding:22px;display:flex;flex-direction:column;gap:9px;flex:1}
.post .tag{font-size:12px;font-weight:600;color:var(--green-strong)}
.post h3{font-size:17px;line-height:1.35}.post p{font-size:14px;color:var(--muted);flex:1}
.post .meta{font-size:12.5px;color:var(--muted);margin-top:6px}

/* cta */
.cta{background:linear-gradient(150deg,var(--pine),var(--green-deep));color:#fff;border-radius:30px;padding:clamp(44px,6vw,72px);text-align:center;position:relative;overflow:hidden}
.cta:before{content:"";position:absolute;inset:0;background:radial-gradient(60% 120% at 50% -20%,rgba(62,210,124,.35),transparent 55%)}
.cta .in{position:relative;z-index:1}.cta h2{color:#fff;font-size:clamp(28px,4vw,46px);margin-bottom:16px}
.cta p{color:#CDE6D9;font-size:17px;max-width:50ch;margin:0 auto 30px}
.cta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.cta .phone{margin-top:26px;font-size:14px;color:#9DBFB0}.cta .phone b{color:#fff;font-family:var(--serif);font-size:20px}

/* footer */
footer{border-top:1px solid var(--line);padding:64px 0 34px;background:var(--bg-soft)}
.foot{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr 1fr;gap:30px;margin-bottom:44px}
.foot .about{max-width:30ch}.foot .about p{font-size:14px;color:var(--muted);margin-top:16px}
.fcol h4{font-size:12.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:16px;font-weight:650}
.fcol a{display:block;font-size:14.5px;color:var(--text);margin-bottom:11px;transition:.2s}.fcol a:hover{color:var(--green-strong)}
.foot-bottom{border-top:1px solid var(--line);padding-top:24px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.foot-bottom a{color:var(--muted)}.foot-bottom a:hover{color:var(--green-strong)}

.rv{opacity:0;transform:translateY(26px);transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .75s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*{animation:none!important}.rv{opacity:1;transform:none;transition:none}}

@media (max-width:940px){
  .hero-grid,.dark-grid,.split,.cgrid{grid-template-columns:1fr;gap:40px}.split.rev .st{order:0}
  .g4,.g3,.plans,.ind,.posts{grid-template-columns:repeat(2,1fr)}
  .statband{grid-template-columns:1fr 1fr}.logos{grid-template-columns:repeat(3,1fr)}
  .foot{grid-template-columns:1fr 1fr}.foot .about{grid-column:1/-1}
  .nav-links{display:none}.scene{max-width:460px;margin:10px auto 0}
}
@media (max-width:560px){
  .g4,.g3,.g2,.plans,.ind,.statband,.posts,.logos,.statwall{grid-template-columns:1fr}
  .menu-btn{display:block}.nav-right .btn{display:none}.chip.k1{left:0}.chip.k2{right:0}
}

/* page-hero banner illustration (two-column) */
.phero.has-viz .wrap{display:grid;grid-template-columns:1.06fr .94fr;gap:48px;align-items:center}
.phero .ptext{position:relative;z-index:1}
.phero .pviz{position:relative}
.phero .pviz .frame{background:var(--card);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow-lg);padding:16px;overflow:hidden}
.phero .pviz svg{width:100%;height:auto;display:block;border-radius:13px}
.phero .pviz .tagchip{position:absolute;bottom:-14px;left:24px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:9px 14px;display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:600;color:var(--ink)}
.phero .pviz .tagchip .d{width:26px;height:26px;border-radius:8px;background:linear-gradient(135deg,var(--green-bright),var(--green-strong));display:grid;place-items:center;color:#fff}
.phero .pviz .tagchip .d svg{width:15px;height:15px;border-radius:0}
@media (max-width:940px){.phero.has-viz .wrap{grid-template-columns:1fr}.phero .pviz{max-width:480px;margin-top:8px}}

/* WhatsApp floating contact button */
.wa-float{position:fixed;right:22px;bottom:24px;z-index:90;display:flex;align-items:center;background:#25D366;color:#fff;border-radius:34px;text-decoration:none;box-shadow:0 14px 32px -8px rgba(37,211,102,.55);transition:transform .25s ease;animation:wapulse 2.6s infinite}
.wa-float:hover{transform:translateY(-3px)}
.wa-float .wa-ic{width:60px;height:60px;flex:none;display:grid;place-items:center}
.wa-float .wa-ic svg{width:33px;height:33px}
.wa-float .wa-tx{overflow:hidden;max-width:0;white-space:nowrap;font-weight:650;font-size:15px;opacity:0;transition:.28s ease}
.wa-float:hover .wa-tx{max-width:180px;opacity:1;padding-right:22px}
@keyframes wapulse{0%{box-shadow:0 14px 32px -8px rgba(37,211,102,.55),0 0 0 0 rgba(37,211,102,.45)}70%{box-shadow:0 14px 32px -8px rgba(37,211,102,.55),0 0 0 15px rgba(37,211,102,0)}100%{box-shadow:0 14px 32px -8px rgba(37,211,102,.55),0 0 0 0 rgba(37,211,102,0)}}
@media (prefers-reduced-motion:reduce){.wa-float{animation:none}}
@media (max-width:560px){.wa-float{right:16px;bottom:16px}.wa-float .wa-ic{width:54px;height:54px}.wa-float .wa-ic svg{width:30px;height:30px}}

/* floating contact stack (WhatsApp + phone + email) */
.contact-fab{position:fixed;right:22px;bottom:24px;z-index:90;display:flex;flex-direction:column;align-items:flex-end;gap:13px}
.cf{display:flex;align-items:center;justify-content:flex-end;border-radius:30px;color:#fff;text-decoration:none;box-shadow:0 12px 26px -8px rgba(8,37,26,.4);transition:transform .22s}
.cf:hover{transform:translateY(-2px) scale(1.02)}
.cf .cf-ic{width:54px;height:54px;flex:none;display:grid;place-items:center}
.cf .cf-ic svg{width:27px;height:27px}
.cf .cf-tx{overflow:hidden;max-width:0;white-space:nowrap;font-weight:600;font-size:14px;opacity:0;transition:.26s ease}
.cf:hover .cf-tx{max-width:230px;opacity:1;padding-left:20px}
.cf.email{background:linear-gradient(135deg,#4FC3E8,#1E88C7)}
.cf.phone{background:linear-gradient(135deg,#3ED27C,#1F9D57)}
.cf.wa{background:#25D366;animation:wapulse 2.6s infinite}
@media (prefers-reduced-motion:reduce){.cf.wa{animation:none}}
@media (max-width:560px){.contact-fab{right:15px;bottom:15px;gap:11px}.cf .cf-ic{width:50px;height:50px}.cf .cf-ic svg{width:25px;height:25px}}


/* real photo integration */
.indc .art{background-size:cover;background-position:center}
.banner-photo{width:100%;display:block;border-radius:13px;aspect-ratio:16/9.6;object-fit:cover}
.phero .pviz .frame{padding:12px}
.showcase{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.shot{position:relative;border-radius:16px;overflow:hidden;min-height:200px;border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.shot .cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:16px;color:#fff;background:linear-gradient(180deg,transparent,rgba(6,20,13,.85))}
.shot .cap b{font-size:15px;font-weight:660;display:block}.shot .cap span{font-size:12.5px;color:#CFE6DA}
@media (max-width:760px){.showcase{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.showcase{grid-template-columns:1fr}}


/* ===== live demo dashboard (ported from v2) ===== */
.demo{background:var(--pine);position:relative;overflow:hidden}
  .demo:before{content:"";position:absolute;inset:0;background:radial-gradient(50% 60% at 15% 0%,rgba(62,210,124,.2),transparent 60%),radial-gradient(50% 60% at 90% 100%,rgba(30,136,199,.18),transparent 60%)}
  .demo .sec-head h2{color:#fff}.demo .sec-head .lead{color:#A9C3B6}.demo .eyebrow{color:var(--green-bright)}
  .demo-wrap{position:relative;z-index:1;max-width:940px;margin:0 auto}
  .browser{background:var(--card);border-radius:18px;box-shadow:var(--shadow-lg);overflow:hidden;border:1px solid var(--line)}
  .b-bar{display:flex;align-items:center;gap:8px;padding:14px 18px;border-bottom:1px solid var(--line);background:var(--bg-soft)}
  .b-bar i{width:11px;height:11px;border-radius:50%;background:#E0685C} .b-bar i:nth-child(2){background:#E8B04B} .b-bar i:nth-child(3){background:#5CB85C}
  .b-url{margin-left:12px;font-size:12px;color:var(--muted);background:var(--card);border:1px solid var(--line);border-radius:7px;padding:5px 12px}
  .dash{padding:22px;display:grid;grid-template-columns:1.3fr 1fr;gap:18px}
  .kpis{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .kpi{background:var(--bg-soft);border:1px solid var(--line);border-radius:14px;padding:16px}
  .kpi .k{font-size:12px;color:var(--muted);font-weight:600;display:flex;align-items:center;gap:6px}
  .kpi .k svg{width:14px;height:14px;color:var(--green-strong)}
  .kpi .v{font-family:var(--serif);font-size:28px;color:var(--ink);font-weight:600;margin-top:6px;font-variant-numeric:tabular-nums}
  .kpi .up{font-size:11.5px;color:var(--green-strong);font-weight:600}
  .chart{background:var(--bg-soft);border:1px solid var(--line);border-radius:14px;padding:16px;grid-column:1/-1}
  .chart .ct{font-size:12.5px;font-weight:600;color:var(--ink);margin-bottom:12px;display:flex;justify-content:space-between}
  .bars{display:flex;align-items:flex-end;gap:9px;height:104px}
  .bars i{flex:1;background:linear-gradient(180deg,var(--green-bright),var(--green-strong));border-radius:6px 6px 3px 3px;height:20%;transition:height 1.1s cubic-bezier(.3,.8,.3,1)}
  .side{display:flex;flex-direction:column;gap:12px}
  .feed{background:var(--bg-soft);border:1px solid var(--line);border-radius:14px;padding:14px;flex:1}
  .feed .ft{font-size:12px;font-weight:600;color:var(--muted);margin-bottom:10px}
  .ev{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
  .ev:last-child{border-bottom:none}
  .ev .d{width:28px;height:28px;border-radius:8px;background:color-mix(in srgb,var(--green) 14%,transparent);color:var(--green-strong);display:grid;place-items:center;flex:none}
  .ev .d svg{width:15px;height:15px}
  .ev .et{flex:1;font-size:12.5px;color:var(--ink);font-weight:560}
  .ev .es{font-size:11px;color:var(--muted)}
  .ev.new{animation:evin .5s ease}
  @keyframes evin{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

.post .thumb img{width:100%;height:100%;object-fit:cover;display:block}

/* ===== hero slideshow ===== */
.hero-slider{position:relative;aspect-ratio:1/.86;border-radius:22px;overflow:hidden;box-shadow:var(--shadow-lg);border:1px solid var(--line);background:var(--card)}
.hslide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity .8s ease;pointer-events:none}
.hslide.on{opacity:1;pointer-events:auto}
.hslide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.hslide .hmock{position:absolute;inset:0}
.hslide .hmock svg{width:100%;height:100%;display:block}
.hslide figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:40px 20px 18px;color:#fff;background:linear-gradient(180deg,transparent,rgba(6,20,13,.92));display:flex;align-items:center;gap:11px;font-weight:600;font-size:15.5px;line-height:1.3}
.hslide figcaption .sci{width:34px;height:34px;border-radius:10px;flex:none;display:grid;place-items:center;background:rgba(255,255,255,.22);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.hslide figcaption .sci svg{width:19px;height:19px}
.hero-dots{position:absolute;bottom:18px;right:18px;z-index:4;display:flex;gap:7px}
.hero-dots button{width:8px;height:8px;padding:0;border-radius:8px;border:none;background:rgba(255,255,255,.5);cursor:pointer;transition:.3s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.hero-dots button.on{width:22px;background:#fff}