:root{--ink:#0b1f1e;--teal:#0f766e;--mint:#5eead4;--paper:#f4f7f6;--tx:#2a3a39;--mu:#5d706e;--ln:#d8e2e0}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth;scroll-padding-top:80px}
body{font:17px/1.65 Figtree,system-ui,sans-serif;color:var(--tx);background:#fff}
h1,h2,h3,h4{font-family:'Bricolage Grotesque',sans-serif;color:var(--ink);line-height:1.12;letter-spacing:-.02em}
h1{font-size:clamp(2.4rem,5.6vw,4.4rem);font-weight:800}h2{font-size:clamp(1.8rem,3.4vw,2.6rem);font-weight:700;margin-bottom:.6rem}h3{font-size:1.15rem;font-weight:700}
a{color:inherit;text-decoration:none}img{max-width:100%;height:auto;display:block}ul,ol{list-style:none;padding:0}
.wrap{max-width:1160px;margin:auto;padding:0 1.5rem}:focus-visible{outline:3px solid var(--mint);outline-offset:3px}
.hd{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--ln)}
.nav{display:flex;align-items:center;justify-content:space-between;height:70px}.links{display:flex;align-items:center;gap:1.8rem;font-weight:500;font-size:.95rem}
.links a:not(.cta){padding:.3rem 0;border-bottom:2px solid transparent}.links a:hover,.links a.on{border-color:var(--teal);color:var(--teal)}
.cta,.btn{background:var(--teal);color:#fff;padding:.7rem 1.4rem;border-radius:999px;font-weight:600;display:inline-block;border:0;cursor:pointer;font:600 1rem Figtree,sans-serif;transition:background .2s}
.cta:hover,.btn:hover{background:var(--ink)}.btn.ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.4)}.btn.ghost:hover{background:#fff;color:var(--ink)}
.burger{display:none;background:none;border:0;font-size:1.5rem;color:var(--ink)}
.hero{background:var(--ink);color:#cfe3e0;padding:5.5rem 0 5rem;overflow:hidden}.hero h1{color:#fff}.hg{display:grid;grid-template-columns:1.05fr .95fr;gap:3rem;align-items:center}
.lede{font-size:1.15rem;color:var(--mu);max-width:560px;margin:1rem 0 1.6rem}.hero .lede{color:#a9c6c2}.acts{display:flex;gap:.8rem;flex-wrap:wrap}
.scan{background:#10302d;border:1px solid #1f4a45;border-radius:20px;padding:1rem}.scan canvas{width:100%;height:auto;display:block}
.readout{display:flex;align-items:baseline;gap:.8rem;padding:.6rem .4rem 0;font-size:.9rem;color:#8fb5b0}.readout b{font:800 2.4rem 'Bricolage Grotesque';color:var(--mint);min-width:3.2ch}
.sec{padding:5rem 0}.tint{background:var(--paper)}.dark{background:var(--teal);color:#d9f5f1}.dark h2{color:#fff}.dark p{margin:1rem 0 1.3rem;max-width:520px}
.layers{display:grid;grid-template-columns:repeat(4,1fr);margin-top:2rem;border-top:2px solid var(--ink)}.layers a{padding:1.6rem 1.4rem 1.6rem 0;border-right:1px solid var(--ln);padding-left:1.4rem}.layers a:first-child{padding-left:0}.layers a:last-child{border:0}
.layers i,.row i{color:var(--teal);font-size:1.4rem;margin-bottom:.8rem}.layers p,.row p{color:var(--mu);font-size:.97rem;margin-top:.4rem}.layers a:hover h3{color:var(--teal)}
.two{display:grid;grid-template-columns:.9fr 1.1fr;gap:4rem;align-items:center}.bignum b{display:block;font:800 clamp(5rem,12vw,9rem)/.9 'Bricolage Grotesque';color:#fff;letter-spacing:-.05em}.bignum span{display:block;margin-top:.8rem;max-width:280px}
.sec:not(.dark) .bignum b{color:var(--teal)}.sec:not(.dark) .bignum span{color:var(--mu)}
.lnk{color:#fff;font-weight:600;border-bottom:2px solid var(--mint)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;margin-top:2rem;counter-reset:s}.steps li{counter-increment:s;border-top:2px solid var(--teal);padding-top:1rem}.steps li:before{content:counter(s);font:800 2rem 'Bricolage Grotesque';color:var(--teal)}.steps p{color:var(--mu);margin-top:.3rem}
.band{background:var(--ink);padding:3.5rem 0}.bandin{display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap}.band h2{color:#fff;margin:0}.band .btn{background:var(--mint);color:var(--ink)}
.ph{background:var(--paper);padding:4.5rem 0 3.5rem;border-bottom:1px solid var(--ln)}.ph h1{max-width:820px;font-size:clamp(2.2rem,4.6vw,3.6rem)}.kick{color:var(--teal);font-weight:600}
.rows{display:grid;grid-template-columns:repeat(2,1fr);column-gap:3rem;margin-top:1.5rem}.rows.three{grid-template-columns:repeat(3,1fr)}
.row{display:grid;grid-template-columns:2.2rem 1fr;column-gap:1rem;padding:1.4rem 0;border-top:1px solid var(--ln)}.row i{grid-row:span 2;margin:.2rem 0 0}.row p{margin:0}
.tabs{display:flex;gap:.5rem;margin-bottom:1rem}.tb{background:#fff;border:1.5px solid var(--ln);padding:.6rem 1.3rem;border-radius:999px;font:600 .95rem Figtree;cursor:pointer;color:var(--tx)}.tb.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.tp{display:none}.tp.on{display:block}figure{margin-top:2.5rem;border:1px solid var(--ln);border-radius:14px;overflow:hidden}figure.nar{max-width:520px}
.chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:2.2rem}.chips li{border:1.5px solid var(--teal);color:var(--teal);padding:.35rem .9rem;border-radius:999px;font-weight:500;font-size:.92rem}
.tick li{padding:.4rem 0 .4rem 1.8rem;position:relative}.tick li:before{content:"\f00c";font:900 .9rem "Font Awesome 6 Free";color:var(--teal);position:absolute;left:0;top:.6rem}
.ppl{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:1.8rem}.pc{border-top:2px solid var(--ink);padding-top:1.2rem}.pc p{font-size:.93rem;color:var(--mu);margin-top:.6rem}.pc b{display:block;color:var(--teal);font-size:.92rem;font-weight:600;margin-top:.2rem}
.av{width:56px;height:56px;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;font:700 1.1rem 'Bricolage Grotesque';margin-bottom:.9rem}.gap{margin-top:4rem}
.cg{display:grid;grid-template-columns:1fr 1.1fr;gap:4rem}.ci h3{margin:1.6rem 0 .3rem}.ci h3:first-child{margin-top:0}.ci a{color:var(--teal);font-weight:500}
form{display:grid;gap:1rem;background:var(--paper);padding:2rem;border-radius:18px;border:1px solid var(--ln)}label{display:grid;gap:.35rem;font-weight:600;font-size:.9rem;color:var(--ink)}
input,select,textarea{font:400 1rem Figtree;padding:.75rem .9rem;border:1.5px solid var(--ln);border-radius:10px;background:#fff;width:100%}input:focus,select:focus,textarea:focus{border-color:var(--teal);outline:0}
.ft{background:var(--ink);color:#9bb8b4;padding-top:3.5rem;font-size:.95rem}.fg{display:grid;grid-template-columns:1.3fr .7fr 1.2fr 1fr;gap:2rem}.ft h4{color:#fff;margin-bottom:.7rem;font-size:1rem}.ft a{display:block;padding:.15rem 0}.ft a:hover{color:var(--mint)}
.flogo{background:#fff;border-radius:8px;padding:5px 9px;margin-bottom:1rem}.fb{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:2.5rem;padding:1.3rem 1.5rem;border-top:1px solid #1f3d3a;font-size:.85rem}
@media(max-width:900px){.hg,.two,.cg{grid-template-columns:1fr}.layers,.steps,.ppl,.rows.three{grid-template-columns:1fr 1fr}.rows{grid-template-columns:1fr}.fg{grid-template-columns:1fr 1fr}.layers a{border:0;padding:1.2rem 0;border-top:1px solid var(--ln)}
.burger{display:block}.links{display:none;position:absolute;top:70px;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;padding:1rem 1.5rem 1.5rem;border-bottom:1px solid var(--ln);gap:.8rem}.links.open{display:flex}.cta{text-align:center}}
@media(max-width:560px){.layers,.steps,.ppl,.rows.three,.fg{grid-template-columns:1fr}.sec{padding:3.5rem 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.hd .nav img{height:44px;width:auto}.flogo{height:40px;width:auto}
.flash{padding:.8rem 1rem;border-radius:10px;font-weight:500}.flash.ok{background:#d7f5ee;color:#0b5a52}.flash.bad{background:#fde4e1;color:#8a2218}.hp{position:absolute;left:-9999px;height:0;width:0;opacity:0}
.hd .nav img{height:44px;width:auto}.flogo{height:40px;width:auto}
.top{background:var(--ink);color:#9fc2bd;font-size:.82rem}.topin{display:flex;justify-content:space-between;gap:1rem;padding-top:.5rem;padding-bottom:.5rem;flex-wrap:wrap}.topin a{margin-left:1.2rem}.topin a:hover{color:var(--mint)}.topin i{margin-right:.35rem;color:var(--mint)}
.hd{position:sticky;top:0}.mi{position:relative}.mi>a i{font-size:.65rem;margin-left:.2rem}.mega{display:none;position:absolute;top:100%;left:-1rem;background:#fff;border:1px solid var(--ln);border-radius:14px;padding:1.3rem 1.6rem;box-shadow:0 18px 40px rgba(11,31,30,.14);gap:2.2rem;min-width:260px;margin-top:.6rem}
.mi:hover .mega,.mi:focus-within .mega{display:flex}.mega:before{content:"";position:absolute;top:-.7rem;left:0;right:0;height:.7rem}.m2{min-width:520px}.mega h4{font-size:.95rem;margin-bottom:.5rem;color:var(--teal)}.mega a{display:block;padding:.28rem 0;font-weight:500;font-size:.93rem;white-space:nowrap}.mega a:hover{color:var(--teal)}
.trust{background:var(--paper);border-bottom:1px solid var(--ln)}.tg{display:grid;grid-template-columns:repeat(4,1fr)}.tg div{padding:1.8rem 1.5rem;border-right:1px solid var(--ln)}.tg div:first-child{padding-left:0}.tg div:last-child{border:0}.tg b{display:block;font:800 2.4rem/1 'Bricolage Grotesque';color:var(--teal)}.tg span{font-size:.92rem;color:var(--mu)}
.hrow{display:flex;justify-content:space-between;align-items:end;gap:1rem;flex-wrap:wrap}.lk{color:var(--teal);font-weight:600;border-bottom:2px solid var(--mint)}
a.row:hover h3{color:var(--teal)}
.bar{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;align-items:center;margin-bottom:1.8rem}.pills{display:flex;gap:.5rem;flex-wrap:wrap}.pills a{border:1.5px solid var(--ln);padding:.5rem 1.1rem;border-radius:999px;font-weight:600;font-size:.92rem}.pills a.on,.pills a:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.srch{display:flex;align-items:center;gap:.6rem;border:1.5px solid var(--ln);border-radius:999px;padding:.1rem 1rem;min-width:260px}.srch input{border:0;padding:.55rem 0;outline:0;background:none}.srch i{color:var(--mu)}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-top:1.6rem}.bar+.pgrid{margin-top:0}
.pc2{display:block;background:#fff;border:1px solid var(--ln);border-radius:16px;padding:1rem 1rem 1.3rem;transition:border-color .2s,box-shadow .2s}.pc2:hover{border-color:var(--teal);box-shadow:0 10px 28px rgba(15,118,110,.12)}
.pimg{background:var(--paper);border-radius:12px;height:190px;display:grid;place-items:center;overflow:hidden;margin-bottom:1rem}.pimg img{max-height:100%;width:auto;mix-blend-mode:multiply}.pimg i{font-size:3.2rem;color:var(--teal)}.pimg.big{height:380px}.pimg.big i{font-size:6rem}
.pc2 h3{margin-bottom:.3rem}.pc2 p{font-size:.95rem;color:var(--mu)}.more{display:inline-block;margin-top:.8rem;font-weight:600;color:var(--teal)}
.two2{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:start}.gap2{margin-top:2rem}.acts2{display:flex;gap:.8rem;margin-top:2rem;flex-wrap:wrap}.btn.alt{background:transparent;color:var(--ink);border:1.5px solid var(--ln)}.btn.alt:hover{background:var(--ink);color:#fff}
.kick a:hover{text-decoration:underline}.ph .kick{margin-bottom:.4rem}
@media(max-width:900px){.pgrid{grid-template-columns:1fr 1fr}.two2{grid-template-columns:1fr}.tg{grid-template-columns:1fr 1fr}.tg div{border:0;border-top:1px solid var(--ln);padding-left:0}.mega,.mi>a i{display:none!important}.pimg.big{height:260px}.topin span:first-child{display:none}}
@media(max-width:560px){.pgrid,.tg{grid-template-columns:1fr}}
a.pp{display:block;border-top:2px solid var(--ink);padding-top:1.2rem}a.pp:hover h3{color:var(--teal)}a.pp p{font-size:.93rem;color:var(--mu);margin:.6rem 0 .4rem}a.pp b{display:block;color:var(--teal);font-size:.92rem;font-weight:600;margin-top:.2rem}
.av.ph{object-fit:cover;background:var(--paper)}.av.big{width:132px;height:132px;font-size:2.4rem}img.av.big{border-radius:50%}
.prof{display:flex;gap:1.8rem;align-items:center;margin-top:.8rem}.prof h1{font-size:clamp(2rem,4vw,3rem)}.role{margin:.4rem 0 0!important;color:var(--teal)!important;font-weight:600}
.bio{font-size:1.12rem;line-height:1.8;max-width:62ch}.side{background:var(--paper);border:1px solid var(--ln);border-radius:16px;padding:1.8rem;display:grid;gap:.8rem;align-content:start}.side .btn{text-align:center;width:100%}
@media(max-width:560px){.prof{flex-direction:column;align-items:flex-start}}
/* ===== Light theme: no dark backgrounds ===== */
.top{background:var(--paper);color:var(--mu);border-bottom:1px solid var(--ln)}
.hero{background:#fff;color:var(--tx);border-bottom:1px solid var(--ln)}.hero h1{color:var(--ink)}.hero .lede{color:var(--mu)}
.btn.ghost{color:var(--ink);border-color:#b8c9c6}.btn.ghost:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.scan{background:var(--paper);border:1px solid var(--ln)}.readout{color:var(--mu)}.readout b{color:var(--teal)}
.dark{background:var(--paper);color:var(--tx);border-top:1px solid var(--ln);border-bottom:1px solid var(--ln)}.dark h2{color:var(--ink)}.dark .bignum b{color:var(--teal)}.dark .bignum span{color:var(--mu)}.lnk{color:var(--teal);border-color:var(--teal)}
.band{background:var(--paper);border-top:1px solid var(--ln)}.band h2{color:var(--ink)}.band .btn{background:var(--teal);color:#fff}.band .btn:hover{background:var(--ink)}
.ft{background:#fff;color:var(--mu);border-top:1px solid var(--ln)}.ft h4{color:var(--ink)}.ft a:hover{color:var(--teal)}.flogo{background:none;padding:0;border-radius:0}.fb{border-top:1px solid var(--ln)}
.top i{color:var(--teal)}.topin a:hover{color:var(--teal)}

.pimg{padding:.8rem}.pimg img{width:100%;height:100%;max-height:none;object-fit:contain;mix-blend-mode:normal}
.pimg.big{height:auto;aspect-ratio:4/3;padding:1.5rem}
.btn.alt2{background:transparent;color:var(--ink);border:1.5px solid #b8c9c6}.btn.alt2:hover{background:var(--ink);color:#fff}.band .btn{display:inline-block}.bandin>div,.band .btn+.btn{margin-left:.6rem}
.ct{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem}.ctile{display:grid;gap:.3rem;border:1.5px solid var(--ln);border-radius:18px;padding:2.2rem;background:#fff;transition:border-color .2s,box-shadow .2s}.ctile:hover{border-color:var(--teal);box-shadow:0 10px 28px rgba(15,118,110,.12)}.ctile i{font-size:1.6rem;color:var(--teal)}.ctile span{color:var(--mu);font-weight:500}.ctile b{font:700 clamp(1.2rem,2.6vw,1.8rem) 'Bricolage Grotesque';color:var(--ink);word-break:break-word}
.facts{display:grid;gap:0}.facts div{padding:1.2rem 0;border-top:1px solid var(--ln)}.facts div:first-child{border-top:2px solid var(--ink)}.facts b{display:block;font:800 clamp(2.4rem,5vw,3.6rem)/1 'Bricolage Grotesque';color:var(--teal)}.facts span{color:var(--mu)}
.steps.six{grid-template-columns:repeat(3,1fr);row-gap:2.2rem}.gh{margin:2.4rem 0 0;color:var(--teal);font-size:1.05rem}.gh+.ppl{margin-top:1rem}
@media(max-width:900px){.ct,.steps.six{grid-template-columns:1fr}}

/* Product photography and solution catalogue refinement */
.pimg{background:linear-gradient(145deg,#f5f8fb,#e8eef4);height:220px}
.pimg img{max-height:100%;max-width:100%;object-fit:contain;transition:transform .25s}
.pc2:hover .pimg img{transform:scale(1.035)}
.pgrid .pc2{height:100%;display:flex;flex-direction:column}
.pgrid .pc2 p{flex:1}
.pgrid .pc2 .more{align-self:flex-start}
.sec .pgrid{row-gap:1.8rem}
@media(max-width:560px){.pimg{height:210px}}

/* Real product-reference photography */
.real-product-photo{position:relative;overflow:hidden;background:#f4f7fb;}
.real-product-photo img{width:100%;height:100%;object-fit:contain;padding:14px;transition:transform .3s ease;}
.pc2:hover .real-product-photo img{transform:scale(1.035);}
.photo-label{position:absolute;left:10px;bottom:10px;background:rgba(255,255,255,.92);color:#52657d;border:1px solid #e2e8f0;border-radius:20px;padding:4px 8px;font-size:10px;letter-spacing:.02em;}
