.posts-page {
    background:linear-gradient(180deg,#f5faff 0,#edf7ff 70%,#fff 100%);
    overflow-x:clip;
}

.posts-page .feature-hero,
.posts-page .zone-product {
    display:none;
}

.posts-page .article-layout {
    width:min(1520px,calc(100% - 32px));
    max-width:none;
    grid-template-columns:clamp(282px,22vw,320px) minmax(0,1fr);
    gap:32px;
    padding:22px 0 34px;
    min-width:0;
}

.posts-page .prose {
    display:grid;
    width:100%;
    min-width:0;
    max-width:none;
    gap:14px;
}

.posts-page .prose-section {
    width:100%;
    min-width:0;
    max-width:100%;
    margin:0;
    border:1px solid #d8e7f5;
    border-radius:8px;
    background:#fff;
    box-shadow:0 10px 30px rgba(42,84,137,.07);
}

.posts-page .prose-section[id^='section-'] {
    position:relative;
    min-height:440px;
    padding:34px 38px;
    overflow:hidden;
    isolation:isolate;
}

.posts-page .prose-section[id^='section-']::after {
    content:none;
}

.posts-page .prose h2 {
    margin:0 0 13px;
    color:#102246;
    font-size:clamp(24px,2vw,33px);
    line-height:1.12;
    letter-spacing:-.045em;
}

.posts-page .section-index {
    display:grid;
    width:37px;
    height:37px;
    place-items:center;
    margin:0 0 14px;
    border:1px solid #acd3ff;
    border-radius:6px;
    background:#edf7ff;
    color:#0772ed;
    font-size:12px;
    font-weight:800;
    letter-spacing:0;
}

.posts-page .prose p,
.posts-page .prose li {
    color:#566d8c;
    font-size:14px;
    line-height:1.55;
    overflow-wrap:anywhere;
}

.posts-page .prose p { margin:0 0 11px }
.posts-page .prose .post-lead { color:#263e63;font-weight:700 }
.posts-page .prose ul { padding:0;list-style:none }
.posts-page .prose li { padding:0 }

.posts-page .post-points,
.posts-page .post-questions {
    display:grid;
    gap:7px;
    margin:14px 0;
}

.posts-page .post-points > li,
.posts-page .post-questions > li {
    position:relative;
    display:grid;
    grid-template-columns:16px minmax(0,1fr);
    align-items:start;
    column-gap:8px;
    padding:8px 10px;
    border:1px solid #e0ebf7;
    border-radius:6px;
    background:rgba(250,253,255,.94);
    text-indent:0;
}

.posts-page .post-points > li::before,
.posts-page .post-questions > li::before {
    position:static;
    inset:auto;
    display:grid;
    grid-column:1;
    grid-row:1;
    width:16px;
    height:16px;
    place-items:center;
    margin-top:2px;
    transform:none;
    border-radius:50%;
    background:#1678ee;
    color:#fff;
    content:'\2713';
    font-size:10px;
    font-weight:800;
    line-height:1;
}

.posts-page .post-points-columns {
    grid-template-columns:repeat(2,minmax(0,1fr));
}

.posts-page .post-flow {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:7px;
    margin:15px 0;
    padding:12px;
    border:1px solid #d7e8fb;
    border-radius:7px;
    background:#f2f8ff;
}

.posts-page .post-flow span {
    padding:7px 9px;
    border-radius:5px;
    background:#fff;
    color:#176bd9;
    font-size:11px;
    font-weight:700;
}

.posts-page .post-flow b { color:#69a7ef }

.posts-page .post-capacity {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
    margin:18px 0;
}

.posts-page .post-capacity span {
    padding:13px 10px;
    border:1px solid #d9e8f7;
    border-radius:7px;
    background:rgba(255,255,255,.92);
    color:#6fa3dd;
    font-size:10px;
    box-shadow:0 8px 20px rgba(39,82,139,.06);
}

.posts-page .post-capacity b {
    display:block;
    margin-bottom:4px;
    color:#17355c;
    font-size:13px;
}

.posts-page #section-1 {
    min-height:650px;
    padding-right:58%;
    background:#eaf6ff;
}

.posts-page #section-1::before {
    position:absolute;
    z-index:-1;
    inset:0;
    background:linear-gradient(90deg,rgba(255,255,255,.98) 0,rgba(255,255,255,.93) 42%,rgba(255,255,255,.14) 70%);
    content:'';
}

.posts-page #section-1 .post-points {
    margin-top:18px;
    padding:12px;
    border:1px solid #d9e8f7;
    border-radius:8px;
    background:rgba(255,255,255,.92);
    box-shadow:0 13px 30px rgba(41,86,143,.11);
}

