.stl-shell,
.stl-shortcode-shell {
	--stl-card: #ffffff;
	--stl-card-soft: #f7fafc;
	--stl-border: #d8e2ea;
	--stl-text: #0f172a;
	--stl-muted: #5f6f7f;
	--stl-accent: #0f766e;
	--stl-accent-dark: #115e63;
	--stl-accent-soft: #e4f6f3;
	--stl-radius: 0px;
	--stl-shadow: 0 20px 50px rgba(15, 23, 42, 0.08);
	color: var(--stl-text);
}

.stl-shell {
	width: 100%;
	max-width: 1820px;
	margin: 0 auto;
	padding: 26px 20px 56px;
	box-sizing: border-box;
}

.stl-shortcode-shell {
	width: 100%;
	max-width: 1820px;
	margin: 0 auto;
	padding: 12px 0 20px;
	box-sizing: border-box;
}

.stl-shell,
.stl-shortcode-shell,
.stl-shell *,
.stl-shortcode-shell * {
	box-sizing: border-box;
}

.stl-kicker {
	margin: 0 0 10px;
	color: var(--stl-accent);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.stl-course-hero,
.stl-learning-layout,
.stl-course-card,
.stl-auth-card,
.stl-empty-card,
.stl-curriculum-card,
.stl-my-courses-head,
.stl-text-panel,
.stl-media-panel {
	border: 1px solid var(--stl-border);
	border-radius: var(--stl-radius);
	background: var(--stl-card);
	box-shadow: var(--stl-shadow);
}

.stl-course-hero {
	display: grid;
	grid-template-columns: minmax(460px, 620px) minmax(0, 1fr);
	gap: 32px;
	padding: 24px;
	align-items: center;
	background:
		radial-gradient(circle at top right, rgba(15, 118, 110, 0.08), transparent 26%),
		linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%);
}

.stl-course-hero__media {
	aspect-ratio: 16 / 9;
	min-height: 0;
	height: auto;
	align-self: start;
	border-radius: var(--stl-radius);
	overflow: hidden;
	background: linear-gradient(135deg, #d7ece8 0%, #f2f7f7 100%);
}

.stl-course-hero__media img,
.stl-course-card__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.stl-hero-placeholder,
.stl-card-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	min-height: 220px;
	padding: 24px;
	background:
		linear-gradient(135deg, rgba(15, 118, 110, 0.18), rgba(15, 118, 110, 0.04)),
		linear-gradient(180deg, #ffffff 0%, #eef7f6 100%);
	color: var(--stl-accent-dark);
	font-size: clamp(24px, 4vw, 42px);
	font-weight: 800;
	text-align: center;
}

.stl-course-hero__media .stl-hero-placeholder {
	min-height: 100%;
	height: 100%;
}

.stl-course-hero__content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 16px;
	min-width: 0;
	min-height: 0;
	overflow: visible;
}

.stl-course-hero__copy {
	display: grid;
	gap: 12px;
	min-width: 0;
}

.stl-course-hero__content h1,
.stl-sidebar-head h1,
.stl-my-courses-head h1,
.stl-auth-card h2,
.stl-empty-card h2 {
	margin: 0;
	line-height: 1.06;
	font-size: clamp(26px, 3vw, 42px);
}

.stl-course-hero__content h1 {
	font-size: clamp(24px, 2vw, 36px);
	line-height: 1.04;
	max-width: 100%;
	overflow-wrap: anywhere;
}

.stl-course-summary,
.stl-my-courses-head p,
.stl-auth-card p,
.stl-empty-card p,
.stl-purchase-panel p,
.stl-subtle-note,
.stl-course-description,
.stl-media-caption,
.stl-curriculum-section li small {
	color: var(--stl-muted);
}

.stl-course-summary {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
}

.stl-meta-row,
.stl-button-row,
.stl-actions-group,
.stl-hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.stl-hero-actions {
	margin-top: 0;
	padding-top: 4px;
}

.stl-meta-row span,
.stl-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	border: 1px solid var(--stl-border);
	border-radius: var(--stl-radius);
	background: #fbfcfd;
	font-size: 13px;
	font-weight: 700;
}

.stl-pill {
	background: var(--stl-card-soft);
}

.stl-course-facts {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 12px;
	align-items: center;
	font-size: 13px;
	font-weight: 700;
	color: var(--stl-muted);
}

.stl-course-facts span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.stl-notice-card,
.stl-purchase-panel,
.stl-auth-card,
.stl-empty-card,
.stl-curriculum-section,
.stl-my-courses-head {
	padding: 22px;
}

.stl-course-facts span:not(:last-child)::after {
	content: "|";
	color: #9aa8b6;
	margin-left: 6px;
}

.stl-notice-card {
	border-radius: var(--stl-radius);
	background: #fff8ed;
	border: 1px solid #f7c98c;
}

.stl-course-description {
	max-width: none;
	font-size: 15px;
	line-height: 1.6;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.stl-sales-stack {
	grid-template-columns: minmax(0, 1fr);
}

.stl-course-description > :first-child,
.stl-text-panel > :first-child,
.entry-content > :first-child {
	margin-top: 0;
}

.stl-course-description > :last-child,
.stl-text-panel > :last-child,
.entry-content > :last-child {
	margin-bottom: 0;
}

.stl-sales-stack {
	display: grid;
	gap: 18px;
	margin-top: 18px;
}

.stl-purchase-panel {
	padding: 22px;
	border: 1px solid var(--stl-border);
	border-radius: var(--stl-radius);
	background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%);
	box-shadow: var(--stl-shadow);
}

.stl-purchase-panel > p {
	display: block;
	margin: 0 0 8px;
	font-size: 14px;
	line-height: 1.6;
}

.stl-product-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 16px;
	margin-top: 14px;
}

.stl-product-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 18px;
	min-width: 0;
	width: 100%;
	max-width: 100%;
	padding: 18px;
	border: 1px solid var(--stl-border);
	border-radius: var(--stl-radius);
	background: #ffffff;
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.06);
}

.stl-product-card__head h3 {
	margin: 0 0 8px;
	font-size: 18px;
	line-height: 1.25;
}

.stl-price-html {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-size: 22px;
	font-weight: 800;
}

.stl-price-html del {
	color: #7b8897;
	font-size: 16px;
	opacity: 0.8;
}

.stl-price-html ins {
	color: var(--stl-accent-dark);
	text-decoration: none;
}

.stl-price-html .amount,
.stl-price-html bdi {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

.stl-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 18px;
	border: 1px solid transparent;
	border-radius: var(--stl-radius);
	font-weight: 800;
	text-decoration: none;
	transition: transform 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease, border-color 0.16s ease;
}

.stl-button:hover {
	transform: translateY(-1px);
}

