/* =============================================================
   Stock Pathshala — Classes landing page
   Self-contained. Every selector is namespaced with .sp-
   ========================================================== */

:root {
	--sp-blue:        #1d6fe8;
	--sp-blue-600:    #1560d4;
	--sp-blue-soft:   #e8f0fd;
	--sp-navy:        #0b2b63;
	--sp-navy-deep:   #08214c;
	--sp-ink:         #10233f;
	--sp-body:        #55637d;
	--sp-muted:       #7a879e;
	--sp-line:        #e4eaf5;
	--sp-bg:          #f4f7fd;
	--sp-white:       #ffffff;

	--sp-green:       #16a34a;
	--sp-purple:      #7c3aed;
	--sp-orange:      #f97316;
	--sp-amber:       #f5a623;

	--sp-r-sm:  8px;
	--sp-r:     12px;
	--sp-r-lg:  16px;

	--sp-shadow:      0 1px 2px rgba(16, 35, 63, .04), 0 6px 20px rgba(16, 35, 63, .06);
	--sp-shadow-lg:   0 10px 40px rgba(16, 35, 63, .10);

	--sp-max: 1200px;
}

/* -------------------------------------------------------------
   LAYOUT HARDENING

   Anything the site loads outside this file (Astra's dynamic CSS,
   a page builder, a plugin) can constrain a parent of .sp-container
   and squeeze the whole page into a narrow column. These rules make
   our own elements immune to inherited width, float and display
   constraints, so the layout holds regardless of what else is on
   the page.
   ----------------------------------------------------------- */
html body.sp-landing-body {
	width: 100%;
	max-width: none;
	min-width: 0;
	margin: 0;
	padding: 0;
	float: none;
	display: block;
}
body.sp-landing-body > .sp-header,
body.sp-landing-body > .sp-main,
body.sp-landing-body > .sp-cta-band,
body.sp-landing-body > .sp-footer,
.sp-main > section,
.sp-hero,
.sp-stats-wrap,
.sp-section,
.sp-lhead {
	width: 100%;
	max-width: none;
	float: none;
	clear: both;
	display: block;
}
.sp-main { width: 100%; max-width: none; margin: 0; padding: 0; }

/* ---------- reset (scoped to this page only) ---------- */
.sp-landing-body {
	margin: 0;
	background: var(--sp-white);
	color: var(--sp-body);
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	font-size: 15px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}
.sp-landing-body *,
.sp-landing-body *::before,
.sp-landing-body *::after { box-sizing: border-box; }

.sp-landing-body h1,
.sp-landing-body h2,
.sp-landing-body h3 {
	font-family: "Poppins", "Inter", sans-serif;
	color: var(--sp-navy);
	margin: 0;
	line-height: 1.25;
	letter-spacing: -.01em;
}
.sp-landing-body p  { margin: 0; }
.sp-landing-body ul { margin: 0; padding: 0; list-style: none; }
.sp-landing-body a  { color: inherit; text-decoration: none; }
.sp-landing-body img { max-width: 100%; height: auto; display: block; }

.sp-landing-body :focus-visible {
	outline: 2px solid var(--sp-blue);
	outline-offset: 2px;
	border-radius: 4px;
}

.sp-sr {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap; border: 0;
}
.sp-skip {
	position: absolute; left: -9999px;
	background: var(--sp-blue); color: #fff;
	padding: 10px 16px; z-index: 999;
}
.sp-skip:focus { left: 12px; top: 12px; }

.sp-container {
	width: 100%;
	max-width: var(--sp-max);
	margin-inline: auto;
	padding-inline: 20px;
}

/* =============================================================
   BUTTONS & LINKS
   ========================================================== */
