/*
 * Public top page — Atlas design language.
 * Consumes the token layer in assets/css/tokens.css only; no other palette.
 * Scrolling is native everywhere: no wheel handlers, no scroll hijacking.
 */

.sasal-front {
	background: var(--surface-page);
}

/* ---- Shared section scaffolding ---- */

.sasal-front-section {
	max-width: var(--container-max);
	margin: 0 auto;
	padding: var(--section-y) var(--gutter);
}

.sasal-front-section--wide {
	max-width: none;
	padding-inline: max(var(--gutter), calc((100vw - var(--container-max)) / 2 + var(--gutter)));
}

.sasal-front-section__heading .sasal-eyebrow {
	margin: 0 0 14px;
}

.sasal-front h2 {
	font: var(--type-h2);
	letter-spacing: var(--tracking-heading);
	max-width: 24ch;
}

.sasal-front h3 {
	font: var(--type-h3);
}

.sasal-front-band {
	background: var(--surface-sunken);
}

.sasal-front-band--sunken {
	background: var(--surface-sunken);
}

.sasal-front-split {
	display: grid;
	grid-template-columns: minmax(280px, 1fr) minmax(0, 1.2fr);
	gap: clamp(40px, 6vw, 70px);
	align-items: start;
}

.sasal-front-note {
	font: var(--type-body);
	margin-top: 18px;
	max-width: 56ch;
}

.sasal-front-text-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 26px;
	font: var(--type-label);
	color: var(--text-link);
}

.sasal-front-text-link:hover {
	color: var(--text-link-hover);
}

.sasal-front-empty {
	margin-top: 24px;
	color: var(--text-muted);
	font: var(--type-body-sm);
}

.sasal-front-empty-state {
	margin-top: 18px;
	padding: var(--card-padding);
	border: 1px dashed var(--border-default);
	border-radius: var(--radius-card);
	color: var(--text-body);
}

.sasal-front-empty-state strong {
	display: block;
	color: var(--text-primary);
	font: var(--type-h4);
}

.sasal-front-empty-state p {
	margin-top: 6px;
	font: var(--type-body-sm);
	color: var(--text-muted);
}

/* Pills — everything you touch. */
.sasal-front-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: var(--control-height-lg);
	padding: 0 22px;
	border: 1px solid transparent;
	border-radius: var(--radius-control);
	font: var(--type-label);
	font-size: var(--text-base);
	cursor: pointer;
	transition: var(--transition-control);
}

.sasal-front-pill--inverse {
	background: var(--paper-0);
	color: var(--text-primary);
}

.sasal-front-pill--inverse:hover {
	background: var(--paper-100);
	color: var(--text-primary);
}

.sasal-front-pill--outline {
	border-color: var(--border-subtle);
	background: var(--paper-0);
	color: var(--text-primary);
	height: var(--control-height-md);
}

.sasal-front-pill--outline:hover {
	border-color: var(--border-strong);
	color: var(--text-primary);
}

.sasal-front-pill--outline i {
	font-style: normal;
	font-weight: var(--weight-semibold);
}

/* Numbers are always Plex Mono. */
.sasal-front-hero__stats dd,
.sasal-front-intents li span,
.sasal-front-profile-metrics strong,
.sasal-front-country-row > b,
.sasal-front-coverage,
.sasal-front-gmv h2,
.sasal-front-review-count b,
.sasal-front-deal-row time,
.sasal-front-step > span,
.sasal-front-stages b,
.sasal-front-editorial-card__meta time,
.sasal-front-linkedin-card__meta time {
	font-family: var(--font-mono);
}

/* ---- Hero ---- */

.sasal-front-hero {
	position: relative;
	min-height: 100svh;
	background: var(--surface-inverse-deep);
	overflow: hidden;
	display: flex;
	align-items: flex-end;
}

.sasal-front-hero__map,
.sasal-front-hero__map svg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.sasal-atlas-map__sphere {
	fill: var(--map-sea);
}

