/* ==========================================================================
   First-party overrides for the Gerold template.
   Loaded after responsive.css so it wins.

   Keep this file small. Anything the template already has a class for should
   use that class instead — the Research section, for example, is built from
   .contact-form-box, .section-header and .button-box and needs nothing here.
   What remains is the one piece of UI the template has no equivalent for.
   ========================================================================== */

/* --------------------------------------------- hero availability line ---- */
/* Deliberately lighter than the lead paragraph above it: this is a status
   line, not another paragraph of body copy. */
/* .lead above this has margin-bottom: 0, so this line owns the gap between
   them. It must be positive — a negative top margin collides with the last
   line of the summary. The .button-box below brings its own margin-top. */
.hero-content-box .hero-availability {
	display: flex;
	align-items: baseline;
	gap: 10px;
	margin: 22px 0 0;
	max-width: 550px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--tj-grey-3);
	opacity: 0.85;
}

.hero-content-box .hero-availability .availability-dot {
	flex: 0 0 auto;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #3ddc84;
	box-shadow: 0 0 0 4px rgba(61, 220, 132, 0.15);
	transform: translateY(-1px);
}