*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--green:#529D78;--green-dk:#3a7558;--green-lt:#eaf4ee;--dark:#111928;--dark2:#1f2a37;--t1:#111928;--t2:#374151;--t3:#6b7280;--t4:#9ca3af;--bg:#fff;--bg2:#f9fafb;--bg3:#f3f4f6;--bd:#e5e7eb;--bd2:#d1d5db}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--t1);font-family:'Inter',sans-serif;font-size:15px;line-height:1.65;overflow-x:hidden}
.risk-bar{background:#fdf2f2;border-bottom:1px solid #fbd5d5;padding:8px 0;text-align:center;font-size:12px;color:#9b1c1c;line-height:1.5}
.risk-bar b{font-weight:600}
nav{background:#fff;border-bottom:1px solid var(--bd);position:sticky;top:0;z-index:200;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.nav-inner{max-width:1200px;margin:0 auto;padding:0 24px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.nav-logo{display:flex;align-items:center;flex-shrink:0}
.nav-links{display:flex;gap:1px;list-style:none}
.nav-links a{text-decoration:none;color:var(--t2);font-size:13.5px;padding:7px 12px;border-radius:6px;transition:.15s;white-space:nowrap}
.nav-links a:hover,.nav-links a.active{background:var(--bg2);color:var(--green)}
.nav-right{display:flex;gap:8px;flex-shrink:0}
.btn-out{background:transparent;border:1px solid var(--bd2);color:var(--t1);padding:8px 18px;font-size:13px;font-weight:500;border-radius:6px;text-decoration:none;transition:.15s}
.btn-out:hover{background:var(--bg2)}
.btn-bl{background:var(--green);color:#fff;padding:8px 18px;font-size:13px;font-weight:500;border-radius:6px;border:none;text-decoration:none;transition:.15s;display:inline-flex;align-items:center;gap:5px}
.btn-bl:hover{background:var(--green-dk)}
.btn-gr{background:var(--green);color:#fff;padding:12px 28px;font-size:14px;font-weight:500;border-radius:6px;border:none;text-decoration:none;transition:.15s;display:inline-flex;align-items:center;gap:7px;cursor:pointer}
.btn-gr:hover{background:var(--green-dk)}
.btn-wh{background:#fff;color:var(--t1);padding:12px 28px;font-size:14px;font-weight:500;border-radius:6px;border:1px solid var(--bd2);text-decoration:none;transition:.15s}
.btn-wh:hover{background:var(--bg2)}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.lbl{font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--green);margin-bottom:10px}
h1,h2,h3{letter-spacing:-.02em;line-height:1.2}
h1{font-size:clamp(32px,4.5vw,54px);font-weight:700;color:#fff;margin-bottom:18px}
h1 span{color:#6ee7b7}
h2{font-size:clamp(24px,3vw,36px);font-weight:700;color:var(--dark);margin-bottom:14px}
h2.w{color:#fff}
.sub{font-size:15.5px;color:var(--t3);max-width:600px;line-height:1.7}
.sh{margin-bottom:48px}.sh.c{text-align:center}.sh.c .sub{margin:0 auto}
section{padding:80px 0}
hr{border:none;border-top:1px solid var(--bd)}
.page-hero{background:linear-gradient(135deg,#0c2a1d,#13503a 55%,#0e5a40);padding:72px 0 60px;position:relative;overflow:hidden}
.page-hero::after{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.025'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/svg%3E")}
.ph-z{position:relative;z-index:1}
.ph-z h1{font-size:clamp(28px,4vw,46px);max-width:640px;margin-bottom:10px}
.ph-z p{font-size:16px;color:rgba(255,255,255,.66);max-width:600px;line-height:1.7}
.cta-band{background:linear-gradient(135deg,#0c2a1d,#13503a);padding:72px 0;text-align:center}
/* ---------- INFOGRAPHIC ELEMENTS ---------- */
/* stat tiles */
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.stat-tile{background:linear-gradient(160deg,var(--green-lt),#fff);border:1px solid var(--bd);border-radius:16px;padding:28px 24px;text-align:center;position:relative;overflow:hidden}
.stat-tile .ico{width:46px;height:46px;margin:0 auto 14px;background:#fff;border:1px solid var(--bd);border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--green)}
.stat-tile .big{font-size:34px;font-weight:700;color:var(--green-dk);line-height:1}
.stat-tile .cap{font-size:12.5px;color:var(--t3);margin-top:6px;font-weight:500}
/* icon feature row with connecting line */
.flowpills{display:flex;gap:0;align-items:stretch;position:relative;flex-wrap:wrap}
/* numbered vertical timeline */
.timeline{position:relative;max-width:880px;margin:0 auto;padding-left:0}
.tl-item{display:grid;grid-template-columns:88px 1fr;gap:0;position:relative}
.tl-rail{display:flex;flex-direction:column;align-items:center}
.tl-dot{width:56px;height:56px;border-radius:50%;background:var(--green);color:#fff;font-size:22px;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(82,157,120,.35);z-index:2;flex-shrink:0}
.tl-line{width:2px;flex:1;background:linear-gradient(var(--green),var(--bd));margin:6px 0}
.tl-item:last-child .tl-line{display:none}
.tl-body{padding:4px 0 40px 28px}
.tl-body h3{font-size:18px;font-weight:600;color:var(--dark);margin-bottom:8px}
.tl-body p{font-size:14px;color:var(--t3);line-height:1.65}
.tl-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.tag{font-size:11.5px;font-weight:500;color:var(--green-dk);background:var(--green-lt);border:1px solid rgba(82,157,120,.25);border-radius:100px;padding:4px 12px}
/* big icon cards grid */
.icards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.icard{border:1px solid var(--bd);border-radius:16px;padding:30px 26px;background:#fff;transition:.2s;position:relative;overflow:hidden}
.icard:hover{box-shadow:0 10px 30px rgba(0,0,0,.07);border-color:var(--green);transform:translateY(-3px)}
.icard .ring{width:56px;height:56px;border-radius:14px;background:var(--green-lt);display:flex;align-items:center;justify-content:center;color:var(--green);margin-bottom:18px}
.icard h3{font-size:16.5px;font-weight:600;color:var(--dark);margin-bottom:9px}
.icard p{font-size:13.5px;color:var(--t3);line-height:1.6}
.icard .corner{position:absolute;top:-18px;right:-18px;font-size:90px;font-weight:800;color:var(--green-lt);line-height:1;z-index:0;user-select:none}
.icard>*{position:relative;z-index:1}
/* donut/percent */
.donut-wrap{display:flex;align-items:center;gap:40px;flex-wrap:wrap;justify-content:center}
/* horizontal bar meter */
.bars{display:flex;flex-direction:column;gap:18px}
.bar-row .bar-top{display:flex;justify-content:space-between;font-size:13.5px;margin-bottom:6px}
.bar-row .bar-top b{color:var(--dark);font-weight:600}
.bar-row .bar-top span{color:var(--green-dk);font-weight:600}
.bar-track{height:10px;background:var(--bg3);border-radius:100px;overflow:hidden}
.bar-fill{height:100%;background:linear-gradient(90deg,var(--green),#6ec79b);border-radius:100px}
/* split / two-up */
.g2r{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.g2cards{display:grid;grid-template-columns:1fr 1fr;gap:20px}
/* asset hex/visual cards */
.asset-list{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.asset-row{display:flex;gap:18px;align-items:flex-start;border:1px solid var(--bd);border-radius:14px;padding:22px 24px;background:#fff;transition:.2s}
.asset-row:hover{border-color:var(--green);box-shadow:0 8px 24px rgba(0,0,0,.06)}
.asset-row .ai{width:52px;height:52px;border-radius:13px;background:var(--green-lt);display:flex;align-items:center;justify-content:center;color:var(--green);flex-shrink:0}
.asset-row h3{font-size:15.5px;font-weight:600;color:var(--dark);margin-bottom:6px}
.asset-row p{font-size:13px;color:var(--t3);line-height:1.6}
.asset-row .chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.chip{font-size:11px;color:var(--t2);background:var(--bg3);border-radius:6px;padding:3px 9px}
/* process arrow strip */
.steps-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;counter-reset:s}
.step-box{background:#fff;border:1px solid var(--bd);border-radius:14px;padding:22px 18px;position:relative;text-align:center}
.step-box .num{width:38px;height:38px;margin:0 auto 12px;border-radius:50%;background:var(--green);color:#fff;font-weight:700;font-size:16px;display:flex;align-items:center;justify-content:center}
.step-box h4{font-size:13.5px;font-weight:600;color:var(--dark);line-height:1.3;margin-bottom:6px}
.step-box p{font-size:11.5px;color:var(--t4);line-height:1.4}
.step-box .arr{position:absolute;right:-11px;top:38px;color:var(--green);z-index:3}
.step-box:last-child .arr{display:none}
/* pillar boxes */
.pillars3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pillar-card{border-radius:16px;padding:28px 24px;color:#fff;background:linear-gradient(155deg,var(--green),var(--green-dk))}
.pillar-card.alt{background:linear-gradient(155deg,#1f2a37,#0c2a1d)}
.pillar-card h3{font-size:16px;font-weight:600;margin-bottom:8px;color:#fff}
.pillar-card p{font-size:13px;color:rgba(255,255,255,.8);line-height:1.6}
.pillar-card .pico{width:44px;height:44px;border-radius:11px;background:rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;margin-bottom:16px}
/* reg checklist */
.checklist{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.check-item{display:flex;gap:12px;align-items:flex-start;background:var(--bg2);border:1px solid var(--bd);border-radius:10px;padding:14px 16px}
.check-item .ck{width:22px;height:22px;border-radius:50%;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.check-item span{font-size:13px;color:var(--t2);line-height:1.45}
/* contact info infographic */
.cinfo{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cinfo-card{border:1px solid var(--bd);border-radius:16px;padding:28px 24px;text-align:center;background:#fff}
.cinfo-card .ci{width:52px;height:52px;margin:0 auto 16px;border-radius:14px;background:var(--green-lt);display:flex;align-items:center;justify-content:center;color:var(--green)}
.cinfo-card h3{font-size:15px;font-weight:600;color:var(--dark);margin-bottom:8px}
.cinfo-card p{font-size:13.5px;color:var(--t3);line-height:1.7}
.cinfo-card a{color:var(--green-dk);text-decoration:none;font-weight:500}
/* footer */
footer{background:var(--dark2);color:#fff;padding:60px 0 0}
.ft-top{display:grid;grid-template-columns:2fr 1fr 1fr 1.3fr;gap:44px;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.08)}
.ft-brand p{font-size:12.5px;color:rgba(255,255,255,.4);line-height:1.7;margin-top:12px;max-width:250px}
.fc h4{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:14px}
.fc ul{list-style:none;display:flex;flex-direction:column;gap:7px}
.fc ul a{text-decoration:none;font-size:13px;color:rgba(255,255,255,.5);transition:.15s}
.fc ul a:hover{color:#fff}
.fc address{font-style:normal;font-size:13px;color:rgba(255,255,255,.5);line-height:1.8}
.fc address a{color:#8dd4b0;text-decoration:none}
.ft-disc{padding:24px 0;font-size:11.5px;color:rgba(255,255,255,.28);line-height:1.7;border-bottom:1px solid rgba(255,255,255,.06)}
.ft-disc strong{color:rgba(255,255,255,.42)}
.ft-bot{padding:18px 0;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:rgba(255,255,255,.28)}
.ft-links{display:flex;gap:22px}
.ft-links a{text-decoration:none;color:rgba(255,255,255,.28);transition:.15s}
.ft-links a:hover{color:rgba(255,255,255,.6)}
svg{display:block}
/* smooth, jitter-free hero parallax (applied to scene container, not animated coins) */
.cryptobg{transition:transform .25s cubic-bezier(.2,.7,.3,1);will-change:transform}
.page-hero .ph-z{transition:transform .3s cubic-bezier(.2,.7,.3,1);will-change:transform}

/* footer new background */
footer{background:linear-gradient(160deg,#0c2a1d 0%,#11352a 55%,#0e3528 100%) !important;position:relative;overflow:hidden}
footer::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 15% 20%,rgba(141,212,176,.10),transparent 40%),radial-gradient(circle at 85% 80%,rgba(82,157,120,.12),transparent 45%);pointer-events:none}
footer .wrap{position:relative;z-index:1}
/* prominent LinkedIn */
.ft-brand{max-width:none}
.ft-brand p{max-width:250px}
.social-row .li-btn{white-space:nowrap;width:max-content}
.social-row .li-btn span{white-space:nowrap}

.social-row{display:flex;gap:12px;margin-top:20px;align-items:center}
.social-row .li-btn{display:inline-flex;align-items:center;gap:10px;height:46px;padding:0 20px 0 16px;border-radius:10px;background:#0a66c2;color:#fff !important;font-size:14px;font-weight:600;text-decoration:none;box-shadow:0 6px 18px rgba(10,102,194,.4);transition:transform .25s,box-shadow .25s,background .25s}
.social-row .li-btn:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(10,102,194,.55);background:#0959aa}
.social-row .li-btn svg{flex-shrink:0}
.social-row .li-pulse{position:relative}
.social-row .li-pulse::after{content:"";position:absolute;inset:0;border-radius:10px;box-shadow:0 0 0 0 rgba(10,102,194,.5);animation:liPulse 2.4s infinite}
@keyframes liPulse{0%{box-shadow:0 0 0 0 rgba(10,102,194,.45)}70%{box-shadow:0 0 0 14px rgba(10,102,194,0)}100%{box-shadow:0 0 0 0 rgba(10,102,194,0)}}
/* image helpers */
.imgwrap{position:relative;border-radius:16px;overflow:hidden;background:linear-gradient(160deg,#0c2a1d,#13503a)}
.imgwrap img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.3,1)}
.imgwrap:hover img{transform:scale(1.06)}
.imgwrap::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(12,42,29,.45));pointer-events:none}
.imgwrap .cap{position:absolute;left:18px;bottom:16px;z-index:2;color:#fff;font-weight:600;font-size:14px;text-shadow:0 2px 8px rgba(0,0,0,.4)}
.img-badge{position:absolute;top:16px;right:16px;z-index:2;background:rgba(255,255,255,.92);border-radius:8px;padding:6px 12px;font-size:11px;font-weight:600;color:#0c2a1d;backdrop-filter:blur(4px)}
/* hero side image */
.hero-photo{position:absolute;right:0;top:0;bottom:0;width:46%;z-index:0;opacity:.35;-webkit-mask-image:linear-gradient(90deg,transparent,#000 40%);mask-image:linear-gradient(90deg,transparent,#000 40%)}
.hero-photo img{width:100%;height:100%;object-fit:cover}

/* ---------- BIGGER HEADER ---------- */
.nav-inner{height:88px !important}
.nav-links a{font-size:14.5px !important;padding:9px 14px !important}
nav{box-shadow:0 2px 14px rgba(0,0,0,.06) !important;transition:height .3s,box-shadow .3s,background .3s}
nav.shrunk .nav-inner{height:68px !important;transition:height .3s}
nav.shrunk{box-shadow:0 4px 20px rgba(0,0,0,.09) !important;background:rgba(255,255,255,.96) !important;backdrop-filter:blur(10px)}
.nav-logo svg{transition:transform .35s cubic-bezier(.2,.8,.3,1.2),filter .3s}
.nav-logo:hover svg{transform:scale(1.06) rotate(-1deg);filter:drop-shadow(0 4px 10px rgba(82,157,120,.3))}
.nav-links a{position:relative}
.nav-links a::after{content:"";position:absolute;left:14px;right:14px;bottom:4px;height:2px;background:var(--green);border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform .28s ease}
.nav-links a:hover::after,.nav-links a.active::after{transform:scaleX(1)}
/* ---------- EXTRA VISUAL EFFECTS ---------- */
/* animated gradient text on hero headline */
h1 span{background:linear-gradient(110deg,#6ee7b7,#b4e4c8,#8dd4b0,#6ee7b7);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:gradText 6s ease infinite}
@keyframes gradText{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
/* button glow pulse on primary CTA */
.btn-bl{position:relative;box-shadow:0 4px 16px rgba(82,157,120,.35)}
.btn-bl::before{content:"";position:absolute;inset:0;border-radius:6px;box-shadow:0 0 0 0 rgba(82,157,120,.5);animation:btnPulse 2.6s infinite}
@keyframes btnPulse{0%{box-shadow:0 0 0 0 rgba(82,157,120,.45)}70%{box-shadow:0 0 0 12px rgba(82,157,120,0)}100%{box-shadow:0 0 0 0 rgba(82,157,120,0)}}
/* card sheen sweep on hover */
.icard,.stat-tile,.cinfo-card,.asset-row,.step-box{position:relative;overflow:hidden}
.icard::after,.stat-tile::after,.cinfo-card::after,.asset-row::after{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;background:linear-gradient(90deg,transparent,rgba(141,212,176,.18),transparent);transform:skewX(-20deg);transition:left .65s;pointer-events:none}
.icard:hover::after,.stat-tile:hover::after,.cinfo-card:hover::after,.asset-row:hover::after{left:150%}
/* section label animated dash */
.lbl::after{content:"";display:inline-block;width:0;height:2px;background:var(--green);vertical-align:middle;margin-left:8px;animation:lblDash 1.2s ease forwards}
@keyframes lblDash{to{width:28px}}
/* count-up numbers get a subtle pop when revealed */
.stat-tile .big,.tl-dot{will-change:transform}
.reveal.in .big{animation:numPop .6s cubic-bezier(.2,.9,.3,1.3) both}
@keyframes numPop{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.12)}100%{transform:scale(1);opacity:1}}
/* glowing ring icons on hover */
.icard .ring,.ic-g,.ic-b,.as-ic,.feat-ic{transition:transform .35s,box-shadow .35s,background .35s}
.icard:hover .ring{box-shadow:0 8px 22px rgba(82,157,120,.3)}
.asset-row:hover .ai{box-shadow:0 8px 20px rgba(82,157,120,.3)}
/* scroll progress bar */
#progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,#529D78,#6ee7b7,#b4e4c8);z-index:300;transition:width .1s ease;box-shadow:0 0 10px rgba(82,157,120,.5)}
/* back-to-top button */
#toTop{position:fixed;right:22px;bottom:22px;width:46px;height:46px;border-radius:50%;background:var(--green);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 20px rgba(82,157,120,.45);opacity:0;pointer-events:none;transform:translateY(14px) scale(.8);transition:.35s;z-index:250}
#toTop.show{opacity:1;pointer-events:auto;transform:translateY(0) scale(1)}
#toTop:hover{background:var(--green-dk);transform:translateY(-3px) scale(1.06)}
/* floating glow orbs in mesh sections */
.mesh-bg .orb{position:absolute;border-radius:50%;filter:blur(50px);opacity:.5;z-index:0;pointer-events:none}
.mesh-bg .orb1{width:280px;height:280px;background:radial-gradient(circle,rgba(82,157,120,.25),transparent 70%);top:-60px;left:-40px;animation:orbFloat 16s ease-in-out infinite}
.mesh-bg .orb2{width:340px;height:340px;background:radial-gradient(circle,rgba(141,212,176,.22),transparent 70%);bottom:-100px;right:-60px;animation:orbFloat 20s ease-in-out infinite reverse}
@keyframes orbFloat{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,-30px) scale(1.12)}}
/* link hover micro-interaction in footer */
.fc ul a{position:relative;display:inline-block}
.fc ul a::before{content:"→ ";opacity:0;margin-left:-14px;transition:.2s;color:#8dd4b0}
.fc ul a:hover::before{opacity:1;margin-left:0}
/* smooth reveal for headings underline */
h2{position:relative}
.sh.c h2::after,.sh h2::after{content:"";display:block;width:0;height:3px;background:linear-gradient(90deg,var(--green),#8dd4b0);border-radius:3px;margin-top:14px;transition:width .8s ease}
.sh.c h2::after{margin-left:auto;margin-right:auto}
.reveal.in h2::after,.sh.in h2::after{width:64px}
@media(prefers-reduced-motion:reduce){#progress,.mesh-bg .orb,.btn-bl::before{display:none}h1 span{animation:none;-webkit-text-fill-color:#6ee7b7}}
@media(max-width:900px){.nav-inner{height:64px !important}}

.social-row{display:flex;gap:10px;margin-top:16px}
.social-row a{width:36px;height:36px;border-radius:9px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.65);transition:.18s}
.social-row a:hover{background:#0a66c2;border-color:#0a66c2;color:#fff;transform:translateY(-2px)}



/* ---------- CRYPTO-THEMED ANIMATED BACKGROUNDS ---------- */
.page-hero{perspective:1100px}
.cryptobg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
/* animated growing line chart (SVG path draw + rise) */
.cryptobg .chartwave{position:absolute;left:0;right:0;bottom:0;width:100%;height:62%}
.cryptobg .chartwave path.area{fill:url(#areaGrad);opacity:.55;transform-origin:bottom;animation:growArea 3.2s cubic-bezier(.2,.7,.3,1) forwards}
.cryptobg .chartwave path.line{fill:none;stroke:#8dd4b0;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1600;stroke-dashoffset:1600;animation:drawPath 3s ease forwards}
.cryptobg .chartwave path.line2{fill:none;stroke:rgba(180,228,200,.55);stroke-width:1.6;stroke-dasharray:1600;stroke-dashoffset:1600;animation:drawPath 3.4s .3s ease forwards}
@keyframes drawPath{to{stroke-dashoffset:0}}
@keyframes growArea{from{transform:scaleY(0)}to{transform:scaleY(1)}}
/* second wave layer that loops (flowing) */
.cryptobg .flow{position:absolute;left:0;bottom:0;width:200%;height:48%;opacity:.4}
.cryptobg .flow svg{width:100%;height:100%}
.cryptobg .flow path{fill:none;stroke:rgba(141,212,176,.5);stroke-width:2}
.flowA{animation:flowMove 14s linear infinite}
.flowB{animation:flowMove 20s linear infinite reverse;opacity:.6}
@keyframes flowMove{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* animated candlesticks rising */
.candles{position:absolute;bottom:0;left:6%;display:flex;gap:14px;align-items:flex-end;height:55%;opacity:.5}
.candle{position:relative;width:10px;display:flex;justify-content:center;animation:candleRise 1s ease both}
.candle .body{width:10px;border-radius:2px;background:linear-gradient(180deg,#8dd4b0,rgba(82,157,120,.3))}
.candle .wick{position:absolute;width:2px;background:rgba(141,212,176,.6);left:50%;transform:translateX(-50%)}
.candle.red .body{background:linear-gradient(180deg,rgba(180,228,200,.6),rgba(82,157,120,.15))}
@keyframes candleRise{from{transform:translateY(40px);opacity:0}to{transform:translateY(0);opacity:.55}}
@keyframes candlePulse{0%,100%{transform:scaleY(.92)}50%{transform:scaleY(1.06)}}
.candle .body{animation:candlePulse 3.2s ease-in-out infinite}
/* floating crypto coins/symbols in 3D */
.coins{position:absolute;inset:0;transform-style:preserve-3d}
.coin{position:absolute;width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:24px;color:#bfe8d2;border:2px solid rgba(141,212,176,.45);background:radial-gradient(circle at 35% 30%,rgba(180,228,200,.22),rgba(82,157,120,.04) 70%);box-shadow:0 0 26px rgba(141,212,176,.18);will-change:transform}
.coin.lg{width:74px;height:74px;font-size:32px}
.coin.sm{width:40px;height:40px;font-size:18px}
@keyframes coinFloat{0%,100%{transform:translate3d(0,0,0) rotateY(0)}50%{transform:translate3d(0,-26px,30px) rotateY(180deg)}}
@keyframes coinSpin{0%,100%{transform:translate3d(0,0,0) rotateY(0) rotateX(12deg)}50%{transform:translate3d(14px,-18px,10px) rotateY(180deg) rotateX(12deg)}}
.c1{top:14%;right:12%;animation:coinFloat 9s ease-in-out infinite}
.c2{top:50%;right:28%;animation:coinSpin 11s ease-in-out infinite}
.c3{top:26%;right:44%;animation:coinFloat 7.5s ease-in-out infinite reverse}
.c4{bottom:24%;right:8%;animation:coinSpin 13s ease-in-out infinite}
/* network nodes / blockchain dots */
.nodes{position:absolute;inset:0;opacity:.4}
.nodes b{position:absolute;width:7px;height:7px;border-radius:50%;background:#8dd4b0;box-shadow:0 0 10px rgba(141,212,176,.6);animation:nodePulse 3s ease-in-out infinite}
@keyframes nodePulse{0%,100%{transform:scale(.7);opacity:.4}50%{transform:scale(1.3);opacity:.9}}
.parallax{will-change:transform}
.tilt{transition:transform .15s ease-out;transform-style:preserve-3d}
.mesh-bg{position:relative;overflow:hidden}
.mesh-bg::before{content:"";position:absolute;inset:-50%;z-index:0;background:radial-gradient(circle at 20% 30%,rgba(82,157,120,.07),transparent 40%),radial-gradient(circle at 80% 70%,rgba(141,212,176,.08),transparent 45%);animation:meshMove 18s ease-in-out infinite}
@keyframes meshMove{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(4%,-3%) scale(1.08)}}
.mesh-bg>*{position:relative;z-index:1}
@media(prefers-reduced-motion:reduce){.cryptobg{display:none}.mesh-bg::before{animation:none}}
@media(max-width:900px){.candles,.coin.lg,.c3{display:none}}

/* ---------- ANIMATIONS ---------- */
@keyframes fadeUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes scaleIn{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}
@keyframes barGrow{from{width:0 !important}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes pulseDot{0%,100%{box-shadow:0 0 0 0 rgba(82,157,120,.5)}70%{box-shadow:0 0 0 10px rgba(82,157,120,0)}}
@keyframes shimmer{0%{background-position:-400px 0}100%{background-position:400px 0}}
@keyframes drawLine{from{transform:scaleY(0)}to{transform:scaleY(1)}}
/* reveal-on-scroll base */
.reveal{opacity:0}
.reveal.in{animation:fadeUp .7s cubic-bezier(.2,.7,.3,1) forwards}
.reveal.d1{animation-delay:.08s}.reveal.d2{animation-delay:.16s}.reveal.d3{animation-delay:.24s}.reveal.d4{animation-delay:.32s}.reveal.d5{animation-delay:.4s}
/* hero text entrance */
.page-hero .ph-z>*{opacity:0;animation:fadeUp .8s cubic-bezier(.2,.7,.3,1) forwards}
.page-hero .ph-z>*:nth-child(1){animation-delay:.05s}
.page-hero .ph-z>*:nth-child(2){animation-delay:.18s}
.page-hero .ph-z>*:nth-child(3){animation-delay:.3s}
.page-hero .ph-z>*:nth-child(4){animation-delay:.42s}
/* card hover lift refinements */
.icard,.asset-row,.stat-tile,.cinfo-card,.step-box{transition:transform .28s cubic-bezier(.2,.7,.3,1),box-shadow .28s,border-color .2s}
.stat-tile:hover{transform:translateY(-5px);box-shadow:0 14px 32px rgba(82,157,120,.18)}
.stat-tile:hover .ico{animation:floaty 1.6s ease-in-out infinite}
.cinfo-card:hover{transform:translateY(-5px);box-shadow:0 14px 32px rgba(0,0,0,.08);border-color:var(--green)}
.cinfo-card:hover .ci{animation:floaty 1.6s ease-in-out infinite}
.step-box:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(0,0,0,.08);border-color:var(--green)}
.icard .ring{transition:transform .3s}
.icard:hover .ring{transform:rotate(-6deg) scale(1.08)}
.asset-row:hover .ai{transform:scale(1.08)}
.asset-row .ai{transition:transform .3s}
/* nav logo */
.nav-logo svg{transition:transform .3s}
.nav-logo:hover svg{transform:scale(1.05)}
/* hero badge pulse dot */
.page-hero .ph-z span[style*="background:#4ade80"]{animation:pulseDot 2s infinite}
/* timeline dot pop + rail draw */
.tl-dot{animation:scaleIn .5s cubic-bezier(.2,.9,.3,1.3) both}
.tl-line{transform-origin:top;animation:drawLine .6s ease both}
.tl-item:nth-child(1) .tl-dot{animation-delay:.05s}.tl-item:nth-child(2) .tl-dot{animation-delay:.2s}.tl-item:nth-child(3) .tl-dot{animation-delay:.35s}.tl-item:nth-child(4) .tl-dot{animation-delay:.5s}.tl-item:nth-child(5) .tl-dot{animation-delay:.65s}
/* bar fills grow when revealed */
.bar-fill{animation:barGrow 1.1s cubic-bezier(.2,.7,.3,1)}
/* button shine */
.btn-gr{position:relative;overflow:hidden}
.btn-gr::after{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);transition:left .6s}
.btn-gr:hover::after{left:140%}
/* arrow nudge */
.step-box .arr{transition:transform .25s}
.step-box:hover .arr{transform:translateX(4px)}
@media(prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}.reveal{opacity:1}.page-hero .ph-z>*{opacity:1}}

@media(max-width:900px){.stat-row{grid-template-columns:repeat(2,1fr)}.icards{grid-template-columns:1fr}.steps-strip{grid-template-columns:1fr}.step-box .arr{display:none}.g2r,.g2cards,.asset-list,.checklist,.cinfo,.pillars3{grid-template-columns:1fr}.nav-links{display:none}.ft-top{grid-template-columns:1fr 1fr}}
/* ---------- MOBILE OVERFLOW FIXES ---------- */
.cryptobg,.page-hero{overflow:hidden}
.flow{max-width:100%;overflow:hidden}
@media(max-width:760px){
  .g2r,.g2l,.g2cards,.g2,.g3,.icards,.assets-grid,.asset-list,.reg-grid,.ct-grid,.cinfo,.pillars3,.icon3d-grid,.feat-strip,.features-grid,.sv-grid,.why-grid,.steps-strip,.stat-row,.checklist{grid-template-columns:1fr !important}
  .fr2,.form-row{grid-template-columns:1fr !important}
  section{padding:48px 0 !important}
  .wrap{padding:0 18px !important}
  h1{font-size:34px !important}
  h2{font-size:26px !important}
  .ph-z h1{font-size:30px !important}
  .icon3d-grid{grid-template-columns:1fr 1fr !important}
  .hstats{gap:20px !important}
  .nav-links{display:none !important}
  .checklist[style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr !important}
  .pillars{grid-template-columns:1fr !important}
  .ft-top{grid-template-columns:1fr 1fr !important;gap:28px !important}
  div[style*="grid-template-columns:1fr 1fr 1fr"]{grid-template-columns:1fr 1fr !important}
  div[style*="grid-template-columns:repeat(3"]{grid-template-columns:1fr 1fr !important}
}
@media(max-width:460px){
  .icon3d-grid{grid-template-columns:1fr !important}
  .ft-top{grid-template-columns:1fr !important}
  .hstats{flex-direction:column;gap:16px !important}
}

@media(max-width:760px){
  .g2r>*,.g2l>*,.g2r>div,.g2l>div{min-width:0 !important;max-width:100% !important;width:auto !important}
  .bars,.bar-row,.bar-top,.bar-track,.checklist{min-width:0 !important;max-width:100% !important;width:auto !important}
  .g2r,.g2l{gap:32px !important}
  img{max-width:100% !important;height:auto}
}

@media(max-width:760px){
  nav .nav-inner{height:64px !important;padding:0 14px !important;gap:8px !important}
  .nav-logo svg{width:150px !important;height:auto !important}
  .nav-right .btn-out{display:none !important}
  .nav-right .btn-bl{padding:8px 14px !important;font-size:12px !important}
  nav.shrunk .nav-inner{height:58px !important}
  body{overflow-x:hidden}
  html{overflow-x:hidden}
}
@media(max-width:430px){
  .nav-logo svg{width:128px !important}
  .nav-right .btn-bl span{display:none}
}

/* ---------- BURGER + MOBILE MENU ---------- */
.burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;background:transparent;border:none;cursor:pointer;padding:0;border-radius:8px}
.burger span{display:block;width:24px;height:2.5px;background:var(--dark);border-radius:2px;margin:0 auto;transition:transform .3s,opacity .25s}
.burger.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
.mobile-overlay{position:fixed;inset:0;background:rgba(12,42,29,.5);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .35s;z-index:290}
.mobile-overlay.show{opacity:1;pointer-events:auto}
.mobile-menu{position:fixed;top:0;right:0;height:100%;width:300px;max-width:84vw;background:linear-gradient(165deg,#0c2a1d,#11352a 60%,#0e3528);box-shadow:-12px 0 40px rgba(0,0,0,.3);transform:translateX(105%);transition:transform .4s cubic-bezier(.3,.8,.3,1);z-index:300;display:flex;flex-direction:column;padding:22px 24px}
.mobile-menu.show{transform:translateX(0)}
.mm-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.mm-title{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.mm-close{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:#fff;width:38px;height:38px;border-radius:9px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s}
.mm-close:hover{background:rgba(255,255,255,.16)}
.mm-links{display:flex;flex-direction:column;gap:2px;margin-bottom:22px}
.mm-links a{color:rgba(255,255,255,.85);text-decoration:none;font-size:16px;font-weight:500;padding:13px 14px;border-radius:10px;transition:.2s;display:flex;align-items:center;justify-content:space-between}
.mm-links a::after{content:"›";color:#6ee7b7;opacity:0;transform:translateX(-6px);transition:.2s;font-size:20px}
.mm-links a:hover,.mm-links a:active{background:rgba(141,212,176,.12);color:#fff;padding-left:18px}
.mm-links a:hover::after{opacity:1;transform:translateX(0)}
.mm-cta{justify-content:center;width:100%;margin-bottom:auto}
.mm-foot{margin-top:24px;padding-top:18px;border-top:1px solid rgba(255,255,255,.1)}
.mm-li{display:inline-flex;align-items:center;gap:8px;color:#fff;background:#0a66c2;text-decoration:none;font-size:13px;font-weight:600;padding:10px 16px;border-radius:9px;transition:.2s}
.mm-li:hover{background:#0959aa}
.mm-foot p{color:rgba(255,255,255,.45);font-size:12px;margin-top:12px}
body.menu-open{overflow:hidden}
@media(max-width:900px){
  .nav-links{display:none !important}
  .nav-right .btn-bl{display:none !important}
  .nav-right .btn-out{display:none !important}
  .burger{display:flex !important}
  .nav-logo svg{width:200px !important;height:auto !important}
  nav .nav-inner{height:72px !important;padding:0 16px !important}
  nav.shrunk .nav-inner{height:64px !important}
}
@media(max-width:430px){
  .nav-logo svg{width:185px !important}
}

.mobile-menu nav.mm-links{background:transparent !important;border:none !important;box-shadow:none !important;position:static !important;height:auto !important;backdrop-filter:none !important}
.mobile-menu nav.mm-links a::after{position:static}

/* gallery grid spacing */
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.imgwrap{margin-bottom:0}
@media(max-width:900px){
  .g3{grid-template-columns:1fr !important;gap:20px !important}
  .g3 .imgwrap{margin-bottom:0 !important}
}
@media(max-width:760px){
  .g3{gap:18px !important}
}

/* ---------- SKYSCRAPER BANNERS ---------- */
.skybanner{position:relative;min-height:380px;display:flex;align-items:center;overflow:hidden;background:linear-gradient(135deg,#0c2a1d,#13503a)}
.skybanner .sky-img{position:absolute;inset:0;z-index:0}
.skybanner .sky-img img{width:100%;height:100%;object-fit:cover;object-position:center}
.skybanner .sky-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(8,30,21,.92) 0%,rgba(10,40,28,.82) 45%,rgba(12,53,42,.55) 100%)}
.skybanner .sky-scrim.center{background:linear-gradient(180deg,rgba(8,30,21,.75),rgba(8,30,21,.6))}
.skybanner .wrap{position:relative;z-index:2;width:100%}
.skybanner .lbl{color:#6ee7b7}
.skybanner h2{color:#fff;max-width:620px;text-shadow:0 2px 18px rgba(0,0,0,.5)}
.skybanner p{color:rgba(255,255,255,.92);max-width:560px;font-size:16px;line-height:1.75;text-shadow:0 1px 10px rgba(0,0,0,.5);margin-top:14px}
.skybanner .sky-stats{display:flex;gap:40px;margin-top:30px;flex-wrap:wrap}
.skybanner .sky-stat .n{font-size:34px;font-weight:700;color:#fff;line-height:1;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.skybanner .sky-stat .l{font-size:13px;color:rgba(255,255,255,.8);margin-top:6px}
.skybanner .btn-gr{margin-top:28px}
@media(max-width:760px){
  .skybanner{min-height:320px;padding:48px 0}
  .skybanner .sky-scrim{background:linear-gradient(180deg,rgba(8,30,21,.85),rgba(10,40,28,.78))}
  .skybanner h2{font-size:26px}
  .skybanner .sky-stats{gap:24px}
}

/* ---------- ANIMATED SOFT BACKDROP (for white sections) ---------- */
.softbg{position:relative;overflow:hidden;background:linear-gradient(180deg,#fff,#fbfdfc)}
.softbg>*{position:relative;z-index:1}
.softbg::before{content:"";position:absolute;inset:0;z-index:0;background-image:radial-gradient(rgba(82,157,120,.09) 1px,transparent 1px);background-size:26px 26px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000,transparent);mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000,transparent);animation:gridDrift 40s linear infinite;pointer-events:none}
@keyframes gridDrift{from{background-position:0 0}to{background-position:26px 26px}}
.softbg .blob{position:absolute;border-radius:50%;filter:blur(55px);z-index:0;pointer-events:none;opacity:.8}
.softbg .blob-a{width:420px;height:420px;background:radial-gradient(circle,rgba(82,157,120,.28),transparent 70%);top:-120px;left:-100px;animation:blobFloat 22s ease-in-out infinite}
.softbg .blob-b{width:480px;height:480px;background:radial-gradient(circle,rgba(141,212,176,.26),transparent 70%);bottom:-160px;right:-120px;animation:blobFloat 28s ease-in-out infinite reverse}
.softbg .blob-c{width:300px;height:300px;background:radial-gradient(circle,rgba(110,199,155,.2),transparent 70%);top:40%;left:55%;animation:blobFloat2 32s ease-in-out infinite}
@keyframes blobFloat{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(60px,-40px) scale(1.12)}66%{transform:translate(-40px,30px) scale(.92)}}
@keyframes blobFloat2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-70px,50px) scale(1.15)}}
/* prominent About-style button */
.btn-feat{display:inline-flex;align-items:center;gap:9px;background:linear-gradient(135deg,#529D78,#3a7558);color:#fff !important;padding:15px 32px;font-size:15px;font-weight:600;border-radius:10px;text-decoration:none;position:relative;overflow:hidden;box-shadow:0 8px 24px rgba(82,157,120,.4);transition:transform .25s,box-shadow .25s}
.btn-feat:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(82,157,120,.5)}
.btn-feat svg{transition:transform .25s}
.btn-feat:hover svg{transform:translateX(4px)}
.btn-feat::before{content:"";position:absolute;inset:0;border-radius:10px;box-shadow:0 0 0 0 rgba(82,157,120,.5);animation:featPulse 2.6s infinite}
@keyframes featPulse{0%{box-shadow:0 0 0 0 rgba(82,157,120,.45)}70%{box-shadow:0 0 0 14px rgba(82,157,120,0)}100%{box-shadow:0 0 0 0 rgba(82,157,120,0)}}
.btn-feat::after{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);transform:skewX(-20deg);transition:left .6s}
.btn-feat:hover::after{left:160%}
@media(prefers-reduced-motion:reduce){.softbg::before,.softbg .blob,.btn-feat::before{animation:none}}

/* ---------- HIGHLIGHTED ABOUT US NAV LINK ---------- */
.nav-links a.nav-about{background:var(--green-lt);color:var(--green-dk) !important;font-weight:600;border:1px solid rgba(82,157,120,.3);position:relative}
.nav-links a.nav-about:hover{background:var(--green);color:#fff !important;border-color:var(--green)}
.nav-links a.nav-about::before{content:"";position:absolute;inset:0;border-radius:6px;box-shadow:0 0 0 0 rgba(82,157,120,.4);animation:aboutPulse 2.8s infinite;pointer-events:none}
@keyframes aboutPulse{0%{box-shadow:0 0 0 0 rgba(82,157,120,.35)}70%{box-shadow:0 0 0 8px rgba(82,157,120,0)}100%{box-shadow:0 0 0 0 rgba(82,157,120,0)}}
.nav-links a.nav-about::after{display:none}
/* mobile menu About Us highlight */
.mm-links a.mm-about{background:rgba(141,212,176,.18);color:#fff !important;font-weight:700;border:1px solid rgba(141,212,176,.35)}
.mm-links a.mm-about::after{content:"›";opacity:1 !important;color:#6ee7b7}
@media(prefers-reduced-motion:reduce){.nav-links a.nav-about::before{animation:none}}

/* ---------- STRONGER SOFT BACKDROP ---------- */
.softbg{background:linear-gradient(180deg,#f4faf6,#eef7f1)}
.softbg::before{background-image:radial-gradient(rgba(82,157,120,.14) 1.4px,transparent 1.4px) !important;background-size:24px 24px !important;-webkit-mask-image:radial-gradient(ellipse 80% 75% at 50% 45%,#000,transparent) !important;mask-image:radial-gradient(ellipse 80% 75% at 50% 45%,#000,transparent) !important}
.softbg .blob{filter:blur(50px) !important;opacity:1 !important}
.softbg .blob-a{background:radial-gradient(circle,rgba(82,157,120,.42),transparent 70%) !important;width:460px !important;height:460px !important}
.softbg .blob-b{background:radial-gradient(circle,rgba(141,212,176,.4),transparent 70%) !important;width:520px !important;height:520px !important}
.softbg .blob-c{background:radial-gradient(circle,rgba(110,199,155,.32),transparent 70%) !important;width:340px !important;height:340px !important}