.sasal-atlas-map__countries path {
	fill: var(--field-700);
	stroke: var(--map-stroke);
	stroke-width: 0.6;
}

.sasal-atlas-map__countries path.is-active {
	fill: var(--map-land-active);
}

.sasal-atlas-map__countries path.is-focus {
	fill: var(--map-land-focus);
}

.sasal-atlas-map__route {
	fill: none;
	stroke: var(--map-route);
	stroke-width: 1.4;
	stroke-opacity: 0.85;
	stroke-dasharray: 3 7;
	stroke-linecap: round;
	animation: sasal-atlas-route-flow 2.4s linear infinite;
}

@keyframes sasal-atlas-route-flow {
	to { stroke-dashoffset: -10; }
}

.sasal-atlas-map__pin-halo {
	fill: var(--map-pin);
	opacity: 0.16;
	transform-origin: center;
	transform-box: fill-box;
	animation: sasal-atlas-pin-pulse 3.2s var(--ease-standard) infinite;
}

@keyframes sasal-atlas-pin-pulse {
	0%, 100% { opacity: 0.16; transform: scale(1); }
	50% { opacity: 0.26; transform: scale(1.18); }
}

@media (prefers-reduced-motion: reduce) {
	.sasal-atlas-map__route,
	.sasal-atlas-map__pin-halo {
		animation: none;
	}
}

.sasal-atlas-map__pin-dot {
	fill: var(--map-pin);
}

.sasal-atlas-map__pin text {
	fill: rgba(255, 255, 255, 0.8);
	font-family: var(--font-mono);
	font-size: 15px;
}

.sasal-front-hero__scrim {
	position: absolute;
	inset: 0;
	background: var(--scrim-map);
	pointer-events: none;
}

.sasal-front-hero__overlay {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: var(--container-wide);
	margin: 0 auto;
	padding: calc(var(--header-height) + 40px) var(--gutter) 40px;
}

.sasal-front-hero__eyebrow {
	color: var(--text-inverse-muted);
}

.sasal-front-hero h1 {
	margin-top: 14px;
	font: var(--type-h1);
	letter-spacing: var(--tracking-display);
	color: var(--text-inverse);
	max-width: 22ch;
}

.sasal-front-hero__lede {
	margin-top: 18px;
	font-size: var(--text-lg);
	line-height: var(--leading-relaxed);
	color: rgba(255, 255, 255, 0.75);
	max-width: 56ch;
}

.sasal-front-hero__actions {
	display: flex;
	gap: 12px;
	margin-top: 26px;
}

.sasal-front-hero__stats {
	display: flex;
	margin: 32px 0 0;
	border-top: 1px solid var(--border-inverse);
}

.sasal-front-hero__stats > div {
	flex: 1;
	padding: 14px 22px 0;
	border-right: 1px solid var(--border-inverse);
}

.sasal-front-hero__stats > div:first-child {
	padding-left: 0;
}

.sasal-front-hero__stats > div:last-child {
	border-right: none;
}

.sasal-front-hero__stats dt {
	font: var(--type-eyebrow);
	letter-spacing: var(--tracking-eyebrow);
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.55);
}

.sasal-front-hero__stats dd {
	margin: 8px 0 0;
	font-size: 27px;
	color: var(--text-inverse);
}

.sasal-front-hero__stats dd.sasal-front-hero__date {
	font-size: var(--text-lg);
	padding-top: 8px;
}

/* ---- Intro ---- */

.sasal-front-intro {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
	gap: clamp(40px, 6vw, 90px);
	margin-top: 24px;
	align-items: start;
}

.sasal-front-intents {
	display: grid;
	gap: 0;
	margin: 28px 0 0;
	padding: 0;
	list-style: none;
}

.sasal-front-intents li {
	display: flex;
	align-items: baseline;
	gap: 18px;
	padding: 16px 0;
	border-top: 1px solid var(--border-subtle);
}

