.integrations{position:relative;background:var(--bg-default);color:var(--text-default);padding:var(--section-pad-y) var(--page-gutter);border-radius:var(--radius-2xl);overflow:hidden;margin:var(--space-5) auto;max-width:var(--container-wide)}.integrations__inner{max-width:var(--container-max);margin:0 auto}.integrations__head{max-width:640px;margin:0 0 var(--space-7)}.integrations__eyebrow{display:inline-block;font-size:var(--text-caption);text-transform:uppercase;letter-spacing:var(--ls-widest);font-weight:var(--fw-semibold);background:var(--gradient-link);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;margin:0 0 var(--space-3)}.integrations__title{font-size:var(--text-h2);line-height:var(--lh-tight);letter-spacing:var(--ls-tight);font-weight:var(--fw-bold);color:var(--text-default);margin:0 0 var(--space-3);text-wrap:balance;max-width:22ch}.integrations__subline{font-size:var(--text-lead);line-height:var(--lh-snug);color:var(--text-muted);margin:0;max-width:64ch;text-wrap:pretty}input.integrations__radio,legend.integrations__radio{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;margin:0;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.integrations__tablist{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid var(--border-default);margin:0 0 var(--space-6)}.integrations__tab{position:relative;display:inline-flex;align-items:center;gap:var(--space-2);padding:14px var(--space-4) 16px;font-family:var(--font-display);font-size:.9375rem;font-weight:var(--fw-semibold);letter-spacing:-.005em;color:var(--text-muted);cursor:pointer;white-space:nowrap;border-radius:var(--radius-md) var(--radius-md) 0 0;transition:color var(--transition-base),background-color var(--transition-base)}.integrations__tab svg{width:16px;height:16px;color:currentColor;opacity:.75;transition:opacity var(--transition-base)}.integrations__tab:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--gradient-link);transform:scaleX(0);transform-origin:left center;transition:transform .22s var(--easing-out-quint, cubic-bezier(.22, 1, .36, 1));pointer-events:none}.integrations__tab:hover:after,.integrations__tab:focus-visible:after{transform:scaleX(1)}.integrations__tab:before{content:"";position:absolute;left:0;bottom:-1px;height:3px;width:100%;background:var(--gradient-link);box-shadow:0 0 6px color-mix(in srgb,var(--brand-accent) 40%,transparent);transform:scaleX(0);transform-origin:left center;pointer-events:none;z-index:1}.integrations__tab:hover{color:var(--text-default);background:color-mix(in srgb,var(--brand-accent) 10%,transparent)}.integrations__tab:hover svg{opacity:1}.integrations:has(.integrations__radio[value=sso]:checked) .integrations__tab[data-tab=sso],.integrations:has(.integrations__radio[value=crm]:checked) .integrations__tab[data-tab=crm],.integrations:has(.integrations__radio[value=lms]:checked) .integrations__tab[data-tab=lms],.integrations:has(.integrations__radio[value=cal]:checked) .integrations__tab[data-tab=cal],.integrations:has(.integrations__radio[value=com]:checked) .integrations__tab[data-tab=com]{color:var(--brand-primary);background:color-mix(in srgb,var(--brand-primary-50) 65%,transparent)}.integrations:has(.integrations__radio[value=sso]:checked) .integrations__tab[data-tab=sso] svg,.integrations:has(.integrations__radio[value=crm]:checked) .integrations__tab[data-tab=crm] svg,.integrations:has(.integrations__radio[value=lms]:checked) .integrations__tab[data-tab=lms] svg,.integrations:has(.integrations__radio[value=cal]:checked) .integrations__tab[data-tab=cal] svg,.integrations:has(.integrations__radio[value=com]:checked) .integrations__tab[data-tab=com] svg{opacity:1}.integrations:has(.integrations__radio[value=sso]:checked) .integrations__tab[data-tab=sso]:after,.integrations:has(.integrations__radio[value=crm]:checked) .integrations__tab[data-tab=crm]:after,.integrations:has(.integrations__radio[value=lms]:checked) .integrations__tab[data-tab=lms]:after,.integrations:has(.integrations__radio[value=cal]:checked) .integrations__tab[data-tab=cal]:after,.integrations:has(.integrations__radio[value=com]:checked) .integrations__tab[data-tab=com]:after{display:none}.integrations.is-running:has(.integrations__radio[value=sso]:checked) .integrations__tab[data-tab=sso]:before,.integrations.is-running:has(.integrations__radio[value=crm]:checked) .integrations__tab[data-tab=crm]:before,.integrations.is-running:has(.integrations__radio[value=lms]:checked) .integrations__tab[data-tab=lms]:before,.integrations.is-running:has(.integrations__radio[value=cal]:checked) .integrations__tab[data-tab=cal]:before,.integrations.is-running:has(.integrations__radio[value=com]:checked) .integrations__tab[data-tab=com]:before{animation:integrations-progress 5s linear forwards}.integrations.is-paused .integrations__tab:before{animation-play-state:paused!important}@keyframes integrations-progress{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@media(prefers-reduced-motion:reduce){.integrations__tab:before{animation:none!important}}.integrations:has(.integrations__radio[value=sso]:focus-visible) .integrations__tab[data-tab=sso],.integrations:has(.integrations__radio[value=crm]:focus-visible) .integrations__tab[data-tab=crm],.integrations:has(.integrations__radio[value=lms]:focus-visible) .integrations__tab[data-tab=lms],.integrations:has(.integrations__radio[value=cal]:focus-visible) .integrations__tab[data-tab=cal],.integrations:has(.integrations__radio[value=com]:focus-visible) .integrations__tab[data-tab=com]{outline:none;box-shadow:var(--focus-ring);border-radius:var(--radius-md)}.integrations__panel{display:none;animation:integrations-fade var(--transition-slow, .32s) var(--easing-out-quint, cubic-bezier(.22, 1, .36, 1))}.integrations:has(.integrations__radio[value=sso]:checked) .integrations__panel[data-panel=sso],.integrations:has(.integrations__radio[value=crm]:checked) .integrations__panel[data-panel=crm],.integrations:has(.integrations__radio[value=lms]:checked) .integrations__panel[data-panel=lms],.integrations:has(.integrations__radio[value=cal]:checked) .integrations__panel[data-panel=cal],.integrations:has(.integrations__radio[value=com]:checked) .integrations__panel[data-panel=com]{display:block}@keyframes integrations-fade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.integrations__panel{animation:none}}.integrations__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-3);margin:0 0 var(--space-5)}@media(max-width:1024px){.integrations__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:640px){.integrations__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.logo-tile{display:flex;align-items:center;gap:var(--space-3);min-height:84px;padding:var(--space-3) var(--space-4);background:var(--bg-default);border:1px solid var(--border-default);border-radius:var(--radius-md);transition:border-color var(--transition-base),background-color var(--transition-base),transform var(--transition-base)}.logo-tile:hover{border-color:color-mix(in srgb,var(--brand-primary) 22%,var(--border-default));background:color-mix(in srgb,var(--brand-primary) 3%,var(--bg-default));transform:translateY(-1px)}.logo-tile__mark{flex:none;width:36px;height:36px;border-radius:var(--radius-sm);background:linear-gradient(135deg,var(--neutral-100) 0%,var(--neutral-200) 100%);position:relative;overflow:hidden}.logo-tile__mark:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 46%,color-mix(in srgb,var(--neutral-400) 28%,transparent) 47%,color-mix(in srgb,var(--neutral-400) 28%,transparent) 53%,transparent 54%)}.logo-tile__name{font-family:var(--font-display);font-size:.875rem;font-weight:var(--fw-semibold);color:var(--text-default);letter-spacing:-.005em;line-height:1.25}.logo-tile__name small{display:block;font-family:var(--font-mono);font-size:10px;font-weight:var(--fw-regular);color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-top:2px}.integrations__panel-note{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-4) var(--space-5);background:color-mix(in srgb,var(--brand-primary) 5%,var(--bg-subtle));border:1px solid color-mix(in srgb,var(--brand-primary) 14%,var(--border-default));border-radius:var(--radius-md);font-size:var(--text-small);line-height:var(--lh-snug);color:var(--text-muted);margin:0;text-wrap:pretty}.integrations__panel-note svg{flex:none;width:18px;height:18px;color:var(--brand-primary);margin-top:1px}.integrations__panel-note strong{color:var(--text-default);font-weight:var(--fw-semibold)}.integrations__foot{margin-top:var(--space-7);padding-top:var(--space-5);border-top:1px solid var(--border-default);display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap;justify-content:space-between}.integrations__foot-label{font-size:var(--text-small);color:var(--text-muted)}.integrations__foot-link{position:relative;display:inline-flex;align-items:center;gap:var(--space-2);font-family:var(--font-display);font-weight:var(--fw-semibold);font-size:.9375rem;color:var(--brand-primary);text-decoration:none;padding:4px 0;transition:color var(--transition-base),gap var(--transition-base)}.integrations__foot-link:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--gradient-link);transform:scaleX(0);transform-origin:left center;transition:transform .22s var(--easing-out-quint, cubic-bezier(.22, 1, .36, 1))}.integrations__foot-link:hover{color:var(--brand-primary-700);gap:12px}.integrations__foot-link:hover:after,.integrations__foot-link:focus-visible:after{transform:scaleX(1)}.integrations__foot-link:focus{outline:none}.integrations__foot-link:focus-visible{box-shadow:var(--focus-ring);border-radius:var(--radius-sm)}.integrations__foot-link svg{width:14px;height:14px;transition:transform var(--transition-base)}.integrations__foot-link:hover svg{transform:translate(2px)}[data-theme=dark] .integrations{background:#0a0d12;color:var(--neutral-50);--border-default: #1f2937;--text-muted: #9ca3b3;--text-default: var(--neutral-50);--bg-default: #0a0d12;--bg-subtle: #11161e}[data-theme=dark] .integrations .integrations__title{color:var(--neutral-0)}[data-theme=dark] .integrations .integrations__tablist{border-bottom-color:#1f2937}[data-theme=dark] .integrations .integrations__tab{color:#9ca3b3}[data-theme=dark] .integrations .integrations__tab:hover{color:var(--neutral-0);background:color-mix(in srgb,var(--brand-accent) 10%,transparent)}[data-theme=dark] .integrations:has(.integrations__radio[value=sso]:checked) .integrations__tab[data-tab=sso],[data-theme=dark] .integrations:has(.integrations__radio[value=crm]:checked) .integrations__tab[data-tab=crm],[data-theme=dark] .integrations:has(.integrations__radio[value=lms]:checked) .integrations__tab[data-tab=lms],[data-theme=dark] .integrations:has(.integrations__radio[value=cal]:checked) .integrations__tab[data-tab=cal],[data-theme=dark] .integrations:has(.integrations__radio[value=com]:checked) .integrations__tab[data-tab=com]{color:var(--brand-skyblue);background:color-mix(in srgb,var(--brand-skyblue) 12%,transparent)}[data-theme=dark] .integrations .logo-tile{background:#11161e;border-color:#1f2937}[data-theme=dark] .integrations .logo-tile:hover{background:#141a23;border-color:color-mix(in srgb,var(--brand-skyblue) 38%,#1f2937)}[data-theme=dark] .integrations .logo-tile__mark{background:linear-gradient(135deg,#1a2030,#232a3c)}[data-theme=dark] .integrations .logo-tile__mark:after{background:linear-gradient(135deg,transparent 46%,color-mix(in srgb,var(--brand-skyblue) 32%,transparent) 47%,color-mix(in srgb,var(--brand-skyblue) 32%,transparent) 53%,transparent 54%)}[data-theme=dark] .integrations .logo-tile__name{color:var(--neutral-0)}[data-theme=dark] .integrations .logo-tile__name small{color:#6b7588}[data-theme=dark] .integrations .integrations__panel-note{background:color-mix(in srgb,var(--brand-skyblue) 10%,#11161e);border-color:color-mix(in srgb,var(--brand-skyblue) 26%,#1f2937);color:#b6becc}[data-theme=dark] .integrations .integrations__panel-note svg{color:var(--brand-skyblue)}[data-theme=dark] .integrations .integrations__panel-note strong{color:var(--neutral-0)}[data-theme=dark] .integrations .integrations__foot{border-top-color:#1f2937}[data-theme=dark] .integrations .integrations__foot-link{color:var(--brand-skyblue)}[data-theme=dark] .integrations .integrations__foot-link:hover{color:var(--brand-paleblue)}
