.demo-infrastructure-section{color:#fff;background-color:#121212;padding:8rem 0;position:relative;overflow:hidden}.demo-infrastructure-section:before{content:"";filter:blur(80px);z-index:0;pointer-events:none;background:radial-gradient(circle,#10b98114 0%,#3b82f60f 50%,#0000 80%);width:60%;height:60%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.demo-infrastructure-section .container{z-index:1;position:relative}.demo-infra-grid{flex-direction:column;gap:4rem;display:flex}.demo-infra-bento-grid{grid-template-columns:repeat(25,1fr);gap:1.5rem;width:100%;display:grid}.demo-infra-card.span-13{grid-column:span 13}.demo-infra-card.span-12{grid-column:span 12}.demo-infra-bento-col{flex-direction:column;gap:1.5rem;display:flex}@media (max-width:968px){.demo-infra-bento-grid{grid-template-columns:1fr;gap:1.5rem}.demo-infra-card.span-13,.demo-infra-card.span-12{grid-column:1/-1;width:100%}.demo-infra-content{text-align:center;align-items:center}}.demo-infra-content{flex-direction:column;gap:1.5rem;display:flex}.demo-infra-label{text-transform:uppercase;letter-spacing:1px;color:#a1a1aa;align-items:center;gap:.5rem;font-size:.85rem;font-weight:600;display:flex}.demo-infra-label .dot{background-color:#10b981;border-radius:50%;width:6px;height:6px;display:inline-block;box-shadow:0 0 8px #10b98199}.demo-infra-content h2{color:#fff;letter-spacing:-.01em;margin-bottom:.75rem;font-size:clamp(2.5rem,4vw,3.5rem);font-weight:600;line-height:1.15}.demo-infra-content p{color:#a1a1aa;margin:0;font-size:1.35rem;line-height:1.6}.demo-infra-features{grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2rem;margin-bottom:2rem;display:grid}.demo-infra-feature{flex-direction:column;gap:.5rem;display:flex}.demo-infra-feature-icon{color:#6e6e73;justify-content:flex-start;align-items:center;margin-bottom:.5rem;display:flex}.demo-infra-feature h4{color:#e4e4e7;margin:0;font-size:.95rem;font-weight:500}.demo-infra-feature span{color:#71717a;font-size:.75rem}@media (max-width:640px){.demo-infra-features{grid-template-columns:1fr;gap:1.5rem}}.demo-infra-actions{align-items:center;gap:1.5rem;display:flex}.demo-infra-btn{font-size:.9rem;font-weight:500;text-decoration:none;transition:all .2s}.demo-infra-btn.primary{color:#000;background-color:#fff;border-radius:100px;padding:.75rem 1.5rem}.demo-infra-btn.primary:hover{background-color:#e4e4e7;transform:translateY(-2px)}.demo-infra-btn.secondary{color:#fff;text-underline-offset:4px;text-decoration:underline}.demo-infra-btn.secondary:hover{color:#a1a1aa}.demo-infra-visuals{flex-direction:column;gap:1.5rem;display:flex}.demo-infra-card{-webkit-backdrop-filter:blur(20px);background:linear-gradient(#1e1e2199 0%,#15151899 100%);border:1px solid #ffffff0f;border-radius:16px;flex-direction:column;display:flex;overflow:hidden;box-shadow:0 10px 40px #0003,inset 0 1px #ffffff1a}.demo-infra-card-ui{flex-direction:column;justify-content:center;height:220px;padding:1.75rem;display:flex;overflow:hidden}.demo-infra-search-bar{-webkit-backdrop-filter:blur(10px);background:#ffffff08;border:1px solid #ffffff14;border-radius:10px;justify-content:space-between;align-items:center;margin-bottom:2rem;padding:1.25rem 1.5rem 2.25rem;display:flex}.search-placeholder{color:#8a8a93;white-space:nowrap;border-right:2px solid #0000;font-size:1.05rem;font-weight:400;display:inline-block;overflow:hidden}.search-icons{color:#8a8a93;gap:.85rem;display:flex}.demo-infra-badges{gap:1rem;display:flex}.demo-infra-badge{border:1px solid #0000;border-radius:20px;align-items:center;gap:.5rem;padding:.4rem .85rem;font-size:.8rem;font-weight:500;display:inline-flex}.demo-infra-badge.success{color:#30c78a;background:#132b24;border-color:#1e4237}.demo-infra-badge.danger{color:#f45b5b;background:#2e1515;border-color:#481d1d}.demo-infra-card-content{padding:1.75rem}.demo-infra-card-content h3{color:#e4e4e7;margin-bottom:.6rem;font-size:1.3rem;font-weight:600}.demo-infra-card-content p{color:#a1a1aa;margin:0;font-size:1rem;line-height:1.6}.node-graph-ui{flex-direction:column;align-items:center;padding:3.5rem 1.5rem 4.5rem;display:flex;position:relative}.node-flow{z-index:2;justify-content:center;align-items:center;gap:0;width:100%;margin-bottom:0;display:flex;position:relative}.node-line-container{flex:50px;align-items:center;max-width:80px;margin:0 .3rem;display:flex;position:relative}.node-branch-curve{z-index:1;pointer-events:none;border-bottom:1.5px dashed #6b6b70;border-left:1.5px dashed #6b6b70;border-bottom-left-radius:30px;width:45px;height:70px;position:absolute;top:50%;left:2px}.node-branch-curve:after{content:"";border-top:3px solid #0000;border-bottom:3px solid #0000;border-left:4px solid #6b6b70;width:0;height:0;position:absolute;bottom:-3px;right:-2px}.node-box{color:#a1a1aa;text-align:center;z-index:3;white-space:nowrap;background:#ffffff0d;border:1px solid #ffffff14;border-radius:8px;justify-content:center;align-items:center;min-width:90px;padding:.65rem 1rem;font-size:.75rem;font-weight:400;display:flex;position:relative}.node-line-container.vertical{flex-direction:column;align-self:center;height:20px;margin:0}.node-dot{background:#6b6b70;border-radius:50%;width:3px;height:3px;margin-right:2px}.node-line-dashed{background:linear-gradient(90deg,#6b6b70 50%,#0000 50%) 0 0/8px 1px repeat-x;flex:1;height:1px}.node-line-dashed.vertical{background:repeating-linear-gradient(#fff3,#fff3 2px,#0000 2px 4px);width:1px;height:100%}.node-arrow{border-top:3px solid #0000;border-bottom:3px solid #0000;border-left:4px solid #6b6b70;width:0;height:0;margin-left:2px}.node-arrow.down{border:3px solid #0000;border-top:4px solid #ffffff4d;border-bottom:none}.node-footer{z-index:2;align-self:center;align-items:center;gap:.5rem;margin-top:2.5rem;display:flex}.google-icon{z-index:2;background:#18181a;border:1px solid #2c2c30;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;display:flex;position:relative}.node-footer-text{flex-direction:column;display:flex}.node-footer-text .title{color:#fff;font-size:.75rem;font-weight:600;line-height:1.2}.node-footer-text .subtitle{color:#6b6b70;font-size:.65rem}.demo-infra-animate{opacity:0;transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1);transform:translateY(20px)}.demo-infra-animate.visible{opacity:1;transform:translateY(0)}.delay-100{transition-delay:.1s}.delay-200{transition-delay:.2s}.delay-300{transition-delay:.3s}.delay-400{transition-delay:.4s}.delay-500{transition-delay:.5s}.half-hidden-ui{background:0 0;justify-content:flex-start;align-items:stretch;padding:1.25rem}.cluster-top-bar{color:#a1a1aa;justify-content:space-between;align-items:center;margin-bottom:.75rem;padding-bottom:0;font-size:.8rem;display:flex}.cluster-title{color:#8c8c92;font-weight:400}.status-online{color:#a1a1aa;align-items:center;gap:.4rem;font-size:.75rem;display:flex}.dot-green{background-color:#10b981;border-radius:50%;width:6px;height:6px;animation:2s infinite pulse-dot;box-shadow:0 0 5px #10b98180}@keyframes pulse-dot{0%{transform:scale(.95);box-shadow:0 0 #10b981b3}70%{transform:scale(1);box-shadow:0 0 0 6px #10b98100}to{transform:scale(.95);box-shadow:0 0 #10b98100}}.lock-label{color:#6b6b70;align-items:center;gap:.4rem;display:flex}.cluster-metrics-grid{grid-template-columns:1fr 1.5fr;gap:.5rem;display:grid}.metrics-col{flex-direction:column;gap:.75rem;display:flex}.metric-box{-webkit-backdrop-filter:blur(10px);background:#ffffff08;border:1px solid #ffffff0f;border-radius:6px;flex-direction:column;justify-content:center;padding:.6rem .75rem;display:flex}.metric-box .label{color:#52525a;margin-bottom:.2rem;font-size:.65rem;font-weight:500}.metric-box .value{color:#e4e4e7;align-items:baseline;gap:.25rem;font-size:1.15rem;font-weight:500;display:flex}.metric-box .unit{color:#52525a;font-size:.6rem;font-weight:400}.metrics-bars-box{-webkit-backdrop-filter:blur(10px);background:#ffffff08;border:1px solid #ffffff0f;border-radius:6px;flex-direction:column;justify-content:space-around;gap:.75rem;padding:.75rem .85rem;display:flex}.progress-group{background:0 0;flex-direction:column;display:flex}.progress-label{color:#71717a;justify-content:space-between;margin-bottom:.5rem;font-size:.7rem;display:flex}.progress-label .percent{font-weight:600}.teal-text{color:#10b981}.blue-text{color:#3b82f6}.progress-bar-bg{background:#36363a;border-radius:4px;width:100%;height:6px;overflow:hidden}.progress-bar-fill{border-radius:4px;height:100%}.teal-bg{background:#10b981}.blue-bg{background:#3b82f6}.access-control-ui{padding-top:1rem}.access-table-box{-webkit-backdrop-filter:blur(10px);background:#ffffff08;border:1px solid #ffffff0f;border-radius:8px;flex-direction:column;display:flex;overflow:hidden}.access-table-header,.access-table-row{grid-template-columns:2fr 1.5fr 2fr .5fr;align-items:center;padding:.6rem .85rem;font-size:.7rem;display:grid}.access-table-header{color:#e4e4e7;border-bottom:1px solid #ffffff0f;font-weight:500}.access-table-row{border-bottom:1px solid #ffffff0a}.access-table-row.no-border{border-bottom:none}.user-name{color:#e4e4e7;font-weight:500}.user-role{color:#a1a1aa}.user-ip{color:#71717a}.user-status{cursor:pointer;justify-content:flex-end;align-items:center;transition:transform .2s cubic-bezier(.16,1,.3,1),color .4s,opacity .2s cubic-bezier(.16,1,.3,1);display:flex}.user-status:hover{opacity:.8;transform:scale(1.1)}.user-status:active{transform:scale(.95)}.user-status.danger{color:#ef4444}.user-status.success{color:#10b981}.demo-infra-card:not(.visible) .demo-infra-badge{opacity:0;pointer-events:none}.demo-infra-badge{opacity:1;transform:scale(1)}.demo-infra-card.visible .demo-infra-badge{animation:.6s cubic-bezier(.34,1.56,.64,1) backwards scaleInBadge}.demo-infra-card.visible .demo-infra-badge.success{animation-delay:.6s}.demo-infra-card.visible .demo-infra-badge.danger{animation-delay:.8s}@keyframes scaleInBadge{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.demo-infra-card.visible .search-placeholder{max-width:0;animation-name:typing,blink-caret;animation-duration:2.5s,.75s;animation-timing-function:steps(30,end),step-end;animation-iteration-count:1,infinite;animation-direction:normal,normal;animation-play-state:running,running;animation-delay:.4s;animation-fill-mode:forwards,none;animation-timeline:auto,auto}@keyframes typing{0%{max-width:0}to{max-width:150px}}@keyframes blink-caret{0%,to{border-color:#0000}50%{border-color:#8a8a93}}.demo-infra-card:not(.visible) .progress-bar-fill{width:0!important}.demo-infra-card.visible .progress-bar-fill{transition:width 1.5s cubic-bezier(.16,1,.3,1)}.demo-infra-card.visible .teal-bg{transition-delay:.6s}.demo-infra-card.visible .blue-bg{transition-delay:.8s}.demo-infra-card.visible .node-line-dashed{animation:.8s linear infinite reverse march}@keyframes march{0%{background-position:8px 0}to{background-position:0 0}}.demo-infra-card.visible .node-box{animation:3s infinite subtle-glow}.demo-infra-card.visible .node-box:first-child{animation-delay:.5s}.demo-infra-card.visible .node-box:nth-child(3){animation-delay:1s}.demo-infra-card.visible .node-box:nth-child(5){animation-delay:1.5s}@keyframes subtle-glow{0%,to{background:#ffffff0d;border-color:#ffffff14}50%{background:#ffffff14;border-color:#fff3}}.demo-infra-card.visible .google-icon{animation:3s ease-in-out infinite float}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.demo-infra-card:not(.visible) .access-table-row{opacity:0;pointer-events:none}.access-table-row{opacity:1;transform:translate(0)}.demo-infra-card.visible .access-table-row{animation:.5s cubic-bezier(.16,1,.3,1) backwards slideInAccessRow}.demo-infra-card.visible .access-table-row:nth-child(2){animation-delay:.6s}.demo-infra-card.visible .access-table-row:nth-child(3){animation-delay:.75s}.demo-infra-card.visible .access-table-row:nth-child(4){animation-delay:.9s}@keyframes slideInAccessRow{0%{opacity:0;transform:translate(15px)}to{opacity:1;transform:translate(0)}}.demo-infra-card{transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s,border-color .4s}.demo-infra-card:hover{border-color:#ffffff1f;transform:translateY(-8px);box-shadow:0 15px 50px #0006,inset 0 1px #ffffff26}.demo-infra-search-bar{transition:all .3s}.demo-infra-search-bar:hover{background:#ffffff0f;border-color:#ffffff26;transform:translateY(-2px);box-shadow:0 4px 15px #0003}.demo-infra-badge{cursor:default;transition:transform .4s cubic-bezier(.16,1,.3,1),filter .4s cubic-bezier(.16,1,.3,1),box-shadow .4s cubic-bezier(.16,1,.3,1)}.demo-infra-badge:hover{filter:brightness(1.2);transform:scale(1.08)translateY(-2px);box-shadow:0 4px 12px #00000026}.metric-box{transition:all .3s}.metric-box:hover{background:#ffffff0f;transform:translateY(-2px)}.progress-group{transition:transform .3s}.progress-group:hover{transform:scale(1.02)}.progress-group:hover .progress-bar-fill.teal-bg{box-shadow:0 0 10px #10b98199}.progress-group:hover .progress-bar-fill.blue-bg{box-shadow:0 0 10px #3b82f699}.node-box{cursor:default;transition:transform .3s,background .3s,border-color .3s}.node-box:hover{transform:scale(1.05);background:#ffffff26!important;border-color:#ffffff4d!important;animation-play-state:paused!important}.google-icon{transition:all .3s}.google-icon:hover{box-shadow:0 0 15px #4285f466;animation-play-state:paused!important;transform:scale(1.1)!important}.demo-infra-card:hover .node-line-dashed{animation-duration:.3s!important}.demo-infra-card.visible .access-table-row{transition:transform .4s cubic-bezier(.16,1,.3,1),background .4s cubic-bezier(.16,1,.3,1),border-color .4s cubic-bezier(.16,1,.3,1),border-radius .4s cubic-bezier(.16,1,.3,1)}.demo-infra-card.visible .access-table-row:hover{background:#ffffff0a;border-radius:4px}[data-theme=light] .demo-infrastructure-section{background-color:var(--bg-primary);color:var(--text-primary)}[data-theme=light] .demo-infrastructure-section:before{background:radial-gradient(circle,#10b9811f 0%,#3b82f61a 50%,#0000 80%)}[data-theme=light] .demo-infra-content h2,[data-theme=light] .demo-infra-card-content h3,[data-theme=light] .demo-infra-feature h4,[data-theme=light] .access-table-header,[data-theme=light] .user-name,[data-theme=light] .metric-box .value,[data-theme=light] .node-footer-text .title{color:var(--text-primary)}[data-theme=light] .demo-infra-content p,[data-theme=light] .demo-infra-card-content p,[data-theme=light] .demo-infra-feature span,[data-theme=light] .user-role,[data-theme=light] .user-ip,[data-theme=light] .metric-box .label,[data-theme=light] .metric-box .unit,[data-theme=light] .cluster-title,[data-theme=light] .node-footer-text .subtitle,[data-theme=light] .search-placeholder,[data-theme=light] .search-icons,[data-theme=light] .demo-infra-feature-icon,[data-theme=light] .demo-infra-label{color:var(--text-secondary)}[data-theme=light] .demo-infra-btn.primary{background-color:var(--text-primary);color:var(--bg-primary)}[data-theme=light] .demo-infra-btn.primary:hover{background-color:var(--text-secondary)}[data-theme=light] .demo-infra-btn.secondary{color:var(--text-primary)}[data-theme=light] .demo-infra-btn.secondary:hover{color:var(--text-secondary)}[data-theme=light] .demo-infra-card{background:linear-gradient(#fffc 0%,#f5f5f7cc 100%);border:1px solid #00000014;box-shadow:0 10px 40px #0000000d,inset 0 1px #fffc}[data-theme=light] .demo-infra-card:hover{border-color:#0000001f;box-shadow:0 15px 50px #0000001a,inset 0 1px #ffffffe6}[data-theme=light] .demo-infra-search-bar,[data-theme=light] .metric-box,[data-theme=light] .metrics-bars-box,[data-theme=light] .access-table-box{background:#00000008;border:1px solid #0000000f}[data-theme=light] .demo-infra-search-bar:hover,[data-theme=light] .metric-box:hover{background:#0000000d;border-color:#0000001a}[data-theme=light] .node-box{color:var(--text-secondary);background:#0000000a;border:1px solid #00000014}[data-theme=light] .node-box:hover{background:#00000014!important;border-color:#00000026!important}[data-theme=light] .demo-infra-card.visible .node-box{animation:3s infinite subtle-glow-light}[data-theme=light] .progress-bar-bg{background:#0000001a}[data-theme=light] .access-table-header{border-bottom:1px solid #00000014}[data-theme=light] .access-table-row{border-bottom:1px solid #0000000a}[data-theme=light] .demo-infra-card.visible .access-table-row:hover{background:#0000000a}[data-theme=light] .google-icon{background:#fff;border:1px solid #0000001a}[data-theme=light] .node-branch-curve{border-color:#0000004d}[data-theme=light] .node-branch-curve:after{border-left-color:#0000004d}[data-theme=light] .node-dot{background:#0000004d}[data-theme=light] .node-line-dashed{background-image:linear-gradient(90deg,#0000004d 50%,#0000 50%)}[data-theme=light] .node-line-dashed.vertical{background:repeating-linear-gradient(#00000026,#00000026 2px,#0000 2px 4px)}[data-theme=light] .node-arrow{border-left-color:#0000004d}[data-theme=light] .node-arrow.down{border-top-color:#0000004d}[data-theme=light] .demo-infra-badge.success{color:#059669;background:#10b9811a;border-color:#10b98133}[data-theme=light] .demo-infra-badge.danger{color:#dc2626;background:#ef44441a;border-color:#ef444433}