/**
 * TutorBridgePro complete home page.
 * All selectors are scoped under .tbp-home or named tbp-home components.
 */
.tbp-home { overflow: clip; background: var(--tbp-color-surface); color: var(--tbp-color-text); }
.tbp-home h1,.tbp-home h2,.tbp-home h3,.tbp-home p { margin-top: 0; }
.tbp-home h2 { max-width: 18ch; margin-bottom: 1rem; font-size: clamp(2rem,4vw,3.35rem); line-height: 1.18; letter-spacing: -.035em; }
html[dir="rtl"] .tbp-home h2 { letter-spacing: -.02em; }
.tbp-home-section { padding-block: clamp(4.5rem,8vw,7rem); }
.tbp-home-section--soft { background: var(--tbp-color-surface-soft); }
.tbp-home-kicker { margin-bottom: .8rem; color: var(--tbp-color-accent); font-size: .84rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
html[dir="rtl"] .tbp-home-kicker { letter-spacing: 0; }
.tbp-home-heading { max-width: 52rem; margin: 0 auto clamp(2.25rem,5vw,3.75rem); text-align: center; }
.tbp-home-heading h2 { max-width: 20ch; margin-inline: auto; }
.tbp-home-heading p:last-child,.tbp-home-section p { color: var(--tbp-color-text-muted); line-height: 1.9; }
.tbp-home-hero { position: relative; isolation: isolate; min-height: 700px; padding-block: clamp(4rem,7vw,6.5rem); overflow: hidden; background: linear-gradient(135deg,color-mix(in srgb,var(--tbp-color-blue-600) 7%,var(--tbp-color-surface)),var(--tbp-color-surface) 48%,color-mix(in srgb,var(--tbp-color-gold-500) 9%,var(--tbp-color-surface))); border-bottom: 1px solid var(--tbp-color-border); }
.tbp-home-hero::before { position:absolute; z-index:-2; inset:0; background: linear-gradient(90deg,rgb(11 31 58 / 5%) 1px,transparent 1px),linear-gradient(rgb(11 31 58 / 5%) 1px,transparent 1px); background-size:3.2rem 3.2rem; mask-image:linear-gradient(to bottom,#000,transparent 92%); content:""; }
.tbp-home-motif { position:absolute; z-index:-1; inset-block-start:-2rem; inset-inline-end:-8rem; width:min(48rem,58vw); color:var(--tbp-color-navy-800); opacity:.17; transform:rotate(-3deg); pointer-events:none; }
.tbp-home-motif__grid,.tbp-home-motif__bridge { fill:none; stroke:currentColor; }
.tbp-home-motif__grid { opacity:.18; stroke-width:1; }.tbp-home-motif__bridge { stroke-width:4; stroke-linecap:round; stroke-linejoin:round; }.tbp-home-motif__nodes { fill:var(--tbp-color-gold-500); stroke:var(--tbp-color-surface); stroke-width:5; }
.tbp-home-hero__grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(26rem,.95fr); align-items:center; gap:clamp(3rem,6vw,6rem); }
.tbp-home-eyebrow { display:inline-flex; align-items:center; gap:.55rem; margin-bottom:1.25rem; padding:.45rem .8rem; border:1px solid color-mix(in srgb,var(--tbp-color-primary) 20%,var(--tbp-color-border)); border-radius:999px; background:color-mix(in srgb,var(--tbp-color-blue-100) 70%,var(--tbp-color-surface)); color:var(--tbp-color-heading); font-size:.9rem; font-weight:800; }
.tbp-home-eyebrow span { width:.5rem; height:.5rem; border-radius:50%; background:var(--tbp-color-gold-500); box-shadow:0 0 0 .3rem rgb(212 175 55 / 15%); }
.tbp-home-hero h1 { max-width:13ch; margin-bottom:1.2rem; font-size:clamp(3rem,5vw,4.8rem); line-height:1.1; letter-spacing:-.05em; }
html[dir="rtl"] .tbp-home-hero h1 { letter-spacing:-.025em; }
.tbp-home-hero h1 em { display:block; background:linear-gradient(120deg,var(--tbp-color-gold-600),var(--tbp-color-gold-500)); -webkit-background-clip:text; background-clip:text; color:transparent; font-style:normal; }
.tbp-home-hero__lead { max-width:46rem; margin-bottom:1.65rem; color:var(--tbp-color-text-muted); font-size:clamp(1rem,1.3vw,1.12rem); line-height:1.9; }
.tbp-home-search { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); overflow:hidden; padding:.65rem; border:1px solid var(--tbp-color-border); border-radius:1.3rem; background:var(--tbp-color-surface); box-shadow:0 1.8rem 4rem rgb(11 31 58 / 12%); }
.tbp-home-search__field { min-width:0; padding:.55rem .9rem .65rem; border-bottom:1px solid var(--tbp-color-border); border-inline-end:1px solid var(--tbp-color-border); }
.tbp-home-search__field:nth-child(3),.tbp-home-search__field:nth-child(6){border-inline-end:0}.tbp-home-search__field:nth-child(n+4){border-bottom:0}
.tbp-home-search__label { display:block; margin-bottom:.15rem; color:var(--tbp-color-text-muted); font-size:.75rem; font-weight:800; }
.tbp-home-search__select { position:relative; display:block; }.tbp-home-search select { width:100%; min-height:2rem; padding:0 1.5rem 0 0; appearance:none; border:0; outline:0; background:transparent; color:var(--tbp-color-heading); font-weight:700; }
html[dir="ltr"] .tbp-home-search select { padding:0 0 0 1.5rem; }.tbp-home-search__select svg { position:absolute; inset-block-start:50%; inset-inline-end:0; width:1.1rem; transform:translateY(-50%); pointer-events:none; }
.tbp-home-search__button { grid-column:1/-1; display:flex; align-items:center; justify-content:center; gap:.55rem; min-height:3.25rem; margin-top:.65rem; border:0; border-radius:.85rem; background:var(--tbp-color-primary); color:#fff; font-weight:800; cursor:pointer; }.tbp-home-search__button svg{width:1.15rem}.tbp-home-search__button:hover{background:var(--tbp-color-primary-hover)}
.tbp-home-proof { display:flex; flex-wrap:wrap; gap:.75rem 1.2rem; margin-top:1.25rem; color:var(--tbp-color-heading); }.tbp-home-proof span{display:flex;align-items:center;gap:.35rem;font-weight:800}.tbp-home-proof small{color:var(--tbp-color-text-muted);font-weight:600}
.tbp-home-hero__visual { position:relative; min-height:34rem; }.tbp-lesson-preview { position:absolute; inset:3.8rem 0 auto; overflow:hidden; border:1px solid var(--tbp-color-border); border-radius:1.6rem; background:var(--tbp-color-surface); box-shadow:0 2rem 5rem rgb(11 31 58 / 16%); transform:rotate(-1deg); }
html[dir="rtl"] .tbp-lesson-preview{transform:rotate(1deg)}.tbp-lesson-preview__top{display:flex;align-items:center;gap:.35rem;padding:1rem;border-bottom:1px solid var(--tbp-color-border);color:var(--tbp-color-text-muted);font-size:.8rem}.tbp-lesson-preview__top i{width:.55rem;height:.55rem;border-radius:50%;background:#ef6b75}.tbp-lesson-preview__top i:nth-child(2){background:#70c590}.tbp-lesson-preview__top i:nth-child(3){background:#e9bd42}.tbp-lesson-preview__top span{margin-inline:auto}
.tbp-lesson-preview__stage{display:grid;grid-template-columns:.9fr 1.1fr;gap:.8rem;padding:.8rem}.tbp-lesson-preview__profile,.tbp-lesson-preview__board{min-height:22rem;padding:1.1rem;border-radius:1rem}.tbp-lesson-preview__profile{display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(160deg,#dbe9f6,#b8cde1);color:#0b1f3a}.tbp-lesson-preview__profile>b{align-self:flex-start;padding:.45rem .65rem;border-radius:.55rem;background:#fff;font-size:.75rem}.tbp-lesson-preview__avatar{display:grid;place-items:center;width:8.5rem;height:8.5rem;margin:1rem;border-radius:50%;background:#1458a3;color:#fff;font-size:3.2rem;font-weight:800}.tbp-lesson-preview__profile small{margin-top:.3rem;text-align:center}.tbp-lesson-preview__board{display:flex;flex-direction:column;justify-content:center;background:#fff;color:#0b1f3a}.tbp-lesson-preview__board>strong{margin:1.2rem 0;font-size:2rem}.tbp-lesson-preview__board p{display:flex;gap:.55rem;align-items:center;color:#0b1f3a}.tbp-lesson-preview__board p span{padding:.55rem;border-radius:.55rem;background:#e5f2ff;font-weight:800}.tbp-lesson-preview__board p b{color:#b58d12}.tbp-lesson-preview__bars{display:flex;align-items:flex-end;gap:.5rem;height:5rem;margin-top:1rem}.tbp-lesson-preview__bars i{flex:1;height:42%;border-radius:.35rem .35rem 0 0;background:#e6b82d}.tbp-lesson-preview__bars i:nth-child(2){height:65%}.tbp-lesson-preview__bars i:nth-child(3){height:88%}.tbp-lesson-preview__bars i:nth-child(4){height:55%}.tbp-lesson-preview__bars i:nth-child(5){height:76%}
.tbp-float-card{position:absolute;display:flex;align-items:flex-start;gap:.75rem;max-width:20rem;padding:1rem;border:1px solid var(--tbp-color-border);border-radius:1rem;background:var(--tbp-color-surface);box-shadow:0 1rem 2.5rem rgb(11 31 58 / 14%);color:var(--tbp-color-primary);font-weight:800}.tbp-float-card span{display:grid;gap:.2rem;color:var(--tbp-color-heading)}.tbp-float-card small{color:var(--tbp-color-text-muted);font-weight:500;line-height:1.55}.tbp-float-card--top{inset-block-start:1rem;inset-inline-end:-1.5rem}.tbp-float-card--bottom{inset-block-end:1rem;inset-inline-start:-1.5rem}
.tbp-home-launch{background:var(--tbp-color-navy-950,#071a31);color:#fff}.tbp-home-launch h2,.tbp-home-platform h2,.tbp-gaza-section h2,.tbp-founding-section h2{color:#fff}.tbp-home-launch .tbp-home-kicker,.tbp-home-platform .tbp-home-kicker,.tbp-gaza-section .tbp-home-kicker,.tbp-founding-section .tbp-home-kicker{color:#f0c438}.tbp-home-launch p{color:#cbd9e8}.tbp-home-launch__grid{display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:3rem}.tbp-home-launch__actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.8rem}
.tbp-step-grid,.tbp-outcome-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.tbp-step-grid article,.tbp-outcome-grid article{padding:1.5rem;border:1px solid var(--tbp-color-border);border-radius:1.15rem;background:var(--tbp-color-surface);box-shadow:var(--tbp-shadow-sm)}.tbp-step-grid span,.tbp-outcome-grid span{display:inline-grid;place-items:center;width:2.5rem;height:2.5rem;margin-bottom:1.2rem;border-radius:.75rem;background:var(--tbp-color-blue-100);color:var(--tbp-color-primary);font-weight:800}.tbp-step-grid h3,.tbp-outcome-grid h3{font-size:1.15rem}

.tbp-trust-grid,.tbp-home-platform__grid,.tbp-groups-grid,.tbp-gaza-section__grid,.tbp-faq-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(3rem,7vw,7rem)}.tbp-text-link{color:var(--tbp-color-primary);font-weight:800;text-decoration:none}.tbp-trust-cards{display:grid;gap:1rem}.tbp-trust-cards article{display:grid;grid-template-columns:auto 1fr;gap:.15rem 1rem;padding:1.25rem;border:1px solid var(--tbp-color-border);border-radius:1rem;background:var(--tbp-color-surface)}.tbp-trust-cards article>span{grid-row:1/3;display:grid;place-items:center;width:2.7rem;height:2.7rem;border-radius:.75rem;background:var(--tbp-color-blue-100);color:var(--tbp-color-primary);font-weight:900}.tbp-trust-cards h3{margin-bottom:.2rem;font-size:1.05rem}
.tbp-home-platform{background:var(--tbp-color-navy-950,#071a31);color:#fff}.tbp-home-platform p{color:#cbd9e8}.tbp-platform-ui{display:grid;grid-template-columns:5rem 1fr;min-height:27rem;overflow:hidden;border:1px solid rgb(255 255 255 / 14%);border-radius:1.4rem;background:#fff;box-shadow:0 2rem 5rem rgb(0 0 0 / 22%)}.tbp-platform-ui__sidebar{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1.2rem;background:#0b1f3a}.tbp-platform-ui__sidebar b{display:grid;place-items:center;width:2.8rem;height:2.8rem;border-radius:.8rem;background:#1278e7;color:#fff}.tbp-platform-ui__sidebar i{width:2.5rem;height:.55rem;border-radius:999px;background:rgb(255 255 255 / 22%)}.tbp-platform-ui__main{padding:1.2rem;background:#f3f7fb}.tbp-platform-ui__header{display:flex;justify-content:space-between}.tbp-platform-ui__header span{width:30%;height:.8rem;border-radius:999px;background:#d2dfec}.tbp-platform-ui__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin:1.5rem 0}.tbp-platform-ui__stats i{height:6rem;border-radius:.8rem;background:linear-gradient(145deg,#dcecff,#edf4fb)}.tbp-platform-ui__schedule{display:grid;gap:.65rem;padding:1rem;border-radius:1rem;background:#fff;color:#0b1f3a}.tbp-platform-ui__schedule span{height:2.2rem;border-radius:.55rem;background:linear-gradient(90deg,#e6f2ff 30%,#fff 30%)}.tbp-check-list{display:grid;gap:.8rem;padding:0;list-style:none}.tbp-check-list li{display:flex;gap:.6rem}.tbp-check-list li::before{content:"✓";color:#f0c438;font-weight:900}
.tbp-curriculum-row{display:grid;grid-template-columns:repeat(6,1fr);gap:.8rem}.tbp-curriculum-row a{display:grid;gap:.35rem;padding:1.2rem;border:1px solid var(--tbp-color-border);border-radius:1rem;background:var(--tbp-color-surface);color:var(--tbp-color-heading);text-align:center;text-decoration:none}.tbp-curriculum-row strong{font-size:1.25rem}.tbp-curriculum-row span{color:var(--tbp-color-text-muted);font-size:.8rem}
.tbp-group-card{padding:1.5rem;border:1px solid var(--tbp-color-border);border-radius:1.25rem;background:linear-gradient(145deg,var(--tbp-color-surface),var(--tbp-color-surface-soft));box-shadow:var(--tbp-shadow-lg)}.tbp-group-card>div{display:flex;justify-content:space-between;gap:1rem;color:var(--tbp-color-primary);font-weight:800}.tbp-group-card h3{margin:2rem 0 1rem;font-size:1.6rem}.tbp-group-card ul{display:grid;gap:.7rem;padding-inline-start:1.2rem;color:var(--tbp-color-text-muted)}
.tbp-gaza-section{background:linear-gradient(135deg,#071a31,#0b2c4f);color:#fff}.tbp-gaza-section p{color:#dce8f4}.tbp-gaza-mark{position:relative;display:grid;place-items:center;width:min(22rem,75vw);aspect-ratio:1;margin:auto;border:1px solid rgb(255 255 255 / 12%);border-radius:50%;background:radial-gradient(circle,rgb(212 175 55 / 20%),transparent 62%)}.tbp-gaza-mark span{display:grid;place-items:center;width:8rem;height:8rem;border-radius:50%;background:#fff;color:#d63d4d;font-size:3.2rem;box-shadow:0 1.5rem 4rem rgb(0 0 0 / 25%)}.tbp-gaza-mark i{position:absolute;width:70%;height:1px;background:linear-gradient(90deg,transparent,#d4af37,transparent)}.tbp-gaza-mark i:nth-child(2){transform:rotate(60deg)}.tbp-gaza-mark i:nth-child(3){transform:rotate(-60deg)}.tbp-gaza-section__actions{display:flex;align-items:center;flex-wrap:wrap;gap:1rem}.tbp-gaza-section__actions span{max-width:24rem;color:#b9cbe0;font-size:.85rem}.tbp-button--gold{background:#d4af37;color:#071a31}.tbp-button--gold:hover{background:#efcc55;color:#071a31}
.tbp-founding-section{background:linear-gradient(120deg,var(--tbp-color-primary),#0b4a91);color:#fff}.tbp-founding-section p{color:#d9e9fa}.tbp-founding-section__grid{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2rem}.tbp-button--light{background:#fff;color:#0b4a91}.tbp-button--light:hover{background:#eef6ff;color:#0b4a91}
.tbp-outcome-grid{grid-template-columns:repeat(3,1fr)}.tbp-faq-grid{align-items:start}.tbp-faq-list{display:grid;gap:.75rem}.tbp-faq-list details{overflow:hidden;border:1px solid var(--tbp-color-border);border-radius:1rem;background:var(--tbp-color-surface)}.tbp-faq-list summary{padding:1.1rem 1.25rem;color:var(--tbp-color-heading);font-weight:800;cursor:pointer}.tbp-faq-list details p{padding:0 1.25rem 1.15rem;margin:0}.tbp-faq-list details[open]{border-color:color-mix(in srgb,var(--tbp-color-primary) 45%,var(--tbp-color-border));box-shadow:var(--tbp-shadow-sm)}
.tbp-home-final{padding-block:clamp(4rem,7vw,6rem);background:var(--tbp-color-surface-soft)}.tbp-home-final__inner{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:clamp(2rem,5vw,4rem);border:1px solid var(--tbp-color-border);border-radius:1.5rem;background:var(--tbp-color-surface);box-shadow:var(--tbp-shadow-lg)}.tbp-home-final__inner h2{font-size:clamp(2rem,4vw,3rem)}.tbp-home-final__inner>div:last-child{display:flex;flex-wrap:wrap;gap:.8rem}
html[data-theme="dark"] .tbp-lesson-preview__profile{background:linear-gradient(160deg,#1b4268,#17324e);color:#fff}html[data-theme="dark"] .tbp-lesson-preview__board{background:#0e253d;color:#fff}html[data-theme="dark"] .tbp-lesson-preview__board p{color:#fff}html[data-theme="dark"] .tbp-platform-ui{border-color:#29445e}
@media(max-width:1120px){.tbp-home-hero__grid{grid-template-columns:1fr}.tbp-home-hero__copy{max-width:56rem}.tbp-home-hero__visual{min-height:32rem}.tbp-home-motif{width:55rem;opacity:.1}.tbp-step-grid{grid-template-columns:repeat(2,1fr)}.tbp-curriculum-row{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){.tbp-home-section{padding-block:4rem}.tbp-home-launch__grid,.tbp-trust-grid,.tbp-home-platform__grid,.tbp-groups-grid,.tbp-gaza-section__grid,.tbp-faq-grid,.tbp-founding-section__grid{grid-template-columns:1fr}.tbp-home-launch__actions{justify-content:flex-start}.tbp-home-search{grid-template-columns:repeat(2,1fr)}.tbp-home-search__field:nth-child(3),.tbp-home-search__field:nth-child(6){border-inline-end:1px solid var(--tbp-color-border)}.tbp-home-search__field:nth-child(2n){border-inline-end:0}.tbp-home-search__field:nth-child(n+4){border-bottom:1px solid var(--tbp-color-border)}.tbp-home-search__field:nth-child(n+5){border-bottom:0}.tbp-home-final__inner{align-items:flex-start;flex-direction:column}.tbp-outcome-grid{grid-template-columns:1fr}.tbp-founding-section__grid{align-items:start}.tbp-gaza-section__grid>div:first-child{order:2}}
@media(max-width:600px){.tbp-home-hero{min-height:auto;padding-block:3rem 4rem}.tbp-home-hero h1{font-size:clamp(2.55rem,13vw,3.55rem)}.tbp-home-search{grid-template-columns:1fr;padding:.55rem}.tbp-home-search__field{border-inline-end:0!important;border-bottom:1px solid var(--tbp-color-border)!important}.tbp-home-search__field:nth-child(6){border-bottom:0!important}.tbp-home-hero__visual{min-height:26rem}.tbp-lesson-preview{inset:2.5rem -.75rem auto}.tbp-lesson-preview__stage{grid-template-columns:1fr 1.15fr}.tbp-lesson-preview__profile,.tbp-lesson-preview__board{min-height:16rem;padding:.7rem}.tbp-lesson-preview__avatar{width:5rem;height:5rem;font-size:2rem}.tbp-lesson-preview__board>strong{font-size:1.15rem}.tbp-lesson-preview__board p{flex-wrap:wrap}.tbp-float-card{display:none}.tbp-step-grid,.tbp-curriculum-row{grid-template-columns:1fr}.tbp-home-launch__actions,.tbp-gaza-section__actions,.tbp-home-final__inner>div:last-child{display:grid;width:100%}.tbp-home-launch__actions .tbp-button,.tbp-gaza-section__actions .tbp-button,.tbp-home-final__inner .tbp-button{width:100%;justify-content:center}.tbp-home-proof{display:grid}.tbp-platform-ui{grid-template-columns:3.5rem 1fr;min-height:22rem}.tbp-home h2{font-size:clamp(1.9rem,10vw,2.6rem)}}

.tbp-home-search select {
	color-scheme: light;
}

.tbp-home-search select option {
	background: #fff;
	color: #0b1f3a;
}

/* TutorBridgePro subject discovery carousel — polished v0.7.6. */
.tbp-subject-showcase {
	position: relative;
	isolation: isolate;
	overflow: clip;
}

.tbp-subject-showcase::before,
.tbp-subject-showcase::after {
	position: absolute;
	z-index: -1;
	width: 24rem;
	height: 24rem;
	border-radius: 50%;
	content: "";
	pointer-events: none;
}

.tbp-subject-showcase::before {
	inset-block-start: -12rem;
	inset-inline-start: -8rem;
	background: radial-gradient(circle, rgb(18 120 231 / 11%), transparent 70%);
}

.tbp-subject-showcase::after {
	inset-block-end: -14rem;
	inset-inline-end: -8rem;
	background: radial-gradient(circle, rgb(212 175 55 / 9%), transparent 70%);
}

.tbp-home-heading--split {
	display: grid;
	grid-template-columns: minmax(0, 49rem) auto;
	align-items: end;
	justify-content: center;
	gap: clamp(1.5rem, 4vw, 3.5rem);
	max-width: 70rem;
	margin-inline: auto;
	text-align: start;
}

.tbp-home-heading--split > div {
	max-width: 49rem;
}

.tbp-home-heading--split h2 {
	margin-inline: 0;
}

.tbp-home-heading--split p:last-child {
	max-width: 47rem;
}

.tbp-subject-showcase__all {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.55rem;
	flex: 0 0 auto;
	min-height: 3rem;
	padding: 0.7rem 1rem;
	border: 1px solid color-mix(in srgb, var(--tbp-color-primary) 24%, var(--tbp-color-border));
	border-radius: 999px;
	background: var(--tbp-color-surface);
	color: var(--tbp-color-primary);
	font-weight: 850;
	text-decoration: none;
	box-shadow: 0 0.35rem 1rem rgb(11 31 58 / 7%);
	transition:
		transform 180ms ease,
		border-color 180ms ease,
		box-shadow 180ms ease,
		background-color 180ms ease;
}

.tbp-subject-showcase__all:hover,
.tbp-subject-showcase__all:focus-visible {
	transform: translateY(-2px);
	border-color: var(--tbp-color-primary);
	box-shadow: 0 0.65rem 1.5rem rgb(18 120 231 / 12%);
	outline: 0;
}

.tbp-subject-showcase__all-icon {
	width: 0.8rem;
	height: 0.8rem;
	filter: invert(35%) sepia(82%) saturate(2460%) hue-rotate(196deg) brightness(91%);
}

.tbp-subject-carousel {
	position: relative;
	margin-inline: 0.35rem;
	padding-inline: 4rem;
}

.tbp-subject-grid {
	display: grid;
	grid-template-rows: repeat(2, minmax(0, 1fr));
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - 3rem) / 4);
	gap: 1rem;
	overflow-x: auto;
	padding: 0.35rem 0.2rem 1rem;
	scroll-behavior: smooth;
	scroll-snap-type: inline mandatory;
	scrollbar-width: none;
	overscroll-behavior-inline: contain;
}

.tbp-subject-grid::-webkit-scrollbar {
	display: none;
}

.tbp-subject-card {
	--tbp-subject-a: #1278e7;
	--tbp-subject-b: #0b4a91;
	position: relative;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	gap: 1rem;
	min-height: 7.15rem;
	padding: 1.15rem;
	overflow: hidden;
	border: 1px solid color-mix(in srgb, var(--tbp-subject-a) 17%, var(--tbp-color-border));
	border-radius: 1.2rem;
	background:
		linear-gradient(
			145deg,
			color-mix(in srgb, var(--tbp-subject-a) 4%, var(--tbp-color-surface)),
			var(--tbp-color-surface)
		);
	color: var(--tbp-color-heading);
	text-decoration: none;
	box-shadow: 0 0.55rem 1.4rem rgb(11 31 58 / 5%);
	scroll-snap-align: start;
	transition:
		transform 190ms ease,
		border-color 190ms ease,
		box-shadow 190ms ease,
		background 190ms ease;
}

.tbp-subject-card::after {
	position: absolute;
	inset-block-start: -2.8rem;
	inset-inline-end: -2.5rem;
	width: 7.4rem;
	height: 7.4rem;
	border-radius: 50%;
	background: radial-gradient(
		circle,
		color-mix(in srgb, var(--tbp-subject-a) 13%, transparent),
		transparent 70%
	);
	content: "";
	transition: transform 220ms ease;
}

.tbp-subject-card:hover,
.tbp-subject-card:focus-visible {
	transform: translateY(-3px);
	border-color: color-mix(in srgb, var(--tbp-subject-a) 50%, var(--tbp-color-border));
	box-shadow: 0 0.85rem 2rem color-mix(in srgb, var(--tbp-subject-a) 12%, transparent);
	outline: 0;
}

.tbp-subject-card:hover::after,
.tbp-subject-card:focus-visible::after {
	transform: scale(1.14);
}

.tbp-subject-card__icon {
	position: relative;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 3.65rem;
	height: 3.65rem;
	border-radius: 1.05rem;
	background: linear-gradient(145deg, var(--tbp-subject-a), var(--tbp-subject-b));
	box-shadow:
		0 0.55rem 1.1rem color-mix(in srgb, var(--tbp-subject-a) 22%, transparent),
		inset 0 1px 0 rgb(255 255 255 / 28%);
}

.tbp-subject-card__icon .tbp-visual-icon {
	width: 1.65rem;
	height: 1.65rem;
	filter: drop-shadow(0 2px 2px rgb(0 0 0 / 14%));
}

.tbp-subject-card__copy {
	position: relative;
	z-index: 1;
	display: grid;
	gap: 0.3rem;
	min-width: 0;
}

.tbp-subject-card__copy strong {
	font-size: 1.02rem;
	line-height: 1.35;
}

.tbp-subject-card__copy small {
	color: var(--tbp-color-text-muted);
	font-weight: 700;
}

.tbp-subject-card--gold { --tbp-subject-a: #d4af37; --tbp-subject-b: #9a7317; }
.tbp-subject-card--violet { --tbp-subject-a: #7c5cff; --tbp-subject-b: #4b2fb7; }
.tbp-subject-card--cyan { --tbp-subject-a: #0ea5c6; --tbp-subject-b: #056b87; }
.tbp-subject-card--rose { --tbp-subject-a: #ee5b78; --tbp-subject-b: #b92d4b; }
.tbp-subject-card--green { --tbp-subject-a: #28a96b; --tbp-subject-b: #147847; }
.tbp-subject-card--indigo { --tbp-subject-a: #5667e8; --tbp-subject-b: #303ea8; }
.tbp-subject-card--navy { --tbp-subject-a: #315d8e; --tbp-subject-b: #0b1f3a; }
.tbp-subject-card--electric { --tbp-subject-a: #1278e7; --tbp-subject-b: #054d9c; }
.tbp-subject-card--amber { --tbp-subject-a: #e6a12a; --tbp-subject-b: #a96108; }
.tbp-subject-card--teal { --tbp-subject-a: #159e9b; --tbp-subject-b: #0a6967; }
.tbp-subject-card--emerald { --tbp-subject-a: #158b5d; --tbp-subject-b: #075b3b; }
.tbp-subject-card--slate { --tbp-subject-a: #62758b; --tbp-subject-b: #324256; }
.tbp-subject-card--sky { --tbp-subject-a: #2d9bd8; --tbp-subject-b: #1669a2; }
.tbp-subject-card--mint { --tbp-subject-a: #3aae91; --tbp-subject-b: #1e7460; }
.tbp-subject-card--purple { --tbp-subject-a: #9b5de5; --tbp-subject-b: #6530a8; }
.tbp-subject-card--coral { --tbp-subject-a: #ef765f; --tbp-subject-b: #b94735; }
.tbp-subject-card--magenta { --tbp-subject-a: #d84ca3; --tbp-subject-b: #92276a; }
.tbp-subject-card--orange { --tbp-subject-a: #f07f2f; --tbp-subject-b: #b54e0e; }

.tbp-subject-carousel__control {
	position: absolute;
	z-index: 3;
	inset-block-start: 50%;
	display: grid;
	place-items: center;
	width: 3rem;
	height: 3rem;
	padding: 0;
	border: 1px solid var(--tbp-color-border);
	border-radius: 50%;
	background: var(--tbp-color-surface);
	box-shadow: 0 0.65rem 1.55rem rgb(11 31 58 / 12%);
	cursor: pointer;
	transform: translateY(-50%);
	transition:
		transform 180ms ease,
		border-color 180ms ease,
		opacity 180ms ease,
		box-shadow 180ms ease;
}

.tbp-subject-carousel__control:hover,
.tbp-subject-carousel__control:focus-visible {
	transform: translateY(-50%) scale(1.05);
	border-color: var(--tbp-color-primary);
	box-shadow: 0 0.75rem 1.75rem rgb(18 120 231 / 14%);
	outline: 0;
}

.tbp-subject-carousel__control:disabled {
	opacity: 0.28;
	cursor: not-allowed;
	box-shadow: none;
}

.tbp-subject-carousel__control .tbp-visual-icon {
	width: 0.8rem;
	height: 0.8rem;
	filter: brightness(0) saturate(100%) invert(36%) sepia(81%) saturate(1695%) hue-rotate(194deg);
}

.tbp-subject-carousel__control--prev {
	inset-inline-start: 0.65rem;
}

.tbp-subject-carousel__control--next {
	inset-inline-end: 0.65rem;
}

.tbp-subject-carousel__status {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.9rem;
	margin-top: 0.7rem;
	color: var(--tbp-color-text-muted);
	font-size: 0.82rem;
	font-weight: 800;
}

.tbp-subject-carousel__line {
	position: relative;
	width: 10rem;
	height: 0.38rem;
	overflow: hidden;
	border-radius: 999px;
	background: color-mix(in srgb, var(--tbp-color-border) 84%, transparent);
	box-shadow: inset 0 1px 2px rgb(11 31 58 / 8%);
}

.tbp-subject-carousel__line i {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	background: linear-gradient(90deg, var(--tbp-color-primary), var(--tbp-color-gold-500));
	transform: scaleX(var(--tbp-subject-progress, 0.2));
	transform-origin: left center;
	transition: transform 240ms ease;
}

html[dir="rtl"] .tbp-subject-carousel__line i {
	transform-origin: right center;
}

.tbp-subject-carousel__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	min-width: 5.2rem;
	min-height: 2rem;
	padding-inline: 0.65rem;
	border: 1px solid color-mix(in srgb, var(--tbp-color-primary) 14%, var(--tbp-color-border));
	border-radius: 999px;
	background: color-mix(in srgb, var(--tbp-color-primary) 4%, var(--tbp-color-surface));
	color: var(--tbp-color-heading);
	direction: ltr;
	font-variant-numeric: tabular-nums;
	unicode-bidi: isolate;
}

.tbp-subject-carousel__count b {
	color: var(--tbp-color-primary);
}

.tbp-subject-carousel__separator {
	color: var(--tbp-color-text-muted);
	font-weight: 750;
}

html[data-theme="dark"] .tbp-subject-card {
	background:
		linear-gradient(
			145deg,
			color-mix(in srgb, var(--tbp-subject-a) 8%, #0c2238),
			#0b2035
		);
	border-color: color-mix(in srgb, var(--tbp-subject-a) 23%, #29445e);
	box-shadow: none;
}

html[data-theme="dark"] .tbp-subject-showcase__all {
	background: #0d263e;
}

html[data-theme="dark"] .tbp-subject-carousel__count {
	background: #0d263e;
}

@media (max-width: 1120px) {
	.tbp-subject-grid {
		grid-auto-columns: calc((100% - 1rem) / 2);
	}
}

@media (max-width: 760px) {
	.tbp-home-heading--split {
		grid-template-columns: 1fr;
		align-items: start;
		justify-items: start;
		gap: 1.15rem;
		max-width: 48rem;
	}

	.tbp-subject-showcase__all {
		justify-self: start;
	}

	.tbp-subject-carousel {
		margin-inline: 0;
		padding-inline: 2.9rem;
	}

	.tbp-subject-carousel__control {
		width: 2.4rem;
		height: 2.4rem;
	}

	.tbp-subject-carousel__control--prev {
		inset-inline-start: 0.2rem;
	}

	.tbp-subject-carousel__control--next {
		inset-inline-end: 0.2rem;
	}

	.tbp-subject-grid {
		grid-auto-columns: calc((100% - 0.75rem) / 1.35);
		gap: 0.75rem;
	}

	.tbp-subject-card {
		min-height: 6.5rem;
		padding: 1rem;
	}

	.tbp-subject-card__icon {
		width: 3.25rem;
		height: 3.25rem;
	}
}

@media (max-width: 600px) {
	.tbp-subject-grid {
		grid-template-rows: 1fr;
		grid-auto-columns: 86%;
	}

	.tbp-subject-carousel {
		padding-inline: 0;
	}

	.tbp-subject-carousel__control {
		inset-block-start: auto;
		inset-block-end: -3.45rem;
	}

	.tbp-subject-carousel__control--prev {
		inset-inline-start: calc(50% - 3.2rem);
	}

	.tbp-subject-carousel__control--next {
		inset-inline-end: calc(50% - 3.2rem);
	}

	.tbp-subject-carousel__status {
		flex-wrap: wrap;
		margin-top: 4.35rem;
	}

	.tbp-subject-carousel__line {
		width: min(10rem, 48vw);
	}
}

@media (prefers-reduced-motion: reduce) {
	.tbp-subject-grid {
		scroll-behavior: auto;
	}

	.tbp-subject-card,
	.tbp-subject-card::after,
	.tbp-subject-carousel__control,
	.tbp-subject-showcase__all,
	.tbp-subject-carousel__line i {
		transition: none;
	}
}