.sasal-front-intents li span {
	font-size: var(--text-sm);
	color: var(--text-accent);
	letter-spacing: 0.1em;
}

.sasal-front-intents li strong {
	font: var(--type-h4);
	color: var(--text-primary);
}

.sasal-front-profile-metrics {
	padding: var(--card-padding);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-card);
	background: var(--surface-card);
	box-shadow: var(--shadow-xs);
}

.sasal-front-profile-metrics article {
	padding: 16px 0 0;
	margin-top: 16px;
	border-top: 1px solid var(--border-subtle);
}

.sasal-front-profile-metrics article span {
	font: var(--type-label);
	color: var(--text-body);
	display: block;
}

.sasal-front-profile-metrics article strong {
	display: block;
	margin-top: 8px;
	font-size: var(--text-3xl);
	font-weight: var(--weight-regular);
	color: var(--text-primary);
}

.sasal-front-profile-metrics article small {
	display: block;
	margin-top: 6px;
	font: var(--type-body-sm);
	color: var(--text-muted);
}

/* ---- Company rails: cards per Atlas. ---- */

.sasal-front-company-rail {
	display: grid;
	align-items: start;
	grid-auto-columns: minmax(265px, 300px);
	grid-auto-flow: column;
	gap: var(--grid-gap);
	margin-top: 36px;
	padding-bottom: 8px;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scroll-snap-type: inline proximity;
}

/* The Ecosystem Users rail moves through its cards automatically. Pointer
 * dragging is disabled without interfering with vertical page scrolling or
 * the links within each card. */
.sasal-front-company-rail[data-sasal-auto-company-rail] {
	overflow-x: hidden;
	scroll-snap-type: none;
	touch-action: pan-y;
}

.sasal-front-company-card a {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: var(--card-padding);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-card);
	background: var(--surface-card);
	box-shadow: var(--shadow-xs);
	color: var(--text-body);
	scroll-snap-align: start;
	transition: box-shadow var(--duration-slow) var(--ease-standard);
}

.sasal-front-company-card a:hover {
	box-shadow: var(--shadow-md);
	color: var(--text-body);
}

.sasal-front-company-card__identity {
	display: flex;
	align-items: center;
	gap: 12px;
}

.sasal-front-company-card__identity img,
.sasal-front-company-card__identity i {
	display: grid;
	place-items: center;
	flex: 0 0 42px;
	width: 42px;
	height: 42px;
	border-radius: var(--radius-circle);
	border: 1px solid var(--border-subtle);
	object-fit: cover;
	font-style: normal;
	font-weight: var(--weight-medium);
	color: var(--text-primary);
	background: var(--surface-sunken);
}

.sasal-front-company-card__identity strong {
	font: var(--type-h4);
	color: var(--text-primary);
}

.sasal-front-company-card__summary {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	font: var(--type-body-sm);
	color: var(--text-muted);
}

.sasal-front-company-card__facts {
	display: grid;
	gap: 7px;
	margin: 0;
	padding-top: 12px;
	border-top: 1px solid var(--border-subtle);
}

.sasal-front-company-card__facts > div {
	min-width: 0;
}

