.ly-ai-deploy-hub, .ly-ai-service { background: #fff; color: var(--ly-ai-ink); } .ly-ai-deploy-hero {
position: relative;
overflow: hidden;
padding: clamp(72px, 8vw, 116px) 0 clamp(64px, 7vw, 92px);
background: linear-gradient(148deg, #fff 6%, #f4f7ff 60%, #edf3ff 100%);
}
.ly-ai-deploy-hero::before {
position: absolute;
top: -260px;
right: -200px;
width: 560px;
height: 560px;
border: 1px solid rgba(37, 88, 237, .14);
border-radius: 50%;
box-shadow: 0 0 0 64px rgba(37, 88, 237, .026), 0 0 0 140px rgba(37, 88, 237, .018);
content: '';
}
.ly-ai-deploy-hero__inner {
position: relative;
z-index: 1;
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(300px, 400px);
gap: 56px;
align-items: center;
}
.ly-ai-deploy-hero h1 {
max-width: 660px;
margin: 0;
font-size: clamp(38px, 5.4vw, 64px);
font-weight: 780;
line-height: 1.08;
letter-spacing: -.045em;
}
.ly-ai-deploy-hero__lead {
margin: 22px 0 0;
font-size: clamp(18px, 2vw, 23px);
font-weight: 640;
color: var(--ly-ai-blue-dark);
}
.ly-ai-deploy-hero__copy > p {
max-width: 640px;
margin: 14px 0 0;
color: #4c5b73;
font-size: 15.5px;
line-height: 1.75;
}
.ly-ai-deploy-hero__actions {
display: flex;
flex-wrap: wrap;
gap: 14px;
align-items: center;
margin-top: 30px;
}
.ly-ai-deploy-hero__secondary {
color: var(--ly-ai-blue);
font-weight: 640;
text-decoration: none;
font-size: 15.5px;
}
.ly-ai-deploy-hero__secondary:hover { color: var(--ly-ai-blue-dark); }
.ly-ai-deploy-hero__points {
margin: 26px 0 0;
padding: 0;
list-style: none;
display: grid;
gap: 8px;
}
.ly-ai-deploy-hero__points li {
display: flex;
gap: 9px;
align-items: flex-start;
color: var(--ly-ai-muted);
font-size: 14px;
line-height: 1.6;
}
.ly-ai-deploy-hero__points li::before {
content: '';
flex: 0 0 auto;
width: 7px;
height: 7px;
margin-top: 7px;
border-radius: 50%;
background: var(--ly-ai-blue);
} .ly-ai-deploy-hero__panel {
border: 1px solid rgba(37, 88, 237, .12);
border-radius: 20px;
background: rgba(255, 255, 255, .8);
box-shadow: 0 30px 70px rgba(30, 64, 175, .10);
backdrop-filter: blur(10px);
padding: 14px 18px 18px;
}
.ly-ai-deploy-hero__panel-head { display: flex; gap: 6px; padding: 4px 4px 12px; }
.ly-ai-deploy-hero__panel-head span { width: 9px; height: 9px; border-radius: 50%; background: #dbe3ef; }
.ly-ai-deploy-hero__panel dl {
margin: 0;
display: grid;
grid-template-columns: auto minmax(0, 1fr);
gap: 10px 14px;
}
.ly-ai-deploy-hero__panel dt {
align-self: start;
padding: 6px 10px;
border-radius: 8px;
background: #eef4ff;
color: var(--ly-ai-blue-dark);
font-size: 12.5px;
font-weight: 700;
white-space: nowrap;
}
.ly-ai-deploy-hero__panel dd {
margin: 0;
align-self: center;
color: #41506a;
font-size: 14px;
line-height: 1.6;
} .ly-ai-deploy-services { padding: clamp(52px, 6vw, 84px) 0; }
.ly-ai-deploy-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 18px;
margin-top: 6px;
}
.ly-ai-deploy-card {
display: flex;
flex-direction: column;
padding: 22px 22px 18px;
border: 1px solid var(--ly-ai-line);
border-radius: 16px;
background: #fff;
text-decoration: none;
color: inherit;
transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}
.ly-ai-deploy-card:hover {
transform: translateY(-2px);
border-color: rgba(37, 88, 237, .35);
box-shadow: 0 16px 40px rgba(30, 64, 175, .08);
}
.ly-ai-deploy-card h3 { margin: 0; font-size: 18.5px; font-weight: 720; }
.ly-ai-deploy-card > p { margin: 10px 0 0; color: var(--ly-ai-muted); font-size: 14px; line-height: 1.7; }
.ly-ai-deploy-card ul { display: flex; flex-wrap: wrap; gap: 7px; margin: 14px 0 0; padding: 0; list-style: none; }
.ly-ai-deploy-card ul li { padding: 4px 10px; border-radius: 999px; background: var(--ly-ai-soft); color: var(--ly-ai-blue-dark); font-size: 12px; }
.ly-ai-deploy-card__cta {
margin-top: auto;
padding-top: 18px;
display: flex;
align-items: center;
gap: 7px;
color: var(--ly-ai-blue);
font-weight: 660;
font-size: 14.5px;
} .ly-ai-deploy-flow { padding: clamp(44px, 5vw, 68px) 0; background: linear-gradient(180deg, #fbfcff 0%, #fff 100%); border-top: 1px solid #eef2f8; }
.ly-ai-deploy-steps {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 14px;
margin: 10px 0 0;
padding: 0;
list-style: none;
}
.ly-ai-deploy-steps li {
display: flex;
gap: 12px;
align-items: center;
padding: 14px 16px;
border: 1px solid var(--ly-ai-line);
border-radius: 13px;
background: rgba(255, 255, 255, .9);
}
.ly-ai-deploy-steps li > span {
flex: 0 0 auto;
display: inline-grid;
place-items: center;
width: 30px;
height: 30px;
border-radius: 9px;
background: var(--ly-ai-soft);
color: var(--ly-ai-blue);
font-size: 12.5px;
font-weight: 720;
}
.ly-ai-deploy-steps li strong { font-size: 14px; font-weight: 660; line-height: 1.4; } .ly-ai-deploy-extra { padding: clamp(40px, 5vw, 64px) 0; border-top: 1px solid #eef2f8; }
.ly-ai-deploy-cta { padding: clamp(44px, 5vw, 68px) 0; }
.ly-ai-deploy-cta__inner {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: 22px;
align-items: center;
padding: 26px 30px;
border: 1px solid rgba(37, 88, 237, .18);
border-radius: 18px;
background: linear-gradient(150deg, #f4f8ff 0%, #ffffff 70%);
}
.ly-ai-deploy-cta__inner h2 { margin: 0; font-size: 22px; font-weight: 740; }
.ly-ai-deploy-cta__inner p { max-width: 560px; margin: 10px 0 0; color: #4c5b73; font-size: 14.5px; line-height: 1.7; }
.ly-ai-deploy-cta__actions { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.ly-ai-deploy-online { padding: clamp(40px, 5vw, 60px) 0 10px; border-top: 1px solid #eef2f8; }
.ly-ai-deploy-online__row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }
.ly-ai-deploy-chip {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 10px 16px;
border: 1px solid var(--ly-ai-line);
border-radius: 999px;
background: #fff;
color: #41506a;
font-size: 14px;
text-decoration: none;
}
.ly-ai-deploy-chip:hover { border-color: rgba(37, 88, 237, .4); color: var(--ly-ai-blue); background: #f6f9ff; } .ly-ai-service { padding-bottom: clamp(60px, 7vw, 92px); }
.ly-ai-service__intro { padding: clamp(48px, 6vw, 80px) 0 clamp(34px, 4vw, 48px); max-width: 780px; }
.ly-ai-service__back {
display: inline-block;
margin-bottom: 24px;
color: var(--ly-ai-muted);
text-decoration: none;
font-size: 14.5px;
}
.ly-ai-service__back:hover { color: var(--ly-ai-blue); }
.ly-ai-service__intro h1 {
margin: 0;
font-size: clamp(32px, 4.4vw, 52px);
font-weight: 780;
letter-spacing: -.035em;
line-height: 1.1;
}
.ly-ai-service__intro > p {
margin: 16px 0 0;
color: #4c5b73;
font-size: clamp(16px, 1.7vw, 18.5px);
line-height: 1.75;
}
.ly-ai-service__layout {
display: grid;
grid-template-columns: minmax(0, 1fr) 400px;
gap: 30px;
align-items: start;
}
.ly-ai-service__main { display: grid; gap: 18px; }
.ly-ai-service__section {
padding: 24px 26px;
border: 1px solid var(--ly-ai-line);
border-radius: 16px;
background: #fff;
}
.ly-ai-service__section h2 { margin: 0; font-size: 19px; font-weight: 720; }
.ly-ai-service__section > p { margin: 12px 0 0; color: #4c5b73; font-size: 15px; line-height: 1.75; }
.ly-ai-service__list {
margin: 14px 0 0;
padding: 0;
list-style: none;
display: grid;
gap: 9px;
}
.ly-ai-service__list li {
display: flex;
gap: 10px;
align-items: flex-start;
color: #41506a;
font-size: 14.5px;
line-height: 1.65;
}
.ly-ai-service__list li::before {
content: '';
flex: 0 0 auto;
width: 7px;
height: 7px;
margin-top: 8px;
border-radius: 50%;
background: var(--ly-ai-blue);
}
.ly-ai-service__chips { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 14px; }
.ly-ai-service__chips span {
padding: 8px 14px;
border: 1px solid var(--ly-ai-line);
border-radius: 999px;
background: var(--ly-ai-soft);
color: var(--ly-ai-blue-dark);
font-size: 13.5px;
}
.ly-ai-service__note {
margin: 14px 0 0;
padding: 12px 14px;
border-radius: 11px;
background: #f6f8fc;
color: #4c5b73;
font-size: 13.5px;
line-height: 1.7;
}
.ly-ai-service__flow {
margin: 14px 0 0;
padding: 0;
list-style: none;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 10px;
}
.ly-ai-service__flow li {
display: flex;
gap: 10px;
align-items: center;
padding: 11px 14px;
border: 1px solid var(--ly-ai-line);
border-radius: 11px;
font-size: 14px;
color: #41506a;
}
.ly-ai-service__flow li span {
flex: 0 0 auto;
color: var(--ly-ai-blue);
font-size: 12.5px;
font-weight: 720;
}
.ly-ai-service__faqs { margin-top: 14px; display: grid; gap: 10px; }
.ly-ai-service__faq { border: 1px solid var(--ly-ai-line); border-radius: 11px; background: #fff; }
.ly-ai-service__faq summary {
padding: 13px 16px;
cursor: pointer;
font-size: 14.5px;
font-weight: 660;
color: var(--ly-ai-ink);
list-style: none;
position: relative;
padding-right: 40px;
}
.ly-ai-service__faq summary::after {
content: '+';
position: absolute;
right: 16px;
top: 50%;
transform: translateY(-50%);
color: var(--ly-ai-blue);
font-weight: 500;
font-size: 18px;
}
.ly-ai-service__faq[open] summary::after { content: '−'; }
.ly-ai-service__faq summary::-webkit-details-marker { display: none; }
.ly-ai-service__faq p { margin: 0; padding: 0 16px 14px; color: var(--ly-ai-muted); font-size: 13.5px; line-height: 1.7; } .ly-ai-service__aside { position: sticky; top: 24px; }
.ly-ai-lead {
padding: 24px;
border: 1px solid rgba(37, 88, 237, .2);
border-radius: 18px;
background: linear-gradient(160deg, #f8fbff 0%, #ffffff 60%);
}
.ly-ai-lead h2 { margin: 0; font-size: 20px; font-weight: 740; }
.ly-ai-lead > p { margin: 10px 0 0; color: var(--ly-ai-muted); font-size: 13.5px; line-height: 1.7; }
.ly-ai-lead__form { margin-top: 18px; display: grid; gap: 14px; }
.ly-ai-lead__field > label {
display: block;
margin-bottom: 7px;
font-size: 13.5px;
font-weight: 660;
}
.ly-ai-lead__required { margin-left: 5px; color: #c0392b; font-size: 11.5px; font-weight: 640; }
.ly-ai-lead__optional { margin-left: 5px; color: var(--ly-ai-muted); font-size: 11.5px; font-weight: 500; }
.ly-ai-lead__field input[type="text"],
.ly-ai-lead__field select,
.ly-ai-lead__field textarea {
width: 100%;
box-sizing: border-box;
padding: 10px 13px;
border: 1px solid var(--ly-ai-line);
border-radius: 10px;
background: #fff;
color: var(--ly-ai-ink);
font-size: 14px;
font-family: inherit;
line-height: 1.55;
}
.ly-ai-lead__field textarea { resize: vertical; }
.ly-ai-lead__field input:focus,
.ly-ai-lead__field select:focus,
.ly-ai-lead__field textarea:focus {
border-color: var(--ly-ai-blue);
box-shadow: 0 0 0 3px rgba(37, 88, 237, .12);
outline: none;
}
.ly-ai-lead__field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ly-ai-lead__device {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 8px;
}
.ly-ai-lead__device select { grid-column: 1 / -1; }
.ly-ai-lead__device input { width: 100%; box-sizing: border-box; }
.ly-ai-lead__device-hint {
display: inline-block;
margin-top: 9px;
color: var(--ly-ai-blue);
font-size: 13px;
text-decoration: none;
}
.ly-ai-lead__device-hint:hover { text-decoration: underline; }
.ly-ai-lead__contact { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 8px; }
.ly-ai-lead__count { display: block; margin-top: 6px; color: var(--ly-ai-muted); font-size: 11.5px; text-align: right; }
.ly-ai-lead__checks { display: grid; gap: 8px; }
.ly-ai-lead__check {
display: flex;
gap: 8px;
align-items: flex-start;
color: #41506a;
font-size: 13px;
line-height: 1.55;
cursor: pointer;
}
.ly-ai-lead__check input { margin-top: 2px; accent-color: var(--ly-ai-blue); }
.ly-ai-lead__privacy { margin: 0; color: var(--ly-ai-muted); font-size: 12px; line-height: 1.65; }
.ly-ai-lead__error {
margin: 0;
padding: 10px 13px;
border: 1px solid #f3c6c2;
border-radius: 10px;
background: #fdf3f2;
color: #a3352e;
font-size: 13px;
line-height: 1.6;
}
.ly-ai-lead__success {
margin: 0;
padding: 12px 14px;
border: 1px solid #bfe6d5;
border-radius: 10px;
background: #f0faf5;
color: #147a54;
font-size: 13.5px;
line-height: 1.6;
}
.ly-ai-lead__error[hidden], .ly-ai-lead__success[hidden] { display: none; }
.ly-ai-lead__submit { justify-content: center; width: 100%; box-sizing: border-box; }
.ly-ai-lead__submit:disabled { opacity: .6; cursor: wait; }
.ly-ai-lead__trap {
position: absolute !important;
left: -9999px !important;
width: 1px;
height: 1px;
opacity: 0;
} @media (max-width: 1100px) {
.ly-ai-service__layout { grid-template-columns: minmax(0, 1fr); }
.ly-ai-service__aside { position: static; }
.ly-ai-deploy-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ly-ai-deploy-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
.ly-ai-deploy-hero__inner { grid-template-columns: minmax(0, 1fr); }
.ly-ai-deploy-hero__panel { max-width: 460px; }
}
@media (max-width: 640px) {
.ly-ai-shell { width: min(100% - 32px, 1180px); }
.ly-ai-deploy-hero { padding: 52px 0 48px; }
.ly-ai-deploy-hero h1 { font-size: 31px; }
.ly-ai-deploy-hero__actions { flex-direction: column; align-items: stretch; }
.ly-ai-deploy-hero__actions .ly-ai-button { justify-content: center; }
.ly-ai-deploy-hero__secondary { text-align: center; }
.ly-ai-deploy-grid { grid-template-columns: minmax(0, 1fr); }
.ly-ai-deploy-steps { grid-template-columns: minmax(0, 1fr); }
.ly-ai-service__flow { grid-template-columns: minmax(0, 1fr); }
.ly-ai-service__section { padding: 20px 17px; }
.ly-ai-service__intro h1 { font-size: 29px; }
.ly-ai-lead { padding: 20px 16px; }
.ly-ai-lead__field-row { grid-template-columns: minmax(0, 1fr); }
.ly-ai-deploy-cta__inner { padding: 22px 18px; }
.ly-ai-deploy-cta__actions { flex-direction: column; align-items: stretch; }
.ly-ai-deploy-cta__actions .ly-ai-button { justify-content: center; }
}