.feature-hero { border-bottom: 1px solid #e5eaf2; background: linear-gradient(135deg,#f7f8fc 0%,#edf4ff 100%); }
.feature-hero-inner { max-width: 1120px; margin: 0 auto; padding: clamp(72px,10vw,132px) max(5vw,32px) clamp(64px,8vw,104px); }
.feature-hero h1 { max-width: 760px; margin-top: 18px; color: var(--ink); font-size: clamp(38px,5.4vw,68px); line-height: 1.14; }
.feature-hero p:not(.home-kicker) { max-width: 680px; margin-top: 24px; color: #637088; font-size: 17px; line-height: 1.85; }
.feature-hero-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 30px; }
.feature-primary,.feature-secondary { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; padding: 0 19px; border-radius: 10px; font-size: 14px; font-weight: 800; }
.feature-primary { color: #fff; background: var(--blue); box-shadow: 0 9px 20px rgba(40,100,240,.18); }
.feature-secondary { border: 1px solid #d8e0ee; color: #2d57b8; background: #fff; }
.feature-primary:focus-visible,.feature-secondary:focus-visible,.feature-card a:focus-visible { outline: 3px solid rgba(40,100,240,.35); outline-offset: 3px; }
.feature-section,.feature-faq { max-width: 1120px; margin: 0 auto; padding: 88px max(5vw,32px); }
.feature-section-heading { max-width: 720px; }
.feature-section-heading h2,.feature-workflow h2 { margin-top: 14px; color: var(--ink); font-size: clamp(30px,4vw,48px); line-height: 1.2; }
.feature-section-heading > p:last-child { margin-top: 15px; color: #69768b; font-size: 15px; line-height: 1.85; }
.feature-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-top: 34px; }
.feature-card { min-height: 260px; padding: 26px; border: 1px solid #e1e7f0; border-radius: 14px; background: #fff; box-shadow: 0 9px 24px rgba(45,68,109,.05); }
.feature-card.feature-blue { border-top: 3px solid #4d7ff3; }.feature-card.feature-mint { border-top: 3px solid #40b59a; }.feature-card.feature-amber { border-top: 3px solid #dda037; }.feature-card.feature-violet { border-top: 3px solid #8a6ce4; }
.feature-number { color: #91a0b8; font-size: 12px; font-weight: 800; letter-spacing: 1px; }
.feature-card h3 { margin-top: 24px; color: var(--ink); font-size: 21px; }.feature-card p { margin-top: 11px; color: #68758a; font-size: 14px; line-height: 1.85; }.feature-card a { display: inline-flex; margin-top: 18px; color: #2e61d6; font-size: 13px; font-weight: 800; }
.feature-workflow { display: grid; grid-template-columns: minmax(220px,.8fr) minmax(0,1.2fr); gap: 52px; align-items: start; padding: 76px max(5vw,32px); background: #fff; border-top: 1px solid #e9edf4; border-bottom: 1px solid #e9edf4; }.feature-workflow > div { max-width: 1120px; margin-left: max(0px,calc((100vw - 1120px) / 2)); }.feature-workflow ol { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; max-width: 1120px; margin: 0 max(0px,calc((100vw - 1120px) / 2)) 0 0; padding: 0; list-style: none; }.feature-workflow li { display: flex; gap: 12px; }.feature-workflow li > span { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; border-radius: 50%; color: #2c5dc9; background: #eaf0ff; font-size: 12px; font-weight: 800; }.feature-workflow strong { color: var(--ink); font-size: 14px; }.feature-workflow li p { margin-top: 6px; color: #718096; font-size: 13px; line-height: 1.6; }
.feature-faq { padding-bottom: 100px; }.feature-faq-list { max-width: 820px; margin-top: 30px; }.feature-faq details { border-top: 1px solid #e1e6ef; }.feature-faq details:last-child { border-bottom: 1px solid #e1e6ef; }.feature-faq summary { padding: 20px 4px; color: var(--ink); cursor: pointer; font-size: 16px; font-weight: 800; }.feature-faq summary:focus-visible { outline: 3px solid rgba(40,100,240,.35); outline-offset: 3px; }.feature-faq details p { max-width: 740px; padding: 0 4px 22px; color: #69768b; font-size: 14px; line-height: 1.85; }
@media (max-width: 860px) { .feature-workflow { grid-template-columns: 1fr; gap: 30px; }.feature-workflow > div { margin-left: 0; }.feature-workflow ol { margin-right: 0; } }
@media (max-width: 620px) { .feature-hero-inner,.feature-section,.feature-faq { padding-right: 22px; padding-left: 22px; }.feature-hero h1 { font-size: clamp(36px,11vw,52px); }.feature-grid { grid-template-columns: 1fr; }.feature-card { min-height: 0; }.feature-workflow { padding-right: 22px; padding-left: 22px; }.feature-workflow ol { grid-template-columns: 1fr; gap: 20px; } }

.changelog-hero { border-bottom: 1px solid #e5eaf2; background: linear-gradient(135deg,#f7f8fc 0%,#eef5ff 100%); }
.changelog-hero-inner { max-width: 1120px; margin: 0 auto; padding: clamp(70px,9vw,118px) max(5vw,32px) clamp(58px,7vw,88px); }
.changelog-hero h1 { margin-top: 16px; color: var(--ink); font-size: clamp(40px,5.6vw,72px); line-height: 1.1; }
.changelog-hero p:not(.home-kicker) { max-width: 680px; margin-top: 22px; color: #637088; font-size: 17px; line-height: 1.85; }
.changelog-hero-meta { display: flex; flex-wrap: wrap; gap: 10px 22px; align-items: center; margin-top: 28px; color: #77849a; font-size: 13px; font-weight: 700; }
.changelog-hero-meta a { color: #2e61d6; }
.changelog-content { max-width: 1000px; margin: 0 auto; padding: 82px max(5vw,32px) 94px; }
.changelog-intro { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(240px,.8fr); gap: 48px; align-items: end; margin-bottom: 34px; }
.changelog-intro h2,.changelog-next h2 { margin-top: 14px; color: var(--ink); font-size: clamp(28px,4vw,44px); line-height: 1.2; }
.changelog-intro > p { color: #69768b; font-size: 14px; line-height: 1.85; }
.changelog-list { position: relative; display: grid; gap: 12px; }
.changelog-list::before { position: absolute; top: 22px; bottom: 22px; left: 17px; width: 1px; background: #dce4f1; content: ""; }
.changelog-entry { position: relative; margin-left: 0; border: 1px solid #e1e7f0; border-radius: 12px; background: #fff; box-shadow: 0 8px 22px rgba(45,68,109,.045); }
.changelog-entry summary { position: relative; display: grid; grid-template-columns: 82px 142px minmax(0,1fr) 22px; gap: 16px; align-items: center; min-height: 72px; padding: 14px 20px 14px 32px; color: var(--ink); cursor: pointer; list-style: none; }
.changelog-entry summary::-webkit-details-marker { display: none; }
.changelog-entry summary::before { position: absolute; left: 11px; width: 12px; height: 12px; border: 3px solid #fff; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 1px #b8c9ea; content: ""; }
.changelog-version { color: #2e61d6; font-size: 15px; font-weight: 800; }
.changelog-entry time { color: #8995a7; font-size: 12px; }
.changelog-entry summary strong { min-width: 0; color: var(--ink); font-size: 15px; line-height: 1.5; }
.changelog-toggle { position: relative; width: 20px; height: 20px; border: 1px solid #cbd6e6; border-radius: 50%; }
.changelog-toggle::before,.changelog-toggle::after { position: absolute; top: 9px; left: 5px; width: 8px; height: 1px; background: #62738d; content: ""; }
.changelog-toggle::after { transform: rotate(90deg); transition: transform .18s ease; }
.changelog-entry[open] .changelog-toggle::after { transform: rotate(0); }
.changelog-entry summary:focus-visible { outline: 3px solid rgba(40,100,240,.35); outline-offset: 3px; border-radius: 8px; }
.changelog-detail { margin: 0 58px 20px 130px; padding-top: 18px; border-top: 1px solid #edf0f5; color: #69768b; font-size: 14px; line-height: 1.85; }
.changelog-detail ul { display: grid; gap: 7px; margin: 12px 0 0; padding-left: 19px; }
.changelog-detail li::marker { color: #5d84df; }
.changelog-next { display: flex; justify-content: space-between; gap: 34px; align-items: end; padding: 72px max(5vw,32px); border-top: 1px solid #e9edf4; background: #f7f8fc; }
.changelog-next > div:first-child { max-width: 620px; margin-left: max(0px,calc((100vw - 1120px) / 2)); }
.changelog-next p:not(.home-kicker) { margin-top: 14px; color: #69768b; font-size: 14px; line-height: 1.8; }
.changelog-next-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-right: max(0px,calc((100vw - 1120px) / 2)); }
.changelog-next-actions a { white-space: nowrap; }
@media (max-width: 760px) { .changelog-intro { grid-template-columns: 1fr; gap: 16px; }.changelog-entry summary { grid-template-columns: 76px minmax(0,1fr) 22px; gap: 12px; }.changelog-entry time { grid-column: 2; grid-row: 1; align-self: end; margin-bottom: 1px; }.changelog-entry summary strong { grid-column: 2; grid-row: 2; }.changelog-toggle { grid-column: 3; grid-row: 1 / span 2; }.changelog-detail { margin-left: 32px; } .changelog-next { display: block; }.changelog-next > div:first-child { margin-left: 0; }.changelog-next-actions { margin: 24px 0 0; } }
@media (max-width: 520px) { .changelog-hero-inner,.changelog-content { padding-right: 22px; padding-left: 22px; }.changelog-hero h1 { font-size: clamp(38px,12vw,54px); }.changelog-entry summary { grid-template-columns: minmax(0,1fr) 22px; padding-left: 28px; }.changelog-entry summary::before { left: 9px; }.changelog-entry summary .changelog-version,.changelog-entry summary strong { grid-column: 1; }.changelog-entry time { grid-column: 1; grid-row: auto; align-self: auto; margin: 0; }.changelog-toggle { grid-column: 2; grid-row: 1 / span 3; }.changelog-detail { margin: 0 20px 18px 28px; }.changelog-list::before { left: 15px; }.changelog-next { padding-right: 22px; padding-left: 22px; }.changelog-next-actions { display: grid; }.changelog-next-actions a { width: 100%; } }