.sasal-front-company-card__facts dd {
	min-width: 0;
	margin: 0;
	overflow: hidden;
	color: var(--text-primary);
	font: var(--type-body-sm);
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ---- Country distribution ---- */

.sasal-front-country-rows {
	display: grid;
	gap: 0;
	align-self: center;
}

.sasal-front-country-row {
	display: grid;
	grid-template-columns: minmax(120px, 0.6fr) 1fr 64px;
	gap: 20px;
	align-items: center;
	padding: 16px 0;
	border-top: 1px solid var(--border-subtle);
}

.sasal-front-country-row:last-child {
	border-bottom: 1px solid var(--border-subtle);
}

.sasal-front-country-row > span {
	font: var(--type-label);
	color: var(--text-primary);
}

.sasal-front-country-row i {
	display: block;
	height: 8px;
	border-radius: var(--radius-pill);
	background: var(--surface-sunken);
	overflow: hidden;
}

.sasal-front-country-row i b {
	display: block;
	height: 100%;
	border-radius: var(--radius-pill);
	background: var(--green-700);
}

.sasal-front-country-row > b {
	font-size: var(--text-lg);
	font-weight: var(--weight-regular);
	color: var(--text-primary);
	text-align: right;
}

/* ---- Sector map (restyle of the monthly report shortcode output) ---- */

.sasal-front-sectors .sasal-monthly-sector-map {
	border: 0;
	background: transparent;
	padding: 0;
}

/* ---- Scale map ---- */

.sasal-front-scale {
	align-self: stretch;
	display: flex;
	flex-direction: column;
}

.sasal-front-scale > small {
	font: var(--type-eyebrow);
	letter-spacing: var(--tracking-eyebrow);
	text-transform: uppercase;
	color: var(--text-muted);
	text-align: right;
}

.sasal-front-scale__plot {
	position: relative;
	flex: 1;
	min-height: 260px;
	margin-top: 16px;
	border-left: 1px solid var(--border-default);
	border-bottom: 1px solid var(--border-default);
}

.sasal-front-scale__plot a {
	position: absolute;
	width: 14px;
	height: 14px;
	transform: translate(-50%, 50%);
	border-radius: var(--radius-circle);
	background: var(--coral-500);
	border: 3px solid var(--paper-0);
	box-shadow: var(--shadow-sm);
	transition: box-shadow var(--duration-fast) var(--ease-standard);
}

.sasal-front-scale__plot a:hover {
	box-shadow: var(--shadow-md);
}

.sasal-front-disclosure {
	margin-top: 24px;
	padding-top: 14px;
	border-top: 1px solid var(--border-subtle);
	font: var(--type-body-sm);
	color: var(--text-muted);
	max-width: 48ch;
}

.sasal-front-coverage {
	margin-top: 12px;
	font-size: var(--text-sm);
	color: var(--text-primary);
}

/* ---- GMV ---- */

.sasal-front-gmv h2 {
	margin-top: 14px;
	font-size: clamp(52px, 8vw, 108px);
	font-weight: var(--weight-light);
	letter-spacing: var(--tracking-display);
	line-height: 1;
	max-width: none;
}

.sasal-front-gmv h2 small {
	font-size: 0.22em;
	letter-spacing: 0;
	color: var(--text-muted);
}

.sasal-front-gmv__as-of {
	margin-top: 12px;
	font: var(--type-mono-sm);
	color: var(--text-muted);
}

.sasal-front-deal-list {
	display: grid;
	margin-top: 36px;
	border-top: 1px solid var(--border-subtle);
}

.sasal-front-deal-row {
	display: grid;
	grid-template-columns: 120px minmax(0, 1fr) minmax(0, 0.5fr) 24px;
	gap: 20px;
	align-items: baseline;
	padding: 16px 0;
	border-bottom: 1px solid var(--border-subtle);
	color: var(--text-body);
	border-radius: var(--radius-sm);
	transition: background-color var(--duration-fast) var(--ease-standard);
}

.sasal-front-deal-row:hover {
	background: var(--paper-0);
	color: var(--text-body);
}

.sasal-front-deal-row time {
	font-size: var(--text-xs);
	color: var(--text-muted);
}

.sasal-front-deal-row strong {
	font: var(--type-h4);
	color: var(--text-primary);
}

.sasal-front-deal-row span {
	font: var(--type-body-sm);
	color: var(--text-muted);
}

.sasal-front-deal-row i {
	font-style: normal;
	color: var(--text-link);
	text-align: right;
}

/* ---- Testimonials ---- */

.sasal-front-review-count {
	margin-top: 14px;
	font: var(--type-eyebrow);
	letter-spacing: var(--tracking-eyebrow);
	text-transform: uppercase;
	color: var(--text-muted);
}

.sasal-front-review-count b {
	margin-left: 8px;
	font-size: var(--text-lg);
	font-weight: var(--weight-medium);
	color: var(--text-primary);
}

.sasal-front-testimonial-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: var(--grid-gap);
	margin-top: 32px;
}

