:root{--black:#050505;--black-2:#111;--text:#171717;--muted:#676767;--line:#dedede;--soft:#f5f6f7;--white:#fff;--accent:#9eff16;--teal:#00b8a9;--radius:18px;--shadow:0 18px 55px rgba(0,0,0,.09)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:76px}body{margin:0;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--text);background:var(--white);line-height:1.6;-webkit-font-smoothing:antialiased}body.menu-open{overflow:hidden}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.container{width:min(1160px,calc(100% - 36px));margin-inline:auto}.skip-link{position:fixed;left:10px;top:-80px;background:#fff;color:#000;padding:10px 14px;z-index:9999}.skip-link:focus{top:10px}.site-header{position:sticky;top:0;z-index:1000;background:rgba(5,5,5,.96);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.1)}.nav-wrap{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:18px}.logo{width:180px;flex:none}.logo img{width:100%;height:auto}.menu-toggle{width:44px;height:44px;border:1px solid rgba(255,255,255,.24);background:transparent;border-radius:10px;display:grid;place-content:center;gap:5px;cursor:pointer}.menu-toggle span{display:block;width:21px;height:2px;background:#fff;transition:.25s}.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.primary-nav{position:fixed;inset:72px 0 auto 0;background:var(--black);padding:24px 18px 30px;display:flex;flex-direction:column;gap:4px;transform:translateY(-130%);opacity:0;visibility:hidden;transition:.28s ease;border-bottom:1px solid rgba(255,255,255,.12)}.primary-nav.open{transform:none;opacity:1;visibility:visible}.primary-nav a{color:#fff;padding:13px 12px;border-radius:9px;font-weight:650}.primary-nav a:hover,.primary-nav a.active{background:rgba(255,255,255,.09)}.primary-nav 
.nav-cta{margin-top:8px;background:#34b854 !important;color:#fff !important;text-align:center}.hero{padding:68px 0 34px;overflow:hidden;background:radial-gradient(circle at 85% 12%,rgba(0,184,169,.13),transparent 32%),linear-gradient(#fff,#fbfbfb)}.hero-grid{display:grid;gap:40px;align-items:center}
.eyebrow{
    margin:0 0 14px;
    font-size: 1rem;
    line-height:1.2;
    text-transform:uppercase;
    letter-spacing:.17em;
    font-weight:800;
    color:#34b854 !important;}.hero h1,.section h2,.contact-section h2{margin:0;line-height:1.02;letter-spacing:-.048em;font-weight:780}.hero h1{font-size:clamp(3rem,14vw,6.9rem)}.hero h1 em{font-style:normal;background:linear-gradient(110deg,#7ccd00,#00a992);-webkit-background-clip:text;background-clip:text;color:transparent}.lead{font-size:clamp(1.08rem,3.8vw,1.38rem);max-width:690px;color:#555;margin:24px 0 0}.lead-small{font-size:1.12rem;color:#555}.actions{display:flex;flex-direction:column;gap:12px;margin-top:28px}.button{min-height:48px;padding:12px 18px;border:1px solid var(--black);background:var(--black);color:#fff;border-radius:11px;font-weight:750;display:inline-flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;transition:.22s}.button:hover{transform:translateY(-2px);box-shadow:0 10px 25px rgba(0,0,0,.15)}.button-ghost,.button-outline{background:transparent;color:var(--black)}
.hero-visual{
    position:relative;
    aspect-ratio:1/1;
    max-width:500px;
    width: 300px;
    margin-inline:auto}
.orbit{
    position:absolute;    
    border: 2px solid rgb(11 169 54 / 45%);
    border-radius:50%;
    inset:10%}
.orbit-two{inset:25%;border-style:dashed;animation:spin 22s linear infinite}
.orbit-one{animation:spin 32s linear infinite reverse}
.core-mark{
    position:absolute;
    inset:34%;
    display:grid;
    place-items:center;
    padding:18px;
    border-radius:50%;
    background:#000;
    box-shadow:var(--shadow)}
.platform{
    position:absolute;
    width:74px;
    height:74px;
    border-radius:18px;
    background:#fff;
    box-shadow:var(--shadow);
    display:grid;
    place-items:center;}
.platform img{max-width:100%;max-height:100%;object-fit:contain}
.platform-shopify{
    left:0%;
    top:48%}
.platform-odoo{right:25%;top:0%}
.platform-workato{
    right:8%;
    bottom:9%}
.stats{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);margin-top:38px}.stats div{padding:21px 12px 12px;border-right:1px solid var(--line)}.stats div:nth-child(even){border-right:0}.stats strong{font-size:1.6rem;display:block}.stats span{font-size:.83rem;color:var(--muted)}.section{padding:76px 0}.section-soft{background:var(--soft)}.section-dark{background:var(--black);color:#fff}.section-dark .eyebrow,.vision-band .eyebrow{color:var(--accent)}.section-dark .section-heading>p{color:#aaa}.section-heading{display:grid;gap:18px;margin-bottom:34px}.section h2,.contact-section h2{font-size:clamp(2.15rem,8.2vw,4.6rem)}.section-heading>p{margin:0;max-width:560px;color:var(--muted);font-size:1.04rem}
.card-grid{display:grid;gap:14px}
.service-card{
    position:relative;
    background:#fff;
    padding:25px;
    border:1px solid #e7e7e7;
    border-radius:var(--radius);
    cursor: pointer;
    transition:.25s;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;}
.service-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.card-no{position:absolute;right:20px;top:18px;font-size:.78rem;color:#999}
.service-icon{
    width:47px;
    height:47px;
    display:grid;
    place-items:center;
    border-radius:13px;
    background:#34b854;
    color: #fff;
    font-size:1.35rem;
    margin-bottom:34px;
    }.service-card h3,.work-card h3,.insight-card h3{font-size:1.35rem;line-height:1.2;margin:0 0 12px}.service-card p,.work-card p,.insight-card p{color:var(--muted);margin:0 0 18px}
    .text-link{
        font-weight:750;
        font-size:.92rem;
        margin-top: auto;
        margin-bottom: -10px !important;}.work-grid{display:grid;gap:15px}
.work-card{
    padding:26px;
    border:1px solid #333;
    border-radius:var(--radius);
    background:linear-gradient(90deg, #000000 0%, #0f7a2b 100%);}
.work-card p{color:#bdbdbd}.tag{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);font-weight:800}.work-card ul{margin:20px 0 0;padding-left:18px;color:#d3d3d3}.process-grid{display:grid;gap:0;border-top:1px solid var(--line)}.process-step{padding:25px 0;border-bottom:1px solid var(--line)}.process-step span{font-size:.75rem;text-transform:uppercase;letter-spacing:.13em;font-weight:800;color:#6b6b6b}.process-step h3{font-size:1.55rem;margin:10px 0 5px}.process-step p{margin:0;color:var(--muted)}.about-grid{display:grid;gap:42px}.about-grid p{color:var(--muted)}.value-list{border-top:1px solid var(--line)}.value-item{display:grid;grid-template-columns:44px 1fr;gap:12px;padding:22px 0;border-bottom:1px solid var(--line)}.value-item>span{font-size:.8rem;font-weight:800}.value-item h3{margin:0 0 5px}.value-item p{margin:0}.vision-band{background:linear-gradient(130deg,#050505,#151515);color:#fff;padding:72px 0}.vision-band blockquote{font-size:clamp(1.75rem,6.7vw,3.8rem);line-height:1.15;letter-spacing:-.035em;margin:0;max-width:1000px}.article-grid{display:grid;gap:15px}.insight-card{border:1px solid var(--line);border-radius:var(--radius);padding:24px}.insight-symbol{font-size:2rem;margin-bottom:30px}.jobs{border-top:1px solid var(--line)}.job{display:grid;gap:15px;padding:23px 0;border-bottom:1px solid var(--line)}.job h3{margin:0 0 4px}.job p{margin:0;color:var(--muted)}.contact-section{background:#fff}.contact-grid{display:grid;gap:42px}.contact-detail{margin-top:22px}.contact-detail span{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.13em;font-weight:800;color:#777;margin-bottom:4px}.contact-detail a{font-weight:750}.contact-detail p{margin:0;color:var(--muted)}.contact-form{background:var(--soft);border:1px solid #e3e3e3;border-radius:var(--radius);padding:22px;display:grid;gap:16px}.contact-form label{font-size:.84rem;font-weight:750}.contact-form input,.contact-form select,.contact-form textarea{width:100%;margin-top:7px;border:1px solid #ccc;border-radius:10px;background:#fff;padding:12px 13px;color:var(--text)}.contact-form textarea{resize:vertical}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{outline:3px solid rgba(158,255,22,.35);border-color:#7aae30}.form-note{font-size:.78rem;color:#777;margin:0}.site-footer{background:var(--black);color:#fff;padding:52px 0 22px}.footer-grid{display:grid;gap:32px}.footer-brand img{width:205px}.footer-brand p{color:#aaa;max-width:300px}.site-footer h3{font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:#888;margin:0 0 12px}.site-footer a{display:block;color:#d8d8d8;padding:5px 0}.site-footer a:hover{color:var(--accent)}.footer-bottom{border-top:1px solid #292929;margin-top:34px;padding-top:20px;display:flex;flex-direction:column;gap:6px;color:#888;font-size:.8rem}.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}.reveal.visible{opacity:1;transform:none}@keyframes spin{to{transform:rotate(360deg)}}
@media (min-width:600px){.actions{flex-direction:row}.button{width:auto}.card-grid,.article-grid{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(4,1fr)}.stats div:nth-child(even){border-right:1px solid var(--line)}.stats div:last-child{border-right:0}.job{grid-template-columns:1fr auto;align-items:center}.footer-grid{grid-template-columns:2fr 1fr 1fr}.footer-bottom{flex-direction:row;justify-content:space-between}}
@media (min-width:900px){html{scroll-padding-top:84px}.nav-wrap{min-height:82px}.logo{width:220px}.menu-toggle{display:none}.primary-nav{position:static;inset:auto;transform:none;opacity:1;visibility:visible;padding:0;background:none;border:0;display:flex;flex-direction:row;align-items:center;gap:4px}.primary-nav a{padding:10px 11px;font-size:.9rem}
.primary-nav .nav-cta{margin:0 0 0 7px;padding:10px 15px; background:#34b854 !important; color: #fff !important;}.hero{padding:92px 0 40px}.hero-grid{grid-template-columns:1.2fr .8fr;gap:30px}.section{padding:108px 0}.section-heading{grid-template-columns:1.35fr .65fr;align-items:end;margin-bottom:48px}
.services-grid{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    align-items: stretch;}.work-grid{grid-template-columns:repeat(3,1fr)}.process-grid{grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}.process-step{padding:28px 24px;border-right:1px solid var(--line);border-bottom:0}.process-step:first-child{padding-left:0}.process-step:last-child{border-right:0}.about-grid{grid-template-columns:1fr 1fr;align-items:start}.article-grid{grid-template-columns:repeat(3,1fr)}.contact-grid{grid-template-columns:.85fr 1.15fr;align-items:start}.contact-form{padding:34px}.footer-grid{grid-template-columns:2fr 1fr 1fr 1fr}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.orbit{animation:none}.button,.service-card{transition:none}}
.title-color {
    color: green;
}
.nav-item {
    color: #fff;
    font-weight: bold;
}
.hide-main-item {
    display: none;
}
.nav-active {
    color: #34b854 !important;
}
.btn-color {
    background:  #34b854 !important;
    color: #fff !important;
    border: 2px !important;
}
.service-card .text-link {
    margin-top: 0;
}

#page-home .services-grid {
    grid-template-columns: 1fr;
}

#page-home .service-accordion {
    cursor: pointer;
    min-height: 0;
    padding: 0;
}

#page-home .service-summary {
    position: relative;
    display: grid;
    grid-template-columns: 47px 1fr;
    align-items: center;
    column-gap: 16px;
    padding: 25px;
}

#page-home .service-summary .service-icon {
    margin-bottom: 0;
}

#page-home .service-summary h3 {
    margin: 0;
}

#page-home .service-summary > p,
#page-home .service-summary > .text-link {
    grid-column: 1 / -1;
}

#page-home .service-summary > .text-link {
    display: inline-block;
    justify-self: start;
}

#page-home .service-summary > .text-link::after {
    content: " +";
    font-size: 1rem;
    line-height: 1;
}

