.features-page { color:#1b3026; }
.features-hero { padding:28px 0 64px; background:linear-gradient(120deg,#fffdf8,#eaf3e8); }
.features-breadcrumb { display:flex; gap:14px; margin-bottom:38px; font-size:14px; }
.features-hero h1 { font-size:clamp(36px,4vw,60px); font-weight:700; line-height:1.12; max-width:1100px; margin:18px 0 24px; }
.features-page h1 span,.features-page h2 span { color:var(--color-accent); }
.features-hero p,.features-end p { max-width:960px; line-height:1.75; }
.features-actions { display:flex; flex-wrap:wrap; gap:14px; margin:26px 0 0; }
.features-actions .secondary { background:#fff; color:#245c46; border:1px solid #cddccd; }
.features-overview { padding-top:64px; padding-bottom:64px; }
.features-page section[id] { scroll-margin-top:150px; }
.features-page h2 { font-size:clamp(28px,2.5vw,38px); line-height:1.22; margin:18px 0; }
.features-overview > p { max-width:850px; line-height:1.75; }
.features-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:18px; margin-top:30px; }
.features-card { display:flex; flex-direction:column; align-items:flex-start; padding:24px; border:1px solid #dce4d9; border-radius:22px; background:#fff; box-shadow:0 8px 24px #1c372508; text-decoration:none; color:inherit; transition:transform .2s ease,box-shadow .2s ease; }
.features-card:hover { transform:translateY(-4px); box-shadow:0 12px 28px #1c372514; }
.features-number { display:grid; place-items:center; width:44px; height:44px; border-radius:14px; background:#e4eee1; color:#245c46; font-weight:700; }
.features-card h3 { font-size:21px; line-height:1.35; margin:22px 0; }
.features-card-link { margin-top:auto; color:#245c46; font-size:14px; font-weight:600; }
.features-detail { padding:64px 0; border-top:1px solid #e0e7dc; }
.features-detail:nth-of-type(even) { background:#f6f8f2; }
.features-detail-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(32px,5vw,80px); align-items:center; }
.features-detail-reverse .features-detail-copy { grid-column:2; grid-row:1; }
.features-detail-reverse .features-visual { grid-column:1; grid-row:1; }
.features-detail-copy p { line-height:1.75; color:#283b32; }
.features-page .features-list-label { font-size:16px; line-height:1.5; margin:24px 0 14px; }
.features-list { padding:0; list-style:none; display:grid; gap:12px; margin:0 0 28px; }
.features-list li { position:relative; padding-left:26px; font-size:16px; line-height:1.6; }
.features-list li::before { content:'\2713'; position:absolute; left:0; color:#245c46; font-weight:700; }
.features-visual { padding:24px; border:1px solid #d7e2d4; border-radius:28px; background:linear-gradient(140deg,#edf3e9,#fffaf3); min-width:0; }
.features-image-space { aspect-ratio:4 / 3; border:1px dashed #bdcbbb; border-radius:18px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:24px; text-align:center; color:#536656; }
.features-placeholder-mark { display:grid; place-items:center; width:52px; height:52px; border-radius:16px; background:#fff9; font-size:30px; font-weight:300; }
.features-image-space > span:not(.features-placeholder-mark) { font-weight:600; }
.features-image-space small { font-size:13px; }
.features-visual-photo img { display:block; width:100%; height:auto; border-radius:18px; }
.features-end { padding:64px 0; background:#eaf3e8; }
.features-demo-section { padding:72px 0; background:var(--color-dark); color:var(--color-on-dark); }
.features-demo-grid { display:grid; grid-template-columns:.85fr 1.15fr; align-items:center; gap:7%; }
.features-demo-copy .eyebrow { color:#b9d3c2; }
.features-demo-copy h2 { margin:13px 0; color:#fff9f1; font-size:clamp(36px,4vw,49px); line-height:1.1; }
.features-demo-copy h2 span { color:#c4dccb; }
.features-demo-description { display:block; color:#e0d2c6; line-height:1.8; }
.features-demo-points { display:grid; gap:10px; margin:21px 0; padding:0; list-style:none; }
.features-demo-points li { color:var(--color-on-dark); font-size:14px; }
.features-demo-points li::before { margin-right:9px; color:#b9d3c2; content:"✓"; }
.features-demo-talk-link { display:inline-block; margin:6px 12px 0 0; color:#d7e5dc; font-weight:700; text-decoration:none; }
.features-demo-talk-link:hover { color:#fff; }
.features-demo-card { min-width:0; border:1px solid rgba(255,255,255,.68); border-radius:20px; background:var(--color-surface); box-shadow:0 22px 60px rgba(23,45,37,.22); color:var(--color-text); padding:clamp(22px,3.5vw,36px); }
.features-demo-card h3 { margin:0 0 5px; font-size:24px; line-height:1.3; }
.features-demo-intro { margin:0 0 18px; color:var(--color-muted); font-size:13px; }
.features-demo-form { display:grid; gap:11px; }
.features-demo-form-row { display:grid; grid-template-columns:1fr 1fr; gap:11px; }
.features-demo-field { display:grid; min-width:0; gap:5px; }
.features-demo-field label { color:#554a40; font-size:12px; font-weight:650; }
.features-demo-field input,.features-demo-field select,.features-demo-field textarea { width:100%; min-width:0; min-height:42px; border:1px solid #e4dcd1; border-radius:8px; outline:none; background:#fffefa; color:#30251f; font:inherit; font-size:13px; padding:9px 11px; }
.features-demo-field textarea { min-height:75px; resize:vertical; }
.features-demo-field :is(input,select,textarea):focus { border-color:var(--color-primary); box-shadow:0 0 0 3px rgba(36,92,69,.12); }
.features-demo-field span.field-validation-error,.features-demo-form > span.field-validation-error { color:#a52a2a; font-size:11px; }
.features-demo-consent { display:flex; width:100%; min-width:0; align-items:flex-start; gap:10px; margin:4px 0; color:var(--color-muted); font-size:12px; font-weight:400; line-height:1.55; }
.features-demo-consent input[type="checkbox"] { width:18px; min-width:18px; height:18px; flex:0 0 18px; margin:1px 0 0; padding:0; accent-color:var(--color-primary); }
.features-demo-consent span { min-width:0; }
.features-demo-submit { display:flex; width:100%; justify-content:center; margin-top:2px; }
.features-demo-form > small { color:#8c8177; font-size:11px; text-align:center; }
.features-demo-honeypot { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.features-demo-card .validation-summary-errors { margin:0 0 14px; border:1px solid #edc7c2; border-radius:8px; background:#fff2ef; color:#8b2922; padding:10px 13px; }
.features-demo-card .validation-summary-errors p { margin:0 0 4px; font-weight:700; }
.features-demo-card .validation-summary-errors ul { margin:0; padding-left:18px; font-size:12px; }
.features-page a:focus-visible { outline:3px solid var(--color-accent); outline-offset:4px; }
@media(min-width:1440px) { .features-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 20px; } }
@media(max-width:1100px) { .features-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:800px) {
 .features-detail-grid { grid-template-columns:1fr; }
 .features-demo-grid { grid-template-columns:1fr; gap:32px; }
 .features-demo-copy { max-width:680px; }
 .features-detail-reverse .features-detail-copy,.features-detail-reverse .features-visual { grid-column:auto; grid-row:auto; }
 .features-visual { max-width:600px; width:100%; box-sizing:border-box; justify-self:center; }
 .features-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .features-page section[id] { scroll-margin-top:115px; }
}
@media(max-width:480px) {
 .features-hero { padding-bottom:36px; }
 .features-breadcrumb { margin-bottom:26px; }
 .features-overview,.features-detail,.features-end,.features-demo-section { padding-top:36px; padding-bottom:36px; }
 .features-grid { grid-template-columns:1fr; gap:12px; }
 .features-card { padding:20px; }
 .features-card h3 { margin:16px 0; }
 .features-visual { padding:14px; border-radius:20px; }
 .features-demo-card { padding:22px 18px; }
 .features-demo-form-row { grid-template-columns:1fr; }
 .features-actions .button { text-align:center; }
}
@media(prefers-reduced-motion:reduce) { .features-card { transition:none; } .features-card:hover { transform:none; } }

/* Swap the sticky navigation without removing the original header's layout space. */
html.features-navigation-ready { scroll-padding-top:0; }
.features-navigation-ready .features-page section[id] { scroll-margin-top:90px; }
body.features-navigation-active > .site-header { visibility:hidden; pointer-events:none; }
.features-scrollbar { position:fixed; inset:0 0 auto; z-index:25; background:#fffdf9f5; backdrop-filter:blur(16px); border-bottom:1px solid #e1e6dd; box-shadow:0 5px 24px #183c250d; }
.features-scrollbar[hidden] { display:none; }
.features-scrollbar-inner { display:flex; align-items:center; gap:14px; min-height:80px; }
.features-scrollbar-home { display:flex; align-items:center; min-height:36px; padding-right:22px; border-right:1px solid #dce3d7; flex:none; font-size:15px; font-weight:700; letter-spacing:.02em; color:#245c45; text-decoration:none; }
.features-scroll-links { display:flex; align-items:center; gap:6px; flex:1; min-width:0; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:none; padding:12px 4px; }
.features-scroll-links::-webkit-scrollbar { display:none; }
.features-scroll-links a { display:flex; align-items:center; justify-content:center; min-height:44px; box-sizing:border-box; flex:none; white-space:nowrap; padding:10px 16px; border:1px solid transparent; border-radius:12px; color:#425348; font-size:14px; line-height:1.4; font-weight:600; text-decoration:none; transition:background .18s ease,color .18s ease,box-shadow .18s ease; }
.features-scroll-links a:hover { background:#f0f3eb; border-color:#e1e7da; color:#20382b; }
.features-scroll-links a[aria-current="location"] { background:var(--color-accent); border-color:var(--color-accent); color:#fff; box-shadow:0 3px 8px #8c492322,inset 0 1px 0 #ffffff26; }
.features-scroll-arrow { display:grid; place-items:center; flex:none; width:44px; height:44px; border:1px solid #dce3d7; border-radius:50%; background:#fff; color:#245c45; cursor:pointer; box-shadow:0 2px 6px #183c2508; transition:background .18s ease,border-color .18s ease; }
.features-scroll-arrow:hover:not(:disabled) { background:#edf3e9; border-color:#a9c1aa; }
.features-scroll-arrow:disabled { opacity:.3; cursor:default; box-shadow:none; }
.features-scroll-arrow { padding:0; line-height:1; }
.features-scroll-arrow svg { display:block; }
.features-scrollbar button:focus-visible { outline:3px solid var(--color-accent); outline-offset:2px; }
@media(max-width:600px) {
 .features-scrollbar-inner { min-height:68px; gap:6px; }
 .features-scrollbar-home { display:none; }
 .features-scroll-arrow { width:36px; height:44px; border-radius:12px; }
 .features-scroll-links a { font-size:13px; padding:10px 12px; }
}
@media(prefers-reduced-motion:reduce) { .features-scroll-links a,.features-scroll-arrow { transition:none; } }
@media print { .features-scrollbar { display:none !important; } }