.sp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-family: "Inter", sans-serif;
	font-size: 14px;
	font-weight: 600;
	padding: 11px 20px;
	border-radius: var(--sp-r-sm);
	border: 1px solid transparent;
	cursor: pointer;
	transition: background-color .18s ease, color .18s ease, border-color .18s ease;
	white-space: nowrap;
}
.sp-btn--primary { background: var(--sp-blue); color: #fff; }
.sp-btn--primary:hover { background: var(--sp-blue-600); }

.sp-btn--outline {
	background: #fff;
	color: var(--sp-blue);
	border-color: #c3d7f6;
}
.sp-btn--outline:hover { background: var(--sp-blue-soft); }

.sp-btn--ghost {
	background: transparent;
	color: #fff;
	border-color: rgba(255, 255, 255, .45);
}
.sp-btn--ghost:hover { background: rgba(255, 255, 255, .12); }

.sp-btn--lg    { padding: 14px 28px; font-size: 15px; }
.sp-btn--block { width: 100%; }

.sp-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--sp-blue);
	font-size: 14px;
	font-weight: 600;
}
.sp-link:hover { color: var(--sp-blue-600); }
.sp-link--sm { font-size: 13px; }

/* =============================================================
   HEADER
   ========================================================== */
.sp-header {
	position: sticky;
	top: 0;
	z-index: 60;
	background: #fff;
	border-bottom: 1px solid var(--sp-line);
}
.sp-header__inner {
	display: flex;
	align-items: center;
	gap: 28px;
	min-height: 68px;
}

.sp-logo {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	flex-shrink: 0;
}
.sp-logo__mark { display: flex; }
.sp-logo__text {
	font-family: "Poppins", sans-serif;
	font-size: 20px;
	font-weight: 700;
	color: var(--sp-navy);
	letter-spacing: -.02em;
}
.sp-logo__text span { color: var(--sp-blue); }

.sp-nav { margin-left: auto; }
.sp-nav__list {
	display: flex;
	align-items: center;
	gap: 26px;
}
.sp-nav__list > li > a {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 14px;
	font-weight: 500;
	color: #33405c;
	padding: 8px 0;
}
.sp-nav__list > li > a:hover { color: var(--sp-blue); }

.sp-nav__has-sub { position: relative; }
.sp-nav__sub,
.sp-nav .sub-menu {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	min-width: 190px;
	background: #fff;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-r);
	box-shadow: var(--sp-shadow);
	padding: 8px;
	opacity: 0;
	visibility: hidden;
	transition: opacity .16s ease;
}
.sp-nav__has-sub:hover > .sp-nav__sub,
.sp-nav__has-sub:focus-within > .sp-nav__sub,
.sp-nav .menu-item-has-children:hover > .sub-menu,
.sp-nav .menu-item-has-children:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
}
.sp-nav__sub a,
.sp-nav .sub-menu a {
	display: block;
	padding: 8px 12px;
	font-size: 14px;
	border-radius: 6px;
}
.sp-nav__sub a:hover,
.sp-nav .sub-menu a:hover { background: var(--sp-bg); color: var(--sp-blue); }

.sp-header__cta { flex-shrink: 0; padding: 9px 16px; font-size: 13px; }

.sp-burger {
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 40px;
	height: 40px;
	background: none;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-r-sm);
	cursor: pointer;
	margin-left: auto;
}
.sp-burger span {
	display: block;
	height: 2px;
	width: 18px;
	margin-inline: auto;
	background: var(--sp-navy);
	border-radius: 2px;
	transition: transform .2s ease, opacity .2s ease;
}
.sp-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.sp-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.sp-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* =============================================================
   HERO
   ========================================================== */
