/* nashco. — Business Central & Finance Systems Consultancy
   Shared stylesheet. Black banner + light body. Cobalt accent. Responsive. */
:root{
  --black:#0b0d12; --black2:#11141b; --cobalt:#1f5fff; --cobalt2:#2b6fff; --indigo:#4f46e5;
  --ink:#0f1620; --body:#39434f; --mut:#5f6c7b; --soft:#f4f7fb; --soft2:#eef3fa; --line:#e6ebf1; --white:#fff;
  --wrap:1180px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:"Inter","Segoe UI",Arial,sans-serif;color:var(--body);background:var(--white);line-height:1.55;-webkit-font-smoothing:antialiased;}
.disp{font-family:"Archivo Black","Arial Black",Arial,sans-serif;font-weight:900;letter-spacing:-1.5px;line-height:1.04;color:var(--ink);}
a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px;}
img{max-width:100%;}

/* ---------- BLACK TOP BANNER ---------- */
.banner{background:var(--black);position:sticky;top:0;z-index:50;}
.nav{display:flex;align-items:center;justify-content:space-between;max-width:var(--wrap);margin:0 auto;padding:18px 28px;}
.brand{display:block;line-height:1;}
.brand .bw{font-family:"Archivo Black","Arial Black",Arial;font-size:23px;letter-spacing:-1px;color:#fff;}
.brand .bw .d{color:var(--cobalt2);}
.brand .brule{height:3px;width:108px;background:var(--cobalt2);margin:5px 0 4px;border-radius:2px;}
.brand .bdesc{font-size:7.5px;letter-spacing:2.3px;text-transform:uppercase;color:#9aa6b6;font-weight:700;}
.menu{display:flex;align-items:center;gap:28px;}
.menu a{color:#cdd6e2;font-size:15px;font-weight:500;transition:color .15s;}
.menu a:hover,.menu a.active{color:#fff;}
.menu a.btn-nav{background:var(--cobalt2);color:#fff;padding:10px 20px;border-radius:8px;font-weight:700;font-size:14px;}
.menu a.btn-nav:hover{background:#3b82f6;}
.hamb,.hamb-cb{display:none;}

/* ---------- BUTTONS ---------- */
.btn{display:inline-block;background:var(--cobalt);color:#fff;padding:15px 28px;border-radius:9px;font-weight:700;font-size:16px;transition:background .15s,transform .1s;}
.btn:hover{background:#2f6dff;}
.btn.ghost{background:#fff;border:1.5px solid #cdd7e3;color:var(--ink);}
.btn.ghost:hover{border-color:var(--cobalt);color:var(--cobalt);}
.btn.dark{background:var(--black);} .btn.dark:hover{background:#1a1f29;}

/* ---------- HERO ---------- */
.hero{background:linear-gradient(180deg,#f7faff,#ffffff 75%);padding:80px 0 70px;}
.hero .ey,.ey{display:inline-block;background:#e9f0ff;color:var(--cobalt);padding:7px 16px;border-radius:30px;font-size:12.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;}
.hero h1{font-size:64px;margin:22px 0 0;max-width:860px;letter-spacing:-2px;}
.hero h1 .c{color:var(--cobalt);}
.hero p{font-size:20px;color:var(--mut);max-width:660px;margin:24px 0 34px;}
.hero .cta-row{display:flex;flex-wrap:wrap;gap:13px;}

/* compact page hero for inner pages */
.phero{background:var(--black);color:#fff;padding:60px 0;}
.phero .ey{background:rgba(43,111,255,.14);color:#7da7ff;}
.phero h1{font-size:50px;color:#fff;margin:18px 0 10px;letter-spacing:-1.5px;}
.phero p{font-size:19px;color:#aeb9c7;max-width:680px;}

/* ---------- STATS STRIP ---------- */
.strip{background:var(--soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.strip .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;padding-top:26px;padding-bottom:26px;}
.strip .stat{text-align:center;flex:1;min-width:140px;}
.strip .stat b{display:block;font-family:"Archivo Black",Arial;font-size:32px;color:var(--ink);letter-spacing:-1px;}
.strip .stat b span{color:var(--cobalt);}
.strip .stat small{font-size:12px;color:#74808f;letter-spacing:.5px;text-transform:uppercase;font-weight:600;}

/* ---------- SECTIONS ---------- */
.sec{padding:72px 0;}
.sec.alt{background:var(--soft);}
.sec h2{font-size:40px;margin:10px 0 10px;letter-spacing:-1px;}
.sec .sub{color:var(--mut);font-size:18px;margin-bottom:36px;max-width:680px;}
.center{text-align:center;} .center .sub{margin-left:auto;margin-right:auto;}

.cards{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px;box-shadow:0 1px 2px rgba(16,30,54,.04);}
.card .num{font-family:"Archivo Black",Arial;color:#cfe0ff;font-size:28px;}
.card h3{font-size:21px;color:var(--ink);margin:6px 0 8px;}
.card p{color:var(--mut);font-size:15px;}
.card ul{margin:12px 0 0 18px;color:var(--mut);font-size:14.5px;} .card li{margin:4px 0;}

/* approach steps */
.steps{display:grid;gap:14px;}
.step{display:grid;grid-template-columns:64px 1fr;gap:20px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px 26px;align-items:start;}
.step .n{font-family:"Archivo Black",Arial;font-size:26px;color:var(--cobalt);}
.step h3{font-size:20px;color:var(--ink);margin-bottom:5px;}
.step p{color:var(--mut);font-size:15px;}

/* about */
.about{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:start;}
.about p{font-size:16px;margin-bottom:14px;color:var(--body);}
.panel{background:var(--soft);border:1px solid var(--line);border-radius:16px;padding:28px;}
.panel h4{font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:var(--cobalt);margin-bottom:12px;}
.panel .li{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line);font-size:14.5px;color:var(--ink);}
.panel .li:last-child{border-bottom:0;} .panel .li span{color:var(--mut);}

/* contact */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:start;}
.field{margin-bottom:14px;} .field label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin-bottom:5px;}
.field input,.field textarea{width:100%;border:1px solid var(--line);border-radius:9px;padding:12px 14px;font:inherit;font-size:15px;color:var(--ink);background:#fff;}
.field textarea{min-height:130px;resize:vertical;}
.cinfo .row{display:flex;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);}
.cinfo .row .k{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--mut);width:90px;font-weight:700;}
.cinfo .row .v{font-size:17px;color:var(--ink);font-weight:600;}

/* ---------- CTA BAND ---------- */
.ctaband{background:linear-gradient(120deg,var(--cobalt),var(--indigo));border-radius:20px;padding:56px;text-align:center;color:#fff;}
.ctaband h2{font-size:38px;color:#fff;letter-spacing:-1px;}
.ctaband p{font-size:18px;color:#dbe6ff;margin:14px 0 26px;}
.ctaband .btn{background:var(--black);}
.ctawrap{padding:0 0 72px;}

/* ---------- DARK FOOTER ---------- */
.foot{background:var(--black);color:#8d99ab;padding:46px 0 30px;}
.foot .top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:30px;padding-bottom:26px;border-bottom:1px solid #1c2330;}
.foot .fcol h5{color:#fff;font-size:13px;letter-spacing:1px;text-transform:uppercase;margin-bottom:12px;}
.foot .fcol a{display:block;color:#9aa6b6;font-size:14.5px;margin:7px 0;}
.foot .fcol a:hover{color:#fff;}
.foot .bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-top:22px;font-size:13px;color:#74808f;}

/* ---------- RESPONSIVE ---------- */
@media(max-width:900px){
  .hero h1{font-size:46px;letter-spacing:-1.2px;}
  .phero h1{font-size:38px;}
  .sec h2{font-size:32px;}
  .cards{grid-template-columns:1fr;}
  .about,.contact{grid-template-columns:1fr;gap:26px;}
  .ctaband{padding:40px 24px;} .ctaband h2{font-size:30px;}
  /* mobile menu via checkbox hack */
  .hamb{display:block;cursor:pointer;width:30px;height:22px;position:relative;}
  .hamb span{position:absolute;left:0;width:100%;height:3px;background:#fff;border-radius:2px;transition:.2s;}
  .hamb span:nth-child(1){top:0;} .hamb span:nth-child(2){top:9px;} .hamb span:nth-child(3){top:18px;}
  .menu{position:absolute;top:100%;left:0;right:0;background:var(--black);flex-direction:column;align-items:flex-start;gap:0;padding:8px 28px 18px;display:none;}
  .menu a{padding:12px 0;width:100%;border-bottom:1px solid #1c2330;font-size:16px;}
  .menu a.btn-nav{margin-top:12px;text-align:center;}
  .hamb-cb:checked ~ .menu{display:flex;}
  .nav{flex-wrap:wrap;}
}
@media(max-width:560px){
  .hero h1{font-size:38px;} .wrap,.nav{padding-left:20px;padding-right:20px;}
  .strip .stat{min-width:45%;}
}