﻿.solution-list-page {
    color: #17233f;
    background: var(--site-bg);
}

.solution-main {
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 18%, var(--site-blue-glow), transparent 28%),
        linear-gradient(180deg, var(--site-bg-tint) 0%, var(--site-bg-soft) 46%, var(--site-bg) 100%);
}

.sl-shell {
    width: min(1600px, calc(100% - 72px));
    margin: 0 auto;
}

.sl-hero {
    position: relative;
    min-height: 550px;
    overflow: hidden;
    color: #fff;
    background-image:
        linear-gradient(90deg, #031023 0%, #031023 12%, rgba(3, 16, 35, .92) 18%, rgba(2, 10, 24, .56) 38%, rgba(2, 10, 24, .08) 66%, rgba(2, 10, 24, 0) 84%, rgba(2, 10, 24, .06) 100%),
        linear-gradient(110deg, #071427 0%, #061b34 42%, #04172d 100%);
    background-position: center, center;
    background-size: cover, cover;
    background-repeat: no-repeat;
}

.sl-hero::before,
.sl-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.sl-hero::before {
    top: 50px;
    right: 110px;
    bottom: auto;
    left: auto;
    z-index: 0;
    width: min(1580px, 88vw);
    aspect-ratio: 1920 / 550;
    background: var(--sl-hero-bg, url("/template/xqd/assets/images/solutions/solution-list-hero-bg.webp?v=2026050719")) center / contain no-repeat;
    opacity: .98;
    -webkit-mask-image: radial-gradient(ellipse at 64% 55%, #000 0%, #000 58%, rgba(0, 0, 0, .78) 70%, transparent 100%);
    mask-image: radial-gradient(ellipse at 64% 55%, #000 0%, #000 58%, rgba(0, 0, 0, .78) 70%, transparent 100%);
}

.sl-hero::after {
    background: linear-gradient(180deg, rgba(2, 9, 22, 0) 72%, rgba(2, 9, 22, .18) 100%);
}

.sl-hero-inner {
    position: relative;
    z-index: 1;
    min-height: 550px;
    display: flex;
    align-items: center;
    padding-top: 88px;
    padding-bottom: 128px;
}

.sl-hero-copy {
    max-width: 760px;
    padding: 12px 0 0;
}

.sl-hero-copy h1 {
    margin: 0 0 12px;
    color: #fff;
    font-size: 58px;
    line-height: 1.12;
    letter-spacing: 0;
    font-weight: 900;
}

.sl-hero-lead {
    max-width: 700px;
    margin: 0;
    color: #eef6ff;
    font-size: 27px;
    line-height: 1.45;
    font-weight: 750;
}

.sl-hero-text {
    max-width: 700px;
    margin: 10px 0 0;
    color: #9fb4d3;
    font-size: 15px;
    line-height: 1.65;
    font-weight: 500;
    display: none;
}

.sl-hero-metrics {
    display: grid;
    grid-template-columns: repeat(3, max-content);
    align-items: center;
    column-gap: 30px;
    row-gap: 0;
    margin-top: 42px;
}

.sl-hero-metrics div {
    display: grid;
    grid-template-columns: 42px max-content;
    grid-template-rows: auto auto;
    align-items: center;
    min-width: 0;
    column-gap: 12px;
    color: #c8d8f0;
}

.sl-hero-metrics i {
    position: relative;
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(23, 132, 255, .66);
    border-radius: 50%;
    background: rgba(8, 55, 119, .46);
    box-shadow: 0 0 22px rgba(19, 126, 255, .24), inset 0 0 14px rgba(25, 132, 255, .16);
    color: #1687ff;
}

.sl-hero-metrics i::before,
.sl-hero-metrics i::after {
    content: "";
    position: absolute;
}

.sl-hero-metrics i::before {
    inset: 10px;
    background: currentColor;
    -webkit-mask: var(--metric-icon) center / contain no-repeat;
    mask: var(--metric-icon) center / contain no-repeat;
}

.sl-hero-metrics i::after {
    inset: 5px;
    border: 1px solid rgba(22, 135, 255, .18);
    border-radius: 50%;
}

.metric-insight {
    --metric-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='7.5'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Cpath d='M12 3v3M12 18v3M3 12h3M18 12h3'/%3E%3C/svg%3E");
}

.metric-ai {
    --metric-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 19 6v5c0 4-2.8 7.2-7 9-4.2-1.8-7-5-7-9V6l7-3Z'/%3E%3Cpath d='m9 12 2 2 4-5'/%3E%3C/svg%3E");
}

.metric-service {
    --metric-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M4 12h16M12 4c2.2 2.3 3.4 5 3.4 8S14.2 17.7 12 20M12 4c-2.2 2.3-3.4 5-3.4 8S9.8 17.7 12 20'/%3E%3C/svg%3E");
}

.sl-hero-metrics strong,
.sl-hero-metrics span {
    display: block;
    grid-column: 2;
    white-space: nowrap;
}

.sl-hero-metrics i {
    grid-row: 1 / 3;
}

.sl-hero-metrics strong {
    color: #f3f8ff;
    font-size: 15px;
    line-height: 1.2;
    font-weight: 850;
}

.sl-hero-metrics span {
    margin-top: 5px;
    color: #9fb4d3;
    font-size: 12px;
    line-height: 1.2;
}

.sl-hero-visual {
    display: none;
}

.sl-ai-stage {
    position: absolute;
    inset: -8px -18px 0 0;
    min-height: 402px;
}

.sl-ai-stage::before,
.sl-ai-stage::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.sl-ai-stage::before {
    left: 50%;
    top: 62%;
    width: 610px;
    height: 220px;
    border-radius: 50%;
    background:
        repeating-radial-gradient(ellipse, rgba(44, 171, 255, .5) 0 2px, transparent 2px 22px),
        radial-gradient(ellipse at center, rgba(22, 136, 255, .26), rgba(22, 136, 255, .08) 38%, transparent 68%);
    filter: drop-shadow(0 0 34px rgba(18, 132, 255, .36));
    transform: translate(-50%, -50%) perspective(760px) rotateX(66deg);
}

.sl-ai-stage::after {
    left: 18%;
    top: 26%;
    width: 70%;
    height: 260px;
    border-top: 1px solid rgba(55, 163, 255, .18);
    border-bottom: 1px solid rgba(55, 163, 255, .08);
    border-radius: 50%;
    transform: rotate(-8deg);
}

.sl-platform {
    position: absolute;
    left: 50%;
    top: 58%;
    z-index: 4;
    width: 260px;
    height: 88px;
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(88, 218, 255, .48), rgba(18, 115, 255, .22)),
        linear-gradient(90deg, rgba(15, 102, 242, .26), rgba(76, 211, 255, .38), rgba(15, 102, 242, .26));
    border: 1px solid rgba(92, 207, 255, .62);
    box-shadow:
        0 0 38px rgba(24, 145, 255, .68),
        inset 0 0 22px rgba(153, 237, 255, .22);
    transform: translate(-50%, -50%) perspective(620px) rotateX(64deg) rotateZ(-1deg);
}

.sl-platform::before,
.sl-platform::after {
    content: "";
    position: absolute;
    left: 50%;
    border: 1px solid rgba(88, 205, 255, .62);
    border-radius: 18px;
    transform: translateX(-50%);
}

.sl-platform::before {
    top: 14px;
    width: 72%;
    height: 40%;
    background: rgba(19, 126, 255, .18);
}

.sl-platform::after {
    top: 30px;
    width: 54%;
    height: 28%;
    border-color: rgba(143, 229, 255, .64);
}

.sl-ai-core {
    position: absolute;
    left: 50%;
    top: 38%;
    z-index: 5;
    width: 162px;
    height: 152px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(118, 214, 255, .76);
    border-radius: 14px;
    color: #7de7ff;
    background:
        linear-gradient(180deg, rgba(52, 172, 255, .32), rgba(7, 51, 130, .5)),
        radial-gradient(circle at 50% 40%, rgba(117, 233, 255, .34), transparent 58%);
    box-shadow:
        0 0 42px rgba(37, 160, 255, .74),
        inset 0 0 28px rgba(111, 221, 255, .22);
    font-size: 62px;
    line-height: 1;
    font-weight: 900;
    transform: translate(-50%, -50%);
    text-shadow: 0 0 22px rgba(108, 228, 255, .86);
}

.sl-ai-core::before,
.sl-ai-core::after {
    content: "";
    position: absolute;
    inset: 10px;
    border: 1px solid rgba(126, 222, 255, .34);
    border-radius: 10px;
}

.sl-ai-core::after {
    inset: auto 18px -18px;
    height: 12px;
    border-radius: 50%;
    background: rgba(53, 178, 255, .52);
    filter: blur(6px);
}

.sl-orbit {
    position: absolute;
    left: 50%;
    top: 47%;
    z-index: 2;
    border: 1px solid rgba(71, 168, 255, .34);
    border-radius: 50%;
    transform: translate(-50%, -50%) rotate(-12deg);
}

.orbit-one {
    width: 380px;
    height: 118px;
}

.orbit-two {
    width: 520px;
    height: 172px;
    transform: translate(-50%, -50%) rotate(18deg);
}

.orbit-three {
    width: 300px;
    height: 88px;
    transform: translate(-50%, -50%) rotate(42deg);
}

.sl-cube {
    position: absolute;
    z-index: 6;
    width: 74px;
    height: 74px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(87, 178, 255, .56);
    border-radius: 10px;
    color: #59c8ff;
    background: linear-gradient(145deg, rgba(14, 85, 171, .78), rgba(7, 31, 78, .48));
    box-shadow:
        0 0 26px rgba(27, 124, 255, .34),
        inset 0 1px 0 rgba(255, 255, 255, .14);
    backdrop-filter: blur(7px);
    transform: rotateX(10deg) rotateY(-10deg) rotateZ(-2deg);
}

.sl-cube svg {
    width: 38px;
    height: 38px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.cube-1 { left: 22%; top: 45%; }
.cube-2 { left: 30%; top: 25%; }
.cube-3 { left: 65%; top: 16%; }
.cube-4 { left: 77%; top: 40%; }
.cube-5 { left: 66%; top: 58%; }
.cube-6 { left: 39%; top: 67%; }

.sl-hero-panel {
    display: none;
    position: absolute;
    right: 24px;
    top: 28%;
    z-index: 7;
    width: 206px;
    padding: 18px 17px;
    border: 1px solid rgba(94, 170, 255, .42);
    border-radius: 9px;
    color: #c6d8f2;
    background: linear-gradient(145deg, rgba(8, 34, 78, .88), rgba(5, 22, 54, .76));
    box-shadow: 0 22px 48px rgba(0, 20, 58, .34), inset 0 0 24px rgba(40, 140, 255, .08);
    transform: rotate(8deg);
}

.sl-hero-panel strong {
    display: block;
    margin-bottom: 10px;
    color: #edf7ff;
    font-size: 14px;
    font-weight: 850;
}

.sl-hero-panel span {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 7px 0;
    border-bottom: 1px solid rgba(140, 185, 255, .13);
    font-size: 13px;
}

.sl-hero-panel span:last-child {
    border-bottom: 0;
}

.sl-hero-panel b {
    color: #fff;
    font-size: 16px;
}

.sl-tabs-wrap {
    position: relative;
    z-index: 8;
    margin-top: -50px;
}

.sl-tabs {
    min-height: 136px;
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    align-items: stretch;
    overflow: hidden;
    border: 1px solid rgba(210, 224, 244, .95);
    border-radius: 16px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 252, 255, .96)),
        #fff;
    box-shadow: 0 24px 60px rgba(22, 62, 120, .2);
}

.sl-tabs [data-solution-tab] {
    position: relative;
    min-width: 0;
    min-height: 136px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    padding: 20px 10px 18px;
    border: 0;
    background: transparent;
    color: #15294d;
    font: inherit;
    text-align: center;
    text-decoration: none;
    font-size: 15px;
    font-weight: 850;
    cursor: pointer;
    transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}

.sl-tabs [data-solution-tab]:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 34px;
    right: 0;
    bottom: 34px;
    width: 1px;
    background: linear-gradient(180deg, transparent, #d9e5f3 18%, #d9e5f3 82%, transparent);
}

.sl-tabs [data-solution-tab]::before {
    content: "";
    position: absolute;
    left: 28px;
    right: 28px;
    bottom: 0;
    height: 4px;
    border-radius: 99px 99px 0 0;
    background: #147bff;
    transform: scaleX(0);
    transition: transform .2s ease;
}

.sl-tabs [data-solution-tab] strong {
    display: block;
    color: #061c3c;
    font-size: 17px;
    line-height: 1.15;
    font-weight: 900;
}

.sl-tabs [data-solution-tab] em {
    display: block;
    min-height: 16px;
    color: #6c7d9c;
    font-size: 0;
    font-style: normal;
    font-weight: 750;
    line-height: 1.2;
}

.sl-tabs [data-solution-tab] em::before {
    content: "";
    display: block;
    font-size: 12px;
}

.sl-tabs [data-solution-tab]:nth-child(1) em::before {
    content: "全场景方案";
}

.sl-tabs [data-solution-tab]:nth-child(2) em::before {
    content: "工厂 / 设备 / B2B";
}

.sl-tabs [data-solution-tab]:nth-child(3) em::before {
    content: "多语种 / 海外获客";
}

.sl-tabs [data-solution-tab]:nth-child(4) em::before {
    content: "本地门店 / 区域服务";
}

.sl-tabs [data-solution-tab]:nth-child(5) em::before {
    content: "加盟 / 连锁增长";
}

.sl-tabs [data-solution-tab]:nth-child(6) em::before {
    content: "招生 / 教培服务";
}

.sl-tabs [data-solution-tab]:nth-child(7) em::before {
    content: "工程 / 建材获客";
}

.sl-tabs [data-solution-tab]:nth-child(8) em::before {
    content: "更多细分场景";
}

.sl-tabs [data-solution-tab]:hover,
.sl-tabs [data-solution-tab]:focus-visible,
.sl-tabs [data-solution-tab].is-active {
    color: #0d6efd;
}

.sl-tabs [data-solution-tab]:hover,
.sl-tabs [data-solution-tab]:focus-visible {
    background: linear-gradient(180deg, #f8fbff, #eef6ff);
}

.sl-tabs [data-solution-tab].is-active {
    background:
        radial-gradient(circle at 50% 22%, rgba(41, 139, 255, .14), transparent 45%),
        linear-gradient(180deg, #eff6ff, #e8f2ff);
    box-shadow: inset 0 0 0 1px rgba(58, 139, 255, .08);
}

.sl-tabs [data-solution-tab]:hover em,
.sl-tabs [data-solution-tab]:focus-visible em,
.sl-tabs [data-solution-tab].is-active em {
    color: #2d7dff;
}

.sl-tabs [data-solution-tab]:hover::before,
.sl-tabs [data-solution-tab]:focus-visible::before,
.sl-tabs [data-solution-tab].is-active::before {
    transform: scaleX(1);
}

.sl-tab-icon {
    position: relative;
    width: 46px;
    height: 46px;
    display: block;
    border: 1px solid rgba(44, 130, 255, .18);
    border-radius: 14px;
    color: #0d6efd;
    background:
        radial-gradient(circle at 50% 28%, rgba(55, 159, 255, .18), transparent 62%),
        linear-gradient(180deg, #f8fbff, #eef6ff);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .86), 0 8px 18px rgba(20, 93, 181, .08);
    transition: color .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.sl-tab-icon::before {
    content: "";
    position: absolute;
    inset: 9px;
    background: currentColor;
    -webkit-mask: var(--sl-tab-icon) center / contain no-repeat;
    mask: var(--sl-tab-icon) center / contain no-repeat;
}

.sl-tab-icon::after {
    display: none;
}

.sl-tabs [data-solution-tab]:hover .sl-tab-icon,
.sl-tabs [data-solution-tab]:focus-visible .sl-tab-icon {
    border-color: rgba(44, 130, 255, .3);
    background:
        radial-gradient(circle at 50% 28%, rgba(55, 159, 255, .26), transparent 62%),
        linear-gradient(180deg, #fff, #edf6ff);
    transform: translateY(-1px);
}

.sl-tabs [data-solution-tab].is-active .sl-tab-icon {
    color: #fff;
    border-color: rgba(20, 123, 255, .66);
    background:
        radial-gradient(circle at 50% 30%, rgba(99, 206, 255, .36), transparent 62%),
        linear-gradient(180deg, #2089ff, #0d6efd);
    box-shadow: 0 12px 24px rgba(13, 110, 253, .26), inset 0 1px 0 rgba(255, 255, 255, .32);
}

.icon-globe {
    --sl-tab-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.6 4 5.6 4 9s-1.5 6.4-4 9M12 3c-2.5 2.6-4 5.6-4 9s1.5 6.4 4 9'/%3E%3C/svg%3E");
}

.icon-factory {
    --sl-tab-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 20V9l5 3V9l5 3V7h4v13H5Z'/%3E%3Cpath d='M8 16h2M13 16h2M4 20h16'/%3E%3C/svg%3E");
}

.icon-export {
    --sl-tab-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v6c0 4.5-3 7.5-7 9-4-1.5-7-4.5-7-9V6l7-3Z'/%3E%3Cpath d='M9 12l2 2 4-5'/%3E%3C/svg%3E");
}

.icon-local {
    --sl-tab-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s7-5.2 7-11a7 7 0 1 0-14 0c0 5.8 7 11 7 11Z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E");
}

.icon-store {
    --sl-tab-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10h16l-1.5-5h-13L4 10Z'/%3E%3Cpath d='M6 10v10h12V10M9 20v-6h6v6'/%3E%3C/svg%3E");
}

.icon-school {
    --sl-tab-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8l9-4 9 4-9 4-9-4Z'/%3E%3Cpath d='M7 10v5c3 2 7 2 10 0v-5M19 9v5'/%3E%3C/svg%3E");
}

.icon-robot {
    --sl-tab-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='8' width='12' height='10' rx='2'/%3E%3Cpath d='M12 4v4M8.5 12h0M15.5 12h0M9 18v2M15 18v2'/%3E%3C/svg%3E");
}

.icon-build {
    --sl-tab-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 18h16M6 18v-4a6 6 0 0 1 12 0v4'/%3E%3Cpath d='M9 14V9M15 14V9M8 9h8M6 18v2h12v-2'/%3E%3C/svg%3E");
}

.icon-more {
    --sl-tab-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Ccircle cx='8' cy='8' r='2.2'/%3E%3Ccircle cx='16' cy='8' r='2.2'/%3E%3Ccircle cx='8' cy='16' r='2.2'/%3E%3Ccircle cx='16' cy='16' r='2.2'/%3E%3C/svg%3E");
}

.sl-card-panel {
    display: none;
}

.sl-card-panel.is-active {
    display: block;
}

.sl-section {
    padding: 42px 0;
}

.sl-list-section {
    padding-top: 50px;
}

.sl-section-head {
    max-width: 720px;
    margin: 0 auto 30px;
    text-align: center;
}

.sl-section-head h2 {
    margin: 0;
    color: #071d49;
    font-size: 34px;
    line-height: 1.18;
    letter-spacing: 0;
    font-weight: 900;
}

.sl-section-head p {
    margin: 9px 0 0;
    color: #657795;
    font-size: 14px;
}

.sl-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
}

.sl-solution-card {
    display: block;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #dce8f8;
    border-radius: 8px;
    color: inherit;
    background: #fff;
    box-shadow: 0 18px 42px rgba(23, 68, 126, .1);
    text-decoration: none;
    cursor: pointer;
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.sl-solution-card:hover {
    border-color: rgba(22, 124, 255, .34);
    box-shadow: 0 24px 54px rgba(23, 68, 126, .15);
    transform: translateY(-4px);
}

.sl-solution-card:focus-visible {
    outline: 3px solid rgba(15, 111, 255, .3);
    outline-offset: 3px;
}

.sl-card-cover {
    position: relative;
    height: auto;
    aspect-ratio: 8 / 5;
    margin: 0;
    overflow: hidden;
    background: #e8f1fb;
    isolation: isolate;
}

.sl-card-cover::before {
    content: "";
    position: absolute;
    inset: -24px;
    z-index: 0;
    background: var(--sl-cover-image) center / cover no-repeat;
    filter: blur(18px);
    opacity: .48;
    transform: scale(1.08);
}

.sl-card-cover::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(255, 255, 255, .36), rgba(232, 241, 251, .5));
}

.sl-solution-card img {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    object-fit: cover;
    object-position: center;
}

.sl-card-body {
    padding: 19px 18px 20px;
}

.sl-card-body h3 {
    margin: 0;
    color: #092353;
    font-size: 20px;
    line-height: 1.28;
    font-weight: 900;
}

.sl-card-body p {
    min-height: 44px;
    margin: 9px 0 14px;
    color: #5e6f88;
    font-size: 13px;
    line-height: 1.65;
}

.sl-pain-tags,
.sl-service-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.sl-pain-tags span,
.sl-service-tags span {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 0 9px;
    border-radius: 4px;
    font-size: 12px;
    line-height: 1;
    font-weight: 800;
}

.sl-pain-tags span {
    color: #d3422c;
    background: #fff0ec;
}

.sl-service-tags span {
    color: #1268dd;
    background: #edf5ff;
}

.sl-card-link {
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 168px;
    margin-top: 18px;
    border: 1px solid rgba(22, 119, 255, .48);
    border-radius: 4px;
    color: #0f6fff;
    background: #fff;
    font-size: 13px;
    line-height: 1;
    font-weight: 850;
    text-decoration: none;
    transition: color .2s ease, background .2s ease, border-color .2s ease;
}

.sl-card-link::after,
.sl-more a::after {
    content: "";
    width: 13px;
    height: 8px;
    background: currentColor;
    clip-path: polygon(0 36%, 62% 36%, 62% 0, 100% 50%, 62% 100%, 62% 64%, 0 64%);
}

.sl-solution-card:hover .sl-card-link,
.sl-solution-card:focus-visible .sl-card-link {
    color: #fff;
    border-color: #0f6fff;
    background: #0f6fff;
}

.sl-more {
    display: flex;
    justify-content: center;
    margin-top: 26px;
}

.sl-more a {
    min-width: 216px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border: 1px solid rgba(22, 119, 255, .58);
    border-radius: 999px;
    color: #0f6fff;
    background: rgba(255, 255, 255, .68);
    font-size: 14px;
    font-weight: 850;
    text-decoration: none;
    box-shadow: 0 12px 28px rgba(23, 101, 209, .08);
}

.sl-goals,
.sl-system {
    padding-top: 18px;
    padding-bottom: 36px;
}

.sl-mini-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 18px;
}

.sl-mini-grid article {
    min-height: 158px;
    display: grid;
    justify-items: center;
    align-content: start;
    padding: 22px 18px 20px;
    border: 1px solid #dce8f8;
    border-radius: 8px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 15px 34px rgba(23, 68, 126, .08);
    text-align: center;
}

.sl-mini-grid i {
    position: relative;
    width: 46px;
    height: 46px;
    display: block;
    margin-bottom: 12px;
    color: #1176ff;
}

.sl-mini-grid i::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--sl-mini-icon) center / contain no-repeat;
    filter: drop-shadow(0 8px 14px rgba(17, 118, 255, .16));
}

.sl-mini-grid i::after {
    display: none;
}

.mini-search {
    --sl-mini-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%231176ff' stroke-width='6' stroke-linecap='round'%3E%3Ccircle cx='21' cy='21' r='11'/%3E%3Cpath d='M30 30 41 41'/%3E%3C/svg%3E");
}

.mini-db {
    --sl-mini-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='%231176ff' d='M12 4 40 23.2 28.2 26 35.4 39.2 29.2 42.6 22 29.4 12 38z'/%3E%3C/svg%3E");
}

.mini-globe {
    --sl-mini-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%231176ff' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='21.5' cy='24' r='14.5' stroke-width='4'/%3E%3Cpath d='M7 24h29M21.5 9.5c4 4.2 6 8.9 6 14.5s-2 10.3-6 14.5M21.5 9.5c-4 4.2-6 8.9-6 14.5s2 10.3 6 14.5' stroke-width='3.5'/%3E%3Crect x='30' y='16' width='14' height='17' rx='4' fill='%23fff' stroke-width='3.4'/%3E%3Cpath d='M33.2 28.6 37 20.5l3.8 8.1M34.6 25.8h4.8' stroke-width='3.2'/%3E%3C/svg%3E");
}

.mini-video {
    --sl-mini-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Crect x='7' y='10' width='34' height='28' rx='8' fill='%231176ff'/%3E%3Cpath fill='%23fff' d='M21 17.5 32.5 24 21 30.5z'/%3E%3C/svg%3E");
}

.mini-trust {
    --sl-mini-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='%231176ff' d='M24 4 40 10v12c0 10.2-6.2 17.1-16 22C14.2 39.1 8 32.2 8 22V10z'/%3E%3Cpath fill='%23fff' d='M21.5 14h5v7h7v5h-7v7h-5v-7h-7v-5h7z'/%3E%3C/svg%3E");
}

.mini-cost {
    --sl-mini-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='20' fill='%231176ff'/%3E%3Cpath fill='%23fff' d='M26 11v3.4c2.4.3 4.6 1.2 6.3 2.6l-3 4c-1.7-1.2-3.3-1.8-5.3-1.8-1.6 0-2.6.6-2.6 1.6 0 1.1 1.1 1.4 4.6 2.3 4.5 1.2 7.5 2.9 7.5 7.2 0 3.8-2.6 6.5-7.5 7.2V41h-4v-3.4a16.2 16.2 0 0 1-8.3-3.5l3.4-4.2c2.2 1.7 4.5 2.7 7 2.7 1.8 0 2.9-.7 2.9-1.8 0-1.2-1.2-1.5-4.7-2.4-4.5-1.2-7.4-2.9-7.4-7.1 0-3.6 2.5-6.2 7.1-6.8V11z'/%3E%3C/svg%3E");
}

.mini-ai {
    --sl-mini-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Crect x='10' y='8' width='28' height='32' rx='4' fill='%231176ff'/%3E%3Crect x='16' y='16' width='16' height='4' rx='1.5' fill='%23fff'/%3E%3Crect x='16' y='23' width='16' height='4' rx='1.5' fill='%23fff'/%3E%3Crect x='16' y='30' width='12' height='4' rx='1.5' fill='%23fff'/%3E%3C/svg%3E");
}

.mini-content {
    --sl-mini-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Crect x='9' y='8' width='27' height='31' rx='4' fill='%231176ff'/%3E%3Crect x='15' y='16' width='14' height='4' rx='1.4' fill='%23fff'/%3E%3Crect x='15' y='23' width='13' height='4' rx='1.4' fill='%23fff'/%3E%3Ccircle cx='34' cy='32' r='10' fill='%231176ff'/%3E%3Cpath d='M34 27v10M29 32h10' stroke='%23fff' stroke-width='3.2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.mini-matrix {
    --sl-mini-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Crect x='8' y='12' width='30' height='24' rx='6' fill='%231176ff'/%3E%3Cpath d='M16 24c3.5-5 7.2-5 10.8 0 3.5 5 6.8 5 10.2 0' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round'/%3E%3Ccircle cx='18' cy='24' r='3' fill='%23fff'/%3E%3Ccircle cx='30' cy='24' r='3' fill='%23fff'/%3E%3Crect x='39' y='18' width='2.6' height='12' rx='1.3' fill='%231176ff'/%3E%3Crect x='5' y='18' width='2.6' height='12' rx='1.3' fill='%231176ff'/%3E%3C/svg%3E");
}

.mini-chart {
    --sl-mini-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='%231176ff' d='M17 36h20a8 8 0 0 0 1-15.9A12 12 0 0 0 14.8 17 9.8 9.8 0 0 0 17 36Z'/%3E%3Crect x='17' y='25' width='4' height='7' rx='1.2' fill='%23fff'/%3E%3Crect x='24' y='20' width='4' height='12' rx='1.2' fill='%23fff'/%3E%3Crect x='31' y='16' width='4' height='16' rx='1.2' fill='%23fff'/%3E%3C/svg%3E");
}

.mini-geo {
    --sl-mini-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='18' fill='none' stroke='%231176ff' stroke-width='4'/%3E%3Ccircle cx='24' cy='24' r='9' fill='none' stroke='%231176ff' stroke-width='4'/%3E%3Ccircle cx='24' cy='24' r='3.2' fill='%231176ff'/%3E%3Cpath d='M26 33 38 21' fill='none' stroke='%231176ff' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M29 21h9v9' fill='none' stroke='%231176ff' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.mini-world {
    --sl-mini-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%231176ff' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='24' cy='24' r='17'/%3E%3Cpath d='M7 24h34M24 7c4.4 4.8 6.6 10.2 6.6 17S28.4 36.2 24 41M24 7c-4.4 4.8-6.6 10.2-6.6 17S19.6 36.2 24 41'/%3E%3C/svg%3E");
}

.sl-mini-grid h3 {
    margin: 0;
    color: #092353;
    font-size: 17px;
    line-height: 1.32;
    font-weight: 900;
}

.sl-mini-grid p {
    margin: 9px 0 0;
    color: #667792;
    font-size: 13px;
    line-height: 1.6;
}

.sl-bottom-cta {
    padding: 22px 0 0;
    background: linear-gradient(180deg, rgba(238, 246, 255, 0), #eef6ff);
}

.sl-bottom-inner {
    position: relative;
    min-height: 150px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 38px;
    overflow: hidden;
    padding: 34px 64px;
    border: 1px solid rgba(176, 207, 255, .42);
    border-radius: 12px;
    color: #fff;
    background:
        radial-gradient(circle at 22% 50%, rgba(32, 137, 255, .2), transparent 26%),
        radial-gradient(circle at 75% 50%, rgba(18, 105, 255, .16), transparent 31%),
        linear-gradient(100deg, #041229 0%, #061c3c 46%, #07142e 100%);
    box-shadow: 0 20px 52px rgba(6, 29, 62, .25), inset 0 1px 0 rgba(255, 255, 255, .08);
    isolation: isolate;
}

.sl-bottom-art {
    display: none;
}

.sl-bottom-art::after {
    display: none;
}

.sl-bottom-copy,
.sl-bottom-actions {
    position: relative;
    z-index: 1;
}

.sl-bottom-copy {
    min-width: 0;
}

.sl-bottom-copy h2 {
    margin: 0;
    color: #dcecff;
    font-size: 27px;
    line-height: 1.22;
    font-weight: 900;
    letter-spacing: 0;
    text-shadow: 0 0 18px rgba(46, 143, 255, .18);
}

.sl-bottom-copy p {
    margin: 15px 0 0;
    color: #a8bad7;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 600;
}

.sl-bottom-actions {
    display: flex;
    align-items: center;
    gap: 24px;
}

.sl-btn {
    width: 150px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 7px;
    font-size: 15px;
    line-height: 1;
    font-weight: 850;
    white-space: nowrap;
    transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.sl-btn:hover,
.sl-btn:focus-visible {
    transform: translateY(-1px);
}

.sl-btn-primary {
    border: 1px solid rgba(79, 168, 255, .72);
    color: #fff;
    background: linear-gradient(180deg, #2388ff 0%, #0d67ec 100%);
    box-shadow: 0 0 24px rgba(18, 112, 255, .36), inset 0 1px 0 rgba(255, 255, 255, .18);
}

.sl-btn-primary i {
    width: 15px;
    height: 15px;
    position: relative;
    display: inline-grid;
    place-items: center;
    border: 1.6px solid currentColor;
    border-radius: 50%;
}

.sl-btn-primary i::before {
    content: "";
    position: absolute;
    inset: 3px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 4l4 4-4 4' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 4l4 4-4 4' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.sl-btn-ghost {
    border: 1px solid rgba(186, 207, 235, .72);
    color: #e4eefc;
    background: rgba(255, 255, 255, .03);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04);
}

.sl-btn-ghost:hover,
.sl-btn-ghost:focus-visible {
    border-color: rgba(226, 239, 255, .9);
    background: rgba(255, 255, 255, .07);
}

@media (max-width: 1180px) {
    .sl-hero-inner {
        grid-template-columns: 1fr;
        gap: 0;
        padding-bottom: 42px;
    }

    .sl-hero-copy {
        max-width: 760px;
        padding-top: 56px;
    }

    .sl-hero-metrics {
        gap: 22px;
    }

    .sl-hero-visual {
        min-height: 330px;
    }

    .sl-ai-stage {
        inset: -26px 0 0;
        min-height: 360px;
    }

    .sl-card-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .sl-mini-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .sl-bottom-inner {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px;
        padding: 36px;
        text-align: center;
    }

    .sl-bottom-actions {
        justify-content: center;
    }
}

@media (max-width: 980px) {
    .sl-shell {
        width: min(720px, calc(100% - 32px));
    }

    .sl-hero {
        min-height: auto;
    }

    .sl-hero-inner {
        min-height: auto;
        padding-top: 100px;
    }

    .sl-hero-copy {
        width: 100%;
        max-width: none;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 24px 0 22px;
        text-align: center;
    }

    .sl-hero-copy h1,
    .sl-hero-lead {
        width: 100%;
        max-width: none;
        text-align: center;
    }

    .sl-hero-copy h1 {
        font-size: 32px;
        line-height: 1.1;
        font-weight: 850;
    }

    .sl-hero-lead {
        margin-right: auto;
        margin-left: auto;
        font-size: 17px;
        line-height: 1.38;
        font-weight: 700;
    }

    .sl-hero-metrics {
        display: grid;
        grid-template-columns: 1fr;
        width: min(250px, 100%);
        margin-right: auto;
        margin-left: auto;
        justify-content: center;
        justify-items: stretch;
        gap: 14px;
    }

    .sl-hero-metrics div {
        width: 100%;
        grid-template-columns: 46px minmax(0, 1fr);
        column-gap: 14px;
        text-align: left;
    }

    .sl-hero-metrics strong,
    .sl-hero-metrics span {
        text-align: left;
    }

    .sl-hero-visual {
        display: none;
    }

    .sl-tabs-wrap {
        position: sticky;
        top: 58px;
        z-index: 70;
        margin-top: -18px;
        padding: 0;
        background: linear-gradient(180deg, transparent 0 18px, #eef6ff 18px 100%);
    }

    .sl-tabs-wrap::before {
        content: "";
        position: absolute;
        top: 18px;
        right: 0;
        bottom: 0;
        z-index: 2;
        width: 54px;
        background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .94) 58%, #fff 100%);
        pointer-events: none;
    }

    .sl-tabs-wrap .sl-tabs {
        width: 100%;
        max-width: none;
        min-height: 0;
        display: flex;
        align-items: center;
        gap: 8px;
        margin: 0;
        padding: 10px 42px 12px 10px;
        overflow-x: auto;
        overflow-y: hidden;
        border-right: 0;
        border-left: 0;
        border-radius: 0;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .sl-tabs::-webkit-scrollbar {
        display: none;
    }

    .sl-tabs [data-solution-tab] {
        flex: 0 0 auto;
        min-width: 94px;
        min-height: 48px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        align-content: center;
        gap: 7px;
        padding: 0 12px;
        border: 1px solid #d7e8ff;
        border-radius: 10px;
        background: #fff;
        scroll-snap-align: start;
        box-shadow: none;
    }

    .sl-tabs [data-solution-tab]:not(:last-child)::after {
        display: none;
    }

    .sl-tabs [data-solution-tab]::before {
        left: 12px;
        right: 12px;
        height: 3px;
    }

    .sl-tabs [data-solution-tab] strong {
        color: currentColor;
        font-size: 14px;
        white-space: nowrap;
    }

    .sl-tabs [data-solution-tab] em {
        display: none;
    }

    .sl-tab-icon {
        width: 22px;
        height: 22px;
        flex: 0 0 auto;
        border: 0;
        border-radius: 0;
        background: none;
        box-shadow: none;
    }

    .sl-tab-icon::before {
        inset: 2px;
    }

    .sl-tabs [data-solution-tab]:hover .sl-tab-icon,
    .sl-tabs [data-solution-tab]:focus-visible .sl-tab-icon {
        border-color: transparent;
        background: none;
        box-shadow: none;
        transform: none;
    }

    .sl-tabs [data-solution-tab].is-active {
        color: #fff;
        border-color: #147cff;
        background: linear-gradient(180deg, #2e98ff, #0d6efd);
        box-shadow: 0 10px 24px rgba(13, 110, 253, .22);
    }

    .sl-tabs [data-solution-tab].is-active .sl-tab-icon {
        color: #fff;
        border-color: transparent;
        background: none;
        box-shadow: none;
    }

    .sl-list-section {
        padding-top: 24px;
    }

    .sl-card-grid,
    .sl-mini-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sl-bottom-inner {
        width: 100%;
        max-width: none;
        grid-template-columns: 1fr;
        gap: 22px;
        min-height: 230px;
        padding: 42px 24px;
        text-align: center;
        border-right: 0;
        border-left: 0;
        border-radius: 0;
    }

    .sl-bottom-art {
        display: none;
    }

    .sl-bottom-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: min(420px, 100%);
        margin: 0 auto;
    }
}

@media (min-width: 641px) and (max-width: 980px) {
    .sl-hero {
        min-height: 520px;
        background-image:
            linear-gradient(90deg, #031023 0%, rgba(3, 16, 35, .98) 42%, rgba(3, 16, 35, .64) 64%, rgba(3, 16, 35, .18) 100%),
            linear-gradient(110deg, #071427 0%, #061b34 42%, #04172d 100%);
    }

    .sl-hero::before {
        top: 92px;
        right: -72px;
        width: 920px;
        max-width: none;
        opacity: .9;
        -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .32) 15%, #000 34%, #000 78%, rgba(0, 0, 0, .72) 100%);
        mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .32) 15%, #000 34%, #000 78%, rgba(0, 0, 0, .72) 100%);
    }

    .sl-hero-inner {
        min-height: 520px;
        align-items: flex-start;
        padding-top: 108px;
        padding-bottom: 58px;
    }

    .sl-hero-copy {
        width: min(360px, 50%);
        margin-left: 34px;
        align-items: flex-start;
        padding: 36px 0 0;
        text-align: left;
    }

    .sl-hero-copy h1,
    .sl-hero-lead {
        width: 100%;
        max-width: none;
        text-align: left;
    }

    .sl-hero-copy h1 {
        margin-top: 0;
        font-size: 42px;
        line-height: 1.08;
    }

    .sl-hero-lead {
        margin-right: 0;
        margin-left: 0;
        font-size: 20px;
        line-height: 1.45;
    }

    .sl-hero-metrics {
        width: 100%;
        grid-template-columns: 1fr;
        gap: 16px;
        margin-top: 42px;
    }

    .sl-hero-metrics div {
        width: 100%;
        grid-template-columns: 42px minmax(0, 1fr);
        column-gap: 12px;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: none;
        box-shadow: none;
        backdrop-filter: none;
    }

    .sl-hero-metrics i {
        width: 42px;
        height: 42px;
    }

    .sl-hero-metrics strong,
    .sl-hero-metrics span {
        white-space: nowrap;
    }

    .sl-hero-metrics strong {
        font-size: 16px;
    }

    .sl-hero-metrics span {
        font-size: 12px;
        line-height: 1.2;
    }
}

@media (max-width: 640px) {
    .sl-shell {
        width: calc(100% - 28px);
    }

    .sl-hero-copy {
        padding-top: 48px;
    }

    .sl-hero-copy h1 {
        margin-top: 22px;
        font-size: 28px;
        text-align: center;
    }

    .sl-hero-lead {
        font-size: 15px;
        margin-right: auto;
        margin-left: auto;
        text-align: center;
    }

    .sl-hero-text {
        font-size: 13px;
    }

    .sl-hero-metrics {
        width: min(238px, 100%);
        margin-top: 28px;
    }

    .sl-hero-metrics div {
        grid-template-columns: 42px minmax(0, 1fr);
        column-gap: 12px;
    }

    .sl-hero-metrics strong {
        font-size: 14px;
    }

    .sl-hero-metrics span {
        font-size: 11.5px;
    }

    .sl-tabs-wrap .sl-tabs {
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 10px 40px 12px 10px;
    }

    .sl-tabs [data-solution-tab] {
        min-width: 88px;
        min-height: 46px;
        gap: 7px;
        padding: 0 10px;
    }

    .sl-tab-icon {
        width: 20px;
        height: 20px;
    }

    .sl-tab-icon::before {
        inset: 1px;
    }

    .sl-tabs [data-solution-tab] strong {
        font-size: 14px;
    }

    .sl-tabs [data-solution-tab] em::before {
        font-size: 11px;
    }

    .sl-tabs [data-solution-tab]::before {
        left: 10px;
        right: 10px;
    }

    .sl-section {
        padding: 34px 0;
    }

    .sl-list-section {
        padding-top: 36px;
    }

    .sl-section-head h2 {
        font-size: 26px;
    }

    .sl-card-grid,
    .sl-mini-grid {
        grid-template-columns: 1fr;
    }

    .sl-card-cover {
        height: auto;
    }

    .sl-card-body p {
        min-height: 0;
    }

    .sl-card-link {
        width: 100%;
    }

    .sl-mini-grid article {
        min-height: 0;
    }

    .sl-bottom-copy h2 {
        font-size: 25px;
    }

    .sl-bottom-copy p {
        font-size: 14px;
    }

    .sl-bottom-actions {
        grid-template-columns: 1fr;
        justify-items: center;
    }

    .sl-bottom-actions .sl-btn {
        width: min(188px, 100%);
    }
}