.sasal-front-testimonial-card {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: var(--card-padding);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-card);
	background: var(--surface-card);
	box-shadow: var(--shadow-xs);
}

.sasal-front-testimonial-card__head {
	display: flex;
	align-items: center;
	gap: 12px;
}

.sasal-front-testimonial-card__head img {
	width: 40px;
	height: 40px;
	border-radius: var(--radius-circle);
	object-fit: cover;
}

.sasal-front-testimonial-card__head strong {
	display: block;
	font: var(--type-label);
	color: var(--text-primary);
}

.sasal-front-testimonial-card__head p {
	font: var(--type-body-sm);
	color: var(--text-muted);
}

.sasal-front-testimonial-card h3 {
	font: var(--type-h4);
}

.sasal-front-testimonial-card__quote {
	font: var(--type-body-sm);
	line-height: var(--leading-relaxed);
	color: var(--text-body);
}

.sasal-front-testimonial-card__quote p + p {
	margin-top: 10px;
}

/* ---- Platform steps ---- */

.sasal-front-platform {
	display: grid;
	gap: clamp(32px, 4vw, 52px);
	align-items: start;
}

.sasal-front-platform > :first-child {
	max-width: 740px;
}

/* Keep the key front-page promises on one line on desktop. They return to
 * normal wrapping below this breakpoint, where preserving the viewport is
 * more important than holding a single line. */
@media (min-width: 1101px) {
	.sasal-front-platform > :first-child {
		max-width: none;
	}

	#sasal-front-intro-title,
	#sasal-front-platform-title,
	#sasal-front-portfolio-title,
	#sasal-front-quality-title,
	#sasal-front-social-title {
		max-width: none;
		font-size: clamp(var(--text-3xl), 2.75vw, var(--text-4xl));
		white-space: nowrap;
	}
}

.sasal-front-steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--grid-gap);
}

.sasal-front-step {
	display: flex;
	flex-direction: column;
	gap: 18px;
	align-items: flex-start;
	padding: var(--card-padding) 28px;
	background: var(--surface-card);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-card);
}

.sasal-front-step > div {
	display: flex;
	flex: 1;
	flex-direction: column;
}

.sasal-front-step > span {
	font-size: var(--text-sm);
	color: var(--text-accent);
	letter-spacing: 0.1em;
}

.sasal-front-step h3 {
	font: var(--type-h4);
	font-size: var(--text-xl);
}

.sasal-front-step p {
	margin-top: 8px;
	font: var(--type-body-sm);
	max-width: 52ch;
}

.sasal-front-step img {
	margin-top: 14px;
	border-radius: var(--radius-media);
	border: 1px solid var(--border-subtle);
}

.sasal-front-step a {
	display: inline-flex;
	gap: 8px;
	margin-top: 12px;
	font: var(--type-label);
}

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

/* ---- Quality & Trust ---- */

/* The adjacent sections provide their own outer rhythm: avoid stacking a
 * second lower gutter before the following editorial section. */
.sasal-front-section--quality {
	padding-top: clamp(56px, 4vw, 72px);
	padding-bottom: 0;
}

.sasal-front-quality {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: var(--grid-gap);
	margin-top: 36px;
}

.sasal-front-quality article {
	padding: var(--card-padding);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-card);
	background: var(--surface-card);
	box-shadow: var(--shadow-xs);
}

.sasal-front-quality article h3 {
	margin-top: 12px;
}

.sasal-front-stages {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 0;
	position: relative;
	margin: 28px 0 0;
	padding: 0;
	list-style: none;
}

