/* Roles are another entry into the existing platform and proof. */
.product-library-facts{display:flex;flex-wrap:wrap;gap:12px 32px;margin:18px 0;color:#102b44;font-size:16px}
.product-library-facts strong{font-size:clamp(24px,2.6vw,34px);font-weight:750;letter-spacing:-.03em;color:#0754b9;line-height:1.3}
.design-library-proof{margin-top:30px;padding-top:24px;border-top:1px solid #d5e1ec}
.design-library-proof h3{font-size:22px}.design-library-proof p{font-size:16px;color:#465e73}
#main-nav .role-nav{position:relative;border:0;margin:0;padding:0}
#main-nav .role-nav>summary{display:flex;align-items:center;gap:7px;min-height:44px;padding:10px 0;list-style:none;font-size:14px;font-weight:650;cursor:pointer;white-space:nowrap;color:inherit}
.role-nav>summary::-webkit-details-marker{display:none}
.role-nav>summary:hover,.role-nav[open]>summary{color:#0865ed!important}
#main-nav .role-nav-links{position:absolute;top:calc(100% + 8px);left:-24px;width:min(390px,calc(100vw - 48px));padding:9px;background:#fff;color:#102b44;border:1px solid #d8e2ec;border-radius:12px;box-shadow:0 18px 50px #09254226;max-height:calc(100dvh - 140px);overflow-y:auto}
#main-nav .role-nav:not([open]) .role-nav-links{display:none}
#main-nav .role-nav-link{display:flex;align-items:center;gap:16px;justify-content:space-between;padding:12px 14px;border-radius:7px;min-height:64px;line-height:1.4;white-space:normal;color:#102b44}
.role-nav-link strong,.role-entry-link strong{display:block;font-size:14px;font-weight:700;line-height:1.4;letter-spacing:-.01em}
.role-nav-link small,.role-entry-link small{display:block;font-size:12px;line-height:1.5;font-weight:400;color:#526578;margin-top:3px}
#main-nav .role-nav-link:hover{background:#edf5ff;color:#0754b9}
.role-link-arrow{font-size:18px;flex:none;color:#0865ed}
.home-page #main-nav .role-nav>summary{color:#e0edf7}
.home-page #main-nav .role-nav>summary:hover,.home-page #main-nav .role-nav[open]>summary{color:#a5ddff!important}
.role-entry{padding:30px 0 32px;background:#f3f8fd;border-bottom:1px solid #dce6ef;scroll-margin-top:calc(var(--site-header-height,96px) + 16px)}
.role-entry-heading{margin-bottom:20px}
.role-entry-heading h2{font-size:clamp(23px,2.2vw,30px);line-height:1.2;letter-spacing:-.03em}
.role-entry-heading p{font-size:15px;color:#526578;margin:8px 0 0}
.role-entry-links{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.role-entry-link{display:flex;justify-content:space-between;gap:8px;align-items:flex-start;background:#fff;border:1px solid #d5e1ec;border-radius:9px;padding:15px 13px;min-width:0;transition:border-color .15s,background .15s,box-shadow .15s}
.role-entry-link:hover{background:#fafdff;border-color:#0865ed;box-shadow:0 3px 12px #0865ed0d;color:#0754b9}
.role-entry-link .role-link-arrow{font-size:16px}
.role-entry-link:focus-visible,.role-nav summary:focus-visible,#main-nav .role-nav-link:focus-visible{outline:3px solid #0865ed;outline-offset:3px}
.home-page .role-nav summary:focus-visible{outline-color:#a5ddff}
.role-problems{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:28px 0 0;padding-left:22px}
.role-handoffs{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:28px}
.role-handoffs dt{font-weight:700}.role-handoffs dd{margin:8px 0 0;color:#526578}
@media(min-width:981px) and (max-width:1100px){#main-nav{gap:13px}#main-nav .role-nav>summary{font-size:13px}}
@media(max-width:1100px){.role-entry-links{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:980px){
 #main-nav{max-height:calc(100dvh - var(--site-header-height,96px));overflow-y:auto;overscroll-behavior:contain}
 #main-nav .role-nav>summary{font-size:16px;padding:13px 0;justify-content:space-between}
 #main-nav .role-nav-links{position:static;width:100%;max-height:none;box-shadow:none;border-radius:8px;margin:0 0 8px;padding:6px;background:#f2f7fd}
 #main-nav .role-nav-link{padding:11px 12px;min-height:60px}
 .home-page #main-nav .role-nav-links{background:#092b45;border-color:#33536f}
 .home-page #main-nav .role-nav-link{color:#fff}
 .home-page #main-nav .role-nav-link small{color:#c8dbea}
 .home-page #main-nav .role-nav-link:hover{background:#123d5f}
 .home-page #main-nav .role-link-arrow{color:#a5ddff}
 .home-page #main-nav .role-nav-link:focus-visible{outline-color:#a5ddff}
}
@media(max-width:650px){
 .role-entry{padding:24px 0}.role-entry-heading{margin-bottom:16px}
 .role-entry-links{grid-template-columns:1fr;gap:0;border:1px solid #d5e1ec;border-radius:10px;overflow:hidden}
 .role-entry-link{border:0;border-radius:0;border-bottom:1px solid #dce6ef;padding:11px 14px;align-items:center}
 .role-entry-link:last-child{border-bottom:0}
 .role-entry-link:focus-visible{outline-offset:-3px}
 .role-problems,.role-handoffs{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.role-entry-link{transition:none}}