.navright{display:flex;align-items:center;gap:22px}
.navlink{color:#111;text-decoration:none;font-weight:600;font-size:15px;padding:10px 0}
.navlink:hover,.navlink.on{color:#0A7A72}
.links a.on{color:#0A7A72}
.proc{padding:104px 0;background:#F4F8F2}
.pgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.pcard{background:#E9F0E6;border-radius:26px;padding:30px 26px;display:flex;flex-direction:column;gap:12px;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.pcard:hover{transform:scale(1.035);box-shadow:0 30px 60px -36px rgba(17,17,17,.35)}
.pcard .pn{font-family:'JetBrains Mono',monospace;font-size:13px;color:#0A7A72}
.pcard h3{font-family:'Bricolage Grotesque',Manrope,sans-serif;font-size:24px;font-weight:800;letter-spacing:-0.02em;line-height:1.15;margin:0}
.pcard p{margin:0;color:#3F4641;font-size:15.5px;line-height:1.6}
.pcard .pt{margin-top:auto;font-size:13px;font-weight:800;color:#0A4F4A;background:#fff;border-radius:999px;padding:5px 11px;align-self:flex-start}
@media (max-width:960px){.pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:680px){.navright{gap:12px}.navlink{display:none}.navright .navcta{display:inline-flex!important;min-height:44px;padding:0 16px;font-size:14px}.pgrid{grid-template-columns:minmax(0,1fr)}.proc{padding:72px 0}}
@media (prefers-reduced-motion:reduce){.pcard{transition:none}.pcard:hover{transform:none}}
@media (max-width:680px){.ftag{left:12px!important;bottom:16px!important;font-size:14px!important;padding:10px 14px!important}main>section:last-child[style*="#111"]{padding:72px 0!important}.foot{padding-top:56px!important}}

/* logo intro animation */
.brand .bmark{display:block;width:32px;height:32px;flex:none}
.brand .bmark svg{display:block;width:32px;height:32px;overflow:hidden}
.brand .btxt{display:inline-block}
.bm-dia{transform-box:fill-box;transform-origin:50% 50%}
.brand.intro .bmark{animation:gdxIcon 2.25s linear both}
.brand.intro .bm-arw{animation:gdxArrow 1.05s .5s both}
.brand.pulse .bm-arw{animation:gdxArrow 1.05s both}
.brand.intro .btxt{animation:gdxText .5s cubic-bezier(.2,.7,.2,1) 1.95s both}
@keyframes gdxIcon{0%{transform:translateX(var(--shift,54px)) scale(.4);opacity:0;animation-timing-function:cubic-bezier(.2,.8,.3,1.3)}18%{transform:translateX(var(--shift,54px)) scale(1);opacity:1}74%{transform:translateX(var(--shift,54px));animation-timing-function:cubic-bezier(.65,0,.25,1)}100%{transform:translateX(0);opacity:1}}
@keyframes gdxChev{0%{transform:translateY(0);animation-timing-function:cubic-bezier(.55,0,.85,.35)}38%{transform:translateY(-760px);animation-timing-function:steps(1,end)}40%{transform:translateY(1080px);animation-timing-function:cubic-bezier(.2,.75,.3,1.12)}100%{transform:translateY(0)}}
@keyframes gdxArrow{0%{transform:translateY(0);animation-timing-function:cubic-bezier(.55,0,.85,.35)}38%{transform:translateY(-720px);animation-timing-function:steps(1,end)}40%{transform:translateY(950px);animation-timing-function:cubic-bezier(.2,.75,.3,1.15)}100%{transform:translateY(0)}}
@keyframes gdxDia{0%{transform:scale(1)}45%{transform:scale(1.1,.88)}100%{transform:scale(1)}}
@keyframes gdxText{from{clip-path:inset(0 100% 0 0);opacity:0;transform:translateX(-6px)}to{clip-path:inset(0 0 0 0);opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.brand.intro .bmark,.brand.intro .bm-chev,.brand.intro .bm-dia,.brand.intro .btxt,.brand.intro .bm-arw,.brand.pulse .bm-arw{animation:none!important}}
