/**
 * Longleyun Design System
 *
 * Shared visual tokens used by the homepage and future service, resource,
 * tutorial and account experiences.
 */
body.ly-has-header-hero,
body.ly-has-service-hero,
.ly-header-hero-shell,
.ly-service-hero-shell,
.ly-service-section,
.ly-home-section,
.ly-global-header,
.ly-global-footer,
.ly-contact-page,
.ly-account-page {
	--ly-color-ink: #090f1f;
	--ly-color-copy: #344054;
	--ly-color-muted: #667085;
	--ly-color-subtle: #98a2b3;
	--ly-color-line: #e6eaf0;
	--ly-color-line-strong: #d7dde7;
	--ly-color-surface: #f6f8fb;
	--ly-color-surface-raised: #fff;
	--ly-color-brand: #315efb;
	--ly-color-brand-hover: #244bd5;
	--ly-color-brand-soft: #edf2ff;
	--ly-color-success: #20a47a;
	--ly-color-violet: #7559ee;
	--ly-color-dark: #0a1020;
	--ly-font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
	--ly-radius-sm: 12px;
	--ly-radius-md: 16px;
	--ly-radius-lg: 24px;
	--ly-radius-xl: 36px;
	--ly-shadow-sm: 0 4px 16px rgba(15, 23, 42, 0.045);
	--ly-shadow-md: 0 18px 50px rgba(15, 23, 42, 0.085);
	--ly-shadow-lg: 0 30px 80px rgba(15, 23, 42, 0.13);
	--ly-ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
	--ly-duration-fast: 160ms;
	--ly-duration-standard: 260ms;
	font-family: var(--ly-font-sans);
}

/* One shared blue shield mark for the full public website. */
.ly-brand-mark {
	position: relative;
	display: inline-flex;
	width: 40px;
	height: 40px;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	border-radius: 12px;
	background: linear-gradient(145deg, #2e60f7 0%, #1fc2a0 100%);
	box-shadow: 0 8px 20px rgba(49, 94, 251, 0.2);
}

.ly-brand-mark::before,
.ly-brand-mark::after {
	position: absolute;
	content: "";
}

.ly-brand-mark::before {
	width: 19px;
	height: 17px;
	border: 3px solid #fff;
	border-top: 0;
	border-radius: 0 0 18px 18px;
	transform: translateY(2px);
}

.ly-brand-mark::after {
	width: 17px;
	height: 3px;
	border-radius: 3px;
	background: #fff;
	transform: translateY(-8px);
}

.ly-brand-mark > i {
	position: absolute;
	top: 9px;
	right: 8px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #fff;
}

body.ly-has-header-hero {
	color: var(--ly-color-ink);
	background: #fff;
}

body.ly-has-header-hero ::selection,
body.ly-has-service-hero ::selection {
	background: rgba(49, 94, 251, 0.18);
	color: var(--ly-color-ink);
}

.ly-header-hero-shell a:focus-visible,
.ly-header-hero-shell button:focus-visible,
.ly-header-hero-shell input:focus-visible,
.ly-service-hero-shell a:focus-visible,
.ly-service-hero-shell button:focus-visible,
.ly-service-section a:focus-visible,
.ly-service-section button:focus-visible,
.ly-home-section a:focus-visible,
.ly-home-section button:focus-visible,
.ly-home-section summary:focus-visible,
.ly-global-header a:focus-visible,
.ly-global-header button:focus-visible,
.ly-global-footer a:focus-visible,
.ly-contact-page a:focus-visible,
.ly-account-page a:focus-visible,
.ly-account-page button:focus-visible,
.ly-account-page input:focus-visible {
	outline: 3px solid rgba(49, 94, 251, 0.28);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.ly-header-hero-shell *,
	.ly-header-hero-shell *::before,
	.ly-header-hero-shell *::after,
	.ly-service-hero-shell *,
	.ly-service-hero-shell *::before,
	.ly-service-hero-shell *::after,
	.ly-service-section *,
	.ly-service-section *::before,
	.ly-service-section *::after,
	.ly-home-section *,
	.ly-home-section *::before,
	.ly-home-section *::after,
	.ly-global-header *,
	.ly-global-header *::before,
	.ly-global-header *::after,
	.ly-global-footer *,
	.ly-global-footer *::before,
	.ly-global-footer *::after,
	.ly-contact-page *,
	.ly-contact-page *::before,
	.ly-contact-page *::after,
	.ly-account-page *,
	.ly-account-page *::before,
	.ly-account-page *::after {
		scroll-behavior: auto !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}
