.bento-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--space-2xl);margin-bottom:var(--space-4xl)}.bento-card{background:var(--bg-surface-elevated);border:1px solid var(--border-color);border-radius:var(--radius-xl);overflow:hidden;display:flex;flex-direction:column;transition:transform var(--transition-normal),box-shadow var(--transition-normal),border-color var(--transition-normal);position:relative}.bento-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -15px rgb(0 0 0 / .5);border-color:var(--color-primary-light)}.bento-card-content{padding:var(--space-2xl);flex-grow:1;display:flex;flex-direction:column;justify-content:center}.bento-card-img-wrapper{position:relative;overflow:hidden;background:var(--bg-surface);cursor:pointer}.bento-card-img{width:100%;height:280px;object-fit:cover;object-position:top center;border-bottom:1px solid var(--border-color);display:block;transition:transform 0.4s ease}.bento-card:hover .bento-card-img{transform:scale(1.03)}.bento-card-zoom-hint{position:absolute;bottom:12px;right:12px;background:rgb(13 17 23 / .85);backdrop-filter:blur(8px);color:var(--text-primary);font-size:.75rem;font-weight:600;padding:4px 10px;border-radius:var(--radius-full);border:1px solid rgb(255 255 255 / .15);opacity:0;transform:translateY(4px);transition:all 0.25s ease;pointer-events:none}.bento-card:hover .bento-card-zoom-hint{opacity:1;transform:translateY(0)}.bento-span-12{grid-column:span 12;flex-direction:row;align-items:stretch}.bento-span-12 .bento-card-img-wrapper{width:55%;flex-shrink:0}.bento-span-12 .bento-card-img{width:100%;height:100%;min-height:340px;border-bottom:none;border-right:1px solid var(--border-color)}.bento-span-12.reverse{flex-direction:row-reverse}.bento-span-12.reverse .bento-card-img-wrapper .bento-card-img{border-right:none;border-left:1px solid var(--border-color)}.bento-span-6{grid-column:span 6}.bento-checklist{list-style:none;padding:0;margin:var(--space-md) 0 0 0;display:flex;flex-direction:column;gap:10px}.bento-checklist li{display:flex;align-items:flex-start;gap:10px;font-size:.95rem;color:var(--text-secondary);line-height:1.5}.bento-checklist .check-icon{color:var(--color-primary);flex-shrink:0;font-weight:700}.mobile-feature-screenshot{display:none;margin-top:var(--space-md);border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border-color);box-shadow:0 12px 30px -10px rgb(0 0 0 / .5);background:var(--bg-surface-elevated,#0d1117);position:relative;aspect-ratio:16/10;cursor:pointer;transition:transform 0.2s ease,border-color 0.2s ease}.mobile-feature-screenshot:active{transform:scale(.99)}.mobile-feature-screenshot img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}.mobile-feature-screenshot .screenshot-overlay-btn{position:absolute;bottom:12px;right:12px;background:rgb(13 17 23 / .88);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--text-primary,#ffffff);font-size:.76rem;font-weight:600;padding:5px 12px;border-radius:var(--radius-full);border:1px solid rgb(255 255 255 / .15);display:flex;align-items:center;gap:4px}@media (max-width:992px){.sticky-layout{grid-template-columns:1fr!important;gap:var(--space-2xl)!important}.sticky-sidebar{display:none!important}.scroll-content{gap:var(--space-xl)!important;padding-bottom:0!important}.scroll-feature{opacity:1!important;transform:none!important;background:var(--bg-surface-elevated,#111B2E)!important;border:1px solid var(--border-color)!important;border-left:4px solid var(--color-primary,#01A2FF)!important;box-shadow:0 8px 24px -6px rgb(0 0 0 / .3)!important}.mobile-feature-screenshot{display:block!important}}.sticky-layout{display:grid;grid-template-columns:1fr 1.25fr;gap:clamp(24px, 3.5vw, 56px);margin-bottom:var(--space-4xl);align-items:start;position:relative}.scroll-content{display:flex;flex-direction:column;gap:16vh;padding-bottom:20vh}.scroll-feature{opacity:.38;transition:all 0.35s cubic-bezier(.16,1,.3,1);transform:translateX(-10px);cursor:pointer;padding:clamp(18px, 2.5vw, 32px);border-radius:var(--radius-lg);border:1px solid #fff0;background:#fff0}.scroll-feature.is-active,.scroll-feature:hover{opacity:1;transform:translateX(0);background:var(--bg-surface-elevated,#111B2E);border-color:rgb(1 162 255 / .35);box-shadow:0 12px 36px -10px rgb(0 0 0 / .5)}.scroll-feature.is-active{border-left:4px solid var(--color-primary,#01A2FF)}.sticky-sidebar{position:-webkit-sticky!important;position:sticky!important;top:96px!important;align-self:start!important;display:flex;flex-direction:column;gap:12px;z-index:20}.sticky-image-container{width:100%;border-radius:var(--radius-xl);overflow:hidden;border:1px solid var(--border-color);box-shadow:0 25px 60px -15px rgb(0 0 0 / .7),0 0 0 1px rgb(255 255 255 / .06);background:var(--bg-surface-elevated,#0d1117);position:relative;aspect-ratio:16/10;cursor:pointer;transition:border-color 0.3s ease,box-shadow 0.3s ease}.sticky-image-container:hover{border-color:var(--color-primary,#01A2FF);box-shadow:0 30px 70px -12px rgb(1 162 255 / .3),0 0 0 1px var(--color-primary,#01A2FF)}.sticky-image-container img{width:100%;height:100%;object-fit:cover;object-position:top center;position:absolute;top:0;left:0;opacity:0;transform:scale(.97);transition:opacity 0.4s cubic-bezier(.16,1,.3,1),transform 0.4s cubic-bezier(.16,1,.3,1);pointer-events:none}.sticky-image-container img.is-active{opacity:1;transform:scale(1);pointer-events:auto}.sticky-image-overlay{position:absolute;bottom:16px;right:16px;background:rgb(13 17 23 / .88);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--text-primary);font-size:.8rem;font-weight:600;padding:7px 16px;border-radius:var(--radius-full);border:1px solid rgb(255 255 255 / .15);display:flex;align-items:center;gap:6px;z-index:5;transition:all 0.2s ease;pointer-events:none}.sticky-image-container:hover .sticky-image-overlay{background:var(--color-primary,#01A2FF);color:#fff;border-color:var(--color-primary,#01A2FF);box-shadow:0 4px 16px rgb(1 162 255 / .4)}.sticky-feature-indicator{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:var(--bg-surface-elevated,#111B2E);border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:.82rem;color:var(--text-secondary);box-shadow:0 4px 16px rgb(0 0 0 / .2)}.sticky-nav-dots{display:flex;align-items:center;gap:6px}.sticky-dot{width:8px;height:8px;border-radius:50%;background:rgb(255 255 255 / .2);cursor:pointer;transition:all 0.25s ease}.sticky-dot:hover{background:rgb(255 255 255 / .6)}.sticky-dot.is-active{background:var(--color-primary,#01A2FF);transform:scale(1.35);box-shadow:0 0 8px rgb(1 162 255 / .6)}@media (max-width:992px){.sticky-layout{grid-template-columns:1fr;gap:var(--space-2xl)}.sticky-sidebar{position:relative!important;top:0!important}.scroll-content{gap:var(--space-2xl);padding-bottom:0}.scroll-feature{opacity:1;transform:none;background:var(--bg-surface-elevated);border:1px solid var(--border-color)}}