.cs-page { --cs-ink: #173029; --cs-green: #315848; --cs-line: #d5ded7; --cs-muted: #55675d; color: var(--cs-ink); }
.cs-hero { max-width: 1440px; margin: 0 auto; padding: 70px 5vw 50px; display: grid; grid-template-columns: 1fr 1.15fr; align-items: center; gap: 48px; }
.cs-hero h1 { font-size: clamp(3.4rem, 6vw, 6.3rem); line-height: 1.02; margin: 24px 0; }
.cs-hero h1 em, .cs-section h2 em { color: var(--cs-green); }
.cs-lede { font-size: 1.16rem; line-height: 1.75; max-width: 600px; }
.cs-hero .product-actions { flex-wrap: wrap; }
.cs-hero .product-facts { flex-wrap: wrap; gap: 0; }
.cs-hero-image { margin: 0; }
.cs-hero-image img, .cs-gallery img { display: block; width: 100%; height: auto; border-radius: 10px; border: 1px solid var(--cs-line); }
.cs-hero-image a, .cs-gallery a { display: block; border-radius: 10px; }
.cs-page a:focus-visible, .cs-page summary:focus-visible { outline: 3px solid #ac6d24; outline-offset: 5px; }
.cs-hero-image figcaption { display: flex; align-items: center; gap: 10px; margin-top: 14px; color: var(--cs-muted); font-size: .82rem; line-height: 1.6; }
.cs-release-note, .cs-jump-links, .cs-section { width: min(1180px, 90vw); margin: 0 auto; }
.cs-release-note { padding: 20px 24px; background: #f3eee2; border: 1px solid #ded2ad; border-radius: 10px; box-sizing: border-box; }
.cs-release-note p { margin: 5px 0 0; line-height: 1.7; }
.cs-jump-links { display: flex; flex-wrap: wrap; gap: 10px 26px; padding: 25px 0; font-size: .94rem; }
.cs-jump-links a { color: var(--cs-green); text-underline-offset: 4px; }
.cs-section { padding: 55px 0; scroll-margin-top: 100px; }
.cs-section h2 { font-size: clamp(2rem, 4vw, 3.4rem); line-height: 1.14; margin: 12px 0 24px; }
.cs-section-intro, .cs-secondary { color: var(--cs-muted); line-height: 1.75; max-width: 900px; margin: 0 0 25px; }
.cs-secondary { font-size: .9rem; margin: 22px 0 0; }
.cs-comparison { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.cs-comparison article { background: #f4f6f2; padding: 30px; border: 1px solid var(--cs-line); border-radius: 12px; }
.cs-comparison article:last-child { background: #edf1e7; }
.cs-comparison h3 { font-size: 1.6rem; line-height: 1.3; margin: 18px 0 12px; }
.cs-comparison p { line-height: 1.8; }
.cs-comparison strong { display: block; font-size: .94rem; line-height: 1.7; }
.cs-tier { display: inline-block; background: #e8dfca; color: #5b4325; border-radius: 5px; padding: 5px 9px; font-size: .73rem; line-height: 1.4; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.cs-tier-free { background: #e0eadd; color: #315a3f; }
.cs-feature-groups { display: grid; gap: 12px; }
.cs-feature-group { border: 1px solid var(--cs-line); border-radius: 9px; background: #fff; overflow: hidden; }
.cs-feature-group summary { list-style: none; display: flex; align-items: center; gap: 17px; cursor: pointer; padding: 22px 24px; }
.cs-feature-group summary::-webkit-details-marker { display: none; }
.cs-feature-group summary h3 { margin: 0; font-size: 1.16rem; line-height: 1.5; flex: 1; }
.cs-expand { font-size: 1.6rem; font-weight: 400; width: 22px; text-align: center; }
.cs-feature-group[open] .cs-expand { transform: rotate(45deg); }
.cs-feature-group[open] summary { background: #f4f6f1; }
.cs-feature-group ul { padding: 6px 30px 20px 50px; margin: 0; }
.cs-feature-group li { padding: 8px 0 4px; line-height: 1.8; }
.cs-feature-group > p { line-height: 1.8; margin: 0; padding: 18px 25px 25px; }
.cs-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.cs-gallery figure { margin: 0; border: 1px solid var(--cs-line); border-radius: 12px; overflow: hidden; background: #f5f6f2; }
.cs-gallery img { border: 0; border-radius: 0; }
.cs-gallery figcaption { padding: 22px; }
.cs-gallery h3 { font-size: 1.3rem; margin: 12px 0 7px; }
.cs-gallery p { margin: 0; line-height: 1.75; }
.cs-page .download-panel { margin-top: 30px; }
@media (max-width: 1000px) { .cs-hero { grid-template-columns: 1fr; gap: 30px; padding-top: 45px; } .cs-hero-image { max-width: 900px; } }
@media (max-width: 650px) { .cs-hero { padding-top: 32px; } .cs-comparison, .cs-gallery { grid-template-columns: 1fr; } .cs-section { padding: 35px 0; } .cs-feature-group summary { padding: 17px 14px; gap: 10px; flex-wrap: wrap; } .cs-feature-group summary h3 { min-width: 150px; font-size: 1.03rem; } .cs-feature-group ul { padding-left: 33px; padding-right: 20px; } .cs-comparison article { padding: 22px; } .cs-hero-image figcaption { align-items: flex-start; } .cs-hero .product-facts { gap: 0; } }
@media print { .cs-page details::details-content { content-visibility: visible; } .cs-page details > :not(summary) { display: block !important; } .cs-page details li { display: list-item !important; } .cs-jump-links, .cs-expand, .cs-page .product-actions, .cs-page .download-panel { display: none; } .cs-hero, .cs-section { display: block; padding: 20px 0; } .cs-feature-group, .cs-gallery figure { break-inside: avoid; } .cs-feature-group summary { padding: 10px; } }