.sasal-front-stages::before {
	position: absolute;
	top: 17px;
	left: calc(100% / 12);
	right: calc(100% / 12);
	height: 1px;
	background: var(--border-default);
	content: "";
}

.sasal-front-stages li {
	position: relative;
	text-align: center;
}

.sasal-front-stages b {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	margin: 0 auto;
	border: 1px solid var(--green-300);
	border-radius: var(--radius-circle);
	background: var(--surface-card);
	color: var(--green-800);
	font-weight: var(--weight-medium);
	font-size: var(--text-xs);
	line-height: 1;
}

.sasal-front-stages span {
	display: block;
	margin-top: 10px;
	font-size: var(--text-2xs);
	color: var(--text-muted);
}

.sasal-front-quality .sasal-front-stages + .sasal-front-note {
	margin-top: 28px;
	padding: 12px 0 12px 16px;
	border-left: 2px solid var(--green-500);
	color: var(--text-body);
	font: var(--type-body-sm);
	line-height: var(--leading-relaxed);
}

.sasal-front-certification {
	display: flex;
	align-items: center;
	gap: 24px;
	margin-top: 22px;
}

.sasal-front-certification__seal {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 96px;
	height: 96px;
	border: 1.5px solid var(--text-primary);
	border-radius: var(--radius-circle);
	color: var(--text-primary);
}

.sasal-front-certification__seal span {
	margin-top: 3px;
	font-size: var(--text-2xs);
	font-weight: var(--weight-semibold);
	letter-spacing: 0.14em;
}

.sasal-front-certification__seal small {
	font-size: 10px;
	letter-spacing: 0.14em;
	color: var(--text-muted);
}

.sasal-front-certification ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 6px;
	font: var(--type-body-sm);
}

/* ---- Editorial cards (news, social) ---- */

.sasal-front-editorial-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: var(--grid-gap);
	margin-top: 36px;
}

.sasal-front-editorial-grid--rail {
	grid-template-columns: none;
	grid-auto-columns: minmax(280px, 300px);
	grid-auto-flow: column;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scroll-behavior: smooth;
	scroll-snap-type: inline proximity;
	padding-bottom: 8px;
}

.sasal-front-editorial-card a {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-card);
	background: var(--surface-card);
	box-shadow: var(--shadow-xs);
	color: var(--text-body);
	scroll-snap-align: start;
	transition: box-shadow var(--duration-slow) var(--ease-standard);
}

.sasal-front-editorial-card a:hover {
	box-shadow: var(--shadow-md);
	color: var(--text-body);
}

.sasal-front-editorial-card__media {
	display: block;
	aspect-ratio: 3 / 2;
	background: var(--surface-sunken);
}

.sasal-front-editorial-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sasal-front-editorial-card__meta {
	display: flex;
	gap: 10px;
	padding: 16px 18px 0;
	font-size: var(--text-xs);
	color: var(--text-muted);
}

.sasal-front-editorial-card__meta b {
	color: var(--text-link);
	font-weight: var(--weight-medium);
}

.sasal-front-editorial-card strong {
	padding: 10px 18px 0;
	font: var(--type-h4);
	color: var(--text-primary);
}

.sasal-front-editorial-card__summary {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	margin: 8px 18px 20px;
	font: var(--type-body-sm);
	color: var(--text-muted);
}

.sasal-front-news__heading {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
}

.sasal-front-news__controls {
	display: flex;
	gap: 8px;
}

.sasal-front-news__controls button {
	display: grid;
	place-items: center;
	width: var(--control-height-md);
	height: var(--control-height-md);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-circle);
	background: var(--surface-card);
	color: var(--text-primary);
	transition: var(--transition-control);
}

.sasal-front-news__controls button:hover {
	border-color: var(--border-strong);
}

/* ---- Media / video ---- */

.sasal-front-video iframe {
	width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-media);
}

/* ---- LinkedIn ---- */

.sasal-front-linkedin__heading {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-top: 14px;
}

