
/* NEXOLLY PREMIUM PLATFORM THEME
   Visual direction: dark, modern, and built around Nexolly's own GREEN
   brand identity -- not a purple/violet skin. (Final Update §7: the
   previous version of this file force-overrode every accent color,
   including the brand's own green declarations, to a low-contrast
   light-purple/violet palette via `!important`, which is exactly the
   "text appears blue/purple and is hard to read" issue being fixed
   here. Every color below has been re-picked for real contrast against
   the dark surfaces this theme uses.)
   Original Nexolly content/assets remain unchanged. */
:root{
 --nx-tm-bg:#050B14; --nx-tm-bg2:#08111D; --nx-tm-surface:#101A2A; --nx-tm-surface2:#142137;
 --nx-tm-border:rgba(255,255,255,.09); --nx-tm-text:#fff; --nx-tm-muted:#A7B0C0;
 /* Brand green (primary accent) -- dark variant for tinted backgrounds,
    a mid green for buttons/gradients, and a brighter green for small
    text sitting directly on a dark surface (needs more lightness than
    the button green to stay readable at body-text sizes). */
 --nx-tm-green-deep:#0A5636; --nx-tm-green:#16A34A; --nx-tm-green-bright:#4ADE80;
 --nx-tm-blue:#2477FF;
}
body{background:var(--nx-tm-bg)!important;color:var(--nx-tm-text)!important;font-size:16px;line-height:1.65}
body a{color:var(--nx-tm-green-bright)} body a:hover{color:#fff}
.site-header,.navbar,.main-header{background:rgba(5,11,20,.88)!important;border-color:var(--nx-tm-border)!important;backdrop-filter:blur(16px)}
.site-header a,.navbar a,.main-header a{color:#EAF0FA!important}
.nav-link:hover,.navbar a:hover{color:#fff!important}
.btn-primary,.btn-primary:focus{background:linear-gradient(135deg,var(--nx-tm-green),#0D9488)!important;border:0!important;color:#fff!important;box-shadow:0 10px 30px rgba(22,163,74,.28)}
.btn-primary:hover{filter:brightness(1.08);transform:translateY(-1px)}
.btn-secondary-cta,.btn-secondary{background:rgba(255,255,255,.06)!important;color:#fff!important;border:1px solid var(--nx-tm-border)!important}
.container,.nx-home{color:inherit}
.nx-home section,.container>h1,.container>h2,.container>h3{color:var(--nx-tm-text)}
.card,.nx-card,.nx-sol-card,.nx-blog-card,.nx-discovery-item,.nx-service-card,.nx-review-card,.form-control,.form-select{background:linear-gradient(145deg,var(--nx-tm-surface),var(--nx-tm-bg2))!important;color:var(--nx-tm-text)!important;border:1px solid var(--nx-tm-border)!important;box-shadow:0 18px 55px rgba(0,0,0,.24)}
.text-muted,.nx-home .head-row p,.nx-blog-card p{color:var(--nx-tm-muted)!important}
.nx-home .see-all,.nx-blog-cat,.nx-blog-readmore{color:var(--nx-tm-green-bright)!important}
.nx-discovery-item i,.nx-sol-price,.nx-sol-cat{color:var(--nx-tm-green-bright)!important}
.nx-sol-cat{background:rgba(22,163,74,.16)!important}
.nx-sol-btn{background:linear-gradient(135deg,var(--nx-tm-green),#0D9488)!important}
.nx-services-band{background:linear-gradient(145deg,#0B1422,#111D31)!important;border:1px solid var(--nx-tm-border)!important}
.nx-hero-new{background:linear-gradient(145deg,#050B14,#0B1B14)!important}
.nx-hero-overlay{background:linear-gradient(135deg,rgba(5,11,20,.72),rgba(8,28,20,.52),rgba(4,14,28,.72))!important}
.nx-hero-new::after{background:radial-gradient(circle at 20% 20%,rgba(22,163,74,.28),transparent 38%),radial-gradient(circle at 85% 75%,rgba(13,148,136,.18),transparent 42%)!important}
.nx-hero-h1{font-size:clamp(38px,7vw,78px)!important;line-height:1.02!important;letter-spacing:-2px!important;text-shadow:0 10px 45px rgba(0,0,0,.38)}
.nx-hero-animated{height:auto!important;min-height:1.2em!important;margin-bottom:22px!important}
.nx-hero-animated-text{font-size:clamp(30px,5.5vw,64px)!important;font-weight:900!important;line-height:1.05!important;background:linear-gradient(90deg,#fff 0%,#6EE7B7 45%,#5EEAD4 100%);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.nx-hero-closing{font-size:clamp(17px,2.2vw,23px)!important;color:#E4EAF4!important}
.nx-problem-box{background:rgba(9,16,28,.78)!important;border:1px solid rgba(255,255,255,.12)!important;backdrop-filter:blur(16px);box-shadow:0 25px 80px rgba(0,0,0,.42)!important}
.nx-problem-textarea,.nx-problem-guest-input{background:#0B1422!important;color:#fff!important;border-color:rgba(255,255,255,.12)!important;font-size:17px!important}
.nx-problem-submit{background:linear-gradient(135deg,var(--nx-tm-green),#0D9488)!important;color:#fff!important}
.nx-service-btn-primary,.nx-service-btn{background:linear-gradient(135deg,var(--nx-tm-green),#0D9488)!important;color:#fff!important}
.site-footer{background:#030810!important;color:#fff!important;border-top:1px solid var(--nx-tm-border)!important}
.site-footer a{color:#AEB8CA!important}.site-footer a:hover{color:#fff!important}
.form-control,.form-select,input,textarea,select{background:#0B1422!important;color:#fff!important;border-color:rgba(255,255,255,.12)!important}
.form-control::placeholder,textarea::placeholder,input::placeholder{color:#748097!important}
.alert{background:rgba(22,163,74,.12)!important;color:#DCFCE7!important;border-color:rgba(22,163,74,.28)!important}

/* ============================================================
   LOGO (Final Update) -- the uploaded Nexolly lockup already
   contains its own wordmark and tagline, so it is used alone,
   never next to a duplicate "Nexolly" text label. Its wordmark is
   dark navy, so on every dark surface it sits on here (header,
   footer, sidebar, mobile nav) it gets a small white backing plate
   for real contrast -- same artwork, just given a light plate to
   sit on, the same way most brand marks get a light chip when
   placed on a dark UI. Height-constrained + width:auto everywhere
   so it scales sharply instead of being squashed into a square.
   ============================================================ */
.nx-logo-img{
    height:34px;width:auto;display:block;
    background:#fff;border-radius:9px;padding:5px 10px;
    box-shadow:0 2px 10px rgba(0,0,0,.18);
}
.nx-logo-img-footer{height:38px;}
.splash-logo-img{height:52px;width:auto;background:#fff;border-radius:12px;padding:8px 16px;margin-bottom:18px;box-shadow:0 8px 28px rgba(0,0,0,.28);}
@media(max-width:767px){
    .nx-logo-img{height:28px;padding:4px 8px;border-radius:8px;}
    .nx-logo-img-footer{height:32px;}
    .splash-logo-img{height:42px;padding:6px 12px;}
}
@media(max-width:767px){
 body{font-size:16px}.nx-home section{margin-top:42px!important}.nx-home .head-row h2{font-size:28px!important}.nx-home .head-row p{font-size:16px!important}
 .nx-hero-new{padding:48px 14px 54px!important}.nx-hero-h1{font-size:34px!important}.nx-hero-animated-text{font-size:32px!important;line-height:1.06!important}.nx-problem-textarea{font-size:17px!important;min-height:120px!important}.nx-sol-title{font-size:18px!important}.nx-blog-card h3{font-size:18px!important}
}

/* Legacy view compatibility: inline styles written against the brand
   greens (#0A5636 dark / #16A34A bright) are already the correct
   brand colors -- left completely alone (no forced remap to a
   different accent, per Final Update §7). Every purple/violet inline
   override that used to exist in this codebase has been replaced at
   the source (see the site-wide color pass in this same update), so
   this file no longer needs an attribute-selector "catch and remap"
   rule at all. */
[style*="#4ADE80"][style*="background"],[style*="#16A34A"][style*="background"],[style*="#4ADE80"][style*="background"]{background:linear-gradient(135deg,#16A34A,#0D9488)!important;color:#fff!important}
