/* ==========================================================================
   GROUP OF COMPANIES — full directory, built on the FAQ page skeleton
   (fq-head / fq-search / fq-grid / fq-toc / fq-sec are shared with
   assets/css/faqs.css, loaded as a dependency). Everything here is the
   goc-specific layer: quick-link cards, the stats bar, company cards,
   flagship profiles and the closing info panels.
   ========================================================================== */

.goc { --goc-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

/* ---------------- quick-link cards ---------------- */

.goc-links { padding: clamp(26px, 4vw, 40px) 0 clamp(28px, 4vw, 44px); }

/* When these cards sit right above the next full section (as they do on
   the homepage, straight after the Corporate Profile Book, right before
   Leadership) that section's own generous --section-py padding stacks on
   top of the gap here and reads as a large empty gap. Tightening just this
   one seam brings the two visually "one after another" without touching
   --section-py anywhere else on the site. */
.goc-links + .section { padding-top: clamp(36px, 5vw, 64px); }

.goc-links__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.goc-link {
	display: flex;
	gap: 20px;
	align-items: flex-start;
	padding: 34px;
	background: var(--card, #fff);
	border: 1px solid var(--line, rgba(15, 23, 42, .12));
	border-radius: var(--radius-lg, 20px);
	text-decoration: none;
	transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.goc-link:hover,
.goc-link:focus-visible {
	transform: translateY(-3px);
	border-color: var(--color-primary);
	box-shadow: 0 14px 34px rgba(15, 23, 42, .1);
}

[data-theme="dark"] .goc-link { background: rgba(255, 255, 255, .03); }

.goc-link__icon {
	flex: none;
	display: grid;
	place-items: center;
	width: 60px;
	height: 60px;
	border-radius: var(--radius-md, 16px);
	background: rgba(var(--color-primary-rgb), .1);
	color: var(--color-primary);
}

.goc-link__body { display: flex; flex-direction: column; gap: 8px; min-width: 0; }

.goc-link__kicker {
	font-family: var(--goc-mono);
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--color-primary);
}

.goc-link__title {
	font-family: var(--font-display);
	font-size: 1.28rem;
	font-weight: 800;
	line-height: 1.3;
	color: var(--ink, #0b1f3a);
}

.goc-link__text { font-size: .93rem; line-height: 1.7; color: var(--muted, #64748b); }

.goc-link__cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 8px;
	font-size: .87rem;
	font-weight: 700;
	color: var(--color-primary);
}

.goc-link__cta svg { transition: transform .18s ease; }
.goc-link:hover .goc-link__cta svg { transform: translateX(3px); }

/* ---------------- stats bar ---------------- */

.goc-stats { padding: clamp(30px, 4vw, 46px) 0; }

.goc-stats__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
	padding: 28px;
	background: var(--bg-alt, #f4f7fb);
	border-radius: var(--radius-lg, 20px);
}

[data-theme="dark"] .goc-stats__grid { background: rgba(255, 255, 255, .03); }

.goc-stat { display: flex; flex-direction: column; gap: 4px; text-align: center; }

.goc-stat__n {
	font-family: var(--font-display);
	font-size: clamp(1.5rem, 3vw, 2.1rem);
	font-weight: 800;
	color: var(--color-primary);
}

.goc-stat__l { font-size: .78rem; line-height: 1.4; color: var(--muted, #64748b); }

/* ---------------- company cards (inside fq-sec) ---------------- */

.goc-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 14px;
	border-top: none;
}

.goc-card {
	display: block;
	padding: 18px 20px;
	background: var(--card, #fff);
	border: 1px solid var(--line-soft, rgba(15, 23, 42, .08));
	border-left: 3px solid var(--color-primary);
	border-radius: 0 var(--radius-sm, 14px) var(--radius-sm, 14px) 0;
	text-decoration: none;
	transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}

.goc-card:hover,
.goc-card:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 10px 26px rgba(15, 23, 42, .1);
}

[data-theme="dark"] .goc-card { background: rgba(255, 255, 255, .03); }

.goc-card[hidden] { display: none; }

.goc-card__h {
	margin: 0 0 6px;
	font-family: var(--font-display);
	font-size: .95rem;
	font-weight: 700;
	line-height: 1.4;
	color: var(--ink, #0b1f3a);
}

.goc-card:hover .goc-card__h { color: var(--color-primary); }

.goc-card__p { margin: 0 0 10px; font-size: .85rem; line-height: 1.6; color: var(--ink-2, #475569); }

.goc-card__cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--goc-mono);
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--color-primary);
}

.goc-card__cta svg { transition: transform .16s ease; }
.goc-card:hover .goc-card__cta svg { transform: translateX(3px); }

/* ---------------- flagship company profiles ---------------- */

.goc-flagships { padding: clamp(40px, 6vw, 70px) 0; background: var(--bg-alt, #f4f7fb); }

[data-theme="dark"] .goc-flagships { background: rgba(255, 255, 255, .02); }

.goc-flagships__grid {
	margin-top: 28px;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}

.goc-flag {
	padding: 26px;
	background: var(--card, #fff);
	border: 1px solid var(--line, rgba(15, 23, 42, .1));
	border-radius: var(--radius-lg, 20px);
}

[data-theme="dark"] .goc-flag { background: rgba(255, 255, 255, .04); }

.goc-flag h3 {
	margin: 0 0 6px;
	font-family: var(--font-display);
	font-size: 1.08rem;
	font-weight: 800;
	color: var(--ink, #0b1f3a);
}

.goc-flag__tag {
	margin: 0 0 12px;
	font-family: var(--goc-mono);
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .04em;
	color: var(--color-primary);
}

.goc-flag__body { margin: 0 0 14px; font-size: .89rem; line-height: 1.65; color: var(--ink-2, #475569); }

.goc-flag__list { margin: 0; padding-left: 18px; font-size: .84rem; line-height: 1.7; color: var(--ink-2, #475569); }
.goc-flag__list li { margin-bottom: 5px; }

/* ---------------- info panels (clientele, franchise, vision, CSR, support) ---------------- */

.goc-extra { padding: clamp(40px, 6vw, 70px) 0; }

.goc-extra__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
}

.goc-panel {
	padding: 26px 28px;
	background: var(--card, #fff);
	border: 1px solid var(--line, rgba(15, 23, 42, .1));
	border-radius: var(--radius-lg, 20px);
}

[data-theme="dark"] .goc-panel { background: rgba(255, 255, 255, .03); }

.goc-panel--wide { grid-column: 1 / -1; }

.goc-panel h3 {
	margin: 0 0 12px;
	font-family: var(--font-display);
	font-size: 1.08rem;
	font-weight: 800;
	color: var(--ink, #0b1f3a);
}

.goc-panel > p { margin: 0 0 14px; font-size: .89rem; line-height: 1.65; color: var(--ink-2, #475569); }

.goc-panel__stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin-bottom: 16px;
}

.goc-panel__stats div { display: flex; flex-direction: column; gap: 2px; }
.goc-panel__stats strong { font-family: var(--font-display); font-size: 1.3rem; font-weight: 800; color: var(--color-primary); }
.goc-panel__stats span { font-size: .74rem; line-height: 1.4; color: var(--muted, #64748b); }

.goc-panel__list { margin: 0; padding-left: 18px; font-size: .87rem; line-height: 1.75; color: var(--ink-2, #475569); }
.goc-panel__list li { margin-bottom: 4px; }

.goc-panel__cols {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

.goc-panel__cols--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.goc-panel__cols > div p:not(.goc-panel__label) { margin: 0; font-size: .87rem; line-height: 1.7; color: var(--ink-2, #475569); }

.goc-panel__label {
	margin: 0 0 8px;
	font-family: var(--goc-mono);
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--color-primary);
}

/* ---------------- leadership cross-link ---------------- */

.goc-leadership { padding: 0 0 clamp(50px, 7vw, 84px); }

.goc-leadership__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 22px;
	padding: 32px 34px;
	background: var(--bg-alt, #f4f7fb);
	border-radius: var(--radius-lg, 20px);
}

[data-theme="dark"] .goc-leadership__inner { background: rgba(255, 255, 255, .03); }

.goc-leadership__inner > div { max-width: 60ch; }
.goc-leadership__inner p { margin: 8px 0 0; font-size: .92rem; line-height: 1.65; color: var(--ink-2, #475569); }
.goc-leadership__cta { flex: none; white-space: nowrap; }

/* ==========================================================================
   RESPONSIVE — desktop first, collapsing down to a single column
   ========================================================================== */

@media (max-width: 1100px) {
	.goc-flagships__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1000px) {
	.goc-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.goc-extra__grid { grid-template-columns: minmax(0, 1fr); }
	.goc-panel__cols--three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 780px) {
	.goc-links__grid { grid-template-columns: minmax(0, 1fr); }
	.goc-flagships__grid { grid-template-columns: minmax(0, 1fr); }
	.goc-cards { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 620px) {
	.goc-link { padding: 22px; gap: 14px; }
	.goc-link__icon { width: 46px; height: 46px; }
	.goc-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 20px; gap: 20px 14px; }
	.goc-panel { padding: 20px; }
	.goc-panel__cols,
	.goc-panel__cols--three { grid-template-columns: minmax(0, 1fr); gap: 18px; }
	.goc-panel__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
	.goc-leadership__inner { flex-direction: column; align-items: flex-start; padding: 24px; }
	.goc-leadership__cta { align-self: stretch; justify-content: center; }
}

@media (max-width: 420px) {
	.goc-stats__grid { grid-template-columns: minmax(0, 1fr); }
	.goc-panel__stats { grid-template-columns: minmax(0, 1fr); }
}