.sasal-front-linkedin-feed {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: var(--grid-gap);
	margin-top: 32px;
}

.sasal-front-linkedin-card {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: var(--card-padding);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-card);
	background: var(--surface-card);
	box-shadow: var(--shadow-xs);
}

.sasal-front-linkedin-card__meta {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	font-size: var(--text-xs);
	color: var(--text-muted);
}

.sasal-front-linkedin-card__meta i {
	font-style: normal;
	font-weight: var(--weight-semibold);
	color: var(--text-primary);
}

.sasal-front-linkedin-card img {
	border-radius: var(--radius-media);
}

.sasal-front-linkedin-card h3 {
	font: var(--type-h4);
}

.sasal-front-linkedin-card p {
	font: var(--type-body-sm);
	color: var(--text-body);
}

.sasal-front-linkedin-card a {
	margin-top: auto;
	font: var(--type-label);
}

/* ---- Vision ---- */

.sasal-front-vision__media {
	margin: 0;
	overflow: hidden;
	border-radius: var(--radius-media);
	border: 1px solid var(--border-subtle);
	align-self: stretch;
}

.sasal-front-vision__media video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ---- Operator / Core Partners ---- */

.sasal-front-partners {
	margin: 0;
	align-self: center;
	justify-self: center;
	width: min(100%, 500px);
}

.sasal-front-partners__faces {
	display: grid;
	gap: 10px;
	overflow: hidden;
}

.sasal-front-partners__face-row {
	min-width: 0;
	overflow: hidden;
}

.sasal-front-partners__face-track {
	display: flex;
	width: 200%;
	/* Two identical, full-width groups make the loop reset invisible. */
	animation: sasal-front-partner-face-scroll 36s linear infinite;
}

.sasal-front-partners__face-row--right .sasal-front-partners__face-track {
	animation-direction: reverse;
}

.sasal-front-partners__face-row--left .sasal-front-partners__face-track {
	animation-direction: normal;
}

.sasal-front-partners__face-group {
	display: flex;
	flex: 0 0 50%;
	align-items: center;
	justify-content: space-around;
}

.sasal-front-partners__faces img {
	width: 64px;
	height: 64px;
	border-radius: var(--radius-circle);
	object-fit: cover;
	background: var(--surface-sunken);
}

@keyframes sasal-front-partner-face-scroll {
	to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
	.sasal-front-partners__face-track {
		width: 100%;
		animation: none;
	}

	.sasal-front-partners__face-group {
		flex-basis: 100%;
		justify-content: space-between;
	}

	.sasal-front-partners__face-group[aria-hidden="true"] {
		display: none;
	}
}

/* The partner faces enter once as this part of the page is reached. The
 * pending state is applied only after JavaScript has confirmed motion is OK,
 * so the static layout remains available when scripts or motion are disabled. */
@media (prefers-reduced-motion: no-preference) {
	.sasal-front-partners__faces.is-partner-face-reveal-pending img {
		opacity: 0;
		transform: translateY(12px) scale(0.97);
	}

	.sasal-front-partners__faces.is-partner-face-reveal-ready img {
		transition:
			opacity var(--duration-slower) var(--ease-entrance) var(--sasal-partner-face-delay, 0ms),
			transform var(--duration-slower) var(--ease-entrance) var(--sasal-partner-face-delay, 0ms);
	}

	.sasal-front-partners__faces.is-partner-face-revealed img {
		opacity: 1;
		transform: none;
	}
}

.sasal-front-partners figcaption {
	margin-top: 16px;
	font: var(--type-eyebrow);
	letter-spacing: var(--tracking-eyebrow);
	text-transform: uppercase;
	color: var(--text-muted);
}

@media (max-width: 900px) {
	.sasal-front-partners {
		justify-self: start;
	}
}

/* ---- Closing CTA ---- */

.sasal-front-cta {
	padding: 88px var(--gutter);
	background: var(--surface-inverse-deep);
	text-align: center;
}

