/* Shared site design; Bootstrap supplies the grid and navigation. */
body.site-refresh {
background: #e5ecf4;
color: #1d2531;
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
font-size: 17px;
line-height: 1.65;
margin: 0;
}
.site-refresh h1, .site-refresh h2, .site-refresh h3, .site-refresh h4 {
font-family: inherit;
color: #1d2531;
font-weight: 600;
line-height: 1.2;
}
.site-refresh a { color: #3f5fa8; }
.site-refresh a:hover, .site-refresh a:focus { color: #2d4681; }
.site-refresh a:focus-visible { outline: 2px solid #3f5fa8; outline-offset: 4px; }
.site-refresh .navbar {
background: #f4f7fb;
border-bottom: 1px solid #bfcbdb;
font-size: 14px;
}
.site-refresh .navbar-nav > li > a { padding-top: 20px; padding-bottom: 20px; }
.site-refresh .navbar-brand { height: 60px; }
.site-refresh .dropdown-menu { font-size: 14px; }
.site-refresh .site-main { padding-top: 132px; padding-bottom: 56px; }
.site-refresh .site-divider { margin: 24px 0; border: 0; border-top: 1px solid #bfcbdb; }
.site-refresh .breadcrumb { padding: 0; margin: 0 0 20px; background: transparent; font-size: 13px; }
.site-refresh .breadcrumb > li + li::before { color: #65748a; }
.site-content > p { margin-bottom: 22px; }
.site-content address { padding-left: 20px; border-left: 3px solid #bfcbdb; }
/* Full-width figure strip above both Bootstrap columns. */
.research-banner {
margin: 0;
padding: 24px 20px;
background: #f4f7fb;
border: 1px solid #bfcbdb;
border-radius: 8px;
}
.research-banner img {
display: block;
width: 100%;
height: auto;
}
.site-sidebar .well { padding: 20px; background: #f4f7fb; border: 1px solid #bfcbdb; border-radius: 8px; }
.site-sidebar h1 { font-size: 25px; letter-spacing: -.025em; }
.site-sidebar .lead { font-size: 16px; color: #55606f; }
.site-sidebar p { font-size: 14px; line-height: 1.65; }
.site-sidebar h4 { font-size: 17px; }
.site-sidebar center { text-align: left; }
.site-sidebar .img-rounded { margin-top: 18px; border-radius: 4px; }
.site-refresh .footer { position: static; height: auto; border-top: 1px solid #bfcbdb; background: #f4f7fb; font-size: 14px; }
@media (min-width: 1200px) {
.site-content { padding-right: 32px; }
}
@media (max-width: 991px) {
.site-sidebar { margin-top: 28px; }
}
@media (max-width: 767px) {
.site-refresh { font-size: 16px; }
.site-refresh .site-main { padding: 112px 22px 36px; }
.site-refresh .navbar-brand { height: 50px; }
.site-refresh .navbar-nav > li > a { padding-top: 10px; padding-bottom: 10px; }
.research-banner { padding: 12px 8px; }
}

.site-refresh .page-header { margin: 0 0 24px; padding: 0 0 16px; border: 0; }
.site-refresh .page-header h1 { margin: 0; font-size: 36px; }
.site-refresh .ai-mathematics { max-width: none; padding: 0; font-family: inherit; }
.site-refresh .ai-mathematics h1,
.site-refresh .ai-mathematics h2,
.site-refresh .ai-mathematics h3 { font-family: inherit; }
.site-refresh .recipe-page { max-width: none; }
@media (max-width: 767px) {
.site-refresh .page-header h1 { font-size: 30px; }
}

.site-refresh .ai-mathematics__masthead { border-bottom: 0; }

/* Quotes and AI/mathematics notices share the same treatment. */
.site-refresh blockquote,
.site-refresh .ai-mathematics__note {
padding: 15px 18px;
border: 0;
border-left: 4px solid #3f5fa8;
background: rgba(255, 255, 255, .35);
font-family: inherit;
font-size: 16px;
line-height: inherit;
}
.site-refresh blockquote { margin: 24px 0; }
.site-refresh blockquote > :last-child { margin-bottom: 0; }

/* Course navigation matches the banner tilings: 85% IBM color, 15% white. */
.site-refresh .course-nav > .btn {
font-family: inherit;
font-weight: 600;
color: #1d2531;
background-image: none;
background-color: var(--course-tint);
border-color: var(--course-color);
text-shadow: none;
}
.course-nav > .btn-success { --course-color: #785ef0; --course-tint: #8c76f2; }
.course-nav > .btn-primary { --course-color: #fe6100; --course-tint: #fe7926; }
.course-nav > .btn-warning { --course-color: #648fff; --course-tint: #7ba0ff; }
.course-nav > .btn-info { --course-color: #dc267f; --course-tint: #e14792; }
.site-refresh .course-nav > .btn:hover,
.site-refresh .course-nav > .btn:focus {
color: #1d2531;
background-color: var(--course-tint);
box-shadow: inset 0 0 0 2px var(--course-color);
}
.site-refresh .course-nav > .btn:focus-visible {
position: relative;
z-index: 3;
outline: 2px solid #1d2531;
outline-offset: 2px;
}