.stl-button--primary {
	background: linear-gradient(135deg, #0f766e 0%, #155e63 100%);
	color: #ffffff;
	box-shadow: 0 14px 30px rgba(15, 118, 110, 0.2);
}

.stl-button--secondary {
	border-color: var(--stl-border);
	background: #ffffff;
	color: var(--stl-text);
}

.stl-product-card .stl-button {
	align-self: flex-start;
	white-space: nowrap;
}

.stl-curriculum-card {
	margin-top: 26px;
	padding: 26px;
}

.stl-section-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.stl-section-head h2 {
	margin: 0;
	font-size: clamp(24px, 2.6vw, 34px);
	line-height: 1.12;
}

.stl-curriculum-list {
	display: grid;
	gap: 18px;
	margin-top: 22px;
}

.stl-curriculum-locked {
	max-width: 760px;
	margin-top: 22px;
	box-shadow: none;
	background: linear-gradient(180deg, #ffffff 0%, #f9fbfd 100%);
}

.stl-curriculum-locked h2 {
	margin-bottom: 10px;
	font-size: clamp(20px, 2vw, 28px);
}

.stl-curriculum-section {
	background: linear-gradient(180deg, #ffffff 0%, #f9fbfd 100%);
}

.stl-curriculum-section header {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 16px;
}

.stl-curriculum-section h3 {
	margin: 0;
	font-size: clamp(20px, 2vw, 28px);
	line-height: 1.18;
}

.stl-curriculum-section ul,
.stl-sidebar-section ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 10px;
}

.stl-curriculum-section li {
	padding: 14px 0;
	border-top: 1px solid var(--stl-border);
}

.stl-curriculum-lesson {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
}

.stl-curriculum-lesson a,
.stl-course-card h2 a {
	color: var(--stl-text);
	text-decoration: none;
	font-weight: 800;
}

.stl-sidebar-section a {
	text-decoration: none;
}

.stl-learning-layout {
	display: grid;
	grid-template-columns: 300px minmax(0, 1fr);
	overflow: hidden;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 253, 0.96));
}

.stl-shell--learning {
	max-width: none;
	min-height: 100vh;
	margin: 0;
	padding: 0;
	--stl-learning-active-bab-bg: color-mix(in srgb, var(--stl-accent) 10%, #ffffff);
}

.stl-course-learning-page {
	background: #ffffff;
}

.stl-course-learning-page :is(.site-header, .site-footer, #masthead, #colophon, body > header, body > footer, .wp-site-blocks > header, .wp-site-blocks > footer, .elementor-location-header, .elementor-location-footer, .main-navigation, .storefront-primary-navigation, .header-widget-region, .site-search, .widget-area, .sidebar) {
	display: none !important;
}

.stl-shell--learning .stl-learning-sidebar {
	background: #ffffff;
}

.stl-shell--learning .stl-lesson-content-card,
.stl-shell--learning .stl-text-panel,
.stl-shell--learning .stl-media-panel,
.stl-shell--learning .stl-lesson-block--file,
.stl-shell--learning .stl-lesson-block--empty {
	padding: 0;
	border: 0;
	border-radius: 0 !important;
	background: transparent;
	box-shadow: none;
}

.stl-shell--learning .stl-video-ratio,
.stl-shell--learning .stl-media-image {
	border-radius: 0 !important;
}

@media (min-width: 783px) {
	.stl-course-learning-page {
		overflow: hidden;
	}

	.stl-course-learning-page .stl-shell--learning {
		width: 100vw;
		max-width: none;
		min-height: 100vh;
	}

	.stl-shell--learning .stl-learning-layout {
		position: fixed;
		inset: var(--stl-learning-top-offset, 0) 0 0 0;
		z-index: 9990;
		grid-template-columns: 360px minmax(0, 1fr);
		width: 100vw;
		height: calc(100vh - var(--stl-learning-top-offset, 0px));
		min-height: 0;
		border: 0;
		border-radius: 0 !important;
		box-shadow: none;
		background: #f6f9fb;
	}

	body.admin-bar .stl-shell--learning .stl-learning-layout {
		--stl-learning-top-offset: 32px;
	}

	@media (max-width: 960px) {
		body.admin-bar .stl-shell--learning .stl-learning-layout {
			--stl-learning-top-offset: 46px;
		}
	}

	.stl-shell--learning .stl-learning-sidebar {
		height: calc(100vh - var(--stl-learning-top-offset, 0px));
		overflow-y: auto;
		padding: 0;
		background: #ffffff;
	}

	.stl-shell--learning .stl-learning-main {
		height: calc(100vh - var(--stl-learning-top-offset, 0px));
		overflow-y: auto;
		padding: 0;
		background: #ffffff;
	}

	.stl-shell--learning .stl-learning-main > .stl-lesson-header,
	.stl-shell--learning .stl-learning-main > .stl-lesson-flow,
	.stl-shell--learning .stl-learning-main > .stl-actions-bar {
		width: min(100%, 1420px);
		margin-right: auto;
		margin-left: auto;
		padding-right: clamp(28px, 3.2vw, 56px);
		padding-left: clamp(28px, 3.2vw, 56px);
	}

	.stl-shell--learning .stl-lesson-header {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 172px;
		margin-bottom: 0;
		padding-top: 36px;
		padding-bottom: 30px;
		border-bottom: 1px solid #edf1f5;
		text-align: center;
	}

	.stl-shell--learning .stl-lesson-header h2 {
		max-width: 980px;
		margin: 0 auto;
		font-size: clamp(26px, 2vw, 36px);
		line-height: 1.18;
	}

	.stl-shell--learning .stl-lesson-header .stl-kicker {
		margin-bottom: 10px;
		color: #7b8794;
		font-size: 14px;
		font-weight: 600;
		letter-spacing: 0;
		text-transform: none;
	}

	.stl-shell--learning .stl-lesson-flow {
		padding-top: 34px;
		padding-bottom: 20px;
	}

	.stl-shell--learning .stl-sidebar-head {
		padding: 28px 30px 24px;
	}

	.stl-shell--learning .stl-sidebar-head h1 {
		font-size: 22px;
		line-height: 1.25;
	}

	.stl-shell--learning .stl-sidebar-section__toggle {
		min-height: 72px;
		padding-right: 30px;
		padding-left: 30px;
	}

	.stl-shell--learning .stl-sidebar-section__number {
		font-size: 12px;
	}

	.stl-shell--learning .stl-sidebar-section__title {
		font-size: 18px;
		line-height: 1.24;
	}

	.stl-shell--learning .stl-sidebar-section.is-open ul {
		padding-top: 10px;
		padding-bottom: 30px;
	}

	.stl-shell--learning .stl-sidebar-section li a {
		min-height: 38px;
		margin-right: 22px;
		margin-left: 22px;
		padding: 9px 12px;
		font-size: 15.5px;
		line-height: 1.35;
	}

	.stl-shell--learning .stl-sidebar-lesson-number {
		font-size: 12px;
	}

	.stl-shell--learning .stl-actions-bar {
		padding-bottom: 40px;
	}

	.stl-shell--learning .stl-sidebar-head h1 {
		color: var(--stl-accent);
	}

	.stl-shell--learning .stl-sidebar-section.is-current .stl-sidebar-section__toggle {
		color: #0f172a;
	}

	.stl-shell--learning .stl-sidebar-lesson-number {
		color: var(--stl-accent);
	}
}

.stl-learning-sidebar {
	padding: 26px;
	border-right: 1px solid var(--stl-border);
	background: #ffffff;
}

.stl-back-link {
	display: inline-flex;
	margin-top: 8px;
	color: #6b7280;
	font-size: 12px;
	font-weight: 600;
	text-decoration: none;
}

.stl-sidebar-head {
	padding: 24px 28px 22px;
	border-bottom: 1px solid #e5e7eb;
}

.stl-sidebar-head h1 {
	margin: 0;
	color: var(--stl-accent);
	font-size: 20px;
	font-weight: 800;
	line-height: 1.3;
	overflow-wrap: anywhere;
}

.stl-sidebar-section + .stl-sidebar-section {
	margin-top: 0;
}

.stl-sidebar-section h2 {
	margin: 0;
	font-size: 15px;
}

.stl-sidebar-section__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	min-height: 66px;
	padding: 0 28px;
	border: 0;
	border-top: 1px solid #e5e7eb;
	background: transparent;
	box-shadow: none;
	color: #4b5563;
	font: inherit;
	font-weight: 800;
	text-align: left;
	cursor: pointer;
}