.sasal-front-cta .sasal-eyebrow {
	color: rgba(255, 255, 255, 0.55);
}

.sasal-front-cta h2 {
	margin: 14px auto 26px;
	font: var(--type-h2);
	font-weight: var(--weight-light);
	color: var(--text-inverse);
	max-width: none;
}

/* ---- Header over the hero ---- */

body.sasal-front-page .sasal-header {
	position: fixed;
	inset-inline: 0;
	top: 0;
	border-bottom-color: transparent;
	background: transparent;
	backdrop-filter: none;
	transition: background-color var(--duration-base) var(--ease-standard);
}

body.sasal-front-page.admin-bar .sasal-header {
	top: 32px;
}

body.sasal-front-page .sasal-header:not(.is-scrolled) .sasal-brand__wordmark,
body.sasal-front-page .sasal-header:not(.is-scrolled) .sasal-header__menu a {
	color: var(--text-inverse);
}

body.sasal-front-page .sasal-header:not(.is-scrolled) .sasal-header__menu a:not(:hover) {
	color: var(--text-inverse-muted);
}

body.sasal-front-page .sasal-header:not(.is-scrolled) .sasal-button--quiet {
	border-color: var(--border-inverse);
	background: rgba(255, 255, 255, 0.12);
	color: var(--text-inverse);
}

body.sasal-front-page .sasal-header:not(.is-scrolled) .sasal-button--primary {
	border-color: var(--paper-0);
	background: var(--paper-0);
	color: var(--text-primary);
}

body.sasal-front-page .sasal-header:not(.is-scrolled) .sasal-menu-toggle {
	border-color: var(--border-inverse);
	background: transparent;
}

body.sasal-front-page .sasal-header:not(.is-scrolled) .sasal-menu-toggle__icon i {
	background: var(--paper-0);
}

body.sasal-front-page .sasal-header.is-scrolled {
	border-bottom-color: var(--border-subtle);
	background: rgba(252, 252, 250, 0.9);
	backdrop-filter: var(--blur-header);
}

/* ---- Responsive ---- */

@media (max-width: 1024px) {
	.sasal-front-hero__stats {
		flex-wrap: wrap;
	}

	.sasal-front-hero__stats > div {
		flex: 1 1 40%;
		border-right: none;
		padding-inline: 0;
	}
}

@media (max-width: 900px) {
	.sasal-front-split,
	.sasal-front-intro,
	.sasal-front-platform {
		grid-template-columns: 1fr;
	}

	.sasal-front-steps {
		grid-template-columns: 1fr;
	}

	.sasal-front-deal-row {
		grid-template-columns: 96px minmax(0, 1fr) 24px;
	}

	.sasal-front-deal-row span {
		display: none;
	}
}

@media (max-width: 900px) {
	/* On small screens the overlay copy sits over the map; labels collide with it. */
	.sasal-atlas-map__pin text {
		display: none;
	}
}

@media (max-width: 640px) {
	.sasal-front-section {
		padding: var(--section-y-tight) var(--gutter-sm);
	}

	.sasal-front-section--quality {
		padding-bottom: 0;
	}

	.sasal-front-section--wide {
		padding-inline: var(--gutter-sm);
	}

	.sasal-front-hero__overlay {
		padding-inline: var(--gutter-sm);
	}

	.sasal-front-hero h1 {
		font-size: var(--text-3xl);
	}

	.sasal-front-stages {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		row-gap: 20px;
	}

	.sasal-front-stages::before {
		display: none;
	}

	.sasal-front-news__heading {
		flex-direction: column;
		align-items: flex-start;
	}

}

@media (prefers-reduced-motion: reduce) {
	.sasal-front-company-rail[data-sasal-auto-company-rail] {
		overflow-x: auto;
		scroll-snap-type: inline proximity;
		touch-action: auto;
	}

	.sasal-front-editorial-grid--rail {
		scroll-behavior: auto;
	}
}