/* NMI Forward — theme and components layered on the NMI Labs AI base system. */
:root{
  --ink:#0f1d26;--ink-2:#1b2d38;--blue:#17455f;--teal:#2b7a80;--lime:#b9d94a;
  --bone:#efebe1;--paper:#f8f5ee;--sand:#e5dece;--muted:#56646c;
  --night:#0b1a22;--night-2:#11252f;--night-rule:rgba(239,235,225,.13);--night-muted:#a7b6bb;
}
.brand-by{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-left:4px;padding-left:12px;border-left:1px solid var(--rule-strong)}
.btn{background:var(--blue);border-color:var(--blue)}
.btn:hover{background:var(--ink);border-color:var(--ink)}
.nav .nav-cta{background:var(--blue)}
.nav .nav-cta:hover{background:var(--ink)}

/* Header sits on the dark hero until the page scrolls */
.hero-dark .site-header:not(.scrolled) .brand,.hero-dark .site-header:not(.scrolled) .nav>a:not(.nav-cta){color:var(--bone)}
.hero-dark .site-header:not(.scrolled) .brand-by{color:var(--night-muted);border-color:var(--night-rule)}
.hero-dark .site-header:not(.scrolled) .nav>a:not(.nav-cta):hover{background:rgba(239,235,225,.08)}
.hero-dark .site-header:not(.scrolled) .nav .nav-cta{background:var(--lime);color:var(--ink)}
.hero-dark .site-header:not(.scrolled) .menu-toggle{color:var(--bone);border-color:var(--night-rule)}
.hero-dark .site-header:not(.scrolled) .brand img{mix-blend-mode:normal;background:#fff;border-radius:9px;padding:3px}
.menu-open.hero-dark .site-header .brand,.menu-open.hero-dark .site-header .nav>a:not(.nav-cta){color:var(--ink)}
.menu-open.hero-dark .site-header .menu-toggle{color:var(--ink);border-color:var(--rule-strong)}

/* Hero */
.fw-hero{position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(90% 70% at 85% 10%,#17455f 0%,rgba(23,69,95,0) 60%),radial-gradient(60% 60% at 0% 100%,rgba(185,217,74,.10),transparent 70%),var(--night);color:var(--bone);padding:clamp(150px,20vh,200px) 0 clamp(80px,10vw,120px)}
.fw-hero .grid-lines{background-image:linear-gradient(rgba(239,235,225,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(239,235,225,.06) 1px,transparent 1px);opacity:1;-webkit-mask-image:radial-gradient(70% 70% at 70% 30%,#000,transparent 80%);mask-image:radial-gradient(70% 70% at 70% 30%,#000,transparent 80%)}
.fw-hero .field-side{-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.25) 40%,#000 85%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.25) 40%,#000 85%)}
.fw-hero h1{color:var(--bone);font-size:clamp(42px,6vw,86px);line-height:1.03;letter-spacing:-.035em;max-width:980px}
.fw-hero h1 .tone{color:var(--lime)}
.fw-hero .eyebrow{color:var(--lime)}
.fw-hero .lede{color:var(--night-muted);margin-top:28px;max-width:660px}
.fw-hero .btn-row{margin-top:36px}
.fw-hero .btn{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.fw-hero .btn:hover{background:var(--bone);border-color:var(--bone)}
.fw-hero .btn.ghost{background:transparent;color:var(--bone);border-color:var(--night-rule)}
.fw-hero .btn.ghost:hover{background:var(--bone);color:var(--ink)}

/* Compare: consulting vs SI vs FDE */
.compare{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.compare .card h3{font-size:22px}
.compare .card.win{background:var(--blue);border-color:var(--blue);color:var(--bone)}
.compare .card.win h3{color:#fff}
.compare .card.win p,.compare .card.win .num{color:#cfdde2}
.compare .card.win .chip{color:var(--lime);border-color:rgba(185,217,74,.4);background:rgba(185,217,74,.08)}
.compare .card .ends{margin-top:auto;padding-top:16px;border-top:1px solid var(--rule);font-size:14px;color:var(--muted)}
.compare .card.win .ends{border-color:rgba(239,235,225,.2);color:var(--bone)}
.compare .card .ends b{font-weight:600;color:inherit}

/* Service rows: badge for secondary */
.index-row .sec{display:inline-block;margin-left:10px;vertical-align:middle;font:500 10.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border:1px solid var(--rule-strong);border-radius:999px;padding:3px 9px}

/* Engagement model: 3x2 */
.steps.six{grid-template-columns:repeat(3,minmax(0,1fr))}
.steps.six>div:nth-child(4){padding-left:0;border-left:0}
.steps.six>div:nth-child(n+4){border-top:1px solid var(--rule);margin-top:6px;padding-top:30px}

/* Clouds & models */
.cloud{display:flex;flex-direction:column;gap:14px}
.cloud .cloud-name{display:flex;align-items:center;gap:12px}
.cloud .cloud-mark{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;font:600 13px var(--mono);color:var(--ink);background:var(--lime)}
.cloud h3{font-size:21px}
.cloud ul{list-style:none;padding:0;margin:4px 0 0;display:flex;flex-wrap:wrap;gap:6px}
.cloud li{font:500 12px var(--mono);letter-spacing:.02em;padding:5px 10px;border-radius:999px;background:rgba(239,235,225,.07);color:var(--bone)}

/* Partners */
.partner-panel{border-radius:24px;padding:clamp(32px,5vw,64px);background:linear-gradient(140deg,#17455f 0%,#0f2f40 100%);color:var(--bone);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);position:relative;overflow:hidden;isolation:isolate}
.partner-panel:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(50% 70% at 100% 0%,rgba(185,217,74,.18),transparent 70%)}
.partner-panel h2{color:#fff}
.partner-panel .eyebrow{color:var(--lime)}
.partner-panel .lede{color:#c9d8dd;margin-top:20px}
.partner-panel .checks{border-color:rgba(239,235,225,.2)}
.partner-panel .checks li{border-color:rgba(239,235,225,.14)}
.partner-panel .checks b{color:#fff}
.partner-panel .checks span span{color:#c9d8dd}
.partner-panel .btn{background:var(--lime);border-color:var(--lime);color:var(--ink);margin-top:30px}
.partner-panel .btn:hover{background:var(--bone);border-color:var(--bone)}
.who{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.who span{font:500 12px var(--mono);letter-spacing:.05em;text-transform:uppercase;padding:7px 12px;border-radius:999px;border:1px solid rgba(239,235,225,.22);color:var(--bone)}

/* Sectors */
.sectors{display:flex;flex-wrap:wrap;gap:10px}
.sectors span{padding:12px 18px;border-radius:999px;background:var(--paper);border:1px solid var(--rule);font-weight:500;font-size:15px;transition:background .25s,color .25s,transform .3s var(--ease)}
.sectors span:hover{background:var(--blue);color:var(--bone);transform:translateY(-2px)}

.cta-panel{background:var(--night)}

@media (max-width:1120px){.brand-by{display:none}}
@media (max-width:980px){
  .partner-panel,.practices{grid-template-columns:1fr}
  .compare{grid-template-columns:1fr}
  .steps.six{grid-template-columns:repeat(2,minmax(0,1fr))}
  .steps.six>div:nth-child(4){padding-left:26px;border-left:1px solid var(--rule)}
  .steps.six>div:nth-child(3),.steps.six>div:nth-child(5){padding-left:0;border-left:0}
  .steps.six>div:nth-child(n+3){border-top:1px solid var(--rule);margin-top:6px;padding-top:30px}
}
@media (max-width:640px){
  .steps.six{grid-template-columns:1fr}
  .steps.six>div,.steps.six>div:nth-child(n){padding:24px 0;border-left:0;border-top:0;margin-top:0;border-bottom:1px solid var(--rule)}
  .fw-hero .btn-row .btn{width:100%;justify-content:center}
}

/* Hero practice index */
.fw-hero h1{max-width:1040px}
.fw-hero .lede{max-width:640px}
.fw-practices{list-style:none;padding:0;margin:64px 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--night-rule)}
.fw-practices li{border-right:1px solid var(--night-rule)}
.fw-practices li:last-child{border-right:0}
.fw-practices a{display:flex;flex-direction:column;gap:10px;padding:22px 22px 4px 0;font-size:16px;font-weight:500;color:var(--bone);transition:color .25s}
.fw-practices li+li a{padding-left:22px}
.fw-practices a span{font:500 12px var(--mono);letter-spacing:.06em;color:var(--lime)}
.fw-practices a:hover{color:var(--lime)}
.fw-practices .sub a span:before{content:"↳ ";color:var(--night-muted)}

/* Practice cards */
.practices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.practice{display:flex;flex-direction:column;gap:16px;padding:clamp(26px,3vw,38px);border-radius:var(--radius);background:var(--paper);border:1px solid var(--rule);scroll-margin-top:96px}
.practice.sub{background:transparent;border:1px dashed var(--rule-strong)}
.p-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px}
.p-num{font:500 13px var(--mono);letter-spacing:.06em;color:var(--blue)}
.practice h3{font-size:clamp(24px,2.2vw,30px)}
.p-tag{flex-basis:100%;font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.practice>p{color:var(--muted);font-size:16px;max-width:520px}
.practice ul{list-style:none;padding:0;margin:4px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px;border-top:1px solid var(--rule)}
.practice li{padding:11px 0 11px 18px;border-bottom:1px solid var(--rule);font-size:14.5px;position:relative;color:var(--ink-2)}
.practice li:before{content:"";position:absolute;left:0;top:19px;width:6px;height:6px;background:var(--lime);transform:rotate(45deg)}
.sectors{margin-top:44px}
@media (max-width:980px){.fw-practices{grid-template-columns:1fr 1fr}.fw-practices li:nth-child(2){border-right:0}.fw-practices li:nth-child(3) a{padding-left:0}.fw-practices li:nth-child(n+3){border-top:1px solid var(--night-rule)}}
@media (max-width:640px){.practice ul{grid-template-columns:1fr}.fw-practices{grid-template-columns:1fr}.fw-practices li{border-right:0;border-top:1px solid var(--night-rule)}.fw-practices li:first-child{border-top:0}.fw-practices li+li a,.fw-practices a{padding:16px 0}.fw-practices a{flex-direction:row;align-items:baseline;gap:14px}}

/* Model line-up */
.models{display:grid;gap:22px;margin-top:28px;padding:26px 28px;border-radius:16px;border:1px solid var(--night-rule);background:rgba(239,235,225,.03)}
.model-group{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.model-group b{flex-basis:100%;font:500 11.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--lime);margin-bottom:4px}
.model-group span{display:inline-flex;align-items:baseline;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid var(--night-rule);font-size:14.5px;font-weight:500;color:var(--bone)}
.model-group em{font-style:normal;font:500 11px var(--mono);letter-spacing:.03em;color:var(--night-muted)}
.model-group+.model-group{padding-top:20px;border-top:1px solid var(--night-rule)}
.models small{color:var(--night-muted);font-size:13.5px;line-height:1.6}