.sp-hero {
	position: relative;
	background: linear-gradient(180deg, #f7fafe 0%, #eef4fd 100%);
	padding: 62px 0 90px;
	overflow: hidden;
}
.sp-hero__bg {
	position: absolute;
	inset: 0;
	pointer-events: none;
}
.sp-hero__bg svg { width: 100%; height: 100%; }
.sp-hero__candles rect      { fill: #c9dcf7; opacity: .55; }
.sp-hero__candles .up rect  { fill: #bfe0cd; opacity: .6; }
.sp-hero__line {
	fill: none;
	stroke: #cadcf6;
	stroke-width: 1.5;
	opacity: .7;
}
.sp-hero__line--2 { stroke: #d7e4f8; }

.sp-hero__inner {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) 400px;
	gap: 60px;
	align-items: start;
}

.sp-hero__title {
	font-size: clamp(32px, 4vw, 47px);
	font-weight: 700;
	line-height: 1.16;
	letter-spacing: -.025em;
	margin-top: 22px;
}
.sp-hero__sub {
	max-width: 44ch;
	margin-top: 18px;
	font-size: 15.5px;
	color: var(--sp-body);
}

.sp-hero__pills {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	margin-top: 34px;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--sp-navy);
}
.sp-hero__pills li { display: flex; align-items: center; gap: 9px; }
.sp-pill__ico { color: var(--sp-blue); display: flex; }
.sp-pill__ico--green { color: var(--sp-green); }

/* ---------- lead form ---------- */
.sp-lead {
	background: #fff;
	border-radius: var(--sp-r-lg);
	box-shadow: var(--sp-shadow-lg);
	padding: 26px 26px 24px;
}
.sp-lead__title {
	font-size: 19px;
	font-weight: 700;
	text-align: center;
	line-height: 1.35;
	margin-bottom: 20px;
}
.sp-field {
	position: relative;
	margin-bottom: 12px;
}
.sp-field__ico {
	position: absolute;
	left: 14px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--sp-muted);
	display: flex;
	pointer-events: none;
}
.sp-field input {
	width: 100%;
	height: 46px;
	padding: 0 14px 0 42px;
	font-family: inherit;
	font-size: 14px;
	color: var(--sp-ink);
	background: #fbfcfe;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-r-sm);
	transition: border-color .16s ease, box-shadow .16s ease;
}
.sp-field input::placeholder { color: #9aa6bd; }
.sp-field input:focus {
	outline: none;
	border-color: var(--sp-blue);
	box-shadow: 0 0 0 3px rgba(29, 111, 232, .12);
}
.sp-field input[aria-invalid="true"] { border-color: #dc2626; }

.sp-lead .sp-btn { height: 46px; margin-top: 4px; }

.sp-lead__note {
	display: flex;
	gap: 8px;
	margin-top: 14px;
	font-size: 12px;
	line-height: 1.5;
	color: var(--sp-muted);
}
.sp-lead__note svg { flex-shrink: 0; margin-top: 2px; }

.sp-lead__msg {
	margin-top: 10px;
	font-size: 13px;
	font-weight: 500;
	text-align: center;
}
.sp-lead__msg.is-ok    { color: var(--sp-green); }
.sp-lead__msg.is-error { color: #dc2626; }

/* =============================================================
   STATS
   ========================================================== */
.sp-stats-wrap {
	position: relative;
	margin-top: -46px;
	padding-bottom: 40px;
	background: linear-gradient(180deg, #eef4fd 0%, #eef4fd 46px, var(--sp-white) 46px);
}
.sp-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	background: #fff;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-r);
	box-shadow: var(--sp-shadow);
	overflow: hidden;
}
.sp-stat {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	padding: 22px 16px;
	border-right: 1px solid var(--sp-line);
}
.sp-stat:last-child { border-right: 0; }
.sp-stat__ico { color: var(--sp-blue); display: flex; }
.sp-stat__ico--star { color: var(--sp-amber); }
.sp-stat__text { display: flex; flex-direction: column; }
.sp-stat__text strong {
	font-family: "Poppins", sans-serif;
	font-size: 19px;
	font-weight: 700;
	color: var(--sp-navy);
	line-height: 1.2;
}
.sp-stat__text small { font-size: 12.5px; color: var(--sp-muted); }

/* =============================================================
   SECTION SHELLS
   ========================================================== */
.sp-section { padding: 46px 0; }
.sp-section--classes { background: var(--sp-white); }
.sp-section--live    { background: var(--sp-white); }
.sp-section--why     { background: var(--sp-bg); padding: 40px 0 34px; }
.sp-section--help    { background: var(--sp-bg); padding: 0 0 44px; }
.sp-section--reviews { background: var(--sp-white); }

.sp-section__title {
	font-size: 24px;
	font-weight: 700;
	text-align: center;
}

.sp-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 22px;
}
.sp-head--center {
	flex-direction: column;
	align-items: center;
	gap: 6px;
}
.sp-head__title { font-size: 21px; font-weight: 700; }
.sp-head__sub   { font-size: 13.5px; color: var(--sp-muted); margin-top: 4px; }

.sp-empty {
	padding: 34px;
	text-align: center;
	color: var(--sp-muted);
	background: #fff;
	border: 1px dashed var(--sp-line);
	border-radius: var(--sp-r);
}

/* =============================================================
   CLASS CAROUSEL
   ========================================================== */
.sp-carousel { position: relative; }
.sp-carousel__viewport { overflow: hidden; }
.sp-carousel__track {
	display: flex;
	gap: 16px;
	transition: transform .4s cubic-bezier(.4, 0, .2, 1);
	will-change: transform;
}
.sp-cardslide {
	flex: 0 0 calc((100% - 5 * 16px) / 6);
	min-width: 0;
}

.sp-ccard {
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 9px;
	padding: 22px 14px 18px;
	background: #fff;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-r);
	transition: border-color .18s ease, box-shadow .18s ease;
}
.sp-ccard:hover {
	border-color: #c3d7f6;
	box-shadow: var(--sp-shadow);
}
.sp-ccard__ico {
	display: grid;
	place-items: center;
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background: var(--sp-blue);
	color: #fff;
	margin-bottom: 4px;
}
.sp-ccard--green  .sp-ccard__ico { background: var(--sp-green); }
.sp-ccard--purple .sp-ccard__ico { background: var(--sp-purple); }
.sp-ccard--orange .sp-ccard__ico { background: var(--sp-orange); }
.sp-ccard--teal   .sp-ccard__ico { background: #0d9488; }

.sp-ccard__title {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
}
.sp-ccard__count {
	font-size: 11.5px;
	font-weight: 500;
	color: var(--sp-body);
	background: var(--sp-bg);
	border-radius: 20px;
	padding: 3px 11px;
}
.sp-ccard__blurb {
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--sp-muted);
	flex-grow: 1;
}
.sp-ccard .sp-link { margin-top: 2px; }

.sp-carousel__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	background: #fff;
	color: var(--sp-navy);
	border: 1px solid var(--sp-line);
	border-radius: 50%;
	box-shadow: var(--sp-shadow);
	cursor: pointer;
	z-index: 2;
	transition: background-color .16s ease, opacity .16s ease;
}
.sp-carousel__nav:hover { background: var(--sp-bg); }
.sp-carousel__nav:disabled { opacity: .35; cursor: default; }
.sp-carousel__nav--prev { left: -17px; }
.sp-carousel__nav--next { right: -17px; }

.sp-carousel__dots {
	display: flex;
	justify-content: center;
	gap: 7px;
	margin-top: 20px;
}
.sp-carousel__dots button {
	width: 7px;
	height: 7px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #cfd9ea;
	cursor: pointer;
	transition: background-color .16s ease, width .16s ease;
}
.sp-carousel__dots button[aria-selected="true"] {
	background: var(--sp-blue);
	width: 18px;
	border-radius: 4px;
}

/* =============================================================
   LIVE CLASS LIST
   ========================================================== */
.sp-livelist {
	background: #fff;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-r);
	overflow: hidden;
}
.sp-liverow {
	display: grid;
	grid-template-columns: 62px 62px minmax(0, 1fr) 150px 140px 118px;
	align-items: center;
	gap: 16px;
	padding: 14px 18px;
	border-bottom: 1px solid var(--sp-line);
}
.sp-liverow:last-child { border-bottom: 0; }
.sp-liverow:hover { background: #fbfcfe; }

.sp-liverow__badge {
	display: grid;
	place-items: center;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .04em;
	color: var(--sp-green);
	background: #eafaf0;
	border: 1px solid #c6ecd6;
	border-radius: 5px;
	padding: 4px 0;
}
.sp-liverow__date { display: flex; flex-direction: column; }
.sp-liverow__date strong {
	font-size: 13.5px;
	font-weight: 700;
	color: var(--sp-navy);
	line-height: 1.3;
}
.sp-liverow__date small { font-size: 12px; color: var(--sp-muted); }

.sp-liverow__main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.sp-liverow__main strong {
	font-size: 14.5px;
	font-weight: 600;
	color: var(--sp-navy);
}
.sp-liverow__main small { font-size: 12.5px; color: var(--sp-muted); }

.sp-liverow__time { font-size: 12.5px; color: var(--sp-body); line-height: 1.45; }

.sp-liverow__mentor {
	display: flex;
	align-items: center;
	gap: 9px;
	font-size: 13px;
	color: var(--sp-ink);
	min-width: 0;
}
.sp-liverow__mentor img { border-radius: 50%; object-fit: cover; }
.sp-liverow__mentor span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.sp-avatar {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	flex-shrink: 0;
	border-radius: 50%;
	background: var(--sp-blue-soft);
	color: var(--sp-blue);
	font-size: 14px;
	font-weight: 600;
}
.sp-avatar--lg { width: 44px; height: 44px; font-size: 17px; }

.sp-liverow__cta { justify-self: end; padding: 8px 14px; font-size: 13px; }

/* =============================================================
   WHY LEARN
   ========================================================== */
.sp-why {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 26px;
	margin-top: 26px;
}
.sp-why__item { display: flex; gap: 12px; }
.sp-why__ico {
	flex-shrink: 0;
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 10px;
	background: #fff;
	border: 1px solid var(--sp-line);
	color: var(--sp-navy);
}
.sp-why__item h3 {
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 3px;
}
.sp-why__item p { font-size: 12.5px; line-height: 1.5; color: var(--sp-muted); }

/* =============================================================
   HELP BAND
   ========================================================== */
.sp-help {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr) auto;
	align-items: center;
	gap: 30px;
	background: #e9f0fc;
	border: 1px solid #d5e3fa;
	border-radius: var(--sp-r-lg);
	padding: 22px 30px;
}
.sp-help__media { position: relative; }
.sp-help__art { width: 100%; height: auto; }
.sp-help__copy h2 { font-size: 19px; font-weight: 700; margin-bottom: 6px; }
.sp-help__copy p  { font-size: 13.5px; max-width: 46ch; }

.sp-help__action { text-align: center; }
.sp-help__action small {
	display: block;
	margin-top: 10px;
	font-size: 12px;
	color: var(--sp-muted);
}

.sp-play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	border: 0;
	border-radius: 50%;
	background: #fff;
	color: var(--sp-navy);
	box-shadow: var(--sp-shadow);
	cursor: pointer;
	z-index: 2;
	transition: transform .16s ease;
}
.sp-play:hover { transform: translate(-50%, -50%) scale(1.06); }
.sp-play--lg { width: 58px; height: 58px; top: 42%; }

/* =============================================================
   TESTIMONIALS
   ========================================================== */
.sp-reviews {
	display: grid;
	grid-template-columns: repeat(3, 1fr) 1.15fr;
	gap: 16px;
	margin-top: 24px;
	align-items: stretch;
}
.sp-review {
	display: flex;
	flex-direction: column;
	gap: 9px;
	background: #fff;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-r);
	padding: 18px;
}
.sp-review__top { display: flex; align-items: center; gap: 12px; }
.sp-review__top img { border-radius: 50%; object-fit: cover; }
.sp-stars { display: inline-flex; gap: 2px; color: var(--sp-amber); }

.sp-review__quote {
	font-size: 12.5px;
	line-height: 1.6;
	color: var(--sp-body);
	flex-grow: 1;
}
.sp-review__name { font-size: 13px; font-weight: 600; color: var(--sp-navy); }
.sp-review__verified {
	display: flex;
	align-items: center;
	gap: 6px;
	padding-top: 9px;
	border-top: 1px solid var(--sp-line);
	font-size: 12px;
	color: var(--sp-green);
}

.sp-review--video {
	position: relative;
	justify-content: flex-end;
	padding: 0;
	overflow: hidden;
	border: 0;
	min-height: 190px;
	background:
		linear-gradient(180deg, rgba(8, 33, 76, .25) 0%, rgba(8, 33, 76, .88) 72%),
		linear-gradient(135deg, #1e3a63 0%, #0b2b63 100%);
}
.sp-review__vidcopy {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3px;
	padding: 16px;
	color: #fff;
	text-align: center;
}
.sp-review__vidcopy strong { font-size: 14px; font-weight: 600; }
.sp-review__vidcopy small  { font-size: 12px; color: rgba(255, 255, 255, .72); }
.sp-review__vidbtn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 8px;
	padding: 6px 14px;
	font-size: 12px;
	font-weight: 500;
	background: rgba(255, 255, 255, .16);
	border: 1px solid rgba(255, 255, 255, .25);
	border-radius: 20px;
}

/* =============================================================
   CLOSING CTA BAND
   ========================================================== */
.sp-cta-band {
	position: relative;
	background: var(--sp-navy-deep);
	padding: 40px 0;
	overflow: hidden;
}
.sp-cta-band::before,
.sp-cta-band::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 220px;
	background-image:
		linear-gradient(to right, rgba(255, 255, 255, .07) 4px, transparent 4px);
	background-size: 14px 100%;
	opacity: .5;
	pointer-events: none;
}
.sp-cta-band::before { left: 0; }
.sp-cta-band::after  { right: 0; }