.stl-sidebar-section__label {
	display: grid;
	gap: 4px;
	min-width: 0;
}

.stl-sidebar-section__number {
	color: var(--stl-accent);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.stl-sidebar-section__title {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 15px;
	line-height: 1.22;
}

.stl-sidebar-section__toggle:hover,
.stl-sidebar-section__toggle:focus {
	background: transparent;
	color: var(--stl-accent-dark);
}

.stl-sidebar-section__chevron {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 8px;
	height: 8px;
	border: 0;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	color: #111827;
	font-size: 16px;
	line-height: 1;
	transform: rotate(45deg);
	transition: transform 0.16s ease;
}

.stl-sidebar-section.is-open .stl-sidebar-section__chevron {
	transform: rotate(-135deg);
}

.stl-sidebar-section:not(.is-open) ul {
	display: none;
}

.stl-sidebar-section.is-open ul {
	padding: 8px 0 26px;
}

.stl-sidebar-section.is-open + .stl-sidebar-section .stl-sidebar-section__toggle {
	border-top-color: #dbe4ec;
}

.stl-sidebar-section li a {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 10px;
	min-height: 30px;
	margin: 0 18px;
	padding: 7px 10px;
	border: 0;
	border-radius: 0 !important;
	background: #ffffff;
	color: #6b7280;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.35;
}

.stl-sidebar-section.is-current > h2 .stl-sidebar-section__toggle {
	background: #f7fafc;
	color: #0f172a;
}

.stl-sidebar-section.is-current > h2 .stl-sidebar-section__number,
.stl-sidebar-section.is-current > h2 .stl-sidebar-section__title {
	color: var(--stl-accent);
}

.stl-sidebar-section.is-current > h2 .stl-sidebar-section__chevron {
	color: #0f172a;
}

.stl-sidebar-lesson-number {
	flex: 0 0 auto;
	min-width: 26px;
	color: var(--stl-accent);
	font-size: 11px;
	font-weight: 800;
	opacity: 0.92;
}

.stl-sidebar-section li a span {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.stl-sidebar-section li.is-active a {
	border-right: 2px solid var(--stl-accent);
	background: #ffffff;
	box-shadow: none;
	color: var(--stl-accent);
	font-weight: 700;
}

.stl-learning-main {
	padding: 30px;
}

.stl-mobile-course-header {
	display: none;
}

.stl-mobile-nav-toggle,
.stl-mobile-nav-home {
	align-items: center;
	justify-content: center;
	width: 42px;
	min-height: 42px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: #0f172a;
	cursor: pointer;
}

.stl-mobile-nav-toggle {
	display: none;
}

.stl-mobile-nav-home {
	display: none;
	text-decoration: none;
}

.stl-mobile-nav-icon {
	display: inline-grid;
	gap: 5px;
	width: 24px;
	flex: 0 0 24px;
}

.stl-mobile-nav-icon span {
	display: block;
	width: 100%;
	height: 2px;
	background: currentColor;
}

.stl-mobile-nav-title {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.stl-mobile-nav-home svg {
	display: block;
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.8;
}

.stl-sidebar-title-row {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

.stl-sidebar-title-row h1 {
	flex: 1 1 auto;
}

.stl-mobile-nav-backdrop,
.stl-mobile-nav-close {
	display: none;
}

body.stl-mobile-menu-lock {
	overflow: hidden;
}

.stl-lesson-header,
.stl-lesson-flow,
.stl-actions-bar {
	transition: opacity 0.18s ease, transform 0.18s ease;
}

.stl-learning-layout.is-loading .stl-lesson-header,
.stl-learning-layout.is-loading .stl-lesson-flow,
.stl-learning-layout.is-loading .stl-actions-bar {
	opacity: 0.45;
}

.stl-lesson-header {
	margin-bottom: 22px;
}

.stl-lesson-header h2 {
	margin: 0;
	font-size: clamp(24px, 3vw, 38px);
	line-height: 1.04;
}

.stl-lesson-flow {
	display: grid;
	gap: 20px;
}

.stl-lesson-content-card {
	display: grid;
	gap: 22px;
	padding: 24px;
	border: 1px solid var(--stl-border);
	border-radius: var(--stl-radius);
	background: linear-gradient(180deg, #ffffff 0%, #fbfcfd 100%);
	box-shadow: var(--stl-shadow);
}

.stl-lesson-block {
	min-width: 0;
}

.stl-lesson-block + .stl-lesson-block {
	padding-top: 22px;
	border-top: 1px solid #e5edf3;
}

.stl-lesson-block--text,
.stl-lesson-caption,
.stl-lesson-block--file,
.stl-lesson-block--empty {
	color: var(--stl-muted);
}

.stl-lesson-block--intro {
	font-size: 17px;
	line-height: 1.75;
	color: var(--stl-text);
}

.stl-lesson-block--file,
.stl-lesson-block--empty {
	padding: 18px;
	border: 1px solid var(--stl-border);
	border-radius: var(--stl-radius);
	background: var(--stl-card-soft);
}

.stl-lesson-block--file p,
.stl-lesson-block--empty p {
	margin: 0;
}

.stl-lesson-caption {
	margin-top: 14px;
}

.stl-lesson-divider {
	display: flex;
	align-items: center;
	gap: 14px;
	color: #738295;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.stl-lesson-divider::before,
.stl-lesson-divider::after {
	content: "";
	flex: 1;
	height: 1px;
	background: #dbe6ee;
}

.stl-lesson-divider span {
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
}

.stl-lesson-divider + .stl-lesson-block {
	padding-top: 0;
	border-top: 0;
}

.stl-text-panel,
.stl-media-panel {
	padding: 24px;
}

.stl-text-panel {
	background: linear-gradient(180deg, #ffffff 0%, #fbfcfd 100%);
}

.stl-media-panel {
	overflow: hidden;
}

.stl-video-ratio {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	border-radius: var(--stl-radius);
	overflow: hidden;
	background: #061117;
}

.stl-video-ratio iframe,
.stl-video-ratio video {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	object-fit: contain;
}

.stl-media-image {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--stl-radius);
}

.stl-media-panel figcaption,
.stl-media-caption {
	margin-top: 14px;
}

.stl-actions-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-top: 22px;
}

.stl-my-courses-head,
.stl-auth-card,
.stl-empty-card {
	margin-bottom: 24px;
}

.stl-auth-card {
	width: min(100%, 620px);
	margin: 0 auto 22px;
	padding: 24px 28px;
	text-align: center;
}

.stl-auth-card h2 {
	font-size: clamp(24px, 3vw, 34px);
	line-height: 1.16;
}

.stl-auth-card p {
	max-width: 500px;
	margin: 14px auto 0;
	font-size: 15px;
	line-height: 1.65;
}

.stl-course-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 22px;
}

.stl-course-card {
	display: grid;
	overflow: hidden;
	background: linear-gradient(180deg, #ffffff 0%, #f9fbfd 100%);
}

.stl-course-card__media {
	display: block;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.stl-course-card__body {
	padding: 22px;
}

.stl-course-card__body h2 {
	margin: 12px 0;
	font-size: 22px;
	line-height: 1.12;
}

.stl-catalog-shell {
	padding-top: 32px;
	padding-bottom: 64px;
}

.stl-catalog-hero {
	margin-bottom: 22px;
	padding: 34px;
	border: 1px solid var(--stl-border);
	border-radius: var(--stl-container-radius, var(--stl-radius));
	background:
		radial-gradient(circle at top right, rgba(15, 118, 110, 0.12), transparent 30%),
		linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%);
	box-shadow: var(--stl-shadow);
}

.stl-catalog-hero h1 {
	margin: 0;
	font-size: clamp(28px, 3vw, 42px);
	line-height: 1.08;
}

.stl-catalog-hero p:last-child {
	max-width: 760px;
	margin: 12px 0 0;
	color: var(--stl-muted);
	font-size: 16px;
	line-height: 1.7;
}

.stl-catalog-grid,
.stl-account-course-grid {
	display: grid;
	grid-template-columns: repeat(var(--stl-catalog-columns, 3), minmax(0, 1fr));
	gap: 22px;
}

.stl-catalog-card,
.stl-account-course-card {
	border-radius: var(--stl-card-radius, var(--stl-radius));
	background: var(--stl-card);
	box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08);
}

.stl-catalog-card .stl-course-card__body,
.stl-account-course-card .stl-course-card__body {
	display: grid;
	gap: 12px;
	padding: 18px;
}

.stl-catalog-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	color: var(--stl-muted);
	font-size: 12px;
	font-weight: 800;
}

.stl-catalog-card__meta span:not(:last-child)::after {
	content: "|";
	margin-left: 8px;
	color: #9aa8b6;
}

.stl-catalog-card h2,
.stl-account-course-card h2 {
	margin: 0;
	font-size: clamp(18px, 2vw, 22px);
	line-height: 1.22;
}

.stl-catalog-excerpt {
	margin: 0;
	color: var(--stl-muted);
	font-size: 14px;
	line-height: 1.65;
}

.stl-catalog-card__footer {
	display: grid;
	gap: 14px;
	margin-top: 2px;
}

.stl-catalog-card .stl-price-html {
	font-size: 18px;
}

.stl-catalog-card .stl-button,
.stl-account-course-card .stl-button {
	min-height: 38px;
	padding-inline: 14px;
	font-size: 13px;
}

.stl-my-courses-shell {
	max-width: 1180px;
}

.woocommerce-account .stl-shortcode-shell {
	max-width: 100%;
	padding: 0;
}

.woocommerce-account .woocommerce::before,
.woocommerce-account .woocommerce::after {
	display: none !important;
	content: none !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation {
	border: 0 !important;
	box-shadow: none !important;
	padding-right: 0 !important;
	margin-right: 0 !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul,
.woocommerce-account .woocommerce-MyAccount-navigation li,
.woocommerce-account .woocommerce-MyAccount-navigation li a {
	border-right: 0 !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
	box-shadow: inset 3px 0 0 var(--stl-account-accent, var(--stl-accent)) !important;
}

.stl-my-courses-head {
	text-align: center;
}

.stl-my-courses-head h1 {
	font-size: clamp(24px, 3vw, 34px);
}

.stl-my-courses-head p:last-child {
	max-width: 720px;
	margin: 12px auto 0;
	font-size: 15px;
	line-height: 1.7;
}

.stl-empty-card--compact h2 {
	font-size: clamp(24px, 3vw, 34px);
}

.stl-account-course-grid {
	grid-template-columns: repeat(auto-fill, minmax(250px, 320px));
	align-items: start;
}

.stl-account-course-card .stl-course-card__media {
	min-height: 0;
}

.stl-account-course-card {
	max-width: 320px;
}

.woocommerce-account .stl-account-course-grid {
	grid-template-columns: repeat(auto-fill, minmax(240px, 300px));
	gap: 18px;
}

.woocommerce-account .stl-account-course-card {
	max-width: 300px;
}

.woocommerce-account .stl-account-course-card .stl-course-card__body {
	padding: 16px;
}

.woocommerce-account .stl-account-course-card h2 {
	font-size: 18px;
}

.stl-account-course-card .stl-button-row {
	gap: 8px;
}

.stl-account-course-card.is-locked {
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(248, 251, 253, 0.96) 100%);
}

.stl-account-course-card.is-locked .stl-course-card__media img {
	filter: saturate(0.9);
}

.stl-account-course-card.is-owned {
	border-color: #a7d8d1;
}

.stl-magic-card {
	width: min(100%, 430px);
	margin: 10px auto 20px;
	padding: 30px;
	border: 1px solid var(--stl-border);
	border-radius: var(--stl-radius);
	background: #ffffff;
	box-shadow: var(--stl-shadow);
	text-align: center;
}

.stl-magic-card h2 {
	margin: 0 0 8px;
	font-size: 26px;
	line-height: 1.15;
}

.stl-magic-card p {
	margin: 0 0 20px;
	color: var(--stl-muted);
	line-height: 1.65;
}

.stl-magic-form {
	display: grid;
	gap: 12px;
}

.stl-magic-form input[type="email"] {
	width: 100%;
	min-height: 48px;
	padding: 0 14px;
	border: 1px solid var(--stl-border);
	border-radius: var(--stl-radius);
	font-size: 16px;
}

.stl-magic-form .stl-button {
	width: 100%;
}

.stl-magic-message {
	margin-bottom: 18px;
	padding: 12px 14px;
	border-radius: var(--stl-radius);
	font-weight: 700;
}

.stl-magic-message--success {
	border: 1px solid #a7f3d0;
	background: #ecfdf5;
	color: #047857;
}

.stl-magic-message--error {
	border: 1px solid #fecaca;
	background: #fef2f2;
	color: #b91c1c;
}

.stl-woo-direct-checkout-button {
	border-radius: var(--stl-radius) !important;
	background: linear-gradient(135deg, #0f766e 0%, #155e63 100%) !important;
	color: #ffffff !important;
	font-weight: 800 !important;
}

body.stl-course-checkout-page {
	background: #eef3f7;
}

body.stl-course-checkout-page #masthead,
body.stl-course-checkout-page #colophon,
body.stl-course-checkout-page .site-header,
body.stl-course-checkout-page .site-footer,
body.stl-course-checkout-page .main-navigation,
body.stl-course-checkout-page .storefront-breadcrumb,
body.stl-course-checkout-page .woocommerce-breadcrumb,
body.stl-course-checkout-page .entry-header,
body.stl-course-checkout-page .page-header,
body.stl-course-checkout-page .widget-area,
body.stl-course-checkout-page .sidebar,
body.stl-course-checkout-page .wp-site-blocks > header,
body.stl-course-checkout-page .wp-site-blocks > footer {
	display: none !important;
}

body.stl-course-checkout-page .site,
body.stl-course-checkout-page .site-content,
body.stl-course-checkout-page .content-area,
body.stl-course-checkout-page .col-full,
body.stl-course-checkout-page .container,
body.stl-course-checkout-page .ast-container,
body.stl-course-checkout-page .ct-container,
body.stl-course-checkout-page .site-main,
body.stl-course-checkout-page article,
body.stl-course-checkout-page .entry-content,
body.stl-course-checkout-page .wp-site-blocks,
body.stl-course-checkout-page main {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

body.stl-course-checkout-page .woocommerce {
	width: min(calc(100% - var(--stl-checkout-outer-total, 22px)), var(--stl-checkout-width, 640px));
	max-width: var(--stl-checkout-width, 640px);
	margin: 10px auto 22px !important;
	color: #0f172a;
}

body.stl-course-checkout-page .woocommerce > h1,
body.stl-course-checkout-page .woocommerce > h2,
body.stl-course-checkout-page .woocommerce > h3,
body.stl-course-checkout-page .entry-title,
body.stl-course-checkout-page main h1:first-child {
	display: none !important;
}

body.stl-course-checkout-page .woocommerce-NoticeGroup-checkout,
body.stl-course-checkout-page .woocommerce-error:not(.stl-field-error),
body.stl-course-checkout-page .woocommerce-message:not(.stl-field-error),
body.stl-course-checkout-page .woocommerce-info:not(.stl-field-error) {
	display: none !important;
}

body.stl-course-checkout-page .form-row .woocommerce-error:not(.stl-field-error),
body.stl-course-checkout-page .form-row .error:not(.stl-field-error):not(.stl-email-confirm-message),
body.stl-course-checkout-page .form-row .wc-block-components-validation-error,
body.stl-course-checkout-page .form-row [class*="validation-error"]:not(.stl-field-error):not(.stl-email-confirm-message),
body.stl-course-checkout-page .form-row [class*="field-error"]:not(.stl-field-error):not(.stl-email-confirm-message) {
	display: none !important;
}

body.stl-course-checkout-page .woocommerce-form-login-toggle,
body.stl-course-checkout-page .woocommerce-form-login,
body.stl-course-checkout-page form.login,
body.stl-course-checkout-page #customer_login,
body.stl-course-checkout-page .woocommerce-account-fields,
body.stl-course-checkout-page .create-account,
body.stl-course-checkout-page .form-row:has(input[name="username"]),
body.stl-course-checkout-page .form-row:has(input#username),
body.stl-course-checkout-page p:has(input[name="username"]),
body.stl-course-checkout-page p:has(input#username) {
	display: none !important;
}

body.stl-course-checkout-page .stl-course-checkout {
	width: 100%;
	max-width: var(--stl-checkout-width, 640px);
	margin: 0 auto 10px;
	color: #0f172a;
}

body.stl-course-checkout-page .stl-course-checkout__panel,
body.stl-course-checkout-page form.checkout {
	width: 100%;
	max-width: var(--stl-checkout-width, 640px);
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;
	border: 1px solid #d8e2ea;
	background: #ffffff;
	box-shadow: 0 12px 34px rgba(15, 23, 42, 0.07);
	box-sizing: border-box;
}

body.stl-course-checkout-page .stl-course-checkout__summary {
	display: grid;
	gap: 12px;
	padding-bottom: 16px;
}

body.stl-course-checkout-page .stl-course-checkout__media {
	overflow: hidden;
	aspect-ratio: 16 / 9;
	background: #eef3f7;
}

body.stl-course-checkout-page .stl-course-checkout__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

body.stl-course-checkout-page .stl-course-checkout__placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	padding: 24px;
	color: var(--stl-accent, #0f766e);
	font-weight: 800;
	text-align: center;
}

body.stl-course-checkout-page .stl-course-checkout__product {
	padding: 0 var(--stl-checkout-mobile-padding, 20px);
}

body.stl-course-checkout-page .stl-course-checkout__kicker {
	margin: 0 0 7px;
	color: var(--stl-accent, #0f766e);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

body.stl-course-checkout-page .stl-course-checkout__product h2 {
	margin: 0;
	font-size: 18px;
	line-height: 1.22;
	letter-spacing: -0.025em;
}

body.stl-course-checkout-page .stl-course-checkout__meta {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-direction: column;
	gap: 6px;
	margin-top: 10px;
	font-size: 13px;
}

body.stl-course-checkout-page .stl-course-checkout__meta span {
	color: #475569;
}

body.stl-course-checkout-page .stl-course-checkout__meta strong {
	color: #0f172a;
	font-size: 15px;
	line-height: 1.2;
}

body.stl-course-checkout-page .stl-course-checkout__meta del,
body.stl-course-checkout-page .stl-course-checkout-order del {
	color: #0f172a !important;
	font-weight: 700;
	opacity: 1;
	text-decoration-color: #dc2626;
	text-decoration-thickness: 1px;
}

body.stl-course-checkout-page .stl-course-checkout__meta ins,
body.stl-course-checkout-page .stl-course-checkout-order ins {
	color: #0f766e !important;
	font-weight: 900;
	text-decoration: none;
}

body.stl-course-checkout-page .stl-course-checkout__meta del .amount,
body.stl-course-checkout-page .stl-course-checkout__meta del bdi,
body.stl-course-checkout-page .stl-course-checkout-order del .amount,
body.stl-course-checkout-page .stl-course-checkout-order del bdi {
	color: #0f172a !important;
}

body.stl-course-checkout-page .stl-course-checkout__meta ins .amount,
body.stl-course-checkout-page .stl-course-checkout__meta ins bdi,
body.stl-course-checkout-page .stl-course-checkout-order ins .amount,
body.stl-course-checkout-page .stl-course-checkout-order ins bdi {
	color: #0f766e !important;
}

body.stl-course-checkout-page form.checkout {
	margin-top: 0;
	padding: 18px var(--stl-checkout-mobile-padding, 20px) 20px;
}

body.stl-course-checkout-page form.checkout::before,
body.stl-course-checkout-page form.checkout::after,
body.stl-course-checkout-page .woocommerce::before,
body.stl-course-checkout-page .woocommerce::after {
	display: none !important;
	content: none !important;
}

body.stl-course-checkout-page .col2-set,
body.stl-course-checkout-page .col2-set .col-1,
body.stl-course-checkout-page .col2-set .col-2,
body.stl-course-checkout-page #customer_details,
body.stl-course-checkout-page #order_review {
	float: none !important;
	width: 100% !important;
	max-width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

body.stl-course-checkout-page .col2-set .col-2 {
	display: none !important;
}

body.stl-course-checkout-page .woocommerce-billing-fields,
body.stl-course-checkout-page .woocommerce-billing-fields__field-wrapper,
body.stl-course-checkout-page .woocommerce-input-wrapper,
body.stl-course-checkout-page .stl-course-checkout-order,
body.stl-course-checkout-page #payment {
	display: block;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

body.stl-course-checkout-page #customer_details,
body.stl-course-checkout-page .woocommerce-billing-fields,
body.stl-course-checkout-page .woocommerce-billing-fields__field-wrapper {
	margin: 0 !important;
	padding: 0 !important;
}

body.stl-course-checkout-page .woocommerce-billing-fields > h3 {
	margin: 0 0 16px;
	font-size: 0;
	line-height: 1.25;
	text-align: center;
}

body.stl-course-checkout-page .woocommerce-billing-fields > h3::before {
	content: "Data Customer";
	font-size: 17px;
	font-weight: 900;
}

body.stl-course-checkout-page .woocommerce-billing-fields__field-wrapper {
	display: grid;
	gap: 12px;
}

body.stl-course-checkout-page .form-row {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	box-sizing: border-box;
}

body.stl-course-checkout-page .form-row label {
	display: block;
	margin: 0 0 5px;
	color: #334155;
	font-size: 12px;
	font-weight: 800;
	line-height: 1.35;
}

body.stl-course-checkout-page .form-row .required {
	color: var(--stl-accent, #0f766e);
	text-decoration: none;
}

body.stl-course-checkout-page .form-row input.input-text,
body.stl-course-checkout-page .form-row textarea,
body.stl-course-checkout-page .form-row select {
	display: block;
	width: 100%;
	max-width: none;
	min-height: 44px;
	margin: 0;
	padding: 0 13px;
	border: 1px solid #d8e2ea;
	background: #ffffff;
	box-shadow: none;
	color: #0f172a;
	font-size: 14px;
	line-height: 1.45;
	outline: none;
	box-sizing: border-box;
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

body.stl-course-checkout-page .form-row input.input-text:focus,
body.stl-course-checkout-page .form-row textarea:focus,
body.stl-course-checkout-page .form-row select:focus {
	border-color: var(--stl-accent, #0f766e);
	box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.12);
}

body.stl-course-checkout-page .form-row input.input-text.stl-email-confirm-error {
	border-color: #ef4444;
	box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.12);
}

body.stl-course-checkout-page #billing_phone_field {
	margin-bottom: 16px !important;
}

body.stl-course-checkout-page .stl-email-confirm-message {
	display: none;
	margin-top: 6px;
	color: #b91c1c;
	font-size: 12px;
	font-weight: 800;
	line-height: 1.4;
}

body.stl-course-checkout-page .stl-email-confirm-message.is-visible {
	display: block;
}

body.stl-course-checkout-page .stl-field-error {
	display: block;
	margin-top: 6px;
	color: #b91c1c;
	font-size: 12px;
	font-weight: 800;
	line-height: 1.35;
}

body.stl-course-checkout-page .stl-course-checkout-order {
	margin: 14px 0 14px;
	padding: 10px 12px 12px;
	border: 1px solid #d8e2ea;
	background: #f8fafc;
}

body.stl-course-checkout-page .stl-course-checkout-order h3,
body.stl-course-checkout-page .stl-course-checkout-order__title {
	margin: 0;
	padding: 0 0 10px;
	border: 0 !important;
	color: #0f172a;
	font-size: 17px !important;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: -0.01em;
	text-align: center;
}

body.stl-course-checkout-page .stl-course-checkout-order h3::before,
body.stl-course-checkout-page .stl-course-checkout-order h3::after {
	display: none !important;
	content: none !important;
}

body.stl-course-checkout-page .stl-course-checkout-order__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) max-content;
	gap: 9px;
	align-items: center;
	padding-top: 8px;
	border-top: 1px solid #d8e2ea;
	color: #0f172a;
	font-size: 12px;
}

body.stl-course-checkout-page .stl-course-checkout-order__row span {
	font-size: 12px;
	font-weight: 800;
	line-height: 1.3;
}

body.stl-course-checkout-page .stl-course-checkout-order__row strong {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	font-size: 12.5px;
	line-height: 1.2;
	text-align: right;
	white-space: nowrap;
}

body.stl-course-checkout-page .stl-course-checkout-order__row strong del {
	font-size: 12px;
	line-height: 1.15;
}

body.stl-course-checkout-page .stl-course-checkout-order__row strong ins {
	font-size: 16px;
	line-height: 1.15;
}

body.stl-course-checkout-page #order_review_heading,
body.stl-course-checkout-page .woocommerce-checkout-review-order-table,
body.stl-course-checkout-page table.shop_table.woocommerce-checkout-review-order-table,
body.stl-course-checkout-page .wc-block-checkout__sidebar,
body.stl-course-checkout-page .wc-block-components-sidebar,
body.stl-course-checkout-page .wc-block-components-order-summary,
body.stl-course-checkout-page .wp-block-woocommerce-checkout-order-summary-block,
body.stl-course-checkout-page .wp-block-woocommerce-checkout-order-summary-cart-items-block,
body.stl-course-checkout-page .wp-block-woocommerce-checkout-order-summary-totals-block,
body.stl-course-checkout-page .wc-block-components-order-summary__button-text,
body.stl-course-checkout-page .fc-checkout-order-review,
body.stl-course-checkout-page .fc-checkout-order-review__inner,
body.stl-course-checkout-page .fc-checkout-order-review__head,
body.stl-course-checkout-page .fc-order-review,
body.stl-course-checkout-page .fc-order-summary,
body.stl-course-checkout-page .fc-sidebar,
body.stl-course-checkout-page .fc-checkout-sidebar,
body.stl-course-checkout-page .fc-checkout__sidebar,
body.stl-course-checkout-page .wcf-order-wrap,
body.stl-course-checkout-page .wcf-order-review,
body.stl-course-checkout-page .wcf-order-review-toggle,
body.stl-course-checkout-page .wfacp_order_summary,
body.stl-course-checkout-page .wfacp_order_summary_container,
body.stl-course-checkout-page .wfacp_mini_cart_start_h,
body.stl-course-checkout-page .checkout-sidebar,
body.stl-course-checkout-page .checkout-summary,
body.stl-course-checkout-page .order-review,
body.stl-course-checkout-page [class*="order-summary"],
body.stl-course-checkout-page [class*="order_summary"],
body.stl-course-checkout-page [class*="order-review"],
body.stl-course-checkout-page [class*="checkout-summary"],
body.stl-course-checkout-page [class*="checkout_sidebar"],
body.stl-course-checkout-page [class*="checkout-sidebar"],
body.stl-course-checkout-page [id*="order-summary"],
body.stl-course-checkout-page [id*="order_summary"],
body.stl-course-checkout-page [id*="order-review"] {
	display: none !important;
}

body.stl-course-checkout-page #payment {
	margin: 0;
	border: 0;
	background: transparent;
}

body.stl-course-checkout-page #payment > h3,
body.stl-course-checkout-page #payment legend,
body.stl-course-checkout-page .woocommerce-checkout-payment > h3,
body.stl-course-checkout-page .woocommerce-checkout-payment .payment-title {
	display: none !important;
}

body.stl-course-checkout-page #payment::before {
	display: block;
	margin: 0 0 12px;
	color: #0f172a;
	font-size: 17px !important;
	font-weight: 900;
	text-align: center;
	content: "Metode Pembayaran";
}

body.stl-course-checkout-page .woocommerce-form-coupon-toggle {
	margin: 0 0 10px;
	padding: 0;
	border: 0;
	background: transparent;
	color: #475569;
	font-size: 13px;
	line-height: 1.5;
	text-align: right;
}

body.stl-course-checkout-page .woocommerce-form-coupon-toggle .woocommerce-info {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: inherit;
	text-align: right;
}

body.stl-course-checkout-page form.checkout_coupon,
body.stl-course-checkout-page .woocommerce-form-coupon {
	margin: 0 0 14px;
	padding: 12px;
	border: 1px solid #d8e2ea;
	background: #f8fafc;
	box-sizing: border-box;
	text-align: right;
}

body.stl-course-checkout-page form.checkout_coupon p {
	margin: 0 0 8px;
}

body.stl-course-checkout-page form.checkout_coupon .form-row {
	display: block;
	width: 100%;
	margin: 0 0 8px !important;
}

body.stl-course-checkout-page form.checkout_coupon button,
body.stl-course-checkout-page .woocommerce-form-coupon button {
	min-height: 38px;
	padding: 0 14px;
	border: 0;
	background: var(--stl-accent, #0f766e);
	color: #ffffff;
	font-size: 12px;
	font-weight: 900;
}

body.stl-course-checkout-page #payment .wc_payment_methods {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
}

body.stl-course-checkout-page #payment .wc_payment_method {
	margin: 0 0 8px;
	padding: 9px 10px;
	border: 1px solid #e5edf3;
	background: #f8fafc;
}

body.stl-course-checkout-page #payment .wc_payment_method > label {
	margin: 0;
	color: #0f172a;
	font-size: 13px;
	font-weight: 800;
}

body.stl-course-checkout-page #payment .payment_box {
	margin: 9px 0 0;
	padding: 9px 11px;
	background: #ffffff;
	color: #475569;
	font-size: 12px;
	line-height: 1.6;
}

body.stl-course-checkout-page #payment .payment_box::before {
	display: none;
}

body.stl-course-checkout-page #payment .place-order {
	margin: 14px 0 0;
	padding: 0;
}

