/* ============================================================
   NextGen Industry Personalization — Styles (Website 2.0, light)
   Brand only: Navy #001B5A · Blue #2563EB · Ink #0f1b34 · Muted #5b6b88
   · Light #F2F4F7 · White. Montserrat (loaded site-wide).
   Re-themed for the 2.0 light page system: renders as a light section
   (soft gray band + white card) directly after the navy hero, so the
   interactive tool recedes and the page keeps the homepage rhythm.
   ============================================================ */
.ngp-section{
  --ngp-navy:#001B5A; --ngp-blue:#2563EB; --ngp-blue-dk:#1d4fd7;
  --ngp-ink:#0f1b34; --ngp-muted:#5b6b88; --ngp-light:#F2F4F7; --ngp-white:#fff;
  padding:54px 0; background:var(--ngp-light);
}
.ngp-wrap{
  max-width:1100px; margin:0 auto; padding:34px 32px;
  background:#fff;
  border:1px solid #e6eaf1;
  border-radius:18px;
  box-shadow:0 18px 40px -28px rgba(4,21,43,.30);
  font-family:'Montserrat',system-ui,sans-serif;
}
@media (max-width:560px){ .ngp-wrap{ padding:24px 18px; } .ngp-section{ padding:38px 0; } }

.ngp-eyebrow{
  display:inline-block; text-transform:uppercase; letter-spacing:.18em;
  font-size:.7rem; font-weight:700; color:var(--ngp-blue); margin-bottom:10px;
}
.ngp-title{ margin:0 0 8px; font-size:1.55rem; font-weight:700; color:var(--ngp-navy); line-height:1.2; }
.ngp-sub{ margin:0 0 24px; font-size:.95rem; color:var(--ngp-muted); max-width:60ch; }

/* Controls: clean dropdowns */
.ngp-controls{
  display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:20px;
}
@media (max-width:900px){ .ngp-controls{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .ngp-controls{ grid-template-columns:1fr; } }

.ngp-field{ display:flex; flex-direction:column; gap:7px; }
.ngp-label{ font-size:.72rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--ngp-muted); }
.ngp-select{
  appearance:none; -webkit-appearance:none;
  font-family:inherit; font-size:.9rem; font-weight:500; color:var(--ngp-ink);
  background:#fff
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'><path d='M2 4l4 4 4-4' fill='none' stroke='%235b6b88' stroke-width='1.6'/></svg>")
    no-repeat right 12px center;
  border:1px solid #d6deea; border-radius:10px;
  padding:11px 34px 11px 13px; cursor:pointer; transition:border-color .15s, box-shadow .15s;
}
.ngp-select:focus{ outline:none; border-color:var(--ngp-blue); box-shadow:0 0 0 3px rgba(37,99,235,.2); }
.ngp-select option{ color:#0f1b33; background:#fff; }
/* Locked Industry select on industry pages (preselected, not changeable) */
.ngp-select:disabled{ opacity:1; cursor:default; color:var(--ngp-muted); background-color:#f2f4f7; }

.ngp-update{
  display:inline-flex; align-items:center; gap:8px;
  font-family:inherit; font-weight:600; font-size:.92rem; color:#fff; cursor:pointer;
  background:var(--ngp-blue); border:0; border-radius:10px; padding:12px 22px;
  box-shadow:0 8px 22px -8px rgba(37,99,235,.7); transition:background .15s, transform .15s;
}
.ngp-update:hover{ background:var(--ngp-blue-dk); transform:translateY(-1px); }

/* Output */
.ngp-output{ margin-top:26px; animation:ngp-fade .32s ease both; }
@keyframes ngp-fade{ from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:translateY(0);} }
.ngp-out-head{ margin-bottom:18px; padding-top:22px; border-top:1px solid #e6eaf1; }
.ngp-summary{ margin:6px 0 0; font-size:.86rem; font-weight:600; color:var(--ngp-navy); }

.ngp-out-grid{ display:grid; grid-template-columns:1.15fr .85fr .85fr; gap:16px; }
@media (max-width:860px){ .ngp-out-grid{ grid-template-columns:1fr; } }

.ngp-card{
  background:#f7f9fc; border:1px solid #e6eaf1;
  border-radius:13px; padding:18px 18px 16px;
}
.ngp-card h4{ margin:0 0 13px; font-size:.92rem; font-weight:700; color:var(--ngp-navy); }

.ngp-list{ list-style:none; margin:0; padding:0; }
.ngp-list li{ display:flex; gap:9px; align-items:flex-start; margin-bottom:11px; font-size:.86rem; line-height:1.45; color:#3a4a68; }
.ngp-list li:last-child{ margin-bottom:0; }
.ngp-tick{ flex:0 0 18px; width:18px; height:18px; border-radius:5px; margin-top:1px;
  background:rgba(37,99,235,.12); border:1px solid rgba(37,99,235,.35); color:var(--ngp-blue);
  display:flex; align-items:center; justify-content:center; font-size:.68rem; font-weight:700; }

.ngp-pills{ display:flex; flex-wrap:wrap; gap:8px; }
.ngp-pill{
  font-size:.8rem; font-weight:600; color:var(--ngp-blue-dk);
  background:rgba(37,99,235,.10); border:1px solid rgba(37,99,235,.28);
  padding:7px 12px; border-radius:999px; line-height:1.2;
}

/* CTA block */
.ngp-cta-block{ margin-top:22px; padding-top:20px; border-top:1px solid #e6eaf1; }
.ngp-prompt{ margin:0 0 14px; font-size:.92rem; line-height:1.55; color:var(--ngp-muted); max-width:72ch; }
.ngp-want{ margin:0 0 10px; font-size:.95rem; font-weight:700; color:var(--ngp-navy); }
.ngp-cta{
  display:inline-flex; align-items:center; gap:8px; text-decoration:none;
  font-weight:600; font-size:.92rem; color:#fff;
  background:var(--ngp-blue); border-radius:10px; padding:12px 22px;
  box-shadow:0 8px 22px -8px rgba(37,99,235,.7); transition:background .15s, transform .15s;
}
.ngp-cta:hover{ background:var(--ngp-blue-dk); transform:translateY(-1px); }

@media (prefers-reduced-motion: reduce){
  .ngp-output{ animation:none; }
  .ngp-update,.ngp-cta{ transition:none; }
  .ngp-output [style*="scroll"]{ scroll-behavior:auto; }
}