layout-main{}layout-main main>section.steps{display:flex;flex-flow:row wrap;justify-content:center;gap:1.5rem;margin:2rem 0}layout-main main>section.steps>article{flex:1 1 240px;max-width:280px;padding:1.5rem;border-radius:8px;background:var(--background-color-surface);border:1px solid var(--draw-color-surface);border-top:4px solid var(--step-color,var(--draw-color-primary));box-shadow:0 4px 12px color-mix(in srgb,var(--draw-color-surface) 40%,transparent);text-align:center;transition:transform 250ms ease,box-shadow 250ms ease}layout-main main>section.steps>article:hover{transform:translateY(-4px);box-shadow:0 12px 32px color-mix(in srgb,var(--draw-color-surface) 60%,transparent)}layout-main main>section.steps>article.step-1{--step-color:var(--color-blue)}layout-main main>section.steps>article.step-2{--step-color:var(--color-green)}layout-main main>section.steps>article.step-3{--step-color:var(--color-purple)}layout-main main>section.steps>article.step-4{--step-color:var(--color-orange)}layout-main main>section.steps>article .step-number{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:var(--step-color,var(--draw-color-primary));color:var(--color-white);font-size:1.5rem;font-weight:700;margin-bottom:1rem}layout-main main>section.steps>article h3{font-size:1.1rem;font-weight:600;margin:0 0 .5rem;color:var(--text-color-primary)}layout-main main>section.steps>article p{font-size:.9rem;color:var(--text-color-secondary);margin:0;line-height:1.6}@media(width <= 768px){layout-main main>section.steps>article{flex:0 0 100%;max-width:unset}}layout-main{}layout-main main>section.features{display:flex;flex-flow:row wrap;justify-content:center;gap:1rem;margin:2rem 0}layout-main main>section.features>article{flex:1 1 300px;max-width:380px;padding:1.25rem;padding-left:1.5rem;border:1px solid var(--draw-color-surface);border-left:4px solid var(--feature-color,var(--draw-color-primary));border-radius:8px;background:var(--background-color-surface);box-shadow:0 4px 12px color-mix(in srgb,var(--draw-color-surface) 40%,transparent);transition:transform 250ms ease,box-shadow 250ms ease,border-color 250ms ease}layout-main main>section.features>article:hover{transform:translateY(-4px);box-shadow:0 12px 32px color-mix(in srgb,var(--draw-color-surface) 60%,transparent);border-color:var(--draw-color-secondary);border-left-color:var(--feature-color,var(--draw-color-primary))}layout-main main>section.features>article.feature-microservices{--feature-color:var(--color-blue)}layout-main main>section.features>article.feature-java{--feature-color:var(--color-green)}layout-main main>section.features>article.feature-containers{--feature-color:var(--color-purple)}layout-main main>section.features>article.feature-cicd{--feature-color:var(--color-aqua)}layout-main main>section.features>article.feature-api{--feature-color:var(--color-orange)}layout-main main>section.features>article.feature-observable{--feature-color:var(--color-yellow)}layout-main main>section.features>article h3{font-size:1.1rem;font-weight:600;margin:0 0 .75rem;color:var(--feature-color,var(--draw-color-primary))}layout-main main>section.features>article p{font-size:.9rem;color:var(--text-color-secondary);margin:0;line-height:1.6}@media(width <= 768px){layout-main main>section.features>article{flex:0 0 100%;max-width:unset}}layout-main main>.highlight-box{margin:2rem 0;padding:1.5rem 2rem;border-radius:8px;background:color-mix(in srgb,var(--draw-color-primary) 8%,var(--background-color-surface));border:1px solid color-mix(in srgb,var(--draw-color-primary) 20%,transparent);text-align:center}layout-main main>.highlight-box p{margin:0;font-size:1.1rem;color:var(--text-color-primary)}layout-main main>.highlight-box p strong{color:var(--draw-color-primary)}layout-main main dl.faq{display:block;margin:2rem 0}layout-main main dl.faq>dt{font-size:1.05rem;font-weight:600;color:var(--text-color-primary);border-bottom:none;padding:0;margin-top:1.5rem}layout-main main dl.faq>dt:first-child{margin-top:0}layout-main main dl.faq>dd{font-size:.9rem;color:var(--text-color-secondary);line-height:1.6;border-bottom:1px solid var(--draw-color-surface);padding:0 0 1.5rem;margin:.5rem 0 0;margin-inline-start:0;text-align:left;font-weight:400}layout-main main>.cta-center{text-align:center;margin:2rem 0}