/**
 * Superintech Tabs — front-end styles. No jQuery.
 */
.superintech-tabs {
	--superintech-tabs-dur: 350ms;
	--superintech-tabs-accent: #e6447d;
	display: block;
	width: 100%;
	box-sizing: border-box;
}
.superintech-tabs *, .superintech-tabs *::before, .superintech-tabs *::after { box-sizing: border-box; }

.superintech-tabs__nav { display: flex; flex-wrap: wrap; gap: 8px; }
.superintech-tabs__tab {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	border: 0;
	cursor: pointer;
	font: inherit;
	font-weight: 600;
	line-height: 1.2;
	color: #2b2a6b;
	background: #f1eef5;
	transition: background var(--superintech-tabs-dur) ease, color var(--superintech-tabs-dur) ease, box-shadow var(--superintech-tabs-dur) ease;
}
.superintech-tabs__tab.is-active { color: #fff; background: var(--superintech-tabs-accent); }
.superintech-tabs__tab:focus-visible { outline: 3px solid var(--superintech-tabs-accent); outline-offset: 2px; }
.superintech-tabs__tab-icon { display: inline-flex; font-size: 18px; }
.superintech-tabs__tab-icon svg { width: 1em; height: 1em; fill: currentColor; }
.superintech-tabs__tab-img { display: block; width: 40px; height: 40px; border-radius: 8px; overflow: hidden; }
.superintech-tabs__tab-img img { width: 100%; height: 100%; object-fit: cover; display: block; }

.superintech-tabs__panels { margin-top: 14px; background: #fff; }
.superintech-tabs__panel[hidden] { display: none; }
.superintech-tabs__content-inner > :first-child { margin-top: 0; }
.superintech-tabs__content-inner > :last-child { margin-bottom: 0; }
.superintech-tabs__mhead { display: none; }

/* ---- Style: Vertical ---- */
.superintech-tabs-style-vertical .superintech-tabs { display: grid; grid-template-columns: minmax(150px, 230px) 1fr; gap: 18px; align-items: start; }
.superintech-tabs-style-vertical .superintech-tabs__nav { flex-direction: column; }
.superintech-tabs-style-vertical .superintech-tabs__tab { width: 100%; }
.superintech-tabs-style-vertical .superintech-tabs__panels { margin-top: 0; }

/* ---- Style: Icon / Image (stacked label) ---- */
.superintech-tabs-style-icon .superintech-tabs__tab,
.superintech-tabs-style-image .superintech-tabs__tab { flex-direction: column; text-align: center; }

/* ---- Style: Pill ---- */
.superintech-tabs-style-pill .superintech-tabs__nav { justify-content: center; }
.superintech-tabs-style-pill .superintech-tabs__tab { border-radius: 40px; }

/* ---- Style: Card ---- */
.superintech-tabs-style-card .superintech-tabs__tab { background: #fff; box-shadow: 0 6px 16px rgba(43,42,107,0.08); }
.superintech-tabs-style-card .superintech-tabs__tab.is-active { box-shadow: 0 10px 24px rgba(230,68,125,0.28); }

/* ===================================================================== */
/* MOBILE                                                                */
/* ===================================================================== */
@media (max-width: 767px) {
	/* Any mobile mode: vertical grid collapses to a single column. */
	.superintech-tabs-style-vertical .superintech-tabs { display: block; }

	/* Scrollable tabs */
	.superintech-tabs-m-scroll .superintech-tabs__nav { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px; }
	.superintech-tabs-m-scroll .superintech-tabs__tab { flex: 0 0 auto; }

	/* Stacked tabs */
	.superintech-tabs-m-stacked .superintech-tabs__nav { flex-direction: column; }
	.superintech-tabs-m-stacked .superintech-tabs__tab { width: 100%; }

	/* Accordion: hide nav, turn each panel into a collapsible row. */
	.superintech-tabs-m-accordion .superintech-tabs__nav { display: none; }
	.superintech-tabs-m-accordion .superintech-tabs__panels { margin-top: 0; display: flex; flex-direction: column; gap: 10px; background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; }
	.superintech-tabs-m-accordion .superintech-tabs__panel { display: block !important; border: 1px solid #ece7ee; border-radius: 10px; overflow: hidden; }
	.superintech-tabs-m-accordion .superintech-tabs__mhead {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 10px;
		width: 100%;
		padding: 14px 18px;
		margin: 0;
		font: inherit;
		font-weight: 600;
		color: #2b2a6b;
		background: #fff;
		border: 0;
		cursor: pointer;
	}
	.superintech-tabs-m-accordion .superintech-tabs__mhead svg { width: 18px; height: 18px; transition: transform var(--superintech-tabs-dur) ease; }
	.superintech-tabs-m-accordion .superintech-tabs__panel.is-active .superintech-tabs__mhead svg { transform: rotate(180deg); }
	.superintech-tabs-m-accordion .superintech-tabs__content { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--superintech-tabs-dur) ease; }
	.superintech-tabs-m-accordion .superintech-tabs__panel.is-active .superintech-tabs__content { grid-template-rows: 1fr; }
	.superintech-tabs-m-accordion .superintech-tabs__content-inner { overflow: hidden; min-height: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.superintech-tabs__tab, .superintech-tabs__content, .superintech-tabs__mhead svg { transition: none !important; }
}