/*!
Theme Name: Business Ninjas Redesign
Theme URI: https://business-ninjas.com/
Description: Business Ninjas redesign child theme (Blocksy). Navy + red brand.
Author: Nuclear Kin Group
Template: blocksy
Version: 1.0.7
Text Domain: bn-redesign
*/

:root{
  --ink:#10222f; --navy:#0b2638; --navy-2:#043145; --deep:#061722; --blue:#24417C;
  --sage:#a0c5c6; --sage-2:#cfe3e3; --sage-50:#eef6f6; --mist:#f5f9fb;
  --red:#c62839; --red-d:#a51f2e; --muted:#566775; --line:#dde7ec; --white:#fff;
  --r:18px; --shadow:0 18px 50px -20px rgba(6,23,34,.35);
  --hfont:"Plus Jakarta Sans", "Inter", system-ui, sans-serif;
  --bfont:"Inter", system-ui, sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;overflow-x:clip;max-width:100%}
body{font-family:var(--bfont);color:var(--ink);background:var(--white);font-size:17px;line-height:1.65;max-width:100%}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1200px;width:100%;margin:0 auto;padding:0 28px;min-width:0}
h1,h2,h3{font-family:var(--hfont);line-height:1.15;letter-spacing:-.02em;color:var(--navy)}
h2{font-size:clamp(26px,4.2vw,42px);font-weight:800}
h3{font-size:21px;font-weight:700}
p+p{margin-top:14px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:700 13px/1 var(--hfont);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.eyebrow:before{content:"";width:26px;height:2px;background:var(--red)}
.lead{font-size:19px;color:var(--muted)}
.btn{display:inline-flex;align-items:center;gap:10px;font:700 16px/1 var(--hfont);padding:17px 24px;border-radius:12px;text-decoration:none;transition:.2s;white-space:nowrap}
.btn svg{width:18px;height:18px}
.btn-red{background:var(--red);color:#fff;box-shadow:0 10px 24px -10px rgba(198,40,57,.7)}
.btn-navy{background:var(--navy);color:#fff}
.btn-sage{background:var(--sage);color:var(--deep)}
.btn-ghost{background:transparent;color:var(--navy);border:2px solid var(--line)}
.btn-white{background:#fff;color:var(--navy)}
.link-arrow{font:700 15px var(--hfont);color:var(--blue);text-decoration:none;display:inline-flex;gap:8px;align-items:center}
.link-arrow:after{content:"→";transition:.2s}
section{padding:96px 0}

/* top strip + header */
.strip{background:var(--deep);color:#cfe3e3;font-size:13.5px}
.strip .wrap{display:flex;justify-content:space-between;align-items:center;height:40px;gap:16px}
.strip b{color:#fff;font-weight:600}
.strip .dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--sage);margin:0 10px 1px}
header.site{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(8px)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;height:84px;gap:12px;flex-wrap:nowrap}
.logo{display:inline-flex;align-items:center;text-decoration:none;min-width:0;flex:0 0 auto;color:inherit}
.logo picture{display:flex;align-items:center;line-height:0}
.logo img{height:48px;width:auto;flex:none;max-width:none}
.logo-word{display:none}
nav.main{flex:1 1 auto;min-width:0;margin:0;padding:0}
nav.main ul{list-style:none;display:flex;gap:2px;align-items:center;justify-content:flex-end;margin:0;padding:0}
nav.main a{white-space:nowrap;text-decoration:none;font:600 14px var(--hfont);color:var(--navy);padding:10px 6px;border-radius:8px}
nav.main a.caret:after{content:"";display:inline-block;margin-left:6px;width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-3px)}
nav.main .sub{display:none}
.hdr-cta{display:flex;gap:10px;align-items:center;flex:0 0 auto}
.hdr-cta .btn{padding:13px 16px;font-size:15px}
.burger{display:none;width:46px;height:46px;border-radius:10px;border:1px solid var(--line);background:#fff;align-items:center;justify-content:center}
.burger span,.burger span:before,.burger span:after{display:block;width:20px;height:2px;background:var(--navy);position:relative}
.burger span:before,.burger span:after{content:"";position:absolute}
.burger span:before{top:-6px}.burger span:after{top:6px}

/* hero */
.hero{position:relative;padding:72px 0 96px;background:
  radial-gradient(900px 500px at 85% 10%, rgba(160,197,198,.35), transparent 60%),
  linear-gradient(180deg,var(--mist),#fff);overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.08fr .92fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(26px,6.2vw,60px);font-weight:800;margin:18px 0 22px}
.hero h1 em{font-style:normal;color:var(--blue);background:linear-gradient(transparent 68%, rgba(160,197,198,.55) 68%)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 30px}
.chip{font:600 13.5px var(--hfont);padding:8px 13px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--navy-2)}
.cta-row{display:flex;flex-wrap:wrap;gap:12px}
.hero-note{margin-top:22px;font-size:14.5px;color:var(--muted);display:flex;gap:18px;flex-wrap:wrap}
.hero-note span{display:inline-flex;align-items:center;gap:7px}
.hero-note span:before{content:"✓";color:#fff;background:var(--navy-2);width:18px;height:18px;border-radius:50%;font-size:11px;display:inline-grid;place-items:center}
.hero-visual{position:relative}
.hero-visual .photo{border-radius:24px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/4.3}
.hero-visual .photo img{width:100%;height:100%;object-fit:cover}
.float{position:absolute;background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:16px 18px}
.float.split{left:-36px;bottom:34px;width:270px}
.float.split .t{font:700 12px var(--hfont);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.float.split .row{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--line);font:600 14.5px var(--hfont);color:var(--navy)}
.float.split .row:first-of-type{border-top:0}
.float.split .row small{display:block;font:500 12.5px var(--bfont);color:var(--muted)}
.ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:none}
.ic svg{width:18px;height:18px}
.ic.n{background:var(--navy);color:#fff}.ic.s{background:var(--sage-2);color:var(--navy-2)}.ic.r{background:#fde8ea;color:var(--red)}
.float.mascot{right:-18px;top:-26px;display:flex;align-items:center;gap:12px;padding:10px 16px 10px 10px}
.float.mascot img{width:52px;height:auto}
.float.mascot b{font:800 15px var(--hfont);color:var(--navy);display:block}
.float.mascot small{font-size:12.5px;color:var(--muted)}

/* services */
.sec-head{max-width:760px;margin-bottom:48px}
.sec-head p{margin-top:16px}
.center{text-align:center;margin-left:auto;margin-right:auto}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:34px 30px;display:flex;flex-direction:column;gap:14px;position:relative;overflow:hidden}
.card .brand{font:800 12px var(--hfont);letter-spacing:.14em;text-transform:uppercase}
.card h3 a{text-decoration:none}
.card p{color:var(--muted);flex:1}
.card .big-ic{width:56px;height:56px;border-radius:16px;display:grid;place-items:center}
.card .big-ic svg{width:28px;height:28px}
.card.books{border-top:5px solid var(--sage)}
.card.books .brand{color:#3d7d80}
.card.tax{border-top:5px solid var(--navy)}
.card.tax .brand{color:var(--navy-2)}
.card.adv{background:var(--navy);border-color:var(--navy);border-top:5px solid var(--red)}
.card.adv h3,.card.adv h3 a{color:#fff}.card.adv p{color:#bcd3d6}.card.adv .brand{color:#f3a2ab}
.card.adv .link-arrow{color:#fff}
.center-cta{text-align:center;margin-top:36px}

/* advisory explainer */
.explain{background:var(--mist)}
.explain .wrap{display:grid;grid-template-columns:.95fr 1.05fr;gap:64px;align-items:start}
.explain .copy p{color:var(--muted)}
.explain .copy h2{margin:14px 0 20px}
.five{display:grid;gap:12px}
.five li{list-style:none;background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 20px;display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:center}
.five .num{width:44px;height:44px;border-radius:12px;background:var(--sage-50);border:1px solid var(--sage-2);display:grid;place-items:center;font:800 16px var(--hfont);color:var(--navy-2)}
.five a{font:700 16.5px var(--hfont);color:var(--navy);text-decoration:none}
.five span{display:block;color:var(--muted);font-size:15px;line-height:1.5}

/* why */
.why .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
.why .copy p{color:var(--muted)}
.why .copy h2{margin-bottom:22px}
.expect{background:var(--navy);color:#fff;border-radius:24px;padding:40px 36px;box-shadow:var(--shadow);position:relative}
.expect h3{color:#fff;font-size:24px;margin-bottom:22px}
.expect ul{list-style:none;display:grid;gap:14px}
.expect li{display:flex;gap:14px;align-items:flex-start;font-size:16.5px;color:#dbe9ea}
.expect li:before{content:"";flex:none;width:24px;height:24px;border-radius:50%;background:var(--sage) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23061722' stroke-width='3'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/14px no-repeat;margin-top:1px}
.examples{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px}
.ex{border-left:3px solid var(--red);padding:4px 0 4px 16px;font-size:15px;color:var(--muted)}
.ex b{display:block;font:700 14px var(--hfont);color:var(--navy);margin-bottom:4px}

/* who */
.who{background:linear-gradient(180deg,#fff,var(--sage-50))}
.who .wrap{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.who .copy p{color:var(--muted)}
.who .copy h2{margin-bottom:20px}
.ind{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ind div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 18px;font:600 15px var(--hfont);color:var(--navy);display:flex;align-items:center;gap:12px}
.ind div i{width:10px;height:10px;border-radius:3px;background:var(--sage);flex:none}
.remote-badge{margin-top:24px;display:inline-flex;align-items:center;gap:12px;background:var(--navy);color:#fff;border-radius:14px;padding:14px 18px;font:600 15px var(--hfont)}
.remote-badge svg{width:22px;height:22px;color:var(--sage)}

/* group */
.group .diagram{display:grid;grid-template-columns:1fr;gap:0;justify-items:center;margin-top:10px}
.node{border-radius:20px;padding:26px 28px;text-align:center;width:100%;max-width:380px}
.node .brand{font:800 22px var(--hfont)}
.node small{display:block;font-size:14.5px;margin-top:6px}
.node.parent{background:var(--navy);color:#fff;display:flex;align-items:center;gap:16px;text-align:left;max-width:460px}
.node.parent img{width:64px}
.node.parent small{color:#bcd3d6}
.branch{width:62%;height:44px;border:2px dashed var(--sage);border-bottom:0;border-radius:16px 16px 0 0;margin-top:24px;position:relative}
.branch:before{content:"";position:absolute;left:50%;top:-26px;height:24px;border-left:2px dashed var(--sage)}
.kids{display:grid;grid-template-columns:1fr 1fr;gap:24px;width:100%;max-width:840px}
.node.kid{background:#fff;border:1px solid var(--line);box-shadow:0 10px 30px -18px rgba(6,23,34,.4);max-width:none}
.node.kid a{text-decoration:none;color:var(--navy)}
.node.kid.b{border-top:5px solid var(--sage)}.node.kid.t{border-top:5px solid var(--navy)}
.node.kid small{color:var(--muted)}
.group .note{max-width:760px;margin:40px auto 0;text-align:center;color:var(--muted)}
.group .note a{color:var(--blue);font-weight:600}

/* stage band */
.stage{background:var(--deep);color:#fff;position:relative;overflow:hidden}
.stage:before{content:"";position:absolute;right:-160px;top:-160px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(160,197,198,.25),transparent 65%)}
.stage .wrap{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;position:relative}
.stage h2{color:#fff}
.stage p{color:#bcd3d6;font-size:18.5px;margin-top:16px}
.quote{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:22px;padding:36px}
.quote .mark{font:800 72px/0.6 var(--hfont);color:var(--red)}
.quote blockquote{font:600 22px/1.5 var(--hfont);color:#fff;margin:14px 0 18px;letter-spacing:-.01em}
.quote cite{font-style:normal;color:var(--sage);font-size:14.5px}
.stars{color:#f5c04a;letter-spacing:3px;font-size:16px}

/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;counter-reset:s}
.step{border:1px solid var(--line);border-radius:var(--r);padding:30px 28px;background:#fff;position:relative}
.step .k{font:800 13px var(--hfont);letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
.step .t{font:800 21px var(--hfont);color:var(--navy);margin:10px 0 8px}
.step p{color:var(--muted);font-size:16px}
.step:not(:last-child):after{content:"→";position:absolute;right:-20px;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:16px;z-index:1}

/* trust */
.trust{background:var(--mist)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:44px 0 36px}
.stat{background:#fff;border-radius:var(--r);padding:34px;text-align:center;border:1px solid var(--line)}
.stat b{display:block;font:800 56px/1 var(--hfont);color:var(--navy);letter-spacing:-.03em}
.stat b sup{color:var(--red);font-size:.55em;vertical-align:.7em}
.stat span{display:block;margin-top:10px;font:600 15px var(--hfont);color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
.svc-links{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.svc-links a{text-decoration:none;font:700 15px var(--hfont);color:var(--navy);background:#fff;border:1px solid var(--line);padding:13px 18px;border-radius:12px}

/* faq */
.faq .wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px}
.faq .side p{color:var(--muted);margin-top:16px}
.qa{border-bottom:1px solid var(--line);padding:24px 0}
.qa:first-child{border-top:1px solid var(--line)}
.qa h3{display:flex;justify-content:space-between;gap:20px;font-size:19.5px}
.qa h3:after{content:"–";color:var(--red);font-weight:800}
.qa.closed h3:after{content:"+"}
.qa p{color:var(--muted);margin-top:10px;font-size:16.5px}
.qa.closed p{display:none}

/* contact band */
.cta-band{padding:0 0 96px}
.cta-box{background:linear-gradient(120deg,var(--navy) 0%,var(--navy-2) 100%);border-radius:28px;padding:56px;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;color:#fff;position:relative;overflow:hidden}
.cta-box img.m{position:absolute;right:28px;bottom:-30px;width:150px;opacity:.12}
.cta-box .h{font:800 36px/1.15 var(--hfont);letter-spacing:-.02em}
.cta-box p{color:#bcd3d6;margin-top:12px}
.contact-cards{display:grid;gap:14px;position:relative}
.cc{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:16px;padding:18px 20px;display:flex;gap:16px;align-items:center;text-decoration:none}
.cc small{display:block;color:var(--sage);font:700 12px var(--hfont);letter-spacing:.12em;text-transform:uppercase}
.cc b{font:800 21px var(--hfont);color:#fff}

/* footer */
footer{background:var(--deep);color:#9fb6bd;font-size:15px;padding:64px 0 28px}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
footer .flogo{display:inline-flex;align-items:center;max-width:100%;background:transparent;padding:0;border-radius:0;text-decoration:none}
footer .flogo img{height:52px;width:auto;flex:none;max-width:100%}
footer ul,footer li{padding-left:0;margin-left:0;list-style:none}
footer .fh{font:800 14px var(--hfont);letter-spacing:.12em;text-transform:uppercase;color:#fff;margin-bottom:16px}
footer ul{list-style:none;display:grid;gap:10px}
footer a{text-decoration:none;color:#cfe3e3}
footer .tag{font:800 18px var(--hfont);color:#fff;margin:18px 0 8px}
.fbot{border-top:1px solid rgba(255,255,255,.1);margin-top:48px;padding-top:22px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13.5px}


/* responsive */
@media (max-width:1199px){
  nav.main{display:none}.burger{display:flex}
  .hdr-cta .btn-ghost{display:none}
}
.cta-box,.cc,.fgrid,.card,.expect,.quote,.hero .wrap,footer .wrap{min-width:0;max-width:100%}
.cc b,.cta-box .h,footer a{overflow-wrap:anywhere;word-break:break-word}
@media (max-width:900px){
  body{font-size:16px}
  section{padding:64px 0}
  .wrap{padding:0 16px}
  .strip .wrap{justify-content:center;height:36px;font-size:12.5px}
  .strip .r{display:none}
  .strip .l{white-space:nowrap}
  .eyebrow{font-size:11.5px;letter-spacing:.12em}
  header.site .wrap{height:64px;gap:10px}
  .logo img{height:48px}
  .hdr-cta .btn-red{padding:11px 14px;font-size:14px}
  .hero{padding:40px 0 64px}
  .hero .wrap,.explain .wrap,.why .wrap,.who .wrap,.stage .wrap,.faq .wrap,.cta-box{grid-template-columns:1fr;gap:36px}
  .hero h1{font-size:clamp(26px,7.4vw,36px)}
  .cta-row .btn{flex:1 1 100%;justify-content:center;white-space:normal}
  .hero-visual .photo{aspect-ratio:4/3.2}
  .float.split{position:relative;left:auto;bottom:auto;width:auto;max-width:100%;margin:-46px 0 0}
  .float.mascot{right:10px;top:-18px}
  .cards3,.steps,.stats,.kids,.examples{grid-template-columns:1fr}
  .step:not(:last-child):after{right:50%;top:auto;bottom:-25px;transform:translateX(50%) rotate(90deg)}
  .stats{grid-template-columns:repeat(3,1fr);gap:8px}.stat{padding:18px 6px}.stat b{font-size:clamp(22px,7vw,30px)}.stat span{font-size:11px;letter-spacing:.06em}
  .ind{grid-template-columns:1fr 1fr}
  .branch{width:50%}
  .cta-box{padding:24px 16px;width:100%;max-width:100%}
  .cta-box .h{font-size:clamp(22px,6.4vw,28px)}
  .cc{padding:14px;gap:12px;max-width:100%}
  .cc b{font-size:clamp(15px,4.4vw,18px)}
  .fgrid{grid-template-columns:1fr;gap:28px}
  .fgrid > div:first-child{grid-column:auto}
  footer ul,footer li{padding-left:0;margin-left:0}
  footer .flogo img{height:44px}
  .quote{padding:26px}.quote blockquote{font-size:clamp(16px,4.6vw,19px)}
}
/* compact red pill with number between logo and burger at 360–599px */
@media (max-width:599px){
  header.site .wrap{padding:0 10px;height:56px;gap:8px}
  .strip .wrap{padding:0 10px}
  .logo{min-width:0;flex:0 0 auto}
  .logo img{height:40px}
  .hdr-cta{gap:6px;flex:none}
  .hdr-cta .hdr-phone{
    display:inline-flex;
    width:auto;
    height:36px;
    padding:0 10px;
    justify-content:center;
    align-items:center;
    border-radius:999px;
    flex:none;
    gap:6px;
    font-size:14px;
    line-height:1;
    white-space:nowrap;
  }
  .hdr-cta .hdr-phone span{display:inline;font-size:14px;line-height:1;white-space:nowrap;letter-spacing:0}
  .hdr-cta .hdr-phone svg{width:15px;height:15px;flex:none}
  .burger{width:36px;height:36px;flex:none}
}
@media (max-width:379px){
  header.site .wrap{padding:0 10px;gap:8px}
}

/* posts-page (News) title, because the child header replaces the Blocksy hero */
.bn-archive-hero{padding:28px 0 8px;background:var(--mist);border-bottom:1px solid var(--line)}
.bn-archive-hero .page-title{font:800 clamp(28px,5vw,42px)/1.15 var(--hfont);color:var(--navy);letter-spacing:-.02em}

/* staging banner (not part of the design) */
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:16px;top:16px;z-index:100;background:#fff;padding:8px 12px;border-radius:8px}
.staging-flag{background:repeating-linear-gradient(45deg,#c62839 0 14px,#b8232f 14px 28px);color:#fff;font:700 11.5px/26px var(--hfont);text-align:center;letter-spacing:.14em}
@media (max-width:900px){.staging-flag{font-size:10.5px;letter-spacing:.12em}}

/* dropdown (missing from the static mockup) */
nav.main li{position:relative}
nav.main .sub{display:none;position:absolute;top:calc(100% - 4px);left:0;min-width:280px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px;box-shadow:var(--shadow);z-index:30}
nav.main .sub a{display:block;padding:8px 12px;white-space:normal}
nav.main li:hover > .sub, nav.main li:focus-within > .sub, nav.main li.open > .sub{display:block}

/* mobile drawer */
@media (max-width:1199px){
  nav.main{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow);padding:12px 20px 20px}
  nav.main.is-open{display:block}
  nav.main ul{flex-direction:column;align-items:stretch;gap:0}
  nav.main a{display:block;padding:12px 8px}
  nav.main .sub{position:static;box-shadow:none;border:0;padding:0 0 0 14px;min-width:0;display:none}
  nav.main li.open > .sub{display:block}
}

/* inner pages: keep Elementor full-width, apply typography only */
body.bn-redesign:not(.home){font-family:var(--bfont);color:var(--ink)}
body.bn-redesign:not(.home) main#main{background:#fff}