.posts-page #section-2 {
    min-height:600px;
    padding-left:52%;
    background:linear-gradient(270deg,#fff 0 51%,#ebf6ff 100%);
}

.posts-page #section-2::before {
    position:absolute;
    z-index:-1;
    top:0;
    bottom:0;
    left:0;
    width:48%;
    background:url('/assets/images/posts/posts-camera-generated.png') center/cover no-repeat;
    content:'';
}

.posts-page #section-3 {
    min-height:650px;
    padding-right:57%;
    background:#eaf6ff;
}

.posts-page #section-3::before {
    position:absolute;
    z-index:-1;
    inset:0;
    background:linear-gradient(90deg,rgba(255,255,255,.98) 0,rgba(255,255,255,.91) 47%,rgba(255,255,255,.08) 74%);
    content:'';
}

.posts-page #section-3 .post-points {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
}

.posts-page #section-3 .post-points li { font-size:11px }

.posts-page #section-4 {
    min-height:475px;
    padding-left:54%;
    background:linear-gradient(270deg,#fff 0 52%,#edf8ff 100%);
}

.posts-page #section-4::before {
    position:absolute;
    z-index:-1;
    top:28px;
    bottom:28px;
    left:24px;
    width:47%;
    border-radius:8px;
    background:#f0f8ff url('/assets/images/posts/posts-orders-generated.png') center/cover no-repeat;
    box-shadow:0 16px 36px rgba(35,83,143,.14);
    content:'';
}

.posts-page #section-5 {
    min-height:535px;
    padding-right:56%;
    background:#eaf6ff;
}

.posts-page #section-5::before {
    position:absolute;
    z-index:-1;
    inset:0;
    background:linear-gradient(90deg,#fff 0,rgba(255,255,255,.98) 38%,rgba(255,255,255,.82) 44%,rgba(255,255,255,0) 60%);
    content:'';
}

@media (min-width:861px) {
    .posts-page #section-1::after,
    .posts-page #section-3::after {
        position:absolute;
        z-index:-2;
        inset:0;
        background:center/cover no-repeat;
        content:'';
    }

    .posts-page #section-1::after {
        background-image:url('/assets/images/posts/posts-hero-generated.png');
    }

    .posts-page #section-3::after {
        background-image:url('/assets/images/posts/posts-suv-generated.png');
    }

    .posts-page #section-5::after {
        position:absolute;
        z-index:-2;
        inset:0 0 0 38%;
        background:url('/assets/images/posts/posts-bays-reference.png') center/cover no-repeat;
        content:'';
    }
}

