.sf-updates-main { min-height: calc(100vh - 86px); background: #fff; }
.sf-updates-page { max-width: 1120px; margin: 0 auto; padding: 44px 0 76px; color: #17344b; }
.sf-updates-hero { margin-bottom: 38px; }.sf-updates-kicker { margin: 0 0 8px; color: #178b80; font-size: .74rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.sf-updates-hero h1, .sf-updates-heading h2, .sf-roadmap-card h2 { margin: 0; color: #0a2a4d; }.sf-updates-hero h1 { font-size: clamp(2rem, 4vw, 3.25rem); }.sf-updates-hero p:last-child { margin: 10px 0 0; color: #648096; font-size: 1.02rem; }
.sf-updates-layout { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 54px; align-items: start; }.sf-updates-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 4px; }.sf-updates-heading h2 { font-size: 1.5rem; }.sf-updates-heading span { color: #7890a1; font-size: .82rem; }
.sf-update-entry { display: grid; grid-template-columns: 126px minmax(0, 1fr); gap: 24px; padding: 24px 0; border-top: 1px solid #dce7ed; }.sf-update-entry time { display: block; height: 21px; color: #168c81; font-size: .82rem; font-weight: 800; line-height: 21px; }.sf-update-category, .sf-update-version { display: inline-flex; box-sizing: border-box; height: 21px; align-items: center; vertical-align: top; font-size: .68rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }.sf-update-category { margin-right: 7px; padding: 0 6px; border-radius: 999px; }.sf-update-version { color: #168c81; }.sf-update-category--jobs { background: #e0ecff; color: #1e4fa1; }.sf-update-category--production { background: #f7e7d0; color: #91520b; }.sf-update-category--mobile { background: #d8f1ec; color: #08766c; }.sf-update-category--platform { background: #e7edf1; color: #4b6678; }.sf-update-category--security { background: #e5e0fb; color: #5a3ca2; }.sf-update-entry h3, .sf-roadmap-card h3 { margin: 7px 0 8px; color: #153a58; font-size: 1.03rem; }.sf-update-entry ul { display: grid; gap: 5px; margin: 0; padding-left: 18px; color: #607c90; font-size: .93rem; line-height: 1.45; }
.sf-roadmap-card { position: sticky; top: 22px; padding: 25px; border: 1px solid #d5e5e8; border-radius: 14px; background: #f6fbfb; }.sf-roadmap-card h2 { font-size: 1.6rem; }.sf-roadmap-intro { margin: 8px 0 18px; color: #668094; font-size: .88rem; line-height: 1.45; }.sf-roadmap-card ol { display: grid; gap: 17px; margin: 0; padding: 0; list-style: none; }.sf-roadmap-card li { padding-top: 16px; border-top: 1px solid #d7e7e7; }.sf-roadmap-card li:first-child { padding-top: 0; border-top: 0; }.sf-roadmap-card li p { margin: 0; color: #607c90; font-size: .87rem; line-height: 1.45; }.sf-roadmap-card > a { display: inline-block; margin-top: 22px; color: #08766c; font-size: .9rem; font-weight: 800; text-decoration: none; }
@media (max-width: 860px) { .sf-updates-layout { grid-template-columns: 1fr; gap: 36px; }.sf-roadmap-card { position: static; max-width: none; } }
@media (max-width: 620px) { .sf-updates-page { padding: 26px 0 54px; }.sf-update-entry { grid-template-columns: 1fr; gap: 8px; padding: 20px 0; }.sf-roadmap-card { padding: 22px; } }