/* Notion Docs' summary rail + single preview, in the existing product theme.
   Categories express tasks, not "main" versus "extra" features. */
#capabilities.caps{padding:48px 0 64px}
#capabilities .details-heading{margin-bottom:26px}
#capabilities .feature-explorer{--feature-image-height:clamp(260px,calc(100svh - var(--journey-offset) - 340px),520px);min-width:0;scroll-margin-top:0}
#capabilities [hidden]{display:none!important}
#capabilities .feature-categories{display:flex;flex-wrap:wrap;column-gap:28px;row-gap:0;margin-bottom:20px;border-bottom:1px solid #e9e9e6}
#capabilities .feature-categories button{position:relative;min-height:44px;margin:0;padding:8px 0 12px;border:0;border-radius:0;background:none;color:var(--muted);font:inherit;font-size:1rem;font-weight:500;white-space:nowrap;cursor:pointer}
#capabilities .feature-categories button::after{position:absolute;content:"";bottom:-1px;left:0;right:0;height:2px;background:transparent}
#capabilities .feature-categories button[aria-pressed=true]{color:var(--ink)}
#capabilities .feature-categories button[aria-pressed=true]::after{background:var(--brand)}
#capabilities .feature-categories button:hover{color:var(--brand-deep)}
#capabilities .feature-position{align-self:center;margin-left:auto;color:#777773;font-size:.875rem;white-space:nowrap;font-variant-numeric:tabular-nums}
#capabilities .feature-rail{position:relative;display:grid;min-width:0;align-items:stretch}
#capabilities .feature-index{grid-area:1/1;display:flex;gap:12px;min-width:0;margin:-4px;padding:4px 4px 10px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#dadbd6 transparent;scroll-snap-type:x proximity;visibility:hidden;pointer-events:none}
#capabilities .feature-index.is-active{visibility:visible;pointer-events:auto}
#capabilities .feature-choice{flex:0 0 calc((100% - 36px)/4);display:flex;flex-direction:column;gap:8px;min-width:0;margin:0;padding:16px;border:1px solid transparent;border-radius:8px;background:#f6f6f5;color:var(--ink);font:inherit;text-align:left;cursor:pointer;scroll-snap-align:start;transition:background .16s,border-color .16s,box-shadow .16s}
#capabilities .feature-choice-title{display:block;font-size:1rem;line-height:1.4;font-weight:600;letter-spacing:-.025em}
#capabilities .feature-choice-description{display:block;color:#686966;font-size:.9375rem;font-weight:400;line-height:1.55;word-break:keep-all;text-wrap:pretty}
#capabilities .feature-choice:hover{background:#efefed}
#capabilities .feature-choice[aria-selected=true]{border-color:#deded9;background:#fff;box-shadow:0 2px 5px #1c1b1909}
#capabilities .feature-choice[aria-selected=true] .feature-choice-title{color:var(--brand-deep)}
#capabilities .feature-choice:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
#capabilities .feature-index[data-count="3"] .feature-choice{flex-basis:calc((100% - 24px)/3)}
#capabilities .feature-stage{position:relative;min-width:0;margin-top:16px}
#capabilities .feature-entry{padding:16px 0;border-bottom:1px solid #e6e7e3}
#capabilities .feature-entry>summary{font-size:1.0625rem;cursor:pointer}
#capabilities .feature-caption h3{margin:0;font-size:1.5rem;line-height:1.35;font-weight:600;letter-spacing:-.03em}
#capabilities .feature-caption p{margin:10px 0 0;color:#686966;font-size:1rem;line-height:1.7}
#capabilities .feature-picture{display:flex;align-items:center;justify-content:center;height:var(--feature-image-height);margin:20px 0 0;padding:12px 64px;border:1px solid #e5e5e1;border-radius:10px;background:#fafaf9;overflow:hidden}
#capabilities .feature-picture img{display:block;width:100%;height:100%;object-fit:contain;user-select:none}
/* Both rails and panels share their tallest intrinsic row. Category changes
   therefore cannot move the preview, even with enlarged or wrapped text. */
#capabilities [data-enhanced] .feature-stage{display:grid;touch-action:pan-y pinch-zoom}
#capabilities [data-enhanced] .feature-entry{grid-area:1/1;display:block;visibility:hidden;pointer-events:none;min-width:0;padding:0;border:0}
#capabilities [data-enhanced] .feature-entry.is-active{visibility:visible;pointer-events:auto}
#capabilities [data-enhanced] .feature-entry>summary{display:none}
#capabilities [data-enhanced] .feature-entry-body{height:100%}
#capabilities [data-enhanced] .feature-entry-body:focus-visible{outline:2px solid var(--brand);outline-offset:4px;border-radius:10px}
#capabilities [data-enhanced] .feature-caption,#capabilities .feature-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
#capabilities [data-enhanced] .feature-picture{height:var(--feature-image-height);margin:0}
#capabilities .feature-media-nav{position:absolute;z-index:2;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 12px;pointer-events:none}
#capabilities .feature-media-nav button{display:grid;place-items:center;flex:0 0 40px;width:40px;height:44px;padding:8px;border:1px solid #e3e3df;border-radius:6px;background:#ffffffed;color:var(--ink);cursor:pointer;pointer-events:auto;transition:background .15s,border-color .15s}
#capabilities .feature-media-nav button:hover:not([aria-disabled=true]){background:#fff;border-color:#a5a7a0}
#capabilities .feature-media-nav button[aria-disabled=true]{opacity:.26;cursor:default}
#capabilities .feature-media-nav svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#capabilities .feature-entry.is-entering .feature-picture img{animation:feature-crossfade .18s ease-out}
@keyframes feature-crossfade{from{opacity:.35}to{opacity:1}}
@media(min-width:761px) and (max-height:850px){
 #capabilities.caps{padding-top:32px}
 #capabilities .details-heading{margin-bottom:20px}
 #capabilities .feature-categories{margin-bottom:16px}
}
@media(max-width:960px){#capabilities .feature-choice{flex-basis:calc((100% - 24px)/3)}}
@media(max-width:760px){
 #capabilities.caps{padding:38px 0 48px}
 #capabilities .details-heading{margin-bottom:22px}
 #capabilities .feature-categories{gap:24px;margin-bottom:16px}
 #capabilities .feature-categories button{font-size:.9375rem}
 #capabilities .feature-explorer{--feature-image-height:clamp(200px,calc((100vw - 40px)/1.35),340px)}
 #capabilities .feature-choice,#capabilities .feature-index[data-count="3"] .feature-choice{flex-basis:clamp(216px,69%,340px);padding:14px}
 #capabilities .feature-picture{padding:10px 36px;border-radius:8px}
 #capabilities .feature-media-nav{padding:0 4px}
 #capabilities .feature-media-nav button{width:32px;flex-basis:32px;padding:5px;background:#fffffff5;border-color:transparent}
}
@media(max-width:359px){#capabilities .feature-categories{gap:18px}}
@media(prefers-reduced-motion:reduce){
 #capabilities .feature-choice,#capabilities .feature-media-nav button{transition:none}
 #capabilities .feature-entry.is-entering .feature-picture img{animation:none}
}