@media (hover:hover) and (prefers-reduced-motion:no-preference) {
    .posts-page :is(#section-1, #section-3, #section-5)::after,
    .posts-page :is(#section-2, #section-4, #section-6)::before {
        transition:scale 900ms cubic-bezier(.2, .65, .3, 1);
    }

    .posts-page :is(#section-1, #section-3, #section-5):hover::after,
    .posts-page :is(#section-2, #section-4, #section-6):hover::before {
        scale:1.035;
    }
}

@media (max-width:860px) and (hover:hover) and (prefers-reduced-motion:no-preference) {
    .posts-page :is(#section-2, #section-4, #section-6)::after {
        transition:scale 900ms cubic-bezier(.2, .65, .3, 1);
    }

    .posts-page :is(#section-2, #section-4, #section-6):hover::after {
        scale:1.035;
    }
}

.posts-page #section-6 {
    min-height:540px;
    padding-left:53%;
    background:linear-gradient(270deg,#fff 0 51%,#edf8ff 100%);
}

.posts-page #section-6::before {
    position:absolute;
    z-index:-1;
    top:25px;
    bottom:25px;
    left:24px;
    width:46%;
    border-radius:8px;
    background:#071c47 url('/assets/images/posts/posts-analytics-generated.png') center/cover no-repeat;
    box-shadow:0 18px 40px rgba(21,58,117,.24);
    content:'';
}

.posts-page .post-process-section {
    padding:28px 32px;
    background:linear-gradient(135deg,#dff1ff,#f9fcff 62%,#cce8ff);
}

.posts-page .post-process-section .post-flow {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
}

.posts-page .post-process-section .post-flow b { display:none }

.posts-page .post-related-links {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:18px;
}

.posts-page .post-related-links a {
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding:12px;
    border:1px solid #d5e7fa;
    border-radius:7px;
    background:rgba(255,255,255,.9);
    color:#1e70dc;
    font-size:12px;
    font-weight:650;
    text-decoration:none;
}

.posts-page .posts-faq {
    padding:34px;
    background:#fff;
}

@media (max-width:1200px) {
    .posts-page .article-layout {
        grid-template-columns:1fr;
        gap:16px;
    }

    .posts-page .prose-section {
        scroll-margin-top:180px;
    }

    .posts-page .toc {
        min-width:0;
        max-width:100%;
    }
}

@media (max-width:860px) {
    .posts-page .prose-section[id^='section-'],
    .posts-page #section-1,
    .posts-page #section-2,
    .posts-page #section-3,
    .posts-page #section-4,
    .posts-page #section-5,
    .posts-page #section-6 {
        min-height:0;
        padding:28px 24px;
        background:#fff;
    }

    .posts-page .prose-section[id^='section-']::before {
        display:none;
    }

    .posts-page .prose-section[id^='section-']::after {
        content:'';
        display:block;
        position:relative;
        width:100%;
        aspect-ratio:16 / 9;
        margin-top:22px;
        border-radius:8px;
        background-color:#eef7ff;
        background-position:center;
        background-size:contain;
        background-repeat:no-repeat;
    }

    .posts-page #section-1::after {
        background-image:url('/assets/images/posts/posts-hero-generated.png');
    }

    .posts-page #section-2::after {
        background-image:url('/assets/images/posts/posts-camera-generated.png');
    }

    .posts-page #section-3::after {
        background-image:url('/assets/images/posts/posts-suv-generated.png');
    }

    .posts-page #section-4::after {
        background-image:url('/assets/images/posts/posts-orders-generated.png');
    }

    .posts-page #section-5::after {
        background-image:url('/assets/images/posts/posts-bays-reference.png');
    }

    .posts-page #section-6::after {
        background-image:url('/assets/images/posts/posts-analytics-generated.png');
    }

    .posts-page .posts-faq {
        padding:24px;
    }
}

@media (max-width:600px) {
    .posts-page .article-layout {
        width:calc(100% - 18px);
        max-width:calc(100vw - 18px);
        padding-top:10px;
    }

    .posts-page .prose-section { scroll-margin-top:158px }

    .posts-page .prose-section[id^='section-'],
    .posts-page #section-1,
    .posts-page #section-2,
    .posts-page #section-3,
    .posts-page #section-4,
    .posts-page #section-5,
    .posts-page #section-6 {
        padding:22px 18px;
    }

    .posts-page .prose-section[id^='section-']::after {
        margin-top:18px;
    }

    .posts-page .prose h2 {
        font-size:25px;
        line-height:1.2;
        letter-spacing:-.5px;
    }

    .posts-page .prose p,
    .posts-page .prose li {
        font-size:16px;
        line-height:1.65;
    }

    .posts-page #section-3 .post-points li { font-size:15px }

    .posts-page .posts-faq { padding:22px 18px }

    .posts-page .post-questions,
    .posts-page .post-points-columns,
    .posts-page #section-3 .post-points,
    .posts-page .post-capacity,
    .posts-page .post-process-section .post-flow,
    .posts-page .post-related-links { grid-template-columns:1fr }
}
