/* CRM Cloud — public pages.
   Layout: centered 1160px column; soft indigo light bands; one navy band; 3D = perspective scenes, tilted cards and layered "gem" icons. */
:root{
	--ink:#0f1738;--body:#3b4466;--muted:#6b7394;--line:#e3e6f0;--bg:#fff;--soft:#f5f6fb;--soft2:#eef0fa;
	--navy:#1b2566;--navy-d:#111a4d;--indigo:#4f63d2;--leaf:#0f9d74;--leaf-s:#e6f6f0;--amber:#d9a21b;--wa:#25d366;--red:#b91c1c;
	--r:16px;--sh:0 1px 2px rgba(15,23,56,.06),0 12px 32px -16px rgba(15,23,56,.28);
	--fd:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;--fb:"Source Sans 3",system-ui,-apple-system,"Segoe UI",sans-serif
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--body);font:17px/1.6 var(--fb);overflow-x:hidden}
img,svg{max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--fd);color:var(--ink);line-height:1.2;margin:0;text-wrap:balance;letter-spacing:-.015em}
p{margin:0}
code{font:600 .9em/1 ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--soft2);padding:2px 6px;border-radius:6px;word-break:break-all}
.cc-wrap{width:100%;max-width:1160px;margin:0 auto;padding-inline:20px}
.cc-skip{position:absolute;left:-999px}.cc-skip:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:99}
:focus-visible{outline:3px solid #7c8cff;outline-offset:2px}
.cc-i{width:22px;height:22px;flex:none}

/* Header */
.cc-top{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.cc-top-in{display:flex;align-items:center;gap:24px;min-height:70px}
.cc-logo{display:inline-flex;align-items:center;gap:10px;font:800 18px/1 var(--fd);color:var(--ink);text-decoration:none;flex:none}
.cc-logo.has-img img{display:block;height:40px;width:auto;max-width:200px;object-fit:contain}
.cc-logo-m{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:linear-gradient(145deg,#3a4bb8,var(--navy));color:#fff;box-shadow:0 6px 14px -6px rgba(27,37,102,.8),inset 0 1px 0 rgba(255,255,255,.25)}.cc-logo-m .cc-i{width:18px;height:18px}
.cc-menu{display:flex;align-items:center;gap:24px;flex:1}
.cc-menu nav{display:flex;gap:4px;flex:1}
.cc-menu nav a{padding:8px 12px;border-radius:8px;text-decoration:none;font:600 15px var(--fd);color:var(--body)}
.cc-menu nav a:hover,.cc-menu nav a[aria-current]{color:var(--navy);background:var(--soft2)}
.cc-acts{display:flex;gap:10px}
.cc-burger{display:none;margin-left:auto;width:44px;height:44px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer}
.cc-burger span,.cc-burger span::before,.cc-burger span::after{display:block;width:18px;height:2px;background:var(--ink);margin:auto;position:relative;content:""}
.cc-burger span::before{position:absolute;top:-6px}.cc-burger span::after{position:absolute;top:6px}

/* Buttons */
.cc-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 18px;border-radius:11px;border:1.5px solid transparent;font:700 15px/1.2 var(--fd);text-decoration:none;cursor:pointer;white-space:nowrap;transition:transform .15s,box-shadow .15s,background .15s,border-color .15s}
.cc-btn-p{background:linear-gradient(180deg,#2a3689,var(--navy));color:#fff;box-shadow:0 8px 18px -8px rgba(27,37,102,.7),inset 0 1px 0 rgba(255,255,255,.18)}.cc-btn-p:hover{transform:translateY(-1px);box-shadow:0 12px 24px -10px rgba(27,37,102,.8)}
.cc-btn-ghost{background:#fff;color:var(--navy);border-color:#cfd4e6}.cc-btn-ghost:hover{border-color:var(--navy)}
.cc-btn-w{background:#fff;color:var(--navy);box-shadow:0 8px 20px -10px rgba(0,0,0,.45)}.cc-btn-w:hover{transform:translateY(-1px)}
.cc-btn-line{color:#fff;border-color:rgba(255,255,255,.45)}.cc-btn-line:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.cc-btn-lg{min-height:52px;padding:12px 24px;font-size:16px}
.cc-btn-block{width:100%}
.cc-row{display:flex;flex-wrap:wrap;gap:12px}
.cc-link{color:var(--navy);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* Type helpers */
.cc-eyebrow{font:800 12px/1 var(--fd);letter-spacing:.12em;text-transform:uppercase;color:var(--leaf);margin-bottom:12px}
.cc-lead{font-size:19px;color:var(--body);max-width:60ch;margin-top:14px}
.cc-muted{color:var(--muted)}.cc-small{font-size:14px}
.cc-center{text-align:center;margin-top:32px}
.cc-sec{padding-block:88px;overflow-x:clip}.cc-alt{background:linear-gradient(180deg,var(--soft),#fbfbfe)}
.cc-head{max-width:720px;margin-bottom:44px}.cc-head h2{font-size:clamp(28px,3.4vw,40px);font-weight:800}
.cc-center-h{margin-inline:auto;text-align:center}.cc-center-h .cc-lead{margin-inline:auto}

/* 3D gem icons */
.cc-gem{position:relative;display:grid;place-items:center;width:48px;height:48px;border-radius:13px;flex:none;color:#fff;
	background:linear-gradient(145deg,#6576e6 0%,#3342a8 55%,#1d2770 100%);
	box-shadow:0 8px 16px -10px rgba(27,37,102,.6),inset 0 1px 0 rgba(255,255,255,.3)}
.cc-gem::after{content:none}
.cc-gem .cc-i{width:24px;height:24px;filter:drop-shadow(0 2px 2px rgba(0,0,0,.25))}
.cc-gem.is-g{background:linear-gradient(145deg,#34d399,#0f9d74 55%,#08664c);box-shadow:0 12px 20px -10px rgba(8,102,76,.75),inset 0 2px 0 rgba(255,255,255,.35),inset 0 -4px 0 rgba(0,0,0,.18)}
.cc-gem.is-y{background:linear-gradient(145deg,#fcd34d,#e0a100 55%,#a16207);box-shadow:0 12px 20px -10px rgba(161,98,7,.75),inset 0 2px 0 rgba(255,255,255,.4),inset 0 -4px 0 rgba(0,0,0,.18)}
.cc-gem.is-b{background:linear-gradient(145deg,#4ade80,#22c55e 55%,#15803d);box-shadow:0 12px 20px -10px rgba(21,128,61,.75),inset 0 2px 0 rgba(255,255,255,.35),inset 0 -4px 0 rgba(0,0,0,.18)}
.cc-gem.is-w{background:linear-gradient(145deg,#fff,#e9ecfb);color:var(--navy);box-shadow:0 12px 20px -10px rgba(0,0,0,.5),inset 0 -4px 0 rgba(27,37,102,.12)}

/* Tilt (JS sets --rx/--ry) */
.cc-tilt{transition:transform .2s ease,box-shadow .2s ease}
.cc-tilt:hover{transform:translateY(-3px);box-shadow:0 22px 40px -26px rgba(15,23,56,.4)}

/* Hero */
.cc-hero{position:relative;overflow:hidden;padding-block:72px 88px}
.cc-hero-bg{position:absolute;inset:0;background:radial-gradient(900px 500px at 85% 20%,rgba(79,99,210,.16),transparent 60%),radial-gradient(700px 400px at 5% 90%,rgba(15,157,116,.1),transparent 60%),linear-gradient(180deg,#f3f5fd,#fff)}
.cc-hero-bg::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(27,37,102,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(27,37,102,.05) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(ellipse at 70% 30%,#000 10%,transparent 70%)}
.cc-hero-in{position:relative;display:grid;grid-template-columns:1.02fr .98fr;gap:56px;align-items:center}
.cc-chip{display:inline-flex;align-items:center;gap:8px;padding:7px 14px 7px 10px;border-radius:999px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh);font:700 13px var(--fd);color:var(--navy);margin-bottom:22px}.cc-chip .cc-i{width:18px;height:18px;color:var(--leaf)}
.cc-hero h1{font-size:clamp(34px,4.4vw,54px);font-weight:800;letter-spacing:-.025em}
.cc-hero h1 span{display:block;background:linear-gradient(90deg,var(--navy),var(--indigo) 60%,var(--leaf));-webkit-background-clip:text;background-clip:text;color:transparent}
.cc-hero .cc-row{margin-top:30px}
.cc-hero-pts{list-style:none;display:flex;flex-wrap:wrap;gap:8px 22px;padding:0;margin:26px 0 0;font:600 15px var(--fd);color:var(--ink)}
.cc-hero-pts li{display:flex;align-items:center;gap:6px}.cc-hero-pts .cc-i{width:18px;height:18px;color:var(--leaf)}

/* Hero scene: 3D dashboard with floating cards (illustration only, no real numbers) */
.cc-scene{position:relative;perspective:1600px;min-width:0;padding:28px 10px}
.cc-glow{position:absolute;inset:6% 4% 0 10%;background:radial-gradient(60% 60% at 60% 40%,rgba(79,99,210,.35),transparent 70%),radial-gradient(40% 40% at 20% 80%,rgba(15,157,116,.25),transparent 70%);filter:blur(20px)}
.cc-stage{position:relative;transform-style:preserve-3d;transform:rotateY(-7deg) rotateX(4deg)}
@keyframes ccTilt{from{transform:rotateY(-16deg) rotateX(9deg) rotateZ(1deg)}to{transform:rotateY(-9deg) rotateX(6deg) rotateZ(0deg)}}
.cc-mock{position:relative;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 40px 80px -40px rgba(17,26,61,.45),0 10px 24px -14px rgba(17,26,61,.2)}
.cc-mock-bar{display:flex;align-items:center;gap:6px;padding:11px 14px;border-bottom:1px solid var(--line);background:linear-gradient(#fbfbfe,#f4f5fb)}.cc-mock-bar span{width:10px;height:10px;border-radius:50%}.cc-mock-bar span:first-child{background:#f87171}.cc-mock-bar span:nth-child(2){background:#fbbf24}.cc-mock-bar span:nth-child(3){background:#34d399}
.cc-mock-bar em{margin-left:10px;font:600 11px var(--fd);font-style:normal;color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:6px;padding:3px 10px}
.cc-mock-b{display:grid;grid-template-columns:58px 1fr;min-height:300px}
.cc-mock-side{background:linear-gradient(180deg,var(--navy),#101860);padding:16px 12px;display:flex;flex-direction:column;gap:10px}.cc-mock-side i{height:9px;border-radius:5px;background:rgba(255,255,255,.2)}.cc-mock-side i.on{background:#fff}.cc-mock-side i.lg{height:24px;width:24px;border-radius:8px;background:#fff;opacity:.9;margin-bottom:6px}
.cc-mock-main{padding:16px;display:grid;gap:14px;align-content:start;min-width:0;background:#fcfcff}
.cc-mock-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.cc-mock-kpis div{background:#fff;border:1px solid var(--line);border-radius:10px;padding:9px 10px;min-width:0;display:grid;gap:5px}.cc-mock-kpis small{font:600 10px var(--fd);color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.sk{display:block;height:9px;border-radius:5px;background:#dfe3f3}.w70{width:70%}.w60{width:60%}.w50{width:50%}.w80{width:80%}
.cc-mock-kpis svg{width:100%;height:18px;fill:none;stroke:var(--leaf);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.cc-mock-kpis div:nth-child(2) svg{stroke:var(--indigo)}.cc-mock-kpis div:nth-child(3) svg{stroke:var(--amber)}
.cc-mock-chart{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 12px 8px;height:96px}
.cc-bars{display:flex;align-items:flex-end;gap:8px;height:100%}.cc-bars i{flex:1;height:var(--h);border-radius:5px 5px 2px 2px;background:linear-gradient(180deg,#6d7ce0,var(--navy));transform-origin:bottom;animation:ccGrow 1.2s cubic-bezier(.2,.8,.2,1) both}.cc-bars i:nth-child(6){background:linear-gradient(180deg,#34d399,var(--leaf))}
.cc-bars i:nth-child(2){animation-delay:.08s}.cc-bars i:nth-child(3){animation-delay:.16s}.cc-bars i:nth-child(4){animation-delay:.24s}.cc-bars i:nth-child(5){animation-delay:.32s}.cc-bars i:nth-child(6){animation-delay:.4s}.cc-bars i:nth-child(7){animation-delay:.48s}
@keyframes ccGrow{from{transform:scaleY(.15)}}
.cc-mock-rows p{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:13px}.cc-mock-rows p:last-child{border:0}
.d{width:8px;height:8px;border-radius:50%;flex:none}.d.g{background:var(--leaf)}.d.b{background:var(--indigo)}.d.y{background:var(--amber)}
.cc-float{position:absolute;display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.97);border:1px solid var(--line);border-radius:14px;padding:10px 14px 10px 10px;box-shadow:-18px 28px 40px -18px rgba(17,26,61,.45);font-size:12px;white-space:nowrap;animation:ccFloat 6s ease-in-out infinite}
.cc-float b{display:block;font:700 13px var(--fd);color:var(--ink)}.cc-float small{color:var(--muted)}
.cc-fi{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}.cc-fi .cc-i{width:18px;height:18px}.cc-fi.g{background:linear-gradient(145deg,#34d399,var(--leaf))}.cc-fi.b{background:linear-gradient(145deg,#4ade80,var(--wa))}.cc-fi.y{background:linear-gradient(145deg,#fcd34d,var(--amber))}
.f1{top:2%;right:-3%;transform:translateZ(40px)}
.f2{bottom:-2%;left:-6%;transform:translateZ(50px);animation-delay:-3s}
.f3{display:none}
.f4{top:38%;right:-9%;padding:10px;color:var(--navy);transform:translateZ(140px);animation-delay:-3s}.f4 .cc-i{width:30px;height:30px}
@keyframes ccFloat{0%,100%{translate:0 0}50%{translate:0 -5px}}

/* Feature strip */
.cc-strip{border-block:1px solid var(--line);background:#fff}
.cc-strip-in{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 36px;padding-block:22px;font:700 15px var(--fd);color:var(--ink)}
.cc-strip-in span{display:inline-flex;align-items:center;gap:8px}.cc-strip-in .cc-i{color:var(--indigo)}

/* Cards */
.cc-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.cc-grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.cc-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;gap:12px;min-width:0;box-shadow:var(--sh)}
.cc-card h3{font-size:20px;margin-top:6px}
.cc-ticks{list-style:none;padding:0;margin:6px 0 0;display:grid;gap:9px}
.cc-ticks li{position:relative;padding-left:28px;font-size:16px}
.cc-ticks li::before{content:"";position:absolute;left:0;top:4px;width:18px;height:18px;border-radius:50%;background:var(--leaf-s) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f9d74' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center/11px no-repeat}
.cc-ticks.is-light li{color:#e3e7fb}.cc-ticks.is-light li::before{background-color:rgba(255,255,255,.14)}

/* Steps */
.cc-steps{list-style:none;counter-reset:s;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;position:relative}
.cc-steps::before{content:"";position:absolute;left:12%;right:12%;top:54px;height:2px;background:repeating-linear-gradient(90deg,#c9cfe8 0 8px,transparent 8px 16px);z-index:0}
.cc-steps li{counter-increment:s;position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px;display:grid;gap:10px;min-width:0;box-shadow:var(--sh);z-index:1}
.cc-steps li::after{content:counter(s);position:absolute;top:18px;right:20px;font:800 44px/1 var(--fd);color:var(--soft2)}
.cc-steps b{font:800 20px var(--fd);color:var(--ink);margin-top:6px}

/* Split sections */
.cc-split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}.cc-split h2{font-size:clamp(28px,3.2vw,38px);font-weight:800;margin-bottom:14px}.cc-split>div>p{margin-bottom:12px}

/* 3D invoice */
.cc-inv3d{position:relative;height:380px;perspective:1200px}
.cc-paper{position:absolute;left:14%;top:8%;width:66%;height:84%;background:#fff;border:1px solid var(--line);border-radius:14px;transform:rotate(-3deg);box-shadow:0 30px 60px -34px rgba(15,23,56,.45)}
.cc-paper.p2{transform:rotate(3deg) translate(18px,-8px);background:#f4f6fd}
.cc-paper.p3{display:none}
.cc-paper.p1{padding:22px;display:flex;flex-direction:column;gap:16px}
.cc-inv-h{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid var(--navy);padding-bottom:10px}.cc-inv-h b{font:800 14px var(--fd);letter-spacing:.08em;color:var(--navy)}.cc-inv-h span{font:600 12px var(--fd);color:var(--muted)}
.cc-inv-l{display:grid;gap:10px}.cc-inv-l i{display:block;height:10px;border-radius:5px;background:#e3e7f5}
.cc-inv-t{display:flex;justify-content:space-between;font:600 12px var(--fd);color:var(--muted);border-top:1px dashed var(--line);padding-top:10px}
.cc-inv-f{display:flex;align-items:center;gap:14px;margin-top:auto}
.cc-inv-qr{display:grid;place-items:center;width:64px;height:64px;border-radius:10px;border:1px solid var(--line);color:var(--ink)}.cc-inv-qr .cc-i{width:44px;height:44px}
.cc-inv-f small{display:block;color:var(--muted);font-size:12px}
.cc-paid{display:inline-block;margin-top:6px;font:800 13px var(--fd);letter-spacing:.12em;color:var(--leaf);border:2px solid var(--leaf);border-radius:6px;padding:3px 10px;transform:rotate(-6deg)}

/* 3D vault */
.cc-vault{position:relative;height:320px;display:grid;place-items:center;border-radius:24px;background:radial-gradient(circle at 50% 40%,#2b3890,var(--navy) 60%,#0d144a);overflow:hidden;box-shadow:0 40px 60px -30px rgba(15,23,56,.6)}
.cc-vault-in{position:relative;z-index:2;display:grid;justify-items:center;gap:10px;color:#fff;text-align:center;transform:translateZ(40px)}
.cc-vault-in .cc-gem{width:76px;height:76px;border-radius:22px}.cc-vault-in .cc-gem .cc-i{width:34px;height:34px}
.cc-vault-in b{font:800 20px var(--fd)}.cc-vault-in span{font:600 13px ui-monospace,monospace;background:rgba(255,255,255,.12);padding:4px 10px;border-radius:6px}
.cc-vault i{position:absolute;border:1px solid rgba(255,255,255,.18);border-radius:50%;transform:rotateX(70deg)}
.cc-vault .r1{width:300px;height:300px}.cc-vault .r2{width:420px;height:420px;border-style:dashed}
@keyframes ccSpin{to{transform:rotateX(70deg) rotateZ(360deg)}}

/* Pricing */
.cc-bill{display:flex;width:max-content;max-width:100%;margin:0 auto 40px;padding:5px;border-radius:999px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh)}
.cc-bill button{border:0;background:none;border-radius:999px;padding:10px 20px;font:700 15px var(--fd);color:var(--body);cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.cc-bill button.is-on{background:var(--navy);color:#fff;box-shadow:0 6px 14px -6px rgba(27,37,102,.8)}
.cc-bill em{font-style:normal;font-size:12px;background:var(--leaf-s);color:#065f46;border-radius:999px;padding:3px 8px}.cc-bill button.is-on em{background:rgba(255,255,255,.18);color:#fff}
.cc-plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;align-items:stretch;perspective:1400px}
.cc-plan{position:relative;border:1px solid var(--line);border-radius:22px;padding:30px 28px;display:flex;flex-direction:column;gap:14px;background:#fff;box-shadow:0 30px 60px -40px rgba(15,23,56,.5)}
.cc-plan.is-f{color:#dfe3f7;background:radial-gradient(120% 80% at 100% 0%,#3a4bb8 0%,var(--navy) 45%,#0d144a 100%);border-color:transparent;box-shadow:0 40px 70px -30px rgba(27,37,102,.8),inset 0 1px 0 rgba(255,255,255,.18);transform:translateY(-10px)}
.cc-plan.is-f h3,.cc-plan.is-f .cc-amt,.cc-plan.is-f .cc-seats b{color:#fff}.cc-plan.is-f .cc-ticks li{color:#e3e7fb}.cc-plan.is-f .cc-ticks li::before{background-color:rgba(255,255,255,.14)}.cc-plan.is-f .cc-price-sub,.cc-plan.is-f .cc-plan-h p,.cc-plan.is-f .cc-per{color:#b9c0e6}
.cc-plan.is-f .cc-seats{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14)}
.cc-plan-h{display:flex;gap:14px;align-items:center}.cc-plan-h h3{font-size:22px}.cc-plan-h p{font-size:14px;color:var(--muted);margin-top:2px}
.cc-price{display:flex;align-items:baseline;gap:6px;margin-top:6px}
.cc-amt{font:800 44px/1 var(--fd);color:var(--ink);letter-spacing:-.02em}.cc-per{font:600 15px var(--fd);color:var(--muted)}
.cc-price-sub{font-size:14px;color:var(--muted);min-height:22px}
.cc-seats{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:var(--soft);border:1px solid var(--line);font-size:15px}.cc-seats .cc-i{color:var(--leaf)}.cc-seats b{font:700 15px var(--fd);color:var(--ink)}
.cc-plan .cc-ticks{flex:1;margin-bottom:10px;align-content:start}
.cc-tag{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:linear-gradient(90deg,#fcd34d,#f59e0b);color:#3b2600;font:800 12px/1 var(--fd);padding:8px 14px;border-radius:999px;letter-spacing:.04em;box-shadow:0 8px 16px -8px rgba(245,158,11,.8);white-space:nowrap}
.cc-compare{margin-top:80px}.cc-compare h2{font-size:28px;text-align:center;margin-bottom:24px}
.cc-tbl{overflow-x:auto;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:var(--sh)}
.cc-tbl table{width:100%;border-collapse:collapse;min-width:560px;font-size:15px}
.cc-tbl th,.cc-tbl td{padding:14px 18px;border-bottom:1px solid var(--line);text-align:center}
.cc-tbl thead th{font:800 15px var(--fd);color:var(--ink);background:var(--soft)}
.cc-tbl tbody th{text-align:left;font-weight:600;color:var(--ink)}.cc-tbl tr:last-child>*{border-bottom:0}
.cc-yes{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--leaf-s);color:var(--leaf)}.cc-yes .cc-i{width:15px;height:15px;stroke-width:3}
.cc-faq{max-width:780px;margin:0 auto;display:grid;gap:12px}
.cc-faq details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 20px;box-shadow:var(--sh)}
.cc-faq summary{cursor:pointer;font:700 17px var(--fd);color:var(--ink);list-style:none;display:flex;justify-content:space-between;gap:12px}
.cc-faq summary::-webkit-details-marker{display:none}
.cc-faq summary::after{content:"+";font:700 22px/1 var(--fd);color:var(--indigo);transition:transform .2s}.cc-faq details[open] summary::after{transform:rotate(45deg)}
.cc-faq details p{margin-top:10px}

/* Page headers with floating 3D shapes */
.cc-page-h{position:relative;overflow:hidden;padding-block:80px 40px;background:radial-gradient(700px 360px at 90% 0%,rgba(79,99,210,.16),transparent 60%),linear-gradient(180deg,#f3f5fd,#fff)}
.cc-page-h .cc-wrap{position:relative;z-index:1}
.cc-page-h h1{font-size:clamp(34px,4.6vw,54px);font-weight:800;letter-spacing:-.025em;max-width:18ch}
.cc-deco{position:absolute;inset:0;pointer-events:none;perspective:800px}
.cc-deco i{position:absolute;border-radius:18px;opacity:.85;box-shadow:0 24px 40px -20px rgba(27,37,102,.5),inset 0 2px 0 rgba(255,255,255,.4)}
.cc-deco .c1{width:90px;height:90px;right:12%;top:22%;background:linear-gradient(145deg,#6576e6,#1d2770);transform:rotateX(25deg) rotateY(-30deg) rotateZ(12deg)}
.cc-deco .c2{display:none;width:54px;height:54px;right:26%;top:58%;background:linear-gradient(145deg,#34d399,#08664c);transform:rotateX(20deg) rotateY(30deg) rotateZ(-14deg);animation-delay:-2s}
.cc-deco .c3{display:none;width:38px;height:38px;right:6%;top:64%;border-radius:50%;background:radial-gradient(circle at 30% 30%,#fde68a,#d97706);animation-delay:-4s}
.cc-deco .c4{width:130px;height:130px;right:-30px;top:-30px;border-radius:50%;background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.9),rgba(79,99,210,.25) 60%,transparent 70%);box-shadow:none;animation-delay:-1s}

/* Features / integrations */
.cc-feat{display:grid;gap:22px}
.cc-feat-row{display:grid;grid-template-columns:330px 1fr;gap:36px;padding:32px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:var(--sh)}
.cc-feat-h{display:flex;gap:18px;align-items:flex-start}.cc-feat-h h2{font-size:23px;margin-bottom:6px}
.cc-cols{grid-template-columns:1fr 1fr;column-gap:26px;margin:0}
.cc-int{display:flex;gap:18px;align-items:flex-start;border:1px solid var(--line);border-radius:18px;padding:26px;min-width:0;background:#fff;box-shadow:var(--sh)}.cc-int h2{font-size:20px;margin-bottom:6px}

/* CTA band */
.cc-band{position:relative;overflow:hidden;background:var(--navy);color:#dfe3f7}
.cc-band-bg{position:absolute;inset:0;background:radial-gradient(600px 300px at 90% 0%,rgba(101,118,230,.55),transparent 60%),radial-gradient(500px 260px at 0% 100%,rgba(15,157,116,.35),transparent 60%)}
.cc-band-in{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px;padding-block:64px}
.cc-band h2{color:#fff;font-size:clamp(26px,3.2vw,36px);font-weight:800;margin-bottom:8px}

/* Contact */
.cc-contact{display:grid;grid-template-columns:.8fr 1.2fr;gap:36px;align-items:start}
.cc-contact-info{display:grid;gap:16px}
.cc-cinfo{display:flex;gap:16px;align-items:center;padding:20px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:var(--sh);text-decoration:none;min-width:0}
.cc-cinfo b{display:block;font:800 17px var(--fd);color:var(--ink)}.cc-cinfo span{color:var(--muted);overflow-wrap:anywhere}
.cc-contact-form{max-width:none;margin:0}.cc-contact-form h2{font-size:24px}

/* Forms */
.cc-auth{padding:48px 20px 80px;background:radial-gradient(700px 400px at 100% 0%,rgba(79,99,210,.12),transparent 60%),var(--soft);min-height:calc(100vh - 71px)}
.cc-auth-grid{display:grid;grid-template-columns:.9fr 1.1fr;max-width:1080px;margin:0 auto;border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 40px 80px -40px rgba(15,23,56,.45);border:1px solid var(--line)}
.cc-auth-grid .cc-auth-box{max-width:none;border:0;border-radius:0;box-shadow:none;margin:0;padding:44px}
.cc-auth-art{position:relative;overflow:hidden;background:radial-gradient(120% 80% at 100% 0%,#3a4bb8 0%,var(--navy) 45%,#0d144a 100%);color:#dfe3f7;padding:44px;display:flex;perspective:1000px}
.cc-auth-art h2{color:#fff;font-size:28px;font-weight:800;margin-bottom:18px}
.cc-auth-art-in{display:flex;flex-direction:column;width:100%}
.cc-art-stack{position:relative;flex:1;min-height:220px;margin-top:28px;}
.cc-art-stack .cc-float{position:absolute}.s1{top:6%;left:4%}.s2{top:38%;left:26%;animation-delay:-2s}.s3{top:70%;left:8%;animation-delay:-4s}
.cc-auth-box{max-width:440px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:20px;padding:34px;box-shadow:0 20px 40px -32px rgba(17,26,61,.4)}
.cc-auth-box.is-wide{max-width:620px}
.cc-auth-box h1{font-size:30px;font-weight:800;margin-bottom:6px}
.cc-form{display:grid;gap:16px;margin-top:22px}
.cc-form fieldset{border:0;padding:0;margin:0;display:grid;gap:16px}
.cc-form legend{font:800 12px var(--fd);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:12px;padding:0}
.cc-f{display:grid;gap:6px;min-width:0}.cc-f2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cc-f label{font:700 14px var(--fd);color:var(--ink)}
.cc-f small{color:var(--muted);font-size:14px}
.cc-f input,.cc-f select,.cc-f textarea{width:100%;min-height:48px;padding:10px 14px;border:1.5px solid #cfd4e6;border-radius:11px;font:16px var(--fb);color:var(--ink);background:#fff}
.cc-f textarea{resize:vertical;min-height:110px}
.cc-f input:focus,.cc-f select:focus,.cc-f textarea:focus{border-color:var(--navy);outline:none;box-shadow:0 0 0 3px rgba(27,37,102,.15)}
.cc-pw{position:relative}.cc-pw input{padding-right:70px}
.cc-eye{position:absolute;right:6px;top:6px;bottom:6px;border:0;background:var(--soft2);border-radius:8px;padding:0 12px;font:600 13px var(--fd);color:var(--navy);cursor:pointer}
.cc-addr{display:flex;align-items:stretch;border:1.5px solid #cfd4e6;border-radius:11px;overflow:hidden;min-width:0}
.cc-addr span{display:flex;align-items:center;padding:0 10px;background:var(--soft);color:var(--muted);font-size:14px;white-space:nowrap;max-width:55%;overflow:hidden;text-overflow:ellipsis}
.cc-addr input{border:0;border-radius:0;min-width:0}
.cc-f-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:15px}
.cc-check{display:flex;gap:10px;align-items:flex-start;font-size:15px}.cc-check input{width:18px;height:18px;margin-top:3px;accent-color:var(--navy)}
.cc-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cc-auth-alt{text-align:center;margin-top:18px;font-size:15px}
.cc-alert{border-radius:12px;padding:12px 14px;margin-top:16px;font-size:15px}.cc-alert ul{margin:6px 0 0;padding-left:18px}
.cc-alert.is-err{background:#fdecec;color:#7f1d1d;border:1px solid #f5c2c2}.cc-alert.is-ok{background:var(--leaf-s);color:#065f46;border:1px solid #b9e6d6}
.cc-ws{list-style:none;padding:0;margin:20px 0;display:grid;gap:12px}
.cc-ws li{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.cc-ws li>div{flex:1;min-width:160px}.cc-ws b{font:700 17px var(--fd);color:var(--ink);display:block}.cc-ws small{color:var(--muted)}
.cc-pill{font:700 12px var(--fd);padding:6px 10px;border-radius:999px}.cc-pill.is-ok{background:var(--leaf-s);color:#065f46}.cc-pill.is-wait{background:#fef3c7;color:#92400e}.cc-pill.is-off{background:#fdecec;color:var(--red)}

/* Legal */
.cc-prose{max-width:760px}.cc-prose h2{font-size:21px;margin:28px 0 8px}.cc-prose p{margin-bottom:10px}

/* Footer */
.cc-foot{background:#0b1233;color:#b8bfdc;padding-top:64px;font-size:15px}
.cc-foot-in{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px}
.cc-foot .cc-logo{color:#fff;margin-bottom:14px}.cc-foot .cc-logo-m{background:#fff;color:var(--navy)}.cc-foot .cc-logo.has-img img{background:#fff;border-radius:10px;padding:4px 8px}
.cc-foot-brand p{max-width:36ch}.cc-foot-by{margin-top:10px;font-size:14px;opacity:.8}
.cc-foot h2{font:800 12px var(--fd);letter-spacing:.12em;text-transform:uppercase;color:#fff;margin-bottom:14px}
.cc-foot-in>div{display:flex;flex-direction:column;gap:9px;min-width:0}.cc-foot a{text-decoration:none;overflow-wrap:anywhere}.cc-foot a:hover{color:#fff}
.cc-copy{border-top:1px solid rgba(255,255,255,.1);margin-top:48px;padding:22px 20px;font-size:14px;text-align:center}

/* WhatsApp button */
.cc-wa-fab{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:60;display:inline-flex;align-items:center;gap:8px;padding:12px 16px 12px 12px;border-radius:999px;background:linear-gradient(145deg,#4ade80,var(--wa));color:#fff;text-decoration:none;font:700 15px var(--fd);box-shadow:0 14px 28px -12px rgba(21,128,61,.8),inset 0 1px 0 rgba(255,255,255,.3)}
.cc-wa-fab .cc-i{width:24px;height:24px}.cc-wa-fab:hover{transform:translateY(-2px)}

/* Responsive */
@media (max-width:980px){
	.cc-hero-in,.cc-split,.cc-contact{grid-template-columns:1fr}.cc-grid3,.cc-steps{grid-template-columns:1fr 1fr}.cc-steps::before{display:none}
	.cc-feat-row{grid-template-columns:1fr;gap:18px}.cc-foot-in{grid-template-columns:1fr 1fr}
	.cc-auth-grid{grid-template-columns:1fr}.cc-auth-art{display:none}
	.cc-plan.is-f{transform:none}
}
@media (max-width:860px){
	.cc-burger{display:block}
	.cc-menu{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;padding:12px 20px 20px;gap:12px}
	.cc-menu.is-open{display:flex}.cc-menu nav{flex-direction:column}.cc-menu nav a{padding:12px}
	.cc-acts{flex-direction:column}.cc-acts .cc-btn{width:100%}
}
@media (max-width:620px){
	body{font-size:16px}.cc-sec{padding-block:60px}.cc-hero{padding-block:40px 56px}.cc-page-h{padding-block:52px 20px}
	.cc-grid3,.cc-grid2,.cc-steps,.cc-cols,.cc-f2,.cc-foot-in{grid-template-columns:1fr}
	.cc-hero .cc-btn{width:100%}.cc-auth{padding:20px 12px 60px}.cc-auth-box,.cc-auth-grid .cc-auth-box{padding:24px 20px}
	.cc-mock-kpis{grid-template-columns:1fr 1fr}.cc-mock-kpis div:last-child{display:none}.cc-wrap{padding-inline:16px}
	.cc-scene{padding:20px 18px 34px}.f2{left:-2%}.f1{right:-2%}.f4{display:none}.cc-stage{transform:none}
	.cc-addr{flex-direction:column}.cc-addr span{max-width:100%;padding:8px 12px;white-space:normal;overflow-wrap:anywhere}
	.cc-inv3d{height:300px}.cc-paper{left:6%;width:80%}.cc-vault{height:260px}.cc-deco .c1{width:60px;height:60px;right:4%;top:10%}.cc-deco .c2{display:none;display:none}
	.cc-wa-fab span{display:none}.cc-wa-fab{padding:12px}.cc-amt{font-size:38px}.cc-feat-row,.cc-card,.cc-steps li{padding:22px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}.cc-tilt{transform:none!important}}

/* Hero mock: invoice list */
.cc-mock-list{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.cc-mock-lh{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.cc-mock-lh b{font:700 12px var(--fd);color:var(--ink)}.cc-mock-lh span{font:600 11px var(--fd);color:var(--indigo)}
.cc-mock-list p{display:flex;align-items:center;gap:10px;padding:7px 0;border-top:1px solid var(--line)}.cc-mock-list p .sk{flex:1}
.av{width:22px;height:22px;border-radius:50%;flex:none}.av.a1{background:linear-gradient(145deg,#a5b4fc,#6366f1)}.av.a2{background:linear-gradient(145deg,#fcd34d,#f59e0b)}.av.a3{background:linear-gradient(145deg,#6ee7b7,#10b981)}
.pl{font:700 10px var(--fd);font-style:normal;padding:3px 8px;border-radius:999px;white-space:nowrap}.pl.is-paid{background:var(--leaf-s);color:#065f46}.pl.is-due{background:#fef3c7;color:#92400e}.pl.is-part{background:#e0e7ff;color:#3730a3}

/* ===== v1.2: professional, flat everywhere except the hero dashboard ===== */
.cc-gem,.cc-gem.is-g,.cc-gem.is-y,.cc-gem.is-b,.cc-gem.is-w{box-shadow:none;transform:none;border-radius:12px;width:46px;height:46px}
.cc-gem{background:#eef0fb;color:var(--navy)}
.cc-gem.is-g{background:#e6f6f0;color:#08664c}
.cc-gem.is-y{background:#fef3c7;color:#92400e}
.cc-gem.is-b{background:#dcfce7;color:#15803d}
.cc-gem.is-w{background:rgba(255,255,255,.14);color:#fff}
.cc-gem .cc-i{filter:none;width:22px;height:22px}
.cc-card,.cc-steps li,.cc-feat-row,.cc-int,.cc-cinfo,.cc-faq details,.cc-tbl{box-shadow:0 1px 2px rgba(15,23,56,.05)}
.cc-tilt:hover{transform:none;box-shadow:0 8px 24px -14px rgba(15,23,56,.25);border-color:#cfd4e6}
.cc-hero-bg::after{display:none}
.cc-hero h1 span{display:inline;background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--indigo)}
.cc-steps li::after{display:none}
.cc-deco{display:none}
.cc-page-h{background:linear-gradient(180deg,#f5f6fb,#fff);padding-block:72px 32px}
/* Invoice showcase: flat card */
.cc-inv3d{height:auto;perspective:none;display:flex;justify-content:center}
.cc-paper.p2,.cc-paper.p3{display:none}
.cc-paper.p1{position:relative;left:auto;top:auto;width:100%;max-width:400px;height:auto;min-height:300px;transform:none;box-shadow:0 20px 40px -28px rgba(15,23,56,.35)}
/* Private workspace: flat panel */
.cc-vault{height:280px;box-shadow:none;background:var(--navy)}
.cc-vault i{display:none}
.cc-vault-in{transform:none}.cc-vault-in .cc-gem{width:64px;height:64px;border-radius:16px}
/* Pricing: flat, popular plan highlighted by colour only */
.cc-plans{perspective:none}
.cc-plan{box-shadow:0 1px 2px rgba(15,23,56,.05)}
.cc-plan.is-f{transform:none;background:var(--navy);box-shadow:0 20px 40px -24px rgba(27,37,102,.6)}
.cc-tag{background:var(--leaf);color:#fff;box-shadow:none}
/* Sign-in panel: static list */
.cc-art-stack .cc-float{animation:none;box-shadow:0 8px 20px -12px rgba(0,0,0,.4)}
.cc-auth-art{background:var(--navy)}
.cc-band-bg{opacity:.5}
.cc-btn-p{background:var(--navy);box-shadow:none}.cc-btn-p:hover{background:var(--navy-d);transform:none;box-shadow:none}
.cc-logo-m{box-shadow:none;background:var(--navy)}
.cc-wa-fab{box-shadow:0 8px 20px -10px rgba(21,128,61,.6);background:var(--wa)}
/* Hero dashboard keeps its 3D look */
.cc-stage{transform:rotateY(-12deg) rotateX(6deg)}
@media (max-width:620px){.cc-stage{transform:none}}