/* NTS Instant Estimator — scoped styles (nts- prefix, safe inside Elementor popups).
   Brand tokens sampled from ntsecurityllc.com: Poppins, navy #2e486a, blue #467ff7, cyan #c8f3ff. */

#nts-estimator-root {
	--nts-navy: #2e486a;
	--nts-navy-deep: #22395a;
	--nts-blue: #467ff7;
	--nts-blue-dark: #2f63d8;
	--nts-cyan: #c8f3ff;
	--nts-ink: #2e486a;
	--nts-body: #5a6b80;
	--nts-line: #e3eaf3;
	--nts-good: #15a866;
	font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	color: var(--nts-body);
	line-height: 1.55;
	font-size: 16px;
	-webkit-font-smoothing: antialiased;
}
#nts-estimator-root *, #nts-estimator-root *::before, #nts-estimator-root *::after { box-sizing: border-box; }
#nts-estimator-root h1, #nts-estimator-root h2, #nts-estimator-root p { margin: 0; padding: 0; }
/* theme-bleed guards for headings/text inside the widget */
#nts-estimator-root .nts-step h2 { color: var(--nts-navy) !important; text-transform: none !important; letter-spacing: normal !important; }
#nts-estimator-root .nts-head h1 { color: #fff !important; text-transform: none !important; letter-spacing: normal !important; }
#nts-estimator-root .nts-center h2 { color: var(--nts-navy) !important; }
#nts-estimator-root .nts-field input, #nts-estimator-root .nts-field textarea {
	background: #fff !important; color: var(--nts-ink) !important; box-shadow: none !important;
	border: 2px solid var(--nts-line) !important; border-radius: 10px !important; min-height: 0 !important;
}
#nts-estimator-root .nts-field input:focus, #nts-estimator-root .nts-field textarea:focus { border-color: var(--nts-blue) !important; outline: none !important; }
#nts-estimator-root .nts-field input.nts-err { border-color: #e25555 !important; background: #fff7f7 !important; }

.nts-card {
	background: #fff;
	border-radius: 14px;
	box-shadow: 0 10px 30px rgba(34, 57, 90, .10);
	overflow: hidden;
	max-width: 720px;
	margin: 0 auto;
}

/* header */
.nts-head {
	background: linear-gradient(135deg, #22395a 0%, #2e486a 60%, #38598a 100%);
	color: #fff;
	text-align: center;
	padding: 26px 20px 24px;
}
.nts-head-eyebrow {
	color: var(--nts-cyan);
	font-size: .68rem;
	font-weight: 600;
	letter-spacing: .3em;
	text-transform: uppercase;
	margin-bottom: 8px;
}
.nts-head h1 { font-size: clamp(1.25rem, 3.6vw, 1.7rem); font-weight: 700; line-height: 1.2; color: #fff; }
.nts-head p { color: #d7e4f6; font-size: .88rem; margin-top: 8px; }

/* progress */
.nts-progress { height: 6px; background: #e8eef7; }
.nts-progress-bar { height: 100%; width: 0%; background: linear-gradient(90deg, #19b8d8, var(--nts-blue)); transition: width .35s ease; }

/* steps */
.nts-step { padding: 26px clamp(16px, 5vw, 40px) 30px; animation: ntsfade .3s ease; }
@keyframes ntsfade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.nts-step h2 { color: var(--nts-navy); font-size: clamp(1.1rem, 3vw, 1.4rem); font-weight: 700; line-height: 1.25; margin-bottom: 6px; }
.nts-sub { font-size: .88rem; margin-bottom: 20px; }

.nts-opts { display: grid; gap: 11px; }
.nts-cols2 { grid-template-columns: repeat(auto-fit, minmax(205px, 1fr)); }
/* Option cards are <button>s — themes and Elementor globals aggressively style
   button bg/color/hover (that's where stray accent colors come from), so these
   are hardened with !important. */
#nts-estimator-root button.nts-opt {
	display: flex !important; align-items: center; gap: 13px; text-align: left !important; width: 100%;
	background: #fff !important; background-image: none !important;
	border: 2px solid var(--nts-line) !important; border-radius: 12px !important; padding: 14px 15px !important;
	font-family: inherit !important; font-size: .9rem !important; color: var(--nts-ink) !important;
	font-weight: 500 !important; cursor: pointer; line-height: 1.4 !important;
	text-transform: none !important; letter-spacing: normal !important; box-shadow: none !important;
	margin: 0 !important; outline: none;
	transition: border-color .15s, box-shadow .15s, transform .05s;
}
#nts-estimator-root button.nts-opt:hover,
#nts-estimator-root button.nts-opt:focus {
	background: #fff !important; background-image: none !important; color: var(--nts-ink) !important;
	border-color: var(--nts-blue) !important; box-shadow: 0 4px 14px rgba(70, 127, 247, .12) !important;
}
#nts-estimator-root button.nts-opt:active { transform: scale(.99); }
#nts-estimator-root button.nts-opt.nts-selected,
#nts-estimator-root button.nts-opt.nts-selected:hover {
	border-color: var(--nts-blue) !important; background: #f3f7ff !important; color: var(--nts-ink) !important;
}
.nts-ico { font-size: 1.4rem; width: 32px; text-align: center; flex: 0 0 auto; }
#nts-estimator-root .nts-lbl b { display: block; font-weight: 600 !important; color: var(--nts-ink) !important; font-size: .9rem !important; }
#nts-estimator-root .nts-lbl span { display: block; font-size: .76rem !important; color: var(--nts-body) !important; font-weight: 400 !important; margin-top: 2px; text-transform: none !important; }
#nts-estimator-root button.nts-opt:hover .nts-lbl b,
#nts-estimator-root button.nts-opt:focus .nts-lbl b { color: var(--nts-ink) !important; }
#nts-estimator-root button.nts-opt:hover .nts-lbl span,
#nts-estimator-root button.nts-opt:focus .nts-lbl span { color: var(--nts-body) !important; }

.nts-nav { display: flex; justify-content: space-between; align-items: center; margin-top: 24px; gap: 10px; }
.nts-count { font-size: .72rem; color: #9aa9bd; }

#nts-estimator-root .nts-btn {
	font-family: inherit !important; font-weight: 600 !important; border: none; border-radius: 999px !important;
	cursor: pointer; font-size: .9rem !important; padding: 13px 26px !important;
	transition: background .15s; text-decoration: none !important; display: inline-block;
	text-align: center; text-transform: none !important; letter-spacing: normal !important; line-height: 1.4 !important;
	background-image: none !important; margin: 0 !important;
}
#nts-estimator-root .nts-primary,
#nts-estimator-root .nts-primary:visited { background: var(--nts-blue) !important; color: #fff !important; box-shadow: 0 6px 18px rgba(70, 127, 247, .35) !important; }
#nts-estimator-root .nts-primary:hover,
#nts-estimator-root .nts-primary:focus { background: var(--nts-blue-dark) !important; color: #fff !important; }
#nts-estimator-root .nts-ghost { background: transparent !important; color: var(--nts-body) !important; padding: 13px 12px !important; box-shadow: none !important; }
#nts-estimator-root .nts-ghost:hover, #nts-estimator-root .nts-ghost:focus { color: var(--nts-navy) !important; background: transparent !important; }
#nts-estimator-root .nts-outline { background: #fff !important; color: var(--nts-blue) !important; border: 2px solid var(--nts-blue) !important; box-shadow: none !important; }
#nts-estimator-root .nts-big { font-size: .98rem !important; padding: 15px 30px !important; }

/* contact form */
.nts-fields { display: grid; gap: 13px; grid-template-columns: 1fr 1fr; }
.nts-full { grid-column: 1 / -1; }
.nts-field label { display: block; font-size: .76rem; font-weight: 600; color: var(--nts-navy); margin-bottom: 5px; }
.nts-field label em { color: #e25555; font-style: normal; }
.nts-field input, .nts-field textarea {
	width: 100%; font-family: inherit; font-size: .9rem; color: var(--nts-ink);
	border: 2px solid var(--nts-line); border-radius: 10px; padding: 11px 13px; background: #fff; outline: none;
	transition: border-color .15s;
}
.nts-field input:focus, .nts-field textarea:focus { border-color: var(--nts-blue); box-shadow: none; }
.nts-field input.nts-err { border-color: #e25555; background: #fff7f7; }
.nts-hint { font-size: .72rem; color: #8b9bb0; margin-top: 4px; }
.nts-trust { display: flex; gap: 8px; align-items: center; font-size: .74rem; color: #8b9bb0; margin-top: 15px; }
/* honeypot: visually gone, still in the DOM for bots */
.nts-hp { position: absolute !important; left: -9999px !important; top: -9999px !important; height: 1px; overflow: hidden; }

/* interstitial + status screens */
.nts-center { text-align: center; padding: 42px clamp(16px, 6vw, 46px); }
.nts-center h2 { color: var(--nts-navy); margin-bottom: 10px; font-size: 1.3rem; }
.nts-center p { max-width: 500px; margin: 0 auto 10px; font-size: .9rem; }
.nts-bigico { font-size: 2.8rem; margin-bottom: 12px; }
.nts-spinner {
	width: 52px; height: 52px; border-radius: 50%;
	border: 5px solid #e3ecf9; border-top-color: var(--nts-blue);
	margin: 8px auto 20px; animation: ntsspin .9s linear infinite;
}
@keyframes ntsspin { to { transform: rotate(360deg); } }
.nts-calcline { font-size: .84rem; min-height: 1.5em; }

/* result */
.nts-result-hero {
	background: linear-gradient(135deg, #22395a, #2e486a);
	color: #fff; padding: 28px clamp(16px, 5vw, 40px); text-align: center;
}
.nts-eyebrow { color: var(--nts-cyan); font-size: .68rem; font-weight: 600; letter-spacing: .28em; text-transform: uppercase; margin-bottom: 8px; }
.nts-who { font-size: .82rem; color: #cfe0f5; }
.nts-range { font-size: clamp(1.6rem, 6vw, 2.4rem); font-weight: 800; margin: 6px 0 2px; color: #fff; }
.nts-range small { font-size: .45em; font-weight: 600; color: var(--nts-cyan); }
.nts-monthly { color: #cfe0f5; font-size: .9rem; }
.nts-monthly b { color: #fff; }
.nts-result-body { padding: 24px clamp(16px, 5vw, 40px) 30px; }
.nts-note {
	background: #f3f7ff; border-left: 4px solid var(--nts-blue); border-radius: 8px;
	padding: 12px 14px; font-size: .8rem; margin-bottom: 18px;
}
.nts-vinny {
	display: flex; gap: 14px; align-items: center;
	background: #fff; border: 2px solid var(--nts-line); border-radius: 12px;
	padding: 14px 16px; margin: 0 0 16px;
}
.nts-avatar {
	width: 50px; height: 50px; border-radius: 50%; flex: 0 0 auto;
	background: linear-gradient(135deg, var(--nts-blue), #19b8d8);
	color: #fff; display: flex; align-items: center; justify-content: center;
	font-weight: 700; font-size: 1.15rem;
}
.nts-vinny p { font-size: .82rem; }
.nts-vinny b { color: var(--nts-navy); }
.nts-ctas { display: grid; gap: 11px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); margin: 4px auto 0; max-width: 460px; }
.nts-fine { font-size: .68rem; color: #9aa9bd; margin-top: 16px; line-height: 1.6; }

@media (max-width: 560px) {
	.nts-fields { grid-template-columns: 1fr; }
	.nts-cols2 { grid-template-columns: 1fr; }
}