/* =========================================================
   Homepage
   ========================================================= */

.hero {
	position: relative;
	background:
		linear-gradient(160deg, rgba(11,31,58,.94), rgba(15,157,140,.88)),
		var(--hero-bg-image, none) center/cover no-repeat;
	color: #fff;
	padding-block: 88px 96px;
	overflow: hidden;
}
.hero::after {
	content: "";
	position: absolute;
	inset-inline-end: -120px; top: -120px;
	width: 420px; height: 420px;
	background: radial-gradient(circle, rgba(212,162,76,.35), transparent 70%);
	pointer-events: none;
}
.hero__inner { position: relative; max-width: 820px; }
.hero__eyebrow {
	display: inline-flex; align-items: center;
	font-weight: 700; letter-spacing: .04em; text-transform: uppercase; font-size: .8rem;
	background: rgba(255,255,255,.12);
	padding: 6px 14px;
	border-radius: 999px;
	margin-bottom: 18px;
}
.hero__title { color: #fff; margin-bottom: 16px; }
.hero__subtitle { color: rgba(255,255,255,.85); font-size: 1.1rem; max-width: 60ch; margin-bottom: 32px; }
.hero__actions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 28px; }

/* ---- Signature: Advanced Search segmented control ---- */
.advanced-search {
	background: rgba(255,255,255,.98);
	border-radius: var(--jck-radius-lg);
	padding: 10px 10px 18px;
	box-shadow: var(--jck-shadow-lg);
	max-width: 780px;
}
.advanced-search__tabs {
	display: flex;
	overflow-x: auto;
	gap: 4px;
	padding: 8px;
	-webkit-overflow-scrolling: touch;
}
.advanced-search__tab {
	position: relative;
	flex: 0 0 auto;
	padding: 9px 16px;
	border-radius: 999px;
	font-size: .85rem;
	font-weight: 700;
	color: var(--jck-color-ink-500);
	cursor: pointer;
	white-space: nowrap;
	transition: background-color .15s ease, color .15s ease;
}
.advanced-search__tab input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.advanced-search__tab.is-active,
.advanced-search__tab:has(input:checked) { background: var(--jck-color-navy-900); color: #fff; }
.advanced-search__tab:hover { color: var(--jck-color-navy-900); }

.advanced-search__fields {
	display: grid;
	grid-template-columns: 1.4fr 1fr auto;
	gap: 10px;
	padding: 10px;
}
.advanced-search__field input {
	width: 100%;
	padding: 13px 16px;
	border: var(--jck-border-width, 1px) solid var(--jck-color-line);
	border-radius: var(--jck-radius-sm);
	background: var(--jck-color-bg);
}
.advanced-search__field input:focus { border-color: var(--jck-color-teal-600); outline: none; background: #fff; }
.advanced-search__submit { padding-inline: 26px; }

/* ---- Categories ---- */
.categories-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}
.category-card {
	background: var(--jck-color-surface);
	border: var(--jck-border-width, 1px) solid var(--jck-color-line);
	border-radius: var(--jck-radius-md);
	padding: 24px 20px;
	display: flex; flex-direction: column; gap: 8px;
	transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.category-card:hover { transform: translateY(-3px); box-shadow: var(--jck-shadow-md); border-color: transparent; }
.category-card__icon {
	width: 40px; height: 40px;
	border-radius: 10px;
	background: linear-gradient(135deg, var(--jck-color-teal-600), var(--jck-color-navy-800));
}
.category-card__name { font-weight: 700; color: var(--jck-color-navy-900); }

/* ---- Companies ---- */
.companies-grid { display: flex; flex-wrap: wrap; gap: 12px; }
.company-chip {
	display: inline-flex; align-items: center; gap: 10px;
	background: var(--jck-color-surface);
	border: var(--jck-border-width, 1px) solid var(--jck-color-line);
	border-radius: 999px;
	padding: 8px 16px 8px 8px;
}
html[dir="rtl"] .company-chip { padding: 8px 8px 8px 16px; }
.company-chip__initial {
	width: 28px; height: 28px; border-radius: 50%;
	background: var(--jck-color-navy-900); color: #fff;
	display: inline-flex; align-items: center; justify-content: center;
	font-weight: 700; font-size: .8rem;
}
.company-chip__name { font-weight: 600; font-size: .9rem; }


/* ---- Testimonials ---- */
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.testimonial-card {
	background: var(--jck-color-surface);
	border: var(--jck-border-width, 1px) solid var(--jck-color-line);
	border-radius: var(--jck-radius-md);
	padding: 26px;
	margin: 0;
}
.testimonial-card blockquote { margin: 0 0 16px; font-size: 1.02rem; color: var(--jck-color-ink-700); }
.testimonial-card__name { display: block; font-weight: 700; color: var(--jck-color-navy-900); }
.testimonial-card__role { display: block; font-size: .85rem; color: var(--jck-color-ink-500); }