#page-home .service-accordion.is-open .service-summary > .text-link::after {
    content: " −";
}

#page-home .service-summary > p {
    margin: 10px 0;
}

#page-home .service-accordion:focus-visible {
    outline: 3px solid rgba(52, 184, 84, .4);
    outline-offset: 3px;
}

#page-home .service-details {
    margin-top: 0px !important;
    padding: 0;
    overflow: hidden;
    height: 0;
    opacity: 0;
    border: 1px solid #dcdcdc;
    border-radius: 12px;
    background: var(--soft);
    cursor: default;
    transition: height .5s cubic-bezier(.22, 1, .36, 1),
        opacity .35s ease, margin-top .5s cubic-bezier(.22, 1, .36, 1);
}

#page-home .service-accordion.is-open .service-details {
    margin-top: 12px;
}

#page-home .service-details-inner {
    padding: 22px;
}

#page-home .service-details[hidden] {
    display: none;
}

#page-home .service-details h4 {
    margin: 0 0 8px;
    font-size: 1.1rem;
}

#page-home .service-details p {
    margin: 0;
}

/* Commerce-themed accordion content */
:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) {
    background: #fff;
    color: var(--text);
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) .service-details-inner {
    padding: 0;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) .container {
    width: 100%;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) .page-hero {
    padding: clamp(20px, 5vw, 20px);
    background:
        radial-gradient(circle at 90% 10%, rgba(52, 184, 84, .18), transparent 38%),
        linear-gradient(135deg, #f8fff9, #edf8ef);
    border-bottom: 1px solid #dce9df;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) .eyebrow {
    margin-bottom: 12px;
    color: #21853a;
    font-size: .72rem;
    letter-spacing: .16em;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) h1 {
    max-width: 760px;
    margin: 0;
    font-size: .96rem;
    line-height: 1.05;
    letter-spacing: -.045em;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) .page-hero .container > h3 {
    margin: 0;
    padding-bottom: 5px;
    font-size: 1em;
    font-weight: 700;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) .container.two-col > div > h3 {
    margin: 0;
    padding-bottom: 5px;
    font-size: 1em;
    font-weight: 700;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) .lead {
    max-width: 720px;
    margin-top: 18px;
    color: #536058;
    font-size: .96rem;
    line-height: 1.65;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) > .service-details-inner > .section {
    padding: clamp(20px, 5vw, 20px);
    background: #fff;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) .two-col {
    display: grid;
    gap: 32px;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) h2 {
    margin: 0;
    font-size: clamp(1.65rem, 3vw, 2.45rem);
    line-height: 1.12;
    letter-spacing: -.035em;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) .values,
:is(#odoo-details, #ai-details) .service-list {
    display: grid;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) .value,
:is(#odoo-details, #ai-details) .service-row {
    display: grid;
    grid-template-columns: 20px 1fr;
    gap: 8px;
    align-items: start;
    padding: 5px;
    /*border: 1px solid #e1e8e2;*/
    border-radius: 14px;
    background: #fafcfb;
}

:is(#odoo-details, #ai-details) .service-row {
    grid-template-columns: 1fr;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) .value > span {
    display: grid;
    width: 20px;
    height: 20px;
    place-items: center;
    border-radius: 5px;
    background: #34b854;
    color: #fff;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .08em;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) .value h3,
:is(#odoo-details, #ai-details) .service-row h3 {
    margin: 0 0 5px;
    font-size: .96rem;
    font-weight: 700;
    line-height: 1.3;
}

:is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) .value p,
:is(#odoo-details, #ai-details) .service-row p {
    color: var(--muted);
    font-size: .92rem;
    line-height: 1.55;
}

#automation-details .service-details-inner {
    padding: clamp(20px, 5vw, 20px);
    background:
        radial-gradient(circle at 90% 10%, rgba(52, 184, 84, .18), transparent 38%),
        linear-gradient(135deg, #f8fff9, #edf8ef);
    border-bottom: 1px solid #dce9df;
}

#page-home #automation-details h4 {
    margin: 0;
    padding-bottom: 5px;
    font-size: 1em;
    font-weight: 700;
}

#page-home p {
    max-width: 720px;
    margin-top: 18px;
    color: #536058;
    font-size: .96rem;
    line-height: 1.65;
}

@media (min-width: 760px) {
    :is(#commerce-details, #odoo-details, #automation-details, #ai-details, #cloud-details, #application-details) .two-col {
        grid-template-columns: .85fr 1.15fr;
        gap: clamp(38px, 6vw, 72px);
        align-items: start;
    }
}

@media (prefers-reduced-motion: reduce) {
    #page-home .service-details {
        transition: none;
    }
}

.next-pos {
    margin-bottom: 50px;
}