.sp-cta-band__inner {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	flex-wrap: wrap;
}
.sp-cta-band__copy h2 {
	color: #fff;
	font-size: 24px;
	font-weight: 700;
	margin-bottom: 8px;
}
.sp-cta-band__copy p {
	color: rgba(255, 255, 255, .74);
	font-size: 14px;
	max-width: 48ch;
}
.sp-cta-band__actions { display: flex; gap: 14px; flex-wrap: wrap; }

/* =============================================================
   FOOTER
   ========================================================== */
.sp-footer { background: #fff; border-top: 1px solid var(--sp-line); }
.sp-footer__grid {
	display: grid;
	grid-template-columns: 1.5fr repeat(4, 1fr);
	gap: 34px;
	padding-top: 40px;
	padding-bottom: 34px;
}
.sp-footer__brand p {
	margin-top: 14px;
	font-size: 13px;
	line-height: 1.6;
	color: var(--sp-muted);
	max-width: 34ch;
}
.sp-social { display: flex; gap: 12px; margin-top: 18px; }
.sp-social a {
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	color: var(--sp-navy);
	background: var(--sp-bg);
	transition: background-color .16s ease, color .16s ease;
}
.sp-social a:hover { background: var(--sp-blue); color: #fff; }

.sp-footer__col h3 {
	font-size: 13.5px;
	font-weight: 600;
	margin-bottom: 12px;
}
.sp-footer__col ul { display: flex; flex-direction: column; gap: 8px; }
.sp-footer__col a { font-size: 13px; color: var(--sp-muted); }
.sp-footer__col a:hover { color: var(--sp-blue); }

.sp-footer__bar { background: var(--sp-navy-deep); }
.sp-footer__bar-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	padding-top: 13px;
	padding-bottom: 13px;
}
.sp-footer__bar p { font-size: 12.5px; color: rgba(255, 255, 255, .7); }
.sp-footer__bar ul { display: flex; gap: 26px; }
.sp-footer__bar a { font-size: 12.5px; color: rgba(255, 255, 255, .7); }
.sp-footer__bar a:hover { color: #fff; }

/* =============================================================
   RESPONSIVE
   ========================================================== */
@media (max-width: 1200px) {
	.sp-carousel__nav--prev { left: 4px; }
	.sp-carousel__nav--next { right: 4px; }
}

@media (max-width: 1080px) {
	.sp-cardslide { flex-basis: calc((100% - 3 * 16px) / 4); }
	.sp-liverow {
		grid-template-columns: 54px 58px minmax(0, 1fr) 130px 118px;
		row-gap: 10px;
	}
	.sp-liverow__cta { grid-column: 1 / -1; justify-self: start; }
	.sp-why { grid-template-columns: repeat(3, 1fr); }
	.sp-reviews { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 960px) {
	.sp-nav {
		position: fixed;
		inset: 68px 0 auto 0;
		background: #fff;
		border-bottom: 1px solid var(--sp-line);
		box-shadow: var(--sp-shadow);
		padding: 12px 20px 20px;
		display: none;
	}
	.sp-nav.is-open { display: block; }
	.sp-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
	.sp-nav__list > li { border-bottom: 1px solid var(--sp-line); }
	.sp-nav__list > li:last-child { border-bottom: 0; }
	.sp-nav__list > li > a { padding: 13px 0; justify-content: space-between; }
	.sp-nav__sub,
	.sp-nav .sub-menu {
		position: static;
		transform: none;
		opacity: 1;
		visibility: visible;
		border: 0;
		box-shadow: none;
		padding: 0 0 8px 12px;
		min-width: 0;
	}
	.sp-burger { display: flex; }
	.sp-header__cta { display: none; }

	.sp-hero { padding: 40px 0 70px; }
	.sp-hero__inner { grid-template-columns: 1fr; gap: 34px; }
	.sp-lead { max-width: 440px; }

	.sp-stats { grid-template-columns: repeat(2, 1fr); }
	.sp-stat:nth-child(2) { border-right: 0; }
	.sp-stat:nth-child(-n+2) { border-bottom: 1px solid var(--sp-line); }

	.sp-help { grid-template-columns: 1fr; text-align: center; }
	.sp-help__media { max-width: 240px; margin-inline: auto; }
	.sp-help__copy p { margin-inline: auto; }
}

@media (max-width: 760px) {
	.sp-cardslide { flex-basis: calc((100% - 16px) / 2); }
	.sp-why { grid-template-columns: repeat(2, 1fr); }

	.sp-head { flex-direction: column; align-items: flex-start; }

	.sp-liverow {
		grid-template-columns: 54px minmax(0, 1fr);
		row-gap: 8px;
		padding: 16px;
	}
	.sp-liverow__date  { grid-column: 2; }
	.sp-liverow__main  { grid-column: 1 / -1; }
	.sp-liverow__time  { grid-column: 1 / -1; }
	.sp-liverow__mentor{ grid-column: 1 / -1; }
	.sp-liverow__badge { align-self: start; }

	.sp-cta-band__inner { flex-direction: column; align-items: flex-start; }
	.sp-footer__grid { grid-template-columns: repeat(2, 1fr); gap: 26px; }
	.sp-footer__brand { grid-column: 1 / -1; }
	.sp-footer__bar-inner { flex-direction: column; align-items: flex-start; }
	.sp-footer__bar ul { gap: 18px; flex-wrap: wrap; }
}

@media (max-width: 520px) {
	.sp-cardslide { flex-basis: 100%; }
	.sp-stats { grid-template-columns: 1fr; }
	.sp-stat { border-right: 0; border-bottom: 1px solid var(--sp-line); }
	.sp-stat:last-child { border-bottom: 0; }
	.sp-why { grid-template-columns: 1fr; }
	.sp-reviews { grid-template-columns: 1fr; }
	.sp-hero__pills { gap: 14px 22px; }
	.sp-cta-band__actions { width: 100%; }
	.sp-cta-band__actions .sp-btn { flex: 1; }
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
	.sp-landing-body *,
	.sp-landing-body *::before,
	.sp-landing-body *::after {
		animation-duration: .001ms !important;
		transition-duration: .001ms !important;
	}
}

/* ---------- print ---------- */
@media print {
	.sp-header, .sp-carousel__nav, .sp-carousel__dots,
	.sp-cta-band, .sp-play { display: none !important; }
}


/* =============================================================
   SINGLE CLASS — breadcrumb, category chips, content block
   ========================================================== */
.sp-crumbs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-size: 12.5px;
	color: var(--sp-muted);
	margin-bottom: 6px;
}
.sp-crumbs a:hover { color: var(--sp-blue); }
.sp-crumbs span[aria-current] { color: var(--sp-navy); font-weight: 500; }

.sp-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.sp-chips a {
	display: inline-block;
	padding: 5px 13px;
	font-size: 12.5px;
	font-weight: 500;
	color: var(--sp-blue);
	background: #fff;
	border: 1px solid #d5e3fa;
	border-radius: 20px;
}
.sp-chips a:hover { background: var(--sp-blue); color: #fff; border-color: var(--sp-blue); }

/* ---------- the_content() block ---------- */
.sp-section--content { background: var(--sp-white); padding-top: 8px; }
.sp-contentcard {
	background: #fff;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-r-lg);
	padding: 30px 34px 34px;
}
.sp-contentcard__thumb {
	margin: 0 0 26px;
	border-radius: var(--sp-r);
	overflow: hidden;
}
.sp-contentcard__thumb img { width: 100%; }

/* Editor output — the one place raw tags are styled. */
.sp-prose { font-size: 15px; line-height: 1.75; color: var(--sp-body); max-width: 74ch; }
.sp-prose > * + * { margin-top: 18px; }
.sp-prose h2 { font-size: 21px; font-weight: 700; margin-top: 34px; }
.sp-prose h3 { font-size: 17px; font-weight: 600; margin-top: 26px; }
.sp-prose h4 { font-size: 15px; font-weight: 600; margin-top: 22px; color: var(--sp-navy); }
.sp-prose ul,
.sp-prose ol { padding-left: 22px; }
.sp-prose ul { list-style: disc; }
.sp-prose ol { list-style: decimal; }
.sp-prose li { margin-top: 7px; }
.sp-prose li::marker { color: var(--sp-blue); }
.sp-prose a { color: var(--sp-blue); text-decoration: underline; text-underline-offset: 2px; }
.sp-prose img { border-radius: var(--sp-r-sm); }
.sp-prose figure { margin: 0; }
.sp-prose blockquote {
	margin-left: 0;
	padding: 4px 0 4px 18px;
	border-left: 3px solid var(--sp-blue);
	color: var(--sp-navy);
	font-size: 15.5px;
}
.sp-prose table { width: 100%; border-collapse: collapse; font-size: 14px; }
.sp-prose th,
.sp-prose td { padding: 10px 12px; border: 1px solid var(--sp-line); text-align: left; }
.sp-prose th { background: var(--sp-bg); color: var(--sp-navy); font-weight: 600; }
.sp-prose code {
	font-size: 13px;
	background: var(--sp-bg);
	border-radius: 4px;
	padding: 2px 6px;
}

/* =============================================================
   CLASSES LIST  —  /stock-market-classes/  (archive + category)
   ========================================================== */
.sp-lhead {
	background: linear-gradient(180deg, #f7fafe 0%, #eef4fd 100%);
	padding: 24px 0 40px;
}
.sp-lhead__title {
	font-size: clamp(27px, 3.4vw, 38px);
	font-weight: 700;
	letter-spacing: -.022em;
	margin-top: 14px;
}
.sp-lhead__sub {
	max-width: 56ch;
	margin-top: 12px;
	font-size: 15px;
	color: var(--sp-body);
}
.sp-lhead__count {
	margin-top: 16px;
	font-size: 13px;
	font-weight: 500;
	color: var(--sp-blue);
}

.sp-section--list { padding: 40px 0 56px; }

.sp-lgrid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px;
}

.sp-lcard {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #fff;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-r);
	overflow: hidden;
	transition: border-color .18s ease, box-shadow .18s ease;
}
.sp-lcard:hover { border-color: #c3d7f6; box-shadow: var(--sp-shadow); }

.sp-lcard__media {
	display: block;
	aspect-ratio: 16 / 9;
	background: var(--sp-bg);
	overflow: hidden;
}
.sp-lcard__media img { width: 100%; height: 100%; object-fit: cover; }
.sp-lcard__ph {
	display: grid;
	place-items: center;
	width: 100%;
	height: 100%;
	color: var(--sp-blue);
	background: var(--sp-blue-soft);
}

.sp-lcard__body {
	display: flex;
	flex-direction: column;
	gap: 9px;
	padding: 18px;
	flex-grow: 1;
}
.sp-lcard__cat {
	align-self: flex-start;
	font-size: 11.5px;
	font-weight: 500;
	color: var(--sp-blue);
	background: var(--sp-blue-soft);
	border-radius: 20px;
	padding: 3px 11px;
}
.sp-lcard__title { font-size: 16.5px; font-weight: 600; line-height: 1.35; }
.sp-lcard__title a:hover { color: var(--sp-blue); }
.sp-lcard__excerpt {
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--sp-muted);
	flex-grow: 1;
}
.sp-lcard__body .sp-link { margin-top: 2px; }

/* ---------- pagination ---------- */
.sp-landing-body .pagination,
.sp-landing-body .nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin-top: 36px;
}
.sp-landing-body .page-numbers {
	display: grid;
	place-items: center;
	min-width: 38px;
	height: 38px;
	padding: 0 12px;
	font-size: 14px;
	font-weight: 500;
	color: var(--sp-navy);
	background: #fff;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-r-sm);
}
.sp-landing-body .page-numbers:hover { background: var(--sp-bg); border-color: #c3d7f6; }
.sp-landing-body .page-numbers.current {
	background: var(--sp-blue);
	border-color: var(--sp-blue);
	color: #fff;
}
.sp-landing-body .screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap;
}

@media (max-width: 1080px) {
	.sp-lgrid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 960px) {
	.sp-contentcard { padding: 24px 20px 26px; }
}
@media (max-width: 640px) {
	.sp-lgrid { grid-template-columns: 1fr; }
}