body.stl-course-checkout-page #payment #place_order {
	float: none;
	width: 100%;
	min-height: 46px;
	margin: 0;
	border: 0;
	background: linear-gradient(135deg, var(--stl-accent, #0f766e) 0%, #115e63 100%);
	color: #ffffff;
	font-size: 16px !important;
	font-weight: 900 !important;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

body.stl-course-checkout-page .woocommerce-privacy-policy-text,
body.stl-course-checkout-page .woocommerce-terms-and-conditions-wrapper {
	margin: 0 0 12px;
	color: #64748b;
	font-size: 12px;
	line-height: 1.6;
}

body.stl-course-checkout-page .woocommerce-privacy-policy-text:empty {
	display: none !important;
}

@media (max-width: 1180px) {
	.stl-learning-layout,
	.stl-course-hero {
		grid-template-columns: 1fr;
	}

	.stl-learning-sidebar {
		border-right: 0;
		border-bottom: 1px solid var(--stl-border);
	}

	.stl-course-hero__media {
		min-height: 240px;
	}

	.stl-course-hero__content {
		min-height: 0;
		overflow: visible;
	}

	.stl-purchase-panel {
		width: 100%;
	}

	.stl-catalog-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 782px) {
	body.stl-course-learning-page {
		background: #ffffff;
		--stl-mobile-learning-header-offset: 0px;
	}

	body.admin-bar.stl-course-learning-page {
		--stl-mobile-learning-header-offset: 46px;
	}

	body.stl-course-learning-page .stl-shell--learning {
		width: 100%;
		max-width: none;
		min-height: 100vh;
		margin: 0;
		padding: calc(60px + var(--stl-mobile-learning-header-offset)) 8px 8px;
	}

	body.stl-course-learning-page .stl-learning-layout {
		border: 0;
		background: #ffffff;
		box-shadow: none;
		overflow: visible;
	}

	body.stl-course-checkout-page .woocommerce {
		width: calc(100vw - var(--stl-checkout-outer-total, 22px));
		max-width: 100%;
		margin: 11px calc(50% - 50vw + var(--stl-checkout-outer-gap, 11px)) 16px !important;
		padding: 0;
	}

	body.stl-course-checkout-page .stl-course-checkout {
		width: 100%;
		max-width: 100%;
		margin-bottom: 8px;
	}

	body.stl-course-checkout-page .stl-course-checkout__summary {
		gap: 12px;
		padding-bottom: 16px;
	}

	body.stl-course-checkout-page .stl-course-checkout__product {
		padding: 0 var(--stl-checkout-mobile-padding, 20px);
	}

	body.stl-course-checkout-page .stl-course-checkout__product h2 {
		font-size: 18px;
	}

	body.stl-course-checkout-page .stl-course-checkout__meta {
		align-items: flex-start;
		flex-direction: column;
		gap: 6px;
	}

	body.stl-course-checkout-page form.checkout {
		padding: 18px var(--stl-checkout-mobile-padding, 20px) 20px;
	}

	body.stl-course-checkout-page .woocommerce-billing-fields > h3::before {
		font-size: 17px;
	}

	body.stl-course-checkout-page .stl-course-checkout-order h3,
	body.stl-course-checkout-page .stl-course-checkout-order__title,
	body.stl-course-checkout-page #payment::before {
		font-size: 17px;
	}

	body.stl-course-checkout-page .stl-course-checkout-order {
		margin: 14px 0 14px;
		padding: 10px 12px 12px;
	}

	body.stl-course-checkout-page .stl-course-checkout-order h3,
	body.stl-course-checkout-page .stl-course-checkout-order__title {
		display: block;
		margin: 0;
		padding: 0 0 9px;
		font-size: 17px !important;
		font-weight: 900;
		line-height: 1.25;
		letter-spacing: 0;
		text-align: center;
	}

	body.stl-course-checkout-page .stl-course-checkout-order__row {
		grid-template-columns: minmax(0, 1fr) max-content;
		gap: 9px;
		align-items: center;
		padding-top: 8px;
		font-size: 12px;
	}

	body.stl-course-checkout-page .stl-course-checkout-order__row span {
		font-size: 12px;
		line-height: 1.3;
		letter-spacing: 0;
	}

	body.stl-course-checkout-page .stl-course-checkout-order__row strong {
		font-size: 12.5px;
		line-height: 1.2;
		text-align: right;
		white-space: nowrap;
	}

	body.stl-course-checkout-page .stl-course-checkout-order__row strong del {
		font-size: 12px;
	}

	body.stl-course-checkout-page .stl-course-checkout-order__row strong ins {
		font-size: 16px;
	}

	body.stl-course-checkout-page #payment .wc_payment_method {
		padding: 9px 10px;
	}

	.woocommerce-account .woocommerce {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 auto !important;
		padding: 0 14px 28px !important;
	}

	.woocommerce-account .entry-title,
	.woocommerce-account main h1:first-child {
		margin: 18px 0 14px !important;
		font-size: 24px !important;
		line-height: 1.18 !important;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation,
	.woocommerce-account .woocommerce-MyAccount-content {
		float: none !important;
		clear: both !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation {
		padding: 0 !important;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation > :not(ul) {
		margin: 0 0 12px !important;
		padding: 0 !important;
		font-size: 14px !important;
		line-height: 1.35 !important;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation p,
	.woocommerce-account .woocommerce-MyAccount-navigation strong,
	.woocommerce-account .woocommerce-MyAccount-navigation span {
		font-size: 14px !important;
		line-height: 1.35 !important;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation img,
	.woocommerce-account .woocommerce-MyAccount-navigation .avatar {
		width: 46px !important;
		height: 46px !important;
		max-width: 46px !important;
		border-radius: 50% !important;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation ul {
		display: flex !important;
		flex-wrap: nowrap !important;
		gap: 8px !important;
		width: 100% !important;
		margin: 0 0 14px !important;
		padding: 0 0 8px !important;
		border: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
		overflow-x: auto !important;
		overflow-y: hidden !important;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: thin;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation li {
		display: block !important;
		flex: 0 0 auto !important;
		width: auto !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation li a {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 8px !important;
		min-height: 38px !important;
		width: auto !important;
		padding: 8px 12px !important;
		border: 1px solid var(--stl-account-border, #d8e2ea) !important;
		background: #ffffff !important;
		box-shadow: none !important;
		color: #0f172a !important;
		font-size: 13px !important;
		font-weight: 800 !important;
		line-height: 1.15 !important;
		white-space: nowrap !important;
		text-align: center !important;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation li a::before,
	.woocommerce-account .woocommerce-MyAccount-navigation li a i,
	.woocommerce-account .woocommerce-MyAccount-navigation li a svg {
		width: 16px !important;
		height: 16px !important;
		min-width: 16px !important;
		font-size: 16px !important;
		line-height: 1 !important;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
		border-color: #9dd8d0 !important;
		background: #e9f8f6 !important;
		box-shadow: inset 0 -2px 0 var(--stl-account-accent, var(--stl-accent)) !important;
		color: #0f766e !important;
	}

	.woocommerce-account .woocommerce-MyAccount-content {
		padding: 14px !important;
		border: 1px solid var(--stl-account-border, #d8e2ea) !important;
		background: #ffffff !important;
		box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06) !important;
	}

	.woocommerce-account .woocommerce-MyAccount-content > h2:first-child,
	.woocommerce-account .woocommerce-MyAccount-content > h3:first-child {
		margin-top: 0 !important;
		font-size: 20px !important;
		line-height: 1.2 !important;
	}

	.stl-shell {
		padding: 16px 12px 36px;
	}

	.stl-course-hero,
	.stl-learning-sidebar,
	.stl-learning-main,
	.stl-curriculum-card,
	.stl-auth-card,
	.stl-empty-card,
	.stl-my-courses-head,
	.stl-lesson-content-card,
	.stl-text-panel,
	.stl-media-panel {
		padding: 18px;
	}

	.stl-course-facts {
		font-size: 13px;
	}

	.stl-learning-layout {
		display: block;
		overflow: visible;
	}

	body.stl-course-learning-page .stl-learning-layout {
		overflow: visible;
	}

	.stl-learning-main {
		width: 100%;
		padding: 8px 12px 28px;
	}

	.stl-mobile-course-header {
		position: fixed;
		top: var(--stl-mobile-learning-header-offset);
		right: 0;
		left: 0;
		z-index: 99990;
		display: grid;
		grid-template-columns: 44px minmax(0, 1fr) 44px;
		align-items: center;
		gap: 8px;
		width: 100vw;
		min-height: 52px;
		padding: 0 10px;
		border-bottom: 1px solid #e5edf3;
		background: #ffffff;
		box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
	}

	.stl-mobile-nav-toggle,
	.stl-mobile-nav-home {
		display: inline-flex;
	}

	.stl-mobile-nav-icon {
		width: 23px;
	}

	.stl-mobile-nav-title {
		font-size: 14px;
		font-weight: 800;
		line-height: 1.25;
		text-align: center;
	}

	.stl-mobile-nav-backdrop {
		position: fixed;
		inset: 0;
		z-index: 99998;
		width: 100%;
		height: 100%;
		padding: 0;
		border: 0;
		background: rgba(15, 23, 42, 0.38);
		cursor: pointer;
	}

	.stl-learning-layout.is-mobile-menu-open .stl-mobile-nav-backdrop {
		display: block;
	}

	.stl-learning-sidebar {
		position: fixed;
		inset: 0 auto 0 0;
		z-index: 99999;
		display: block;
		width: min(78vw, 326px);
		max-width: 326px;
		margin: 0;
		padding: 14px 18px 22px;
		border: 0;
		border-right: 1px solid var(--stl-border);
		background: #ffffff;
		box-shadow: 18px 0 46px rgba(15, 23, 42, 0.18);
		overflow-y: auto;
		overscroll-behavior: contain;
		transform: translateX(-105%);
		transition: transform 0.22s ease;
	}

	.stl-learning-sidebar .stl-sidebar-head {
		margin: 0 0 14px;
		padding: 0 0 14px;
	}

	.stl-learning-layout.is-mobile-menu-open .stl-learning-sidebar {
		transform: translateX(0);
	}

	.stl-mobile-nav-close {
		display: flex;
		align-items: center;
		justify-content: center;
		flex: 0 0 30px;
		width: 30px;
		min-height: 30px;
		margin: 0 0 0 8px;
		padding: 0;
		border: 1px solid var(--stl-border);
		border-radius: var(--stl-radius);
		background: #ffffff;
		color: #0f172a;
		font-size: 17px;
		font-weight: 900;
		line-height: 1;
		cursor: pointer;
	}

	.stl-sidebar-head {
		margin-bottom: 12px;
	}

	.stl-sidebar-head h1 {
		font-size: clamp(20px, 6.4vw, 26px);
		line-height: 1.2;
	}

	.stl-sidebar-curriculum {
		display: grid;
		gap: 10px;
	}

	.stl-sidebar-section + .stl-sidebar-section {
		margin-top: 0;
	}

	.stl-sidebar-section h2 {
		margin-bottom: 0;
	}

	.stl-sidebar-section ul {
		max-height: 240px;
		overflow: auto;
		padding-right: 4px;
	}

	.stl-sidebar-section li a {
		padding: 9px 0;
		font-size: 13px;
	}

	.stl-sidebar-section__toggle {
		min-height: 46px;
		padding: 8px 0;
	}

	.stl-sidebar-section__title {
		font-size: 16px;
		line-height: 1.2;
	}

	.stl-sidebar-section li a {
		margin-right: 6px;
		margin-left: 22px;
		background: #ffffff;
		font-size: 12.8px;
		line-height: 1.32;
	}

	.stl-sidebar-section.is-current > h2 .stl-sidebar-section__toggle {
		width: calc(100% + 36px);
		margin-right: -18px;
		margin-left: -18px;
		padding-right: 18px;
		padding-left: 18px;
		background: #f7fafc;
	}

	.stl-lesson-header {
		margin-bottom: 18px;
		padding: 2px 2px 0;
	}

	.stl-lesson-header h2 {
		font-size: clamp(22px, 6vw, 26px);
		line-height: 1.16;
	}

	.stl-lesson-header .stl-kicker {
		margin-bottom: 8px;
		font-size: 11px;
		letter-spacing: 0.16em;
	}

	.stl-lesson-flow {
		gap: 18px;
	}

	.stl-shell--learning .stl-lesson-content-card {
		gap: 20px;
	}

	.stl-shell--learning .stl-lesson-block + .stl-lesson-block {
		padding-top: 20px;
	}

	.stl-actions-bar,
	.stl-curriculum-lesson,
	.stl-section-head {
		display: block;
	}

	.stl-actions-group {
		margin-bottom: 12px;
	}

	.stl-button-row .stl-button,
	.stl-actions-group .stl-button,
	.stl-hero-actions .stl-button,
	.stl-product-card .stl-button {
		width: 100%;
	}

	.stl-product-grid,
	.stl-course-cards {
		grid-template-columns: 1fr;
	}

	.stl-course-hero__media {
		min-height: 200px;
	}

	.stl-catalog-hero {
		padding: 22px;
	}

	.stl-catalog-grid,
	.stl-account-course-grid {
		grid-template-columns: 1fr;
	}

	.stl-catalog-card .stl-button-row,
	.stl-account-course-card .stl-button-row {
		display: grid;
		grid-template-columns: 1fr;
	}

	.stl-my-courses-shell {
		padding: 0;
	}

	.stl-account-course-grid {
		display: grid;
		grid-template-columns: 1fr;
		gap: 12px;
		width: 100%;
		max-width: 420px;
		margin: 0 auto;
	}

	.stl-account-course-card {
		display: grid;
		grid-template-columns: 1fr;
		width: 100%;
		max-width: 360px;
		min-height: 0;
		margin: 0 auto;
		overflow: hidden;
	}

	.stl-account-course-card .stl-course-card__media {
		height: auto;
		aspect-ratio: 16 / 9;
	}

	.stl-account-course-card .stl-course-card__body,
	.woocommerce-account .stl-account-course-card .stl-course-card__body {
		gap: 8px;
		padding: 12px;
	}

	.stl-account-course-card .stl-catalog-card__meta {
		gap: 4px 7px;
		font-size: 10.5px;
		line-height: 1.35;
	}

	.stl-account-course-card h2,
	.woocommerce-account .stl-account-course-card h2 {
		font-size: 16px;
		line-height: 1.22;
	}

	.stl-account-course-card .stl-price-html {
		font-size: 14px;
	}

	.stl-account-course-card .stl-button-row {
		display: grid;
		grid-template-columns: 1fr;
		gap: 7px;
	}

	.stl-account-course-card .stl-button {
		width: 100%;
		min-height: 34px;
		padding-inline: 10px;
		font-size: 12px;
	}

	.stl-magic-card {
		padding: 22px;
	}
}