@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&display=swap');
.commercial{--font-heading:'Space Grotesk',var(--font-body);background:radial-gradient(ellipse at 85% 8%,#16514f35,transparent 35%),#080f1d}.commercial .hero{grid-template-columns:1fr 1.15fr;gap:44px;align-items:center;padding-block:88px}.commercial .hero h1{font-size:clamp(52px,5.8vw,82px);font-weight:700;letter-spacing:-.055em;line-height:1.06}.commercial .hero h1 span{background:linear-gradient(100deg,#73e4e0,#b1d9ed);background-clip:text}.commercial .hero-text{font-size:17px;line-height:1.75;max-width:450px}.commercial .eyebrow{font-size:11px;letter-spacing:1.3px}.commercial .hero-note{font-size:10px;flex-wrap:wrap;gap:12px}.commercial h2{font-weight:700;letter-spacing:-.045em}.commercial h3{font-weight:700}.commercial .header{background:#080f1de8;backdrop-filter:blur(16px)}.commercial .header nav{gap:22px}.commercial .primary{font-weight:700;box-shadow:0 4px 24px #5ce1dd18}.pulse-preview{min-width:0;border:1px solid #355265;border-radius:18px;background:#101d2e;overflow:hidden;box-shadow:0 26px 80px #0006;animation:nm-panel .7s ease-out both}.preview-top,.preview-caption,.preview-bottom{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;gap:12px}.preview-brand{display:flex;align-items:center;gap:8px;font-size:17px;font-weight:600}.preview-brand b{color:#73e4e0}.preview-state{font:9px var(--font-mono);color:#90dedb;padding:6px 9px;border:1px solid #3b6766;border-radius:5px}.preview-caption{padding-block:12px;border-block:1px solid #273a4d;font-size:11px;color:#acbcd0}.preview-caption a{color:#8ee8e5}.preview-window{height:330px;position:relative;background:#091422;overflow:hidden}.preview-window iframe{width:1250px;height:900px;border:0;transform:scale(.48);transform-origin:top left;pointer-events:none}.preview-window img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}.preview-cover{position:absolute;inset:0}.preview-cover:focus-visible{outline:3px solid #73e4e0;outline-offset:-4px}.preview-bottom{justify-content:flex-start;font-size:11px;color:#a5b7cc;padding-block:16px}.preview-bottom .live-dot{flex-shrink:0;animation:nm-status 3s ease-in-out infinite}.commercial .service{border-radius:16px;padding:32px;background:linear-gradient(145deg,#142338,#0f1b2b)}.commercial .service-icon{font:32px var(--font-heading);color:#73e4e0}.commercial .service-number{font-size:11px;color:#a1b9cb}.commercial .service h3{font-size:24px}.commercial .service li{font-size:14px}.commercial .pulse-service{border-color:#4b9794;box-shadow:inset 0 1px #73e4e020}.pulse-section{border-top:1px solid #263747}.pulse-features{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.pulse-features article{padding:28px;border:1px solid #2b4155;border-radius:14px;background:#112033}.feature-symbol{font:30px var(--font-heading);color:#73e4e0}.pulse-features h3{margin:18px 0 10px;font-size:21px}.pulse-features p,.case-proof p{font-size:14px;line-height:1.8;color:#afbdd0}.pulse-cta{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:32px}.pulse-cta>span{font-size:11px;color:#93a6bc;flex-basis:100%}.case-proof{border-left:2px solid #73e4e0;padding:12px 0 12px 22px;margin:24px 0}.case-proof>span{font:10px var(--font-mono);color:#73e4e0;letter-spacing:1px}.case-proof a{font-size:13px;color:#a1efec}.commercial .capabilities{flex-wrap:wrap;gap:24px}.commercial .work-section{align-items:start}.commercial .service a,.commercial .project-card{transition:transform .2s,border-color .2s}.commercial .service a:hover{color:#a1efec}.commercial a:focus-visible{outline:2px solid #73e4e0;outline-offset:5px}.commercial .section-head>p{font-size:16px;line-height:1.8}@keyframes nm-status{50%{box-shadow:0 0 12px #73e4e055,0 0 0 5px #73e4e012}}
@media(max-width:1050px){.commercial .header nav{gap:12px}.commercial .hero{gap:25px}.preview-brand{font-size:14px}.preview-top{padding:16px}.preview-window{height:280px}.preview-window iframe{transform:scale(.38)}.commercial .service{padding:24px}.commercial .hero-note{gap:8px}}
@media(max-width:760px){.commercial .hero{grid-template-columns:1fr;padding-block:42px;gap:36px}.commercial .hero h1{font-size:clamp(44px,11vw,68px)}.commercial .hero-text{font-size:16px}.commercial .eyebrow{font-size:9px}.commercial .hero .actions{flex-wrap:wrap;gap:20px}.pulse-features{grid-template-columns:1fr;gap:14px}.pulse-features article{padding:24px}.preview-window{height:260px}.preview-caption{font-size:10px;padding-inline:16px}.preview-bottom{font-size:10px;padding-inline:16px}.preview-state{font-size:8px}.commercial .capabilities{gap:16px}.commercial .capabilities p{flex-basis:100%}.commercial .section-head>p{font-size:15px}.pulse-cta{gap:20px}}
@media(prefers-reduced-motion:reduce){.pulse-preview,.preview-bottom .live-dot{animation:none}.commercial .service a,.commercial .project-card{transition:none}}
.commercial .button.primary{background:#73e4e0;color:#082524}.commercial .button.primary:hover{background:#a1efec}.feature-symbol svg,.service-icon svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.commercial .pulse-features article{transition:transform .2s,border-color .2s}@media(hover:hover){.commercial .pulse-features article:hover{transform:translateY(-3px);border-color:#4b9794}}@media(max-width:760px){.preview-window{height:auto;aspect-ratio:1265/792}.preview-window img{height:auto;object-fit:contain}}@media(prefers-reduced-motion:reduce){.commercial .pulse-features article{transition:none}.commercial .pulse-features article:hover{transform:none}}
/* Strong typography across the commercial homepage. */
.commercial{font-weight:500}.commercial h1,.commercial h2,.commercial h3{font-weight:700}.commercial .hero-text,.commercial .section-head>p,.commercial .service p,.commercial .service li,.commercial .work-copy>p:not(.eyebrow),.commercial .contact-section p,.commercial .faq p,.commercial .pulse-features p,.commercial .case-proof p{font-weight:500;color:#bac9da}.commercial .button,.commercial .nav-cta{font-weight:700}.commercial .header nav a,.commercial .text-link,.commercial .service a,.commercial .form-card label{font-weight:600}.commercial .eyebrow,.commercial .hero-note,.commercial .service-number,.commercial .case-proof>span{font-weight:500}.commercial .hero-note{font-size:11px;color:#b5c8d8}.commercial .preview-caption,.commercial .preview-bottom,.commercial .pulse-cta>span,.commercial .scope-note{font-size:12px;color:#b1c3d5}.commercial .preview-state{font-size:10px}.commercial .form-footnote{font-size:12px;line-height:1.75}@media(max-width:760px){.commercial .hero-note{font-size:10px}.commercial .preview-caption,.commercial .preview-bottom{font-size:11px}.commercial .preview-state{font-size:9px}}
/* Decorative rack pulse matching the Pulse dashboard; not a server status indicator. */
.commercial .brand-logo,.commercial .preview-brand>img{border-radius:11px;animation:nm-rack-pulse 2.8s ease-in-out infinite;will-change:box-shadow}.commercial .preview-brand>img{border-radius:8px}@keyframes nm-rack-pulse{0%,100%{box-shadow:0 0 0 0 #5ce1dd00,0 0 7px #5ce1dd16;filter:brightness(1)}50%{box-shadow:0 0 0 5px #5ce1dd0c,0 0 20px #5ce1dd45;filter:brightness(1.12)}}@media(prefers-reduced-motion:reduce){.commercial .brand-logo,.commercial .preview-brand>img{animation:none;will-change:auto}}
.commercial footer .brand-logo{width:32px;height:32px;border-radius:8px;animation:nm-footer-rack 2.8s ease-in-out infinite;filter:none;will-change:auto}.commercial footer .brand:hover .brand-logo{transform:none;border-radius:8px}@keyframes nm-footer-rack{0%,100%{box-shadow:0 0 5px #5ce1dd10}50%{box-shadow:0 0 10px #5ce1dd28}}@media(prefers-reduced-motion:reduce){.commercial footer .brand-logo{animation:none}}
.commercial .capabilities{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:32px 0;margin-inline:6%;background:transparent;border:0}.commercial .capabilities:before{content:'';position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,#50898745,transparent)}.commercial .capabilities p{max-width:220px;font-size:14px;line-height:1.6;color:#adc3d5}.commercial .capabilities>span{position:relative;display:flex;align-items:center;gap:12px;font:500 11px var(--font-mono);letter-spacing:1.3px;color:#a9dedc;padding:12px 0;background:none;border:0}.commercial .capabilities>span:before{content:'◇';display:grid;place-items:center;color:#73e4e0;font-size:23px;width:32px;height:32px;background:radial-gradient(circle,#73e4e014,transparent 72%)}.commercial .capabilities>span:nth-of-type(2):before{content:'◎'}.commercial .capabilities>span:nth-of-type(3):before{content:'⌁';font-size:30px}.commercial .capabilities>span:nth-of-type(4):before{content:'↻'}.commercial .capabilities>span:not(:last-child):after{content:'';position:absolute;left:calc(100% + 20px);width:clamp(16px,3vw,45px);height:1px;background:linear-gradient(90deg,#73e4e050,transparent)}@media(max-width:1050px){.commercial .capabilities{gap:12px}.commercial .capabilities>span:not(:last-child):after{display:none}.commercial .capabilities>span{font-size:10px;gap:6px}}@media(max-width:760px){.commercial .capabilities{display:grid;grid-template-columns:1fr 1fr;gap:8px 24px;padding-block:26px}.commercial .capabilities p{grid-column:1/-1;max-width:none;margin-bottom:8px}.commercial .capabilities>span{font-size:11px;gap:12px;padding:6px 0}}
/* Keep the caption and service flow on one visual axis. */
.commercial .capabilities{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 32px;max-width:1120px;width:88%;margin:0 auto;padding:26px 0 32px;box-sizing:border-box}.commercial .capabilities p{grid-column:1/-1;max-width:none;margin:0 0 4px;text-align:center;font-size:13px;color:#9eb6c9}.commercial .capabilities>span{justify-content:center;margin:0;padding:8px 0;min-width:0}.commercial .capabilities>span:not(:last-child):after{left:calc(100% - 8px);width:48px;background:linear-gradient(90deg,transparent,#73e4e040,transparent)}@media(max-width:1050px){.commercial .capabilities{gap:14px 16px}.commercial .capabilities>span:not(:last-child):after{display:none}}@media(max-width:760px){.commercial .capabilities{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 20px;padding:24px 0}.commercial .capabilities p{margin-bottom:8px}.commercial .capabilities>span{justify-content:flex-start}}
/* Atmospheric transitions for the portfolio and enquiry sections. */
.commercial .work-section,.commercial .contact-section{position:relative;isolation:isolate;background:transparent;border:0;overflow:hidden}
.commercial .work-section:before,.commercial .contact-section:before{content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(ellipse at 78% 40%,#27898624,transparent 58%),radial-gradient(ellipse at 14% 72%,#253f6f21,transparent 55%);mask-image:linear-gradient(transparent,#000 18%,#000 80%,transparent)}
.commercial .work-section:after{content:'';position:absolute;z-index:-1;pointer-events:none;width:780px;height:780px;right:-260px;top:0;border:1px solid #7adad70b;border-radius:50%;box-shadow:0 0 0 85px #7adad703,0 0 0 170px #7adad702;transform:rotate(-18deg) scaleY(.65)}
.commercial .contact-section{border-radius:36px;margin-block:24px 50px}
.commercial .contact-section:before{background:radial-gradient(ellipse at 12% 38%,#3399962a,transparent 52%),radial-gradient(ellipse at 95% 65%,#53518d20,transparent 54%);mask-image:linear-gradient(transparent,#000 15%,#000 85%,transparent)}
.commercial .contact-section:after{content:'';position:absolute;z-index:-1;pointer-events:none;left:6%;right:6%;top:0;height:1px;background:linear-gradient(90deg,transparent,#72deda22,transparent)}
.commercial .community-projects{gap:22px;padding-top:10px}
.commercial .community-projects .project-card{border-radius:24px;background:linear-gradient(125deg,#142739dc,#183345a6);border-color:#75afad30;box-shadow:0 18px 46px #00000020,inset 0 1px #c8fefc08}
.commercial .community-projects .hytale-project{background:linear-gradient(125deg,#19253bdc,#34304ba6);border-color:#aaa0dc2b}
.commercial .project-card:after{right:-100px;top:45px;width:220px;height:220px;border-color:#82e9e614;box-shadow:0 0 0 38px #73e4e004,0 0 0 76px #73e4e003}
.commercial .case-proof{border-left:1px solid #73e4e070;background:linear-gradient(90deg,#73e4e006,transparent);border-radius:0 18px 18px 0;padding-block:18px}
.commercial .contact-section .form-card{border-radius:24px;background:linear-gradient(140deg,#152637eb,#0d192aef);border:1px solid #839fac35;box-shadow:0 24px 60px #00000030,inset 0 1px #c8fefc0a}
.commercial .form-card input,.commercial .form-card select,.commercial .form-card textarea{border-radius:9px;background:#09152380;border-color:#7d9dae30}
.commercial .contact-note{border-image:linear-gradient(90deg,#73e4e045,transparent) 1}
@media(max-width:760px){.commercial .work-section:after{width:480px;height:480px;right:-300px;top:35%}.commercial .contact-section{border-radius:0;margin-block:10px 30px}.commercial .community-projects .project-card,.commercial .contact-section .form-card{border-radius:20px}}
/* Warm NetMesra brand accents. */
.commercial{--orange:#45fff9;--green:#45fff9;background:radial-gradient(ellipse at 85% 8%,#29797625,transparent 35%),#080f1d}
.commercial .button.primary{background:#45fff9;color:#0b201f;box-shadow:0 6px 28px #45fff918}.commercial .button.primary:hover{background:#7dfffb}
.commercial .hero h1 span{background:linear-gradient(100deg,#45fff9,#a6f5f2);background-clip:text;-webkit-text-fill-color:transparent}
.commercial .brand-dot,.commercial .contact-section h2>span{color:#45fff9}
.commercial .work-section:before{background:radial-gradient(ellipse at 78% 40%,#35a6a220,transparent 58%),radial-gradient(ellipse at 14% 72%,#253f6f21,transparent 55%)}
.commercial .contact-section:before{background:radial-gradient(ellipse at 12% 38%,#30b5b125,transparent 52%),radial-gradient(ellipse at 95% 65%,#53518d20,transparent 54%)}
.commercial .preview-brand b,.commercial .preview-caption a,.commercial .case-proof a,.commercial .contact-direct a{color:#7ffffb}
.nm-chat .nm-chat-status.online:before{background:#6adeaa}
.nm-chat-launch{font-size:13px;font-weight:700}

.commercial .button.primary{background:#45fff9;color:#0c2120}.commercial .button.primary:hover{background:#6ffffa}.commercial .hero h1 span{background:linear-gradient(100deg,#45fff9,#9efffc);background-clip:text;-webkit-text-fill-color:transparent}.commercial .brand-dot,.commercial .contact-section h2>span,.commercial .service-icon,.commercial .feature-symbol,.commercial .capabilities>span:before{color:#45fff9}

/* Refined cyan identity with soft atmospheric depth. */
.commercial{--orange:#73e4df;--green:#73e4df;background:radial-gradient(ellipse at 85% 8%,#16415125,transparent 35%),#080f1d}.commercial .button.primary{background:#73e4df;color:#081c25;box-shadow:0 6px 28px #73e4df14}.commercial .button.primary:hover{background:#a1efe9}.commercial .hero h1 span{background:linear-gradient(100deg,#73e4df,#b1d9ed);background-clip:text;-webkit-text-fill-color:transparent}.commercial .brand-dot,.commercial .contact-section h2>span,.commercial .service-icon,.commercial .feature-symbol,.commercial .capabilities>span:before{color:#73e4df}.commercial .work-section:before{background:radial-gradient(ellipse at 78% 40%,#277c8924,transparent 58%),radial-gradient(ellipse at 14% 72%,#253f6f21,transparent 55%)}.commercial .contact-section:before{background:radial-gradient(ellipse at 12% 38%,#338e992a,transparent 52%),radial-gradient(ellipse at 95% 65%,#53518d20,transparent 54%)}