.integrations-page{max-width:1200px;margin:0 auto}.integrations-page .integrations-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.25rem;padding-bottom:1rem;border-bottom:1px solid var(--color-border)}.integrations-page .header-content{display:flex;align-items:center;gap:.875rem}.integrations-page .header-icon{width:2.25rem;height:2.25rem;background:var(--color-primary);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;color:white;font-size:var(--text-lg);flex-shrink:0}.integrations-page .page-title{font-size:var(--text-lg);font-weight:600;color:var(--color-text-primary);margin:0}.integrations-page .page-description{font-size:var(--text-sm);color:var(--color-text-secondary);margin:.125rem 0 0;line-height:1.4}.integrations-page .header-badges{display:flex;gap:.5rem}.integrations-page .pro-badge{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .75rem;background:rgba(245,158,11,.15);border:1px solid rgba(245,158,11,.4);border-radius:var(--radius-full);color:#f59e0b;font-size:var(--text-xs);font-weight:600;cursor:pointer;transition:all .15s}.integrations-page .pro-badge:hover{background:rgba(245,158,11,.25);border-color:#f59e0b}.integrations-page .pro-badge i{font-size:var(--text-xs)}.integrations-page .integrations-notice{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:rgba(59,130,246,.06);border:1px solid rgba(59,130,246,.15);border-radius:var(--radius-md);margin-bottom:1.5rem}.integrations-page .notice-icon{width:2rem;height:2rem;background:#3b82f6;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:white;font-size:var(--text-sm);flex-shrink:0}.integrations-page .notice-content h4{font-size:var(--text-sm);font-weight:600;color:var(--color-text-primary);margin:0 0 .125rem}.integrations-page .notice-content p{font-size:var(--text-sm);color:var(--color-text-secondary);margin:0;line-height:1.4}.integrations-page .integrations-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem;margin-bottom:2rem}.integrations-page .integration-card{position:relative;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:1rem;display:flex;flex-direction:column;gap:.75rem;transition:all .2s ease}.integrations-page .integration-card.coming-soon{opacity:.75}.integrations-page .integration-card:hover{border-color:var(--color-primary)}.integrations-page .card-coming-soon-badge{position:absolute;top:.75rem;right:.75rem;padding:.1875rem .5rem;background:rgba(245,158,11,.1);border:1px solid rgba(245,158,11,.25);border-radius:var(--radius-sm);color:#f59e0b;font-size:var(--text-2xs);font-weight:600;text-transform:uppercase;letter-spacing:.03em}.integrations-page .integration-header{display:flex;flex-direction:column;gap:.5rem}.integrations-page .integration-logo{height:2rem;display:flex;align-items:center}.integrations-page .integration-logo img{max-height:100%;max-width:140px;object-fit:contain;object-position:left center}.integrations-page .integration-logo-fallback{display:flex;align-items:center;gap:.5rem;padding:.375rem .75rem;border-radius:var(--radius-sm);color:white;font-weight:600;font-size:var(--text-sm)}.integrations-page .integration-logo-fallback i{font-size:var(--text-sm)}.integrations-page .integration-description{font-size:var(--text-xs);color:var(--color-text-secondary);margin:0;line-height:1.4}.integrations-page .integration-features{flex:1}.integrations-page .integration-features ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.25rem}.integrations-page .integration-features li{display:flex;align-items:center;gap:.375rem;font-size:var(--text-xs);color:var(--color-text-secondary)}.integrations-page .integration-features li i{color:#10b981;font-size:var(--text-2xs);flex-shrink:0}.integrations-page .integration-actions{padding-top:.75rem;border-top:1px solid var(--color-border);margin-top:auto;display:flex;gap:.5rem}.integrations-page .btn-integration{width:100%;display:flex;align-items:center;justify-content:center;gap:.375rem;padding:.5rem .75rem;border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:all .15s ease;border:1px solid var(--color-border);background:var(--color-background);color:var(--color-text-secondary)}.integrations-page .btn-integration.btn-disabled{cursor:not-allowed;opacity:.6}.integrations-page .btn-integration:not(.btn-disabled):hover{border-color:var(--color-primary);color:var(--color-primary)}.integrations-page .btn-integration.btn-connect{background:var(--color-primary);border-color:var(--color-primary);color:white;flex:1}.integrations-page .btn-integration.btn-connect:hover{background:#0052a3;border-color:#0052a3}.integrations-page .btn-integration.btn-upgrade{background:rgba(245,158,11,.1);border-color:rgba(245,158,11,.4);color:#f59e0b}.integrations-page .btn-integration.btn-upgrade:hover{background:rgba(245,158,11,.2);border-color:#f59e0b}.integrations-page .btn-integration.btn-contact{background:var(--color-primary);border-color:var(--color-primary);color:white;text-decoration:none;flex:1}.integrations-page .btn-integration.btn-contact:hover{background:#0052a3;border-color:#0052a3;color:white}.integrations-page .btn-integration.btn-docs{background:var(--color-background);border-color:var(--color-border);color:var(--color-text-secondary);text-decoration:none;flex-shrink:0;width:auto;padding:.5rem .875rem}.integrations-page .btn-integration.btn-docs:hover{background:var(--color-surface);border-color:var(--color-primary);color:var(--color-primary)}.integrations-page .integration-card.locked{border-color:rgba(245,158,11,.2)}.integrations-page .integration-card.locked:hover{border-color:rgba(245,158,11,.4)}.integrations-page .card-locked-badge{position:absolute;top:.75rem;right:.75rem;display:flex;align-items:center;gap:.25rem;padding:.1875rem .5rem;background:rgba(245,158,11,.15);border:1px solid rgba(245,158,11,.4);border-radius:var(--radius-sm);color:#f59e0b;font-size:var(--text-2xs);font-weight:600}.integrations-page .card-locked-badge i{font-size:.5rem}.integrations-page .integrations-notice.upgrade-notice{background:rgba(245,158,11,.06);border-color:rgba(245,158,11,.2)}.integrations-page .upgrade-notice .notice-icon{background:#f59e0b}.integrations-page .btn-upgrade-notice{display:inline-flex;align-items:center;gap:.375rem;margin-top:.625rem;padding:.5rem 1rem;background:#f59e0b;border:none;border-radius:var(--radius-sm);color:white;font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:all .15s ease}.integrations-page .btn-upgrade-notice:hover{background:#d97706;transform:translateY(-1px)}.integrations-page .integrations-how-it-works{margin-bottom:1.5rem;padding:1rem 1.25rem;background:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-md)}.integrations-page .integrations-how-it-works h2{font-size:var(--text-sm);font-weight:600;color:var(--color-text-primary);margin:0 0 .875rem;text-transform:uppercase;letter-spacing:.03em}.integrations-page .steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.integrations-page .step-card{display:flex;gap:.625rem;align-items:flex-start}.integrations-page .step-number{width:1.5rem;height:1.5rem;background:var(--color-primary);border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;color:white;font-size:var(--text-xs);font-weight:600;flex-shrink:0}.integrations-page .step-content h4{font-size:var(--text-sm);font-weight:600;color:var(--color-text-primary);margin:0 0 .125rem}.integrations-page .step-content p{font-size:var(--text-xs);color:var(--color-text-tertiary);margin:0;line-height:1.4}.integrations-page .integrations-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.5rem}.integrations-page .benefit-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:1rem;text-align:center;transition:all .15s ease}.integrations-page .benefit-card:hover{border-color:var(--color-primary)}.integrations-page .benefit-card i{font-size:var(--text-xl);color:var(--color-primary);margin-bottom:.5rem}.integrations-page .benefit-card h4{font-size:var(--text-sm);font-weight:600;color:var(--color-text-primary);margin:0 0 .25rem}.integrations-page .benefit-card p{font-size:var(--text-xs);color:var(--color-text-secondary);margin:0;line-height:1.4}.integrations-page .sdk-packages-section{margin-bottom:2rem;padding:1.25rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md)}.integrations-page .sdk-packages-section h2{font-size:var(--text-base);font-weight:600;color:var(--color-text-primary);margin:0 0 .25rem}.integrations-page .sdk-packages-section .section-description{font-size:var(--text-sm);color:var(--color-text-secondary);margin:0 0 1rem}.integrations-page .sdk-packages-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.integrations-page .sdk-package-card{background:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:1rem;display:flex;flex-direction:column;gap:.75rem;transition:all .15s ease}.integrations-page .sdk-package-card:hover{border-color:var(--color-primary)}.integrations-page .sdk-package-header{display:flex;align-items:center;gap:.625rem}.integrations-page .sdk-package-logo{width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}.integrations-page .sdk-package-logo img{max-width:100%;max-height:100%;object-fit:contain}.integrations-page .sdk-package-name{font-size:var(--text-sm);font-weight:600;color:var(--color-text-primary)}.integrations-page .sdk-package-install{display:flex;align-items:center;gap:.5rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:.5rem .75rem}.integrations-page .sdk-package-install code{flex:1;font-family:SF Mono,Monaco,Inconsolata,Fira Code,monospace;font-size:var(--text-xs);color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.integrations-page .sdk-package-install .copy-btn{background:none;border:none;padding:.25rem;cursor:pointer;color:var(--color-text-tertiary);transition:color .15s ease;flex-shrink:0}.integrations-page .sdk-package-install .copy-btn:hover{color:var(--color-primary)}.integrations-page .sdk-package-link{display:flex;align-items:center;justify-content:center;gap:.375rem;padding:.5rem;background:var(--color-primary);border-radius:var(--radius-sm);color:white;font-size:var(--text-sm);font-weight:500;text-decoration:none;transition:all .15s ease}.integrations-page .sdk-package-link:hover{background:#0052a3}.integrations-page .sdk-package-link i{font-size:var(--text-xs)}@media (max-width:1000px){.integrations-page .integrations-benefits,.integrations-page .sdk-packages-grid,.integrations-page .steps-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.integrations-page .integrations-header{flex-direction:column;align-items:flex-start;gap:.75rem}.integrations-page .integrations-notice{flex-direction:column;text-align:center;gap:.625rem}.integrations-page .integrations-grid,.integrations-page .steps-grid{grid-template-columns:1fr}.integrations-page .step-card{flex-direction:row;align-items:center}.integrations-page .integrations-benefits,.integrations-page .sdk-packages-grid{grid-template-columns:1fr}}