/* GTN Tech Tools — namespaced, theme-agnostic styling.
 * Uses the brand palette: near-white background, dark charcoal text, tech-blue accent.
 * Everything is scoped under .gtn-tool so it won't fight the active theme. */

.gtn-tool {
	--gtn-blue: #1a73e8;
	--gtn-blue-dark: #1558b8;
	--gtn-charcoal: #1f2430;
	--gtn-muted: #5b6472;
	--gtn-border: #e2e6ee;
	--gtn-bg: #f7f9fc;
	max-width: 640px;
	margin: 1.5rem auto;
	padding: 1.25rem 1.25rem 1rem;
	background: #fff;
	border: 1px solid var(--gtn-border);
	border-radius: 14px;
	box-shadow: 0 1px 3px rgba(20, 30, 50, .06);
	color: var(--gtn-charcoal);
	font-family: inherit;
	line-height: 1.5;
}
.gtn-tool *, .gtn-tool *::before, .gtn-tool *::after { box-sizing: border-box; }
.gtn-tool__title { font-size: 1.35rem; margin: 0 0 .35rem; line-height: 1.25; }
.gtn-tool__intro { color: var(--gtn-muted); margin: 0 0 1rem; }

.gtn-tool__form { display: grid; gap: .85rem; }
.gtn-field { display: flex; flex-direction: column; gap: .3rem; }
.gtn-field label { font-weight: 600; font-size: .92rem; }
.gtn-field input,
.gtn-field select {
	width: 100%;
	padding: .6rem .7rem;
	font-size: 1rem;
	color: var(--gtn-charcoal);
	background: var(--gtn-bg);
	border: 1px solid var(--gtn-border);
	border-radius: 9px;
	appearance: none;
}
.gtn-field input:focus,
.gtn-field select:focus {
	outline: none;
	border-color: var(--gtn-blue);
	box-shadow: 0 0 0 3px rgba(26, 115, 232, .18);
	background: #fff;
}
.gtn-hint { color: var(--gtn-muted); font-size: .82rem; }

.gtn-btn {
	display: inline-block;
	padding: .6rem 1rem;
	font-size: .95rem;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	color: var(--gtn-blue);
	background: #fff;
	border: 1.5px solid var(--gtn-blue);
	border-radius: 9px;
	cursor: pointer;
	transition: background .15s, color .15s;
}
.gtn-btn:hover { background: rgba(26, 115, 232, .08); }
.gtn-btn--primary {
	color: #fff;
	background: var(--gtn-blue);
	border-color: var(--gtn-blue);
	justify-self: start;
	margin-top: .15rem;
}
.gtn-btn--primary:hover { background: var(--gtn-blue-dark); border-color: var(--gtn-blue-dark); }

.gtn-tool__result {
	margin-top: 1rem;
	padding: .9rem 1rem;
	background: var(--gtn-bg);
	border: 1px solid var(--gtn-border);
	border-left: 4px solid var(--gtn-blue);
	border-radius: 10px;
}
.gtn-tool__result p { margin: 0 0 .5rem; }
.gtn-tool__result p:last-child { margin-bottom: 0; }
.gtn-tool__note { font-size: .82rem; color: var(--gtn-muted); font-style: italic; }
.gtn-tool__error { margin: 0; color: #b3261e; font-weight: 600; }

.gtn-tool__ctas { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 .5rem; }
.gtn-tool__ctas .gtn-btn { flex: 0 1 auto; }

.gtn-tool__disclosure { font-size: .78rem; color: var(--gtn-muted); margin: .5rem 0 0; }

@media (max-width: 480px) {
	.gtn-tool { padding: 1rem; border-radius: 12px; }
	.gtn-tool__title { font-size: 1.2rem; }
	.gtn-btn--primary { width: 100%; }
	.gtn-tool__ctas .gtn-btn { flex: 1 1 100%; }
}