/* Shared refinements for every page using the project design. */
.portfolio-site { display: flex; flex-direction: column; min-height: 100vh; }
.portfolio-site main { flex: 1; }
.portfolio-site :where(a, button, input, textarea, select, summary):focus-visible { outline: 3px solid var(--case-accent); outline-offset: 4px; }
.portfolio-site button, .portfolio-site textarea, .portfolio-site select { font: inherit; }
.portfolio-site button { cursor: pointer; }
.portfolio-site .case-nav { font-size: 15px; }
.portfolio-site .case-brand-caption { font-size: 12px; }
.portfolio-site .case-nav .current-menu-parent > a,
.portfolio-site .case-nav .current_page_parent > a { border-color: var(--case-accent); color: var(--case-accent); }
.portfolio-site .case-eyebrow { font-size: 12px; }
.portfolio-site .case-breadcrumbs { font-size: 13px; }
.portfolio-site .case-count { font-size: 12px; }
.portfolio-site .case-sidebar .case-related-title { font-size: 17px; }
.portfolio-site .case-topics a { font-size: 12px; }
.portfolio-site .case-text-link { font-size: 15px; }
.portfolio-site .case-button { font-size: 15px; }
.portfolio-site .case-project-card { display: block; }
.portfolio-site .case-project-card h3 { font-size: 21px; }
.portfolio-site .case-project-card p { font-size: 15px; line-height: 1.75; }
.portfolio-site .case-project-preview { position: relative; }
.portfolio-site .site-project-placeholder { display: grid; place-items: center; width: 100%; height: 100%; font: 500 54px / 1 Consolas, monospace; color: #718474; background: var(--case-tint); }
.portfolio-site .case-footer-top p, .portfolio-site .case-footer-top nav { font-size: 14px; }
.portfolio-site .case-footer-bottom { font-size: 12px; }
.portfolio-site .case-publishing-meta { font-size: 13px; }
.portfolio-site .site-search-form { display: flex; gap: 8px; margin: 0; max-width: 600px; }
.portfolio-site .site-search-form input { min-width: 0; width: 100%; height: 48px; padding: 10px 12px; border: 1px solid #9ba99a; border-radius: 3px; color: var(--case-ink); background: transparent; font-size: 16px; }
.portfolio-site .site-search-form button { flex-shrink: 0; padding: 8px 15px; border: 1px solid var(--case-accent); border-radius: 3px; background: var(--case-accent); color: white; font-size: 15px; }
.portfolio-site .site-search-form button:hover { background: #194331; }
.portfolio-site .site-search-form button span { margin-left: 10px; }
.portfolio-site .site-empty-actions { display: grid; gap: 28px; max-width: 650px; padding-block: 40px 90px; }
.portfolio-site .site-not-found { min-height: 65vh; }
.portfolio-site .site-page { padding-bottom: 70px; }
.portfolio-site .site-page-copy { max-width: 896px; padding-top: 40px; }
.portfolio-site .case-page-links { margin-block: 28px; }
.portfolio-site .case-page-links a, .portfolio-site .case-page-links > span { display: inline-block; min-width: 36px; padding: 4px 10px; border: 1px solid var(--case-line); text-align: center; }
.portfolio-site .case-page-links [aria-current] { background: var(--case-tint); }
.portfolio-site .case-copy { display: flow-root; }
.portfolio-site .case-copy :where(h1, h2, h3, h4, h5, h6) { text-indent: 0; }
.portfolio-site .case-copy .alignleft { float: left; margin: 6px 24px 18px 0; }
.portfolio-site .case-copy .alignright { float: right; margin: 6px 0 18px 24px; }
.portfolio-site .case-copy .aligncenter { margin-inline: auto; }
.portfolio-site .case-copy p > code, .portfolio-site .case-copy li > code { white-space: break-spaces; overflow-wrap: anywhere; }
.portfolio-site .case-copy code.portfolio-local-formula { display: block; max-width: 100%; margin-block: 10px; padding: 10px; white-space: pre-wrap; overflow-wrap: anywhere; }
.portfolio-site .case-copy .syntaxhighlighter { overflow-x: auto !important; max-width: 100%; font-size: 14px !important; }
.portfolio-site .case-copy .syntaxhighlighter table { display: table; width: 100%; }
.portfolio-site .case-copy .syntaxhighlighter td { border: 0; padding: 0 !important; }
@media (max-width: 800px) {
	.portfolio-site .case-header-inner { gap: 24px; }
	.portfolio-site .case-nav { gap: 22px; }
	.portfolio-site .case-brand-caption { max-width: 235px; font-size: 11px; }
}
@media (max-width: 600px) {
	.portfolio-site .case-main-nav { width: 100%; }
	.portfolio-site .case-nav { justify-content: space-between; gap: 12px; font-size: 15px; }
	.portfolio-site .case-nav > li > a { padding-block: 11px; }
	.portfolio-site .case-nav .sub-menu { left: 0; right: auto; }
	.portfolio-site .case-hero .case-eyebrow { font-size: 12px; }
	.portfolio-site .case-topics a { font-size: 12px; }
	.portfolio-site .case-project-card h3 { font-size: 21px; }
	.portfolio-site .case-project-card p { font-size: 15px; }
	.portfolio-site .case-footer-top nav { gap: 20px; }
	.portfolio-site .case-copy .alignleft, .portfolio-site .case-copy .alignright { float: none; margin: 22px 0; }
	.portfolio-site .site-page-copy { padding-top: 30px; }
	.portfolio-site .site-search-form button { padding-inline: 12px; }
	.portfolio-site .site-search-form button span { display: none; }
}