body.ly-has-custom-footer #colophon {
display: none;
} .ly-home-search,
.ly-home-search * {
box-sizing: border-box;
}
.ly-home-search {
width: min(720px, calc(100% - 48px));
margin: 0 auto;
padding: 24px 0 0;
}
.ly-home-search h2 {
margin: 0 0 12px;
color: var(--ly-color-ink, #090f1f);
font-size: 18px;
font-weight: 600;
line-height: 1.5;
text-align: center;
}
.ly-home-search__form {
display: flex;
gap: 8px;
margin: 0;
}
.ly-home-search__form input {
flex: 1 1 0;
min-width: 0;
height: 52px;
margin: 0;
padding: 0 14px;
border: 1px solid var(--ly-color-line, #e6eaf0);
border-radius: 12px;
background: #fff;
color: var(--ly-color-ink, #090f1f);
font: inherit;
font-size: 16px;
}
.ly-home-search__form input::placeholder {
color: var(--ly-color-muted, #667085);
font-size: 14px;
opacity: 1;
}
.ly-home-search__form button {
flex: 0 0 auto;
min-height: 52px;
padding: 0 22px;
border: 1px solid transparent;
border-radius: 12px;
background: var(--ly-color-brand, #315efb);
color: #fff;
font: inherit;
font-size: 16px;
font-weight: 600;
white-space: nowrap;
}
.ly-home-search__form button:hover {
background: var(--ly-color-brand-hover, #244bd5);
}
.ly-home-search__form input:focus-visible,
.ly-home-search__form button:focus-visible {
outline: 2px solid var(--ly-color-brand, #315efb);
outline-offset: 3px;
}
@media (max-width: 600px) {
.ly-home-search { width: calc(100% - 32px); }
.ly-home-search h2 { font-size: 17px; }
.ly-home-search__form button { padding: 0 16px; }
} .ly-ai-workstation--home,
.ly-ai-workstation--home * {
box-sizing: border-box;
}
.ly-ai-workstation--home {
width: 100%;
max-width: 100%;
margin: 0;
padding: 40px 0 8px;
color: var(--ly-color-ink, #090f1f);
font-family: var(--ly-font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif);
}
.ly-ai-workstation--home .ly-ai-workstation__inner {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
column-gap: 40px;
width: min(1240px, calc(100% - 48px));
margin: 0 auto;
padding: clamp(24px, 3vw, 40px);
border: 1px solid var(--ly-color-line, #e6eaf0);
border-radius: 24px;
background: linear-gradient(120deg, #fff, var(--ly-color-surface, #f6f8fb));
box-shadow: var(--ly-shadow-sm, 0 4px 16px rgba(15, 23, 42, 0.045));
}
.ly-ai-workstation--home .ly-ai-workstation__eyebrow,
.ly-ai-workstation--home .ly-ai-workstation__title,
.ly-ai-workstation--home .ly-ai-workstation__description,
.ly-ai-workstation--home .ly-ai-workstation__note {
grid-column: 1;
min-width: 0;
margin: 0;
overflow-wrap: anywhere;
}
.ly-ai-workstation--home .ly-ai-workstation__eyebrow {
margin-bottom: 10px;
color: var(--ly-color-brand, #315efb);
font-size: 12px;
font-weight: 750;
letter-spacing: 0.8px;
line-height: 1.5;
}
.ly-ai-workstation--home .ly-ai-workstation__title {
color: inherit;
font-size: clamp(26px, 2.4vw, 34px);
font-weight: 750;
letter-spacing: -0.8px;
line-height: 1.25;
}
.ly-ai-workstation--home .ly-ai-workstation__description {
margin-top: 14px;
color: var(--ly-color-copy, #344054);
font-size: 16px;
line-height: 1.7;
}
.ly-ai-workstation--home .ly-ai-workstation__note {
max-width: 680px;
margin-top: 8px;
color: var(--ly-color-muted, #667085);
font-size: 14px;
line-height: 1.8;
}
.ly-ai-workstation--home .ly-ai-workstation__actions {
grid-column: 2;
grid-row: 1 / 5;
align-self: center;
}
.ly-ai-workstation--home .ly-ai-workstation__button {
display: inline-flex;
min-height: 48px;
align-items: center;
justify-content: center;
padding: 12px 22px;
border: 1px solid transparent;
border-radius: 13px;
background: var(--ly-color-brand, #315efb);
color: #fff;
font-size: 14px;
font-weight: 700;
line-height: 1.5;
text-align: center;
text-decoration: none;
}
.ly-ai-workstation--home .ly-ai-workstation__button:hover,
.ly-ai-workstation--home .ly-ai-workstation__button:focus-visible {
background: var(--ly-color-brand-hover, #244bd5);
color: #fff;
}
.ly-ai-workstation--home .ly-ai-workstation__button:focus-visible {
outline: 3px solid var(--ly-color-brand, #315efb);
outline-offset: 4px;
}
@media (max-width: 767px) {
.ly-ai-workstation--home {
padding-top: 24px;
}
.ly-ai-workstation--home .ly-ai-workstation__inner {
grid-template-columns: minmax(0, 1fr);
width: calc(100% - 32px);
border-radius: 20px;
}
.ly-ai-workstation--home .ly-ai-workstation__actions {
grid-column: 1;
grid-row: auto;
margin-top: 24px;
}
.ly-ai-workstation--home .ly-ai-workstation__button {
width: 100%;
}
}
.ly-home-section,
.ly-home-section * {
box-sizing: border-box;
}
.ly-home-section {
--ly-ink: #0a1020;
--ly-copy: #344054;
--ly-muted: #667085;
--ly-line: #e7eaf0;
--ly-blue: #315efb;
--ly-mint: #20b486;
--ly-surface: #f7f8fb;
position: relative;
width: 100%;
max-width: none;
margin: 0;
padding: 104px 0;
color: var(--ly-ink);
background: #fff;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
-webkit-font-smoothing: antialiased;
}
.ly-home-section.alignfull {
margin-right: 0 !important;
margin-left: 0 !important;
}
.ly-home-section.is-tone-soft {
background: var(--ly-surface);
}
.ly-home-section.is-tone-dark {
color: #fff;
background: #0b1020;
}
.ly-home-section__inner,
.ly-footer__inner {
width: min(1224px, calc(100% - 48px));
margin-right: auto;
margin-left: auto;
}
.ly-section-heading {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 48px;
margin-bottom: 44px;
}
.ly-section-heading__copy {
max-width: 720px;
}
.ly-section-heading__eyebrow {
margin: 0 0 13px;
color: var(--ly-section-accent);
font-size: 12px;
font-weight: 780;
letter-spacing: 1.4px;
line-height: 1.3;
text-transform: uppercase;
}
.ly-section-heading h2 {
margin: 0;
color: inherit;
font-size: clamp(34px, 3vw, 48px);
font-weight: 790;
letter-spacing: -1.8px;
line-height: 1.12;
}
.ly-section-heading__description {
max-width: 670px;
margin: 17px 0 0;
color: var(--ly-muted);
font-size: 15px;
line-height: 1.8;
}
.is-tone-dark .ly-section-heading__description {
color: #aab4c7;
}
.ly-section-heading__actions,
.ly-cta__actions {
display: flex;
flex: 0 0 auto;
flex-wrap: wrap;
gap: 10px;
}
.ly-section-button {
display: inline-flex;
min-height: 46px;
align-items: center;
justify-content: center;
gap: 12px;
padding: 0 18px;
border: 1px solid transparent;
border-radius: 13px;
font-size: 13px;
font-weight: 720;
line-height: 1;
text-decoration: none;
transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}
.ly-section-button:hover,
.ly-section-button:focus-visible {
transform: translateY(-1px);
}
.ly-section-button--primary {
background: var(--ly-ink);
color: #fff;
}
.ly-section-button--primary:hover,
.ly-section-button--primary:focus-visible {
background: #1a2439;
color: #fff;
}
.ly-section-button--secondary {
border-color: #dce1e9;
background: #fff;
color: var(--ly-copy);
}
.ly-card-grid {
display: grid;
grid-template-columns: repeat(var(--ly-columns, 3), minmax(0, 1fr));
gap: 20px;
}
.is-columns-2 .ly-card-grid {
--ly-columns: 2;
}
.is-columns-3 .ly-card-grid {
--ly-columns: 3;
}
.is-columns-4 .ly-card-grid {
--ly-columns: 4;
}
.ly-card {
position: relative;
display: flex;
min-width: 0;
min-height: 100%;
flex-direction: column;
overflow: hidden;
border: 1px solid var(--ly-line);
border-radius: 24px;
background: #fff;
box-shadow: 0 3px 8px rgba(15, 23, 42, 0.025);
transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}
.ly-card:hover {
border-color: #d8deea;
box-shadow: 0 18px 48px rgba(15, 23, 42, 0.08);
transform: translateY(-3px);
}
.ly-card__link {
position: absolute;
inset: 0;
z-index: 1;
border-radius: inherit;
}
.ly-card__link:focus-visible {
outline: 3px solid color-mix(in srgb, var(--ly-section-accent) 42%, transparent);
outline-offset: -4px;
}
.ly-card__media {
position: relative;
height: 202px;
overflow: hidden;
background: #eef2f7;
}
.ly-card__image {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 350ms ease;
}
.ly-card:hover .ly-card__image {
transform: scale(1.025);
}
.ly-card__media--placeholder {
display: flex;
align-items: center;
justify-content: center;
background:
radial-gradient(circle at 78% 18%, rgba(255, 255, 255, 0.8), transparent 22%),
linear-gradient(135deg, #eef3ff, #dfe8ff);
}
.ly-card__media--placeholder::before,
.ly-card__media--placeholder::after {
position: absolute;
border: 1px solid rgba(49, 94, 251, 0.14);
border-radius: 50%;
content: "";
}
.ly-card__media--placeholder::before {
width: 190px;
height: 190px;
}
.ly-card__media--placeholder::after {
width: 108px;
height: 108px;
}
.ly-card__media--placeholder span {
position: relative;
z-index: 2;
display: inline-flex;
width: 72px;
height: 72px;
align-items: center;
justify-content: center;
border: 1px solid rgba(255, 255, 255, 0.88);
border-radius: 22px;
background: rgba(255, 255, 255, 0.74);
box-shadow: 0 18px 36px rgba(49, 94, 251, 0.12);
color: var(--ly-section-accent);
font-size: 24px;
font-weight: 800;
backdrop-filter: blur(12px);
}
.ly-card__media--placeholder.is-variant-2 {
background: linear-gradient(135deg, #edf9f5, #d9f2ea);
}
.ly-card__media--placeholder.is-variant-3 {
background: linear-gradient(135deg, #f4f0ff, #e4dcff);
}
.ly-card__media--placeholder.is-variant-4 {
background: linear-gradient(135deg, #fff5e8, #ffe8cc);
}
.ly-card__body {
display: flex;
min-height: 220px;
flex: 1;
flex-direction: column;
padding: 24px;
}
.ly-card__topline {
display: flex;
min-height: 24px;
align-items: center;
justify-content: space-between;
gap: 14px;
margin-bottom: 14px;
}
.ly-card__badge {
display: inline-flex;
padding: 6px 9px;
border-radius: 999px;
background: #edf2ff;
color: var(--ly-section-accent);
font-size: 10px;
font-weight: 760;
line-height: 1;
}
.ly-card__meta {
overflow: hidden;
color: #8a94a6;
font-size: 11px;
text-overflow: ellipsis;
white-space: nowrap;
}
.ly-card h3 {
margin: 0;
color: var(--ly-ink);
font-size: 19px;
font-weight: 750;
letter-spacing: -0.45px;
line-height: 1.38;
}
.ly-card__body > p {
margin: 11px 0 0;
color: var(--ly-muted);
font-size: 13px;
line-height: 1.75;
}
.ly-card__footer {
position: relative;
z-index: 2;
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
margin-top: auto;
padding-top: 22px;
}
.ly-card__footer a {
display: inline-flex;
align-items: center;
gap: 8px;
margin-left: auto;
color: var(--ly-ink);
font-size: 12px;
font-weight: 720;
text-decoration: none;
}
.ly-card__footer a i {
color: var(--ly-section-accent);
font-style: normal;
}
.ly-card__price {
color: var(--ly-ink);
font-size: 14px;
font-weight: 760;
}
.ly-card__price del {
margin-right: 4px;
color: #98a2b3;
font-size: 11px;
}
.ly-card--tutorials .ly-card__media {
height: 184px;
}
.ly-card--cases:first-child {
grid-column: span 2;
}
.ly-benefit-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
overflow: hidden;
border: 1px solid var(--ly-line);
border-radius: 26px;
background: #fff;
}
.ly-benefit {
display: flex;
min-height: 180px;
gap: 18px;
padding: 30px;
border-right: 1px solid var(--ly-line);
border-bottom: 1px solid var(--ly-line);
}
.ly-benefit:nth-child(3n) {
border-right: 0;
}
.ly-benefit:nth-last-child(-n + 3) {
border-bottom: 0;
}
.ly-benefit__icon {
display: inline-flex;
width: 46px;
height: 46px;
flex: 0 0 46px;
align-items: center;
justify-content: center;
border-radius: 14px;
background: #eef3ff;
color: var(--ly-section-accent);
font-size: 13px;
font-weight: 800;
}
.ly-benefit h3,
.ly-process h3 {
margin: 2px 0 8px;
color: var(--ly-ink);
font-size: 16px;
font-weight: 750;
}
.ly-benefit p,
.ly-process p {
margin: 0;
color: var(--ly-muted);
font-size: 12px;
line-height: 1.75;
}
.ly-process {
display: grid;
margin: 0;
padding: 0;
list-style: none;
grid-template-columns: repeat(5, minmax(0, 1fr));
}
.ly-process li {
position: relative;
padding-right: 32px;
}
.ly-process li:not(:last-child)::after {
position: absolute;
top: 22px;
right: 11px;
width: calc(100% - 54px);
height: 1px;
background: linear-gradient(90deg, var(--ly-section-accent), #dce3f3);
content: "";
transform: translateX(100%);
}
.ly-process__index {
position: relative;
z-index: 2;
display: inline-flex;
width: 46px;
height: 46px;
align-items: center;
justify-content: center;
margin-bottom: 22px;
border: 1px solid #dfe5ef;
border-radius: 15px;
background: #fff;
box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
color: var(--ly-section-accent);
font-size: 12px;
font-weight: 800;
}
.ly-enterprise-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 14px;
}
.ly-enterprise-card {
position: relative;
min-height: 370px;
padding: 38px;
overflow: hidden;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 26px;
background: linear-gradient(150deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025));
}
.ly-enterprise-card::after {
position: absolute;
right: -65px;
bottom: -70px;
width: 190px;
height: 190px;
border: 1px solid rgba(112, 135, 255, 0.18);
border-radius: 50%;
content: "";
pointer-events: none;
}
.ly-enterprise-card__link {
position: absolute;
inset: 0;
z-index: 1;
border-radius: inherit;
}
.ly-enterprise-card__link:focus-visible {
outline: 3px solid rgba(142, 164, 255, 0.72);
outline-offset: -4px;
}
.ly-enterprise-card__number {
position: absolute;
top: 28px;
right: 30px;
color: rgba(255, 255, 255, 0.2);
font-size: 13px;
font-weight: 700;
}
.ly-enterprise-card > span {
display: inline-flex;
margin-bottom: 60px;
padding: 7px 10px;
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 999px;
color: #b9c7ff;
font-size: 10px;
font-weight: 740;
}
.ly-enterprise-card h3 {
max-width: 250px;
margin: 0;
color: #fff;
font-size: 22px;
font-weight: 730;
line-height: 1.35;
}
.ly-enterprise-card p {
max-width: 290px;
margin: 15px 0 30px;
color: #aab4c7;
font-size: 13px;
line-height: 1.75;
}
.ly-enterprise-card__action {
position: absolute;
z-index: 2;
bottom: 34px;
left: 38px;
color: #fff;
font-size: 12px;
font-weight: 720;
text-decoration: none;
}
.ly-enterprise-card__action i {
margin-left: 8px;
color: #8ea4ff;
font-style: normal;
}
.ly-testimonial-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 18px;
}
.ly-testimonial {
display: flex;
min-height: 320px;
flex-direction: column;
margin: 0;
padding: 30px;
border: 1px solid var(--ly-line);
border-radius: 24px;
background: #fff;
}
.ly-testimonial__badge {
align-self: flex-start;
padding: 7px 10px;
border-radius: 999px;
background: #f1f4f9;
color: #667085;
font-size: 10px;
font-weight: 720;
}
.ly-testimonial blockquote {
margin: 36px 0 32px;
color: var(--ly-ink);
font-size: 17px;
font-weight: 580;
line-height: 1.8;
quotes: none;
}
.ly-testimonial blockquote::before {
display: block;
margin-bottom: 17px;
color: var(--ly-section-accent);
font-family: Georgia, serif;
font-size: 42px;
line-height: 0.5;
content: "“";
}
.ly-testimonial figcaption {
display: flex;
align-items: center;
gap: 12px;
margin-top: auto;
}
.ly-testimonial__avatar {
display: inline-flex;
width: 40px;
height: 40px;
align-items: center;
justify-content: center;
border-radius: 50%;
background: #eaf0ff;
color: var(--ly-section-accent);
font-size: 13px;
font-weight: 800;
}
.ly-testimonial figcaption strong,
.ly-testimonial figcaption small {
display: block;
}
.ly-testimonial figcaption strong {
color: var(--ly-ink);
font-size: 13px;
}
.ly-testimonial figcaption small {
margin-top: 3px;
color: var(--ly-muted);
font-size: 10px;
}
.ly-faq-list {
max-width: 920px;
margin: 0 auto;
border-top: 1px solid var(--ly-line);
}
.ly-faq-list details {
border-bottom: 1px solid var(--ly-line);
}
.ly-faq-list summary {
display: flex;
min-height: 86px;
align-items: center;
justify-content: space-between;
gap: 26px;
padding: 22px 0;
color: var(--ly-ink);
font-size: 16px;
font-weight: 690;
cursor: pointer;
list-style: none;
}
.ly-faq-list summary::-webkit-details-marker {
display: none;
}
.ly-faq-list summary i {
position: relative;
display: inline-block;
width: 30px;
height: 30px;
flex: 0 0 30px;
border-radius: 50%;
background: #f2f4f7;
}
.ly-faq-list summary i::before,
.ly-faq-list summary i::after {
position: absolute;
top: 14px;
left: 9px;
width: 12px;
height: 2px;
border-radius: 2px;
background: #526176;
content: "";
transition: transform 160ms ease;
}
.ly-faq-list summary i::after {
transform: rotate(90deg);
}
.ly-faq-list details[open] summary i::after {
transform: rotate(0);
}
.ly-faq-list__answer {
max-width: 780px;
padding: 0 0 26px;
color: var(--ly-muted);
font-size: 14px;
line-height: 1.85;
}
.ly-faq-list__answer p {
margin: 0;
}
.ly-home-section--cta {
padding-top: 58px;
padding-bottom: 58px;
}
.ly-cta {
position: relative;
display: flex;
min-height: 320px;
align-items: center;
justify-content: space-between;
gap: 60px;
padding: 60px 66px;
overflow: hidden;
border-radius: 30px;
background:
radial-gradient(circle at 88% 18%, rgba(96, 122, 255, 0.32), transparent 30%),
linear-gradient(135deg, #0b1020 0%, #121b33 100%);
color: #fff;
}
.ly-cta::before {
position: absolute;
inset: 0;
background-image: radial-gradient(rgba(255, 255, 255, 0.12) 0.6px, transparent 0.6px);
background-size: 20px 20px;
content: "";
opacity: 0.32;
}
.ly-cta__copy,
.ly-cta__actions {
position: relative;
z-index: 2;
}
.ly-cta__copy {
max-width: 690px;
}
.ly-cta__copy > p {
margin: 0 0 14px;
color: #9fb1ff;
font-size: 11px;
font-weight: 780;
letter-spacing: 1.5px;
}
.ly-cta__copy h2 {
margin: 0;
color: #fff;
font-size: clamp(36px, 3.4vw, 52px);
font-weight: 780;
letter-spacing: -1.8px;
line-height: 1.12;
}
.ly-cta__copy > span {
display: block;
margin-top: 17px;
color: #aab4c7;
font-size: 14px;
line-height: 1.75;
}
.ly-cta .ly-section-button--primary {
background: #fff;
color: #0b1020;
}
.ly-cta .ly-section-button--secondary {
border-color: rgba(255, 255, 255, 0.17);
background: rgba(255, 255, 255, 0.06);
color: #fff;
}
.ly-cta__orb {
position: absolute;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 50%;
}
.ly-cta__orb--one {
top: -110px;
right: 190px;
width: 280px;
height: 280px;
}
.ly-cta__orb--two {
right: -80px;
bottom: -150px;
width: 350px;
height: 350px;
}
.ly-home-section--footer {
padding: 78px 0 28px;
background: #080d19;
color: #fff;
}
.ly-footer__main {
display: grid;
grid-template-columns: minmax(260px, 1.7fr) repeat(4, minmax(120px, 1fr));
gap: 54px;
padding-bottom: 58px;
}
.ly-footer__brand > a {
display: inline-flex;
align-items: center;
gap: 11px;
color: #fff;
text-decoration: none;
}
.ly-footer__brand > a > span {
position: relative;
display: inline-flex;
width: 38px;
height: 38px;
align-items: center;
justify-content: center;
border-radius: 12px;
background: linear-gradient(145deg, #2e60f7, #1fc2a0);
}
.ly-footer__brand > a > span::before {
width: 17px;
height: 15px;
border: 3px solid #fff;
border-top: 0;
border-radius: 0 0 18px 18px;
content: "";
}
.ly-footer__brand > a > span::after {
position: absolute;
top: 10px;
width: 15px;
height: 3px;
border-radius: 3px;
background: #fff;
content: "";
}
.ly-footer__brand > a strong {
font-size: 18px;
letter-spacing: -0.3px;
}
.ly-footer__brand p {
max-width: 290px;
margin: 22px 0 12px;
color: #8e9aaf;
font-size: 12px;
line-height: 1.8;
}
.ly-footer__brand small {
color: #687489;
font-size: 10px;
}
.ly-footer__group h2 {
margin: 5px 0 20px;
color: #fff;
font-size: 12px;
font-weight: 730;
}
.ly-footer__group ul {
margin: 0;
padding: 0;
list-style: none;
}
.ly-footer__group li + li {
margin-top: 13px;
}
.ly-footer__group a,
.ly-footer__group li > span {
color: #8e9aaf;
font-size: 11px;
text-decoration: none;
transition: color 150ms ease;
}
.ly-footer__group li > span {
display: inline-flex;
align-items: center;
gap: 7px;
color: #596579;
cursor: not-allowed;
}
.ly-footer__group li > span small {
padding: 3px 5px;
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 999px;
color: #4f5a6d;
font-size: 8px;
line-height: 1;
}
.ly-footer__group a:hover,
.ly-footer__group a:focus-visible {
color: #fff;
}
.ly-footer__statement {
margin: 0;
padding: 22px 0;
border-top: 1px solid rgba(255, 255, 255, 0.08);
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
color: #687489;
font-size: 10px;
line-height: 1.75;
}
.ly-footer__bottom {
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
padding-top: 24px;
color: #586477;
font-size: 10px;
}
@media (max-width: 1100px) {
.ly-home-section {
padding: 88px 0;
}
.ly-card-grid,
.is-columns-4 .ly-card-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ly-benefit-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ly-benefit:nth-child(3n) {
border-right: 1px solid var(--ly-line);
}
.ly-benefit:nth-child(2n) {
border-right: 0;
}
.ly-benefit:nth-last-child(-n + 3) {
border-bottom: 1px solid var(--ly-line);
}
.ly-benefit:nth-last-child(-n + 2) {
border-bottom: 0;
}
.ly-process {
grid-template-columns: repeat(5, minmax(150px, 1fr));
overflow-x: auto;
scrollbar-width: thin;
}
.ly-enterprise-card {
padding: 30px;
}
.ly-enterprise-card__action {
left: 30px;
}
.ly-footer__main {
grid-template-columns: minmax(240px, 2fr) repeat(2, minmax(130px, 1fr));
}
}
@media (max-width: 767px) {
.ly-home-section {
padding: 68px 0;
}
.ly-home-section__inner,
.ly-footer__inner {
width: min(100% - 32px, 1224px);
}
.ly-section-heading {
display: block;
margin-bottom: 30px;
}
.ly-section-heading h2 {
font-size: 32px;
letter-spacing: -1.2px;
}
.ly-section-heading__description {
margin-top: 13px;
font-size: 13px;
}
.ly-section-heading__actions {
margin-top: 20px;
}
.ly-card-grid,
.is-columns-2 .ly-card-grid,
.is-columns-3 .ly-card-grid,
.is-columns-4 .ly-card-grid {
grid-template-columns: minmax(0, 1fr);
}
.ly-card--cases:first-child {
grid-column: auto;
}
.ly-card__media {
height: 184px;
}
.ly-card__body {
min-height: 200px;
padding: 22px;
}
.ly-benefit-grid {
grid-template-columns: minmax(0, 1fr);
}
.ly-benefit,
.ly-benefit:nth-child(2n),
.ly-benefit:nth-child(3n),
.ly-benefit:nth-last-child(-n + 2),
.ly-benefit:nth-last-child(-n + 3) {
min-height: 0;
padding: 24px;
border-right: 0;
border-bottom: 1px solid var(--ly-line);
}
.ly-benefit:last-child {
border-bottom: 0;
}
.ly-process {
display: block;
overflow: visible;
}
.ly-process li {
display: grid;
padding: 0 0 28px;
grid-template-columns: 46px minmax(0, 1fr);
gap: 17px;
}
.ly-process li:not(:last-child)::after {
top: 46px;
right: auto;
bottom: 0;
left: 22px;
width: 1px;
height: calc(100% - 37px);
background: linear-gradient(var(--ly-section-accent), #dce3f3);
transform: none;
}
.ly-process__index {
margin: 0;
}
.ly-process__copy {
padding-top: 4px;
}
.ly-enterprise-grid,
.ly-testimonial-grid {
grid-template-columns: minmax(0, 1fr);
}
.ly-enterprise-card {
min-height: 330px;
}
.ly-testimonial {
min-height: 280px;
}
.ly-faq-list summary {
min-height: 76px;
font-size: 14px;
}
.ly-home-section--cta {
padding-top: 28px;
padding-bottom: 28px;
}
.ly-cta {
display: block;
min-height: 0;
padding: 44px 28px;
border-radius: 24px;
}
.ly-cta__copy h2 {
font-size: 34px;
}
.ly-cta__actions {
margin-top: 28px;
}
.ly-cta__actions .ly-section-button {
flex: 1;
}
.ly-home-section--footer {
padding-top: 58px;
}
.ly-footer__main {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 38px 24px;
}
.ly-footer__brand {
grid-column: 1 / -1;
}
.ly-footer__bottom {
align-items: flex-start;
flex-direction: column;
}
}
@media (prefers-reduced-motion: reduce) {
.ly-home-section *,
.ly-home-section *::before,
.ly-home-section *::after {
scroll-behavior: auto !important;
transition-duration: 0.01ms !important;
}
} .ly-home-section {
--ly-ink: var(--ly-color-ink, #090f1f);
--ly-copy: var(--ly-color-copy, #344054);
--ly-muted: var(--ly-color-muted, #667085);
--ly-line: var(--ly-color-line, #e6eaf0);
--ly-blue: var(--ly-color-brand, #315efb);
--ly-mint: var(--ly-color-success, #20a47a);
--ly-surface: var(--ly-color-surface, #f6f8fb);
padding: 112px 0;
overflow: clip;
font-family: var(--ly-font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif);
}
.ly-home-section.is-tone-soft {
background:
linear-gradient(180deg, rgba(248, 250, 253, 0.2), transparent 16%),
var(--ly-surface);
}
.ly-home-section.is-tone-dark {
background:
radial-gradient(circle at 83% 10%, rgba(75, 105, 246, 0.12), transparent 28%),
linear-gradient(145deg, #090f1f 0%, #0c1426 100%);
}
.ly-home-section__inner,
.ly-footer__inner {
width: min(1240px, calc(100% - 56px));
}
.ly-section-heading {
gap: 56px;
margin-bottom: 48px;
}
.ly-section-heading__eyebrow {
margin-bottom: 15px;
font-size: 11px;
font-weight: 800;
letter-spacing: 1.7px;
}
.ly-section-heading h2 {
font-size: clamp(38px, 3.15vw, 50px);
font-weight: 800;
letter-spacing: -2.1px;
line-height: 1.1;
}
.ly-section-heading__description {
margin-top: 18px;
color: #5d697b;
font-size: 15px;
line-height: 1.86;
}
.ly-section-button {
min-height: 48px;
padding: 0 20px;
border-radius: 14px;
font-weight: 730;
transition:
background-color var(--ly-duration-fast, 160ms) ease,
border-color var(--ly-duration-fast, 160ms) ease,
color var(--ly-duration-fast, 160ms) ease,
box-shadow var(--ly-duration-fast, 160ms) ease,
transform var(--ly-duration-fast, 160ms) var(--ly-ease-standard, ease);
}
.ly-section-button:hover,
.ly-section-button:focus-visible {
transform: translateY(-2px);
}
.ly-section-button--primary {
background: linear-gradient(135deg, var(--ly-blue), #416eff);
box-shadow: 0 11px 26px rgba(49, 94, 251, 0.21);
}
.ly-section-button--primary:hover,
.ly-section-button--primary:focus-visible {
background: linear-gradient(135deg, var(--ly-color-brand-hover, #244bd5), var(--ly-blue));
box-shadow: 0 15px 32px rgba(49, 94, 251, 0.26);
}
.ly-section-button--secondary {
border-color: #d9dfe8;
box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
}
.ly-section-button--secondary:hover,
.ly-section-button--secondary:focus-visible {
border-color: #c9d1de;
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.07);
color: var(--ly-ink);
}
.ly-card-grid {
gap: 22px;
}
.ly-card {
border-color: rgba(211, 219, 230, 0.98);
border-radius: 25px;
box-shadow:
0 7px 22px rgba(15, 23, 42, 0.045),
0 1px 0 rgba(255, 255, 255, 0.9) inset;
transition:
border-color var(--ly-duration-standard, 260ms) ease,
box-shadow var(--ly-duration-standard, 260ms) var(--ly-ease-standard, ease),
transform var(--ly-duration-standard, 260ms) var(--ly-ease-standard, ease);
}
.ly-card::after {
position: absolute;
z-index: 3;
top: 0;
right: 20%;
left: 20%;
height: 2px;
border-radius: 0 0 3px 3px;
background: linear-gradient(90deg, transparent, var(--ly-section-accent), transparent);
content: "";
opacity: 0;
pointer-events: none;
transform: scaleX(0.65);
transition:
opacity var(--ly-duration-standard, 260ms) ease,
transform var(--ly-duration-standard, 260ms) var(--ly-ease-standard, ease);
}
.ly-card__media {
height: 210px;
}
.ly-card__media::after {
position: absolute;
inset: 0;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(9, 15, 31, 0.025));
content: "";
pointer-events: none;
}
.ly-card__image {
transition: transform 500ms var(--ly-ease-standard, ease);
}
.ly-card__media--placeholder span {
width: 74px;
height: 74px;
border-radius: 23px;
box-shadow:
0 20px 40px color-mix(in srgb, var(--ly-section-accent) 14%, transparent),
inset 0 1px 0 rgba(255, 255, 255, 0.92);
font-size: 22px;
transition:
box-shadow var(--ly-duration-standard, 260ms) ease,
transform var(--ly-duration-standard, 260ms) var(--ly-ease-standard, ease);
}
.ly-card__body {
min-height: 224px;
padding: 26px;
}
.ly-card__badge {
padding: 6px 10px;
background: color-mix(in srgb, var(--ly-section-accent) 9%, #fff);
font-weight: 780;
}
.ly-card h3 {
font-size: 19px;
font-weight: 770;
letter-spacing: -0.55px;
}
.ly-card__body > p {
margin-top: 12px;
color: #5f6c7f;
line-height: 1.78;
}
.ly-card__footer {
padding-top: 24px;
}
.ly-card__footer a {
gap: 9px;
font-weight: 730;
transition: color var(--ly-duration-fast, 160ms) ease;
}
.ly-card__footer a i {
display: inline-flex;
width: 22px;
height: 22px;
align-items: center;
justify-content: center;
border-radius: 50%;
background: color-mix(in srgb, var(--ly-section-accent) 9%, #fff);
transition:
background-color var(--ly-duration-fast, 160ms) ease,
color var(--ly-duration-fast, 160ms) ease,
transform var(--ly-duration-fast, 160ms) var(--ly-ease-standard, ease);
}
@media (hover: hover) {
.ly-card:hover {
border-color: color-mix(in srgb, var(--ly-section-accent) 24%, #d8deea);
box-shadow:
0 20px 48px rgba(15, 23, 42, 0.095),
0 1px 0 rgba(255, 255, 255, 0.92) inset;
transform: translateY(-4px);
}
.ly-card:hover::after {
opacity: 0.85;
transform: scaleX(1);
}
.ly-card:hover .ly-card__image {
transform: scale(1.03);
}
.ly-card:hover .ly-card__media--placeholder span {
box-shadow:
0 24px 46px color-mix(in srgb, var(--ly-section-accent) 19%, transparent),
inset 0 1px 0 rgba(255, 255, 255, 0.92);
transform: translateY(-2px);
}
.ly-card__footer a:hover i,
.ly-card__footer a:focus-visible i {
background: var(--ly-section-accent);
color: #fff;
transform: translate(2px, -2px);
}
}
.ly-benefit-grid {
border-color: rgba(219, 225, 234, 0.95);
border-radius: 28px;
box-shadow: var(--ly-shadow-sm, 0 4px 16px rgba(15, 23, 42, 0.045));
}
.ly-benefit {
min-height: 184px;
padding: 32px;
transition:
background-color var(--ly-duration-standard, 260ms) ease,
box-shadow var(--ly-duration-standard, 260ms) ease;
}
.ly-benefit__icon {
width: 48px;
height: 48px;
flex-basis: 48px;
border: 1px solid color-mix(in srgb, var(--ly-section-accent) 10%, #e4e9f1);
border-radius: 15px;
background: color-mix(in srgb, var(--ly-section-accent) 9%, #fff);
}
.ly-benefit h3,
.ly-process h3 {
font-size: 16px;
font-weight: 760;
letter-spacing: -0.2px;
}
.ly-benefit p,
.ly-process p {
color: #657184;
font-size: 12px;
line-height: 1.8;
}
@media (hover: hover) {
.ly-benefit:hover {
background: #fbfcff;
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ly-section-accent) 8%, transparent);
}
}
.ly-process__index {
width: 48px;
height: 48px;
border-color: #dce2eb;
border-radius: 16px;
box-shadow: 0 9px 26px rgba(15, 23, 42, 0.07);
transition:
background-color var(--ly-duration-fast, 160ms) ease,
border-color var(--ly-duration-fast, 160ms) ease,
box-shadow var(--ly-duration-fast, 160ms) ease,
color var(--ly-duration-fast, 160ms) ease,
transform var(--ly-duration-fast, 160ms) var(--ly-ease-standard, ease);
}
@media (hover: hover) {
.ly-process li:hover .ly-process__index {
border-color: var(--ly-section-accent);
background: var(--ly-section-accent);
box-shadow: 0 12px 28px color-mix(in srgb, var(--ly-section-accent) 24%, transparent);
color: #fff;
transform: translateY(-3px);
}
}
.ly-enterprise-grid {
gap: 18px;
}
.ly-enterprise-card {
min-height: 384px;
border-color: rgba(255, 255, 255, 0.11);
border-radius: 28px;
background:
radial-gradient(circle at 96% 8%, rgba(85, 113, 255, 0.12), transparent 30%),
linear-gradient(150deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025));
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
transition:
border-color var(--ly-duration-standard, 260ms) ease,
background-color var(--ly-duration-standard, 260ms) ease,
box-shadow var(--ly-duration-standard, 260ms) ease,
transform var(--ly-duration-standard, 260ms) var(--ly-ease-standard, ease);
}
.ly-enterprise-card__action {
transition: color var(--ly-duration-fast, 160ms) ease;
}
.ly-enterprise-card__action i {
display: inline-block;
transition: transform var(--ly-duration-fast, 160ms) var(--ly-ease-standard, ease);
}
@media (hover: hover) {
.ly-enterprise-card:hover {
border-color: rgba(132, 154, 255, 0.3);
background-color: rgba(255, 255, 255, 0.025);
box-shadow: 0 26px 56px rgba(0, 0, 0, 0.2);
transform: translateY(-5px);
}
.ly-enterprise-card__action:hover i,
.ly-enterprise-card__action:focus-visible i {
transform: translateX(4px);
}
}
.ly-testimonial-grid {
gap: 22px;
}
.ly-testimonial {
min-height: 326px;
padding: 32px;
border-color: rgba(219, 225, 234, 0.95);
border-radius: 25px;
box-shadow: var(--ly-shadow-sm, 0 4px 16px rgba(15, 23, 42, 0.045));
transition:
border-color var(--ly-duration-standard, 260ms) ease,
box-shadow var(--ly-duration-standard, 260ms) ease,
transform var(--ly-duration-standard, 260ms) var(--ly-ease-standard, ease);
}
@media (hover: hover) {
.ly-testimonial:hover {
border-color: color-mix(in srgb, var(--ly-section-accent) 20%, #d8deea);
box-shadow: var(--ly-shadow-md, 0 18px 50px rgba(15, 23, 42, 0.085));
transform: translateY(-4px);
}
}
.ly-faq-list {
max-width: 940px;
border-top-color: #e1e6ee;
}
.ly-faq-list details {
border-bottom-color: #e1e6ee;
}
.ly-faq-list summary {
min-height: 90px;
font-weight: 710;
transition: color var(--ly-duration-fast, 160ms) ease;
}
.ly-faq-list summary i {
background: #f0f3f7;
transition:
background-color var(--ly-duration-fast, 160ms) ease,
transform var(--ly-duration-fast, 160ms) var(--ly-ease-standard, ease);
}
.ly-faq-list details[open] summary {
color: var(--ly-section-accent);
}
.ly-faq-list details[open] summary i {
background: color-mix(in srgb, var(--ly-section-accent) 10%, #fff);
transform: rotate(180deg);
}
@media (hover: hover) {
.ly-faq-list summary:hover {
color: var(--ly-section-accent);
}
}
.ly-home-section--cta {
padding-top: 64px;
padding-bottom: 64px;
}
.ly-cta {
min-height: 334px;
padding: 64px 70px;
border: 1px solid rgba(255, 255, 255, 0.07);
border-radius: 34px;
background:
radial-gradient(circle at 88% 12%, rgba(82, 111, 255, 0.42), transparent 30%),
radial-gradient(circle at 8% 110%, rgba(32, 164, 122, 0.12), transparent 34%),
linear-gradient(135deg, #090f1f 0%, #101b35 100%);
box-shadow: 0 34px 80px rgba(9, 15, 31, 0.18);
}
.ly-cta__copy > p {
color: #a9b7ff;
font-weight: 800;
}
.ly-cta__copy h2 {
font-weight: 800;
letter-spacing: -2.1px;
}
.ly-cta .ly-section-button--primary {
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.17);
}
.ly-cta .ly-section-button--primary:hover,
.ly-cta .ly-section-button--primary:focus-visible {
background: #f3f6ff;
box-shadow: 0 16px 34px rgba(0, 0, 0, 0.22);
color: #0b1020;
}
.ly-cta .ly-section-button--secondary:hover,
.ly-cta .ly-section-button--secondary:focus-visible {
border-color: rgba(255, 255, 255, 0.28);
background: rgba(255, 255, 255, 0.1);
color: #fff;
}
.ly-home-section--footer {
padding: 0 0 30px;
overflow: hidden;
background:
radial-gradient(circle at 12% -10%, rgba(49, 94, 251, 0.11), transparent 25%),
#070c17;
}
.ly-home-section--footer::before {
display: block;
width: 100%;
height: 1px;
background: linear-gradient(90deg, transparent, rgba(105, 131, 255, 0.45), transparent);
content: "";
}
.ly-footer__assurances {
display: grid;
padding: 34px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.ly-footer__assurances > div {
display: flex;
align-items: center;
justify-content: center;
gap: 11px;
min-height: 36px;
border-right: 1px solid rgba(255, 255, 255, 0.08);
}
.ly-footer__assurances > div:last-child {
border-right: 0;
}
.ly-footer__assurances span {
position: relative;
width: 24px;
height: 24px;
flex: 0 0 24px;
border: 1px solid rgba(101, 130, 255, 0.22);
border-radius: 50%;
background: rgba(70, 102, 255, 0.09);
}
.ly-footer__assurances span::after {
position: absolute;
top: 7px;
left: 6px;
width: 10px;
height: 5px;
border-bottom: 2px solid #8da3ff;
border-left: 2px solid #8da3ff;
content: "";
transform: rotate(-45deg);
}
.ly-footer__assurances strong {
color: #d8e0f0;
font-size: 11px;
font-weight: 660;
}
.ly-footer__main {
gap: 58px;
padding-top: 68px;
padding-bottom: 62px;
}
.ly-footer__brand > a > span {
width: 42px;
height: 42px;
border-radius: 13px;
background: linear-gradient(145deg, #315efb 0%, #416eff 48%, #20a47a 100%);
box-shadow: 0 12px 28px rgba(49, 94, 251, 0.18);
}
.ly-footer__brand > a strong {
font-size: 20px;
font-weight: 780;
letter-spacing: -0.55px;
}
.ly-footer__brand p {
margin-top: 24px;
color: #929eb2;
line-height: 1.86;
}
.ly-footer__group h2 {
margin-bottom: 22px;
font-size: 11px;
font-weight: 760;
letter-spacing: 0.25px;
}
.ly-footer__group li + li {
margin-top: 15px;
}
.ly-footer__group a {
color: #8e9aaf;
transition:
color var(--ly-duration-fast, 160ms) ease,
transform var(--ly-duration-fast, 160ms) var(--ly-ease-standard, ease);
}
.ly-footer__group a:hover,
.ly-footer__group a:focus-visible {
display: inline-block;
color: #fff;
transform: translateX(3px);
}
.ly-footer__statement {
padding: 24px 0;
color: #707c90;
line-height: 1.85;
}
.ly-footer__bottom {
padding-top: 26px;
color: #626e81;
}
@media (max-width: 1100px) {
.ly-home-section {
padding: 92px 0;
}
.ly-footer__main {
padding-top: 58px;
}
}
@media (max-width: 767px) {
.ly-home-section {
padding: 72px 0;
}
.ly-home-section__inner,
.ly-footer__inner {
width: min(100% - 32px, 1240px);
}
.ly-section-heading {
margin-bottom: 32px;
}
.ly-section-heading h2 {
font-size: 33px;
letter-spacing: -1.35px;
}
.ly-section-heading__description {
font-size: 13px;
line-height: 1.78;
}
.ly-card-grid {
gap: 16px;
}
.ly-card {
border-radius: 22px;
}
.ly-card__media {
height: 188px;
}
.ly-card__body {
min-height: 204px;
padding: 22px;
}
.ly-benefit-grid {
border-radius: 23px;
}
.ly-benefit,
.ly-benefit:nth-child(2n),
.ly-benefit:nth-child(3n),
.ly-benefit:nth-last-child(-n + 2),
.ly-benefit:nth-last-child(-n + 3) {
padding: 25px 23px;
}
.ly-enterprise-card {
min-height: 336px;
border-radius: 24px;
}
.ly-testimonial {
min-height: 284px;
padding: 26px;
border-radius: 22px;
}
.ly-faq-list summary {
min-height: 78px;
}
.ly-home-section--cta {
padding-top: 32px;
padding-bottom: 32px;
}
.ly-cta {
padding: 46px 28px;
border-radius: 26px;
box-shadow: 0 24px 56px rgba(9, 15, 31, 0.16);
}
.ly-cta__copy h2 {
font-size: 35px;
letter-spacing: -1.5px;
}
.ly-home-section--footer {
padding-top: 0;
}
.ly-footer__assurances {
padding: 26px 0;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ly-footer__assurances > div {
justify-content: flex-start;
padding: 13px 8px;
border-right: 0;
}
.ly-footer__main {
gap: 40px 24px;
padding-top: 50px;
padding-bottom: 48px;
}
} @media (min-width: 701px) {
.home .ly-home-section { padding: 36px 0; }
.home .ly-home-section__inner { width: min(1160px, calc(100% - 48px)); }
.home .ly-section-heading { gap: 24px; margin-bottom: 24px; }
.home .ly-section-heading h2 { font-size: clamp(26px, 2.3vw, 32px); font-weight: 700; line-height: 1.3; letter-spacing: -.025em; }
.home .ly-section-heading__description { margin-top: 10px; font-size: 15px; line-height: 1.75; }
.home .ly-ai-service-entry { padding: 28px; border-radius: 16px; background: #f8faff; box-shadow: none; }
.home .ly-home-section--trust > .ly-home-section__inner { padding: 28px; border-radius: 16px; background: #fff; box-shadow: none; }
.home .ly-home-section--trust .ly-biz-flow { margin-bottom: 0; }
.home .ly-home-section--trust .ly-biz-flow li { box-shadow: none; border-radius: 12px; }
.home .ly-cases__home { grid-template-columns: minmax(0, 1fr); margin-bottom: 0; }
.home .ly-cases__home .ly-case-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 28px; padding: 24px; border-radius: 16px; box-shadow: none; }
.home .ly-cases__home .ly-case-card h3 { margin: 0; font-size: 21px; line-height: 1.45; }
.home .ly-cases__home .ly-case-card > p { margin: 0; }
.home .ly-cases__home .ly-case__type { grid-column: 1 / -1; }
.home .ly-cases__home .ly-card__cta { grid-column: 2; grid-row: 2 / span 2; align-self: center; }
.home .ly-home-section--final-cta__card { padding: 28px; border-radius: 16px; background: #f8faff; }
.home .ly-home-section--final-cta__card h2 { font-size: 28px; }
}