.connections-hero { padding: clamp(3rem,6vw,6rem) 0 0; background: radial-gradient(ellipse at 85% 0,#d8e1fa,transparent 65%),#edf2f7; }
.connections-hero h1 { font-size: clamp(3rem,6vw,5.7rem); }
.connections-hero h1 span { color: #365eaa; }
.connections-lede { max-width: 680px; font-size: 1.12rem; line-height: 1.75; color: var(--muted); margin: 1.8rem 0; }
.connections-hero .hero__cta { gap: 1.5rem; }
.connections-ribbon { display: flex; align-items: center; flex-wrap: wrap; gap: 1.3rem; padding: 2rem 0; margin-top: 3.5rem; border-top: 1px solid #cad5e7; font-size: .8rem; color: #4c6486; }
.connections-ribbon i { width: 5px; height: 5px; border-radius: 50%; background: #8aa7d1; }
.connections-heading { display: flex; justify-content: space-between; align-items: end; gap: 2rem; margin-bottom: 2rem; }
.connections-heading > p { max-width: 320px; color: var(--muted); font-size: .9rem; }
.connections-heading h2 { margin-bottom: 0; }
.connections-filters { display: flex; flex-wrap: wrap; gap: .6rem; }
.connections-filters[hidden] { display: none; }
.connections-filters button { border: 1px solid #cbd5e4; background: white; color: #4a5c76; padding: .7rem 1.1rem; border-radius: 2rem; font: inherit; font-size: .82rem; min-height: 44px; cursor: pointer; }
.connections-filters button[aria-pressed="true"] { background: #1c304c; border-color: #1c304c; color: #fff; }
.connections-filters button:focus-visible { outline: 3px solid #2d6bff; outline-offset: 3px; }
.connections-count { color: var(--muted); font-size: .72rem; margin: 1.5rem 0 1rem; }
.connections-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.2rem; }
.connection-tile { background: #fff; border: 1px solid #dce2ec; border-radius: 1rem; padding: 1.7rem; display: flex; flex-direction: column; transition: border-color .2s,box-shadow .2s; }
.connection-tile:hover { border-color: #a7bedf; box-shadow: 0 12px 30px #274a7b0b; }
.connection-tile[hidden] { display: none; }
.connection-tile__head { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.8rem; }
.connection-logo { display: grid; place-items: center; width: 64px; height: 64px; border: 1px solid #e5e9f0; border-radius: .85rem; flex-shrink: 0; background: #fafbfc; }
.connection-logo img { display: block; width: 44px; height: 44px; object-fit: contain; }
.connection-stripe { font-weight: 750; color: #635bff; font-size: 1.35rem; letter-spacing: -.06em; }
.connection-tile h2 { font-size: 1.2rem; margin: 0 0 .3rem; letter-spacing: -.025em; }
.connection-tile__head p { margin: 0; font-size: .66rem; color: var(--muted); }
.connection-tile h3 { font-size: 1rem; margin: 0 0 .6rem; line-height: 1.4; }
.connection-tile > p { color: var(--muted); font-size: .86rem; line-height: 1.75; margin: 0 0 1.6rem; }
.connection-tile > a { display: flex; justify-content: space-between; align-items: center; gap: .5rem; margin-top: auto; padding-top: 1rem; border-top: 1px solid #e4e9f1; color: #305dab; font-size: .79rem; font-weight: 550; }
.connections-custom { background: #eaf0f8; }
.connections-custom__card { background: #fff; border: 1px solid #cddbec; border-radius: 1.2rem; padding: 2.5rem; }
.connections-custom__card h3 { font: 650 1.8rem/1.2 var(--display); margin: 1.4rem 0 1rem; letter-spacing: -.04em; }
.connections-custom__card p { color: var(--muted); margin-bottom: 1.5rem; }
@media(max-width:1000px) { .connections-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .connections-grid { grid-template-columns: 1fr; }.connections-heading { flex-direction: column; align-items: start; gap: 1rem; }.connections-heading > p { max-width: none; margin: 0; }.connections-ribbon { gap: .8rem; font-size: .7rem; }.connections-custom__card { padding: 1.6rem; } }
@media(prefers-reduced-motion:reduce) { .connection-tile { transition: none; } }