@import url("https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,400&display=swap");

body.fpga-static-article,
body.fpga-static-page {
	font-family: Ubuntu, sans-serif;
}

/* Keep 842px on the article body only. Header/footer inherit site-wide width. */
body.fpga-static-article {
	--wp--style--global--wide-size: min(1290px, calc(100% - 2rem));
	--global-content-narrow-width: 842px;
}

body.fpga-static-article main {
	--wp--style--global--content-size: min(842px, calc(100% - 2rem));
	--wp--style--global--wide-size: min(842px, calc(100% - 2rem));
}

body.fpga-static-page {
	--wp--style--global--content-size: min(1290px, calc(100% - 2rem));
	--wp--style--global--wide-size: min(1290px, calc(100% - 2rem));
}

/* Kadence content-width-narrow (842px); counter archive-import mu-plugin 20% padding. */
body.fpga-static-article main.wp-block-group,
body.fpga-static-article #primary.content-area {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

body.fpga-static-article main.wp-block-group,
body.fpga-static-article main .wp-block-post-content,
body.fpga-static-article .entry-content {
	max-width: 842px !important;
	width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: 1rem !important;
	padding-right: 1rem !important;
	box-sizing: border-box !important;
}

/* Theme files stay unchanged: override Extendable's 42rem content column.
   Scope to main so the header/footer are not squeezed into the article width. */
body.fpga-static-article main .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
body.fpga-static-article .wp-block-post-content.is-layout-constrained > * {
	max-width: min(842px, 100%) !important;
}

body.fpga-static-article header.wp-block-template-part,
body.fpga-static-article footer.wp-block-template-part {
	--wp--style--global--content-size: min(1290px, calc(100% - 2rem));
	--wp--style--global--wide-size: min(1290px, calc(100% - 2rem));
}

body.fpga-static-article header.wp-block-template-part .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
body.fpga-static-article footer.wp-block-template-part .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: min(1290px, 100%) !important;
}

/* Blog / About / Contact must stay on one row; wrapping was caused by the
   842px article clamp plus a 40px nav gap. */
body.fpga-static-article header.wp-block-template-part nav.wp-block-navigation,
body.fpga-static-article header.wp-block-template-part .wp-block-navigation__container {
	flex-wrap: nowrap !important;
	flex-shrink: 0;
}

body.fpga-static-article header.wp-block-template-part .ext-nav-extras:not(:has(nav, .wp-block-navigation)):not(:has(.wp-block-social-link, .wp-block-button, a)) {
	display: none;
}

body.fpga-static-page .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
body.fpga-static-page .wp-block-post-content.is-layout-constrained > * {
	max-width: min(1290px, 100%) !important;
}

body.fpga-static-article .entry-content,
body.fpga-static-article .wp-block-post-content,
body.fpga-static-page .entry-content,
body.fpga-static-page .wp-block-post-content,
body.fpga-static-article .wp-block-group,
body.fpga-static-page .wp-block-group {
	max-width: none;
	width: 100%;
}

/* Static HTML already has the H1 in the theme title; do not also show the featured hero. */
body.fpga-static-article .wp-block-post-featured-image {
	display: none !important;
}

/* Recreate Kadence tutorial article layout without editing the theme. */
.fpga-static-article .entry-content,
.fpga-static-article .wp-block-post-content,
.fpga-static-page .entry-content,
.fpga-static-page .wp-block-post-content {
	font-size: 1.05rem;
	line-height: 1.75;
}

.fpga-static-article .entry-content > p,
.fpga-static-article .wp-block-post-content > p {
	margin-top: 0;
	margin-bottom: 1.5em;
}

.fpga-static-article .entry-content h2,
.fpga-static-article .wp-block-post-content h2 {
	margin-top: 1.75em;
	margin-bottom: 0.85em;
	line-height: 1.3;
}

.fpga-static-article .entry-content h3,
.fpga-static-article .wp-block-post-content h3 {
	margin-top: 1.6em;
	margin-bottom: 0.7em;
	line-height: 1.35;
}

.fpga-static-article .entry-content h4,
.fpga-static-article .wp-block-post-content h4 {
	margin-top: 1.35em;
	margin-bottom: 0.6em;
	line-height: 1.4;
}

.fpga-static-article .entry-content ul,
.fpga-static-article .entry-content ol,
.fpga-static-article .wp-block-post-content ul,
.fpga-static-article .wp-block-post-content ol {
	margin: 0 0 1.5em 1.25em;
	padding: 0;
	line-height: 1.7;
}

.fpga-static-article .entry-content img,
.fpga-static-article .wp-block-post-content img {
	max-width: 100%;
	height: auto;
}

.fpga-static-article .table-class,
.fpga-static-article .entry-content table,
.fpga-static-article .wp-block-post-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 1.5em;
	text-align: left;
	background-color: #cfcfcf;
	color: #494949;
	font-size: 18px;
	border: 2px solid #4caf50;
}

.fpga-static-article .table-class th,
.fpga-static-article .table-class td,
.fpga-static-article .entry-content th,
.fpga-static-article .entry-content td,
.fpga-static-article .wp-block-post-content th,
.fpga-static-article .wp-block-post-content td {
	border: 2px solid #4caf50;
	padding: 12px;
}

.fpga-static-article .wp-block-post-content a:not(.ub-expand-toggle-button):not(.wp-element-button),
.fpga-static-article .entry-content a:not(.ub-expand-toggle-button):not(.wp-element-button) {
	color: inherit;
	text-decoration: underline;
}

.fpga-static-article .wp-block-post-content a:not(.ub-expand-toggle-button):hover,
.fpga-static-article .entry-content a:not(.ub-expand-toggle-button):hover {
	color: #0084c6;
}

.fpga-static-article .wp-block-image {
	margin: 1.25em 0;
}

.fpga-static-article .wp-block-image.aligncenter img,
.fpga-static-article figure.aligncenter img {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.fpga-static-article .wp-block-spacer {
	clear: both;
}

.fpga-static-article .updated:not(.published) {
	display: none;
}

.wp-block-kevinbatdorf-code-block-pro,
.code-block-pro {
	margin: 1.5rem 0;
	border-radius: 8px;
	overflow: hidden;
	background: #1e1e1e;
	color: #d4d4d4;
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	line-height: 1.1 !important;
}

.code-block-pro pre,
.wp-block-kevinbatdorf-code-block-pro pre {
	margin: 0;
	padding: 0.85rem 1rem 1rem;
	overflow: visible;
	overflow-x: visible;
	background: #1e1e1e !important;
	color: inherit;
}

.code-block-pro-copy-button {
	display: none !important;
}

.wp-block-kevinbatdorf-code-block-pro {
	direction: ltr;
	position: relative;
	box-sizing: border-box;
}

.wp-block-kevinbatdorf-code-block-pro pre {
	overflow: visible !important;
	overflow-x: visible !important;
	padding: 12px 0 12px 16px !important;
	white-space: pre-wrap !important;
	word-break: break-word;
	border: 0 !important;
	border-radius: 0 !important;
	line-height: 1.1 !important;
}

.wp-block-kevinbatdorf-code-block-pro pre code {
	display: block !important;
	background: none !important;
	padding: 0 !important;
	white-space: pre-wrap !important;
	word-break: break-word;
	line-height: 1.1 !important;
}

.wp-block-kevinbatdorf-code-block-pro pre code .line {
	display: block !important;
	position: relative !important;
	min-width: 0 !important;
	width: 100% !important;
	vertical-align: top !important;
	white-space: pre-wrap !important;
	word-break: break-word;
	line-height: 1.1 !important;
	margin: 0 !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

body.fpga-static-article .entry-content pre,
body.fpga-static-article .wp-block-post-content pre {
	overflow: visible !important;
	overflow-x: visible !important;
	white-space: pre-wrap !important;
	word-break: break-word;
}

.wp-block-kevinbatdorf-code-block-pro.cbp-has-line-numbers pre code {
	counter-reset: step !important;
}

.wp-block-kevinbatdorf-code-block-pro.cbp-has-line-numbers pre code .line {
	padding-left: calc(12px + var(--cbp-line-number-width, auto)) !important;
}

.wp-block-kevinbatdorf-code-block-pro.cbp-has-line-numbers pre code .line:before {
	color: var(--cbp-line-number-color, #999) !important;
	content: counter(step) !important;
	counter-increment: step !important;
	left: 0 !important;
	opacity: 0.5 !important;
	position: absolute !important;
	text-align: right !important;
	user-select: none !important;
	width: var(--cbp-line-number-width, auto) !important;
}

.ub-hide {
	display: none !important;
}

a.ub-expand-toggle-button {
	display: inline-block;
	cursor: pointer;
	color: #4caf50;
	font-weight: 500;
	text-decoration: underline;
	margin-top: 0.65rem;
	text-transform: lowercase;
}

a.ub-expand-toggle-button:hover {
	color: #0084c6;
	background: transparent;
}

.ub_table-of-contents {
	box-sizing: border-box;
	background-color: #fafafa;
	border: 1px solid #dfdfdf;
	padding: 30px;
	margin: 20px 0;
}

.ub-notification-box,
.ub_notify_info,
.ub_notify_success,
.ub_notify_warning {
	margin: 10px 0;
	padding: 15px;
	border-left-width: 4px;
	border-left-style: solid;
}

.ub_notify_info {
	color: #31708f;
	background-color: #d9edf7;
	border-left-color: #31708f;
}

.ub_notify_success {
	color: #3c763d;
	background-color: #dff0d8;
	border-left-color: #3c763d;
}

.ub_notify_warning {
	color: #d8000c;
	background-color: #ffd2d2;
	border-left-color: #d8000c;
}

/* Strip SPA leftovers that hide content */
.fpga-static-article .entry-content [style*="opacity:0"],
.fpga-static-article .entry-content [style*="opacity: 0"] {
	opacity: 1 !important;
}

.fpga-static-article .wp-block-ub-content-toggle-accordion .ub-content-initialized {
	opacity: 1;
	position: static;
}

/* Hub pages (home, sv, verilog, vhdl) */
body.fpga-hub-page {
	--global-palette1: #4caf50;
	--global-palette2: #0084c6;
	--global-palette3: #1a202c;
	--global-palette4: #2d3748;
	--global-palette5: #404040;
	--global-palette9: #ffffff;
	--global-content-width: 1290px;
	--global-content-edge-padding: 1rem;
	--global-content-boxed-padding: 2rem;
}

body.fpga-hub-page .wp-block-post-title,
body.fpga-hub-page .wp-block-post-featured-image {
	display: none !important;
}

/* Kadence boxed page shell (content-style-boxed + entry-content-wrap). */
body.fpga-hub-page main.wp-block-group .wp-block-post-content {
	background: #fff;
	padding: 2rem;
	box-shadow: 0 15px 15px -10px rgb(0 0 0 / 0.05);
	box-sizing: border-box;
}

.fpga-hub-page .entry-content,
.fpga-hub-page .wp-block-post-content {
	font-size: 1.05rem;
	line-height: 1.75;
	max-width: none !important;
	width: 100% !important;
}

/* Kadence heading scale (theme-june.css) — overrides Extendable + archive-import. */
.fpga-hub-page .entry-content h1,
.fpga-hub-page .wp-block-post-content h1 {
	font-style: normal;
	font-weight: 500;
	font-size: 45px;
	line-height: 1.5;
	color: var(--global-palette5);
	margin-top: 0;
	margin-bottom: 0.5em;
}

.fpga-hub-page .entry-content h2,
.fpga-hub-page .entry-content .wp-block-heading,
.fpga-hub-page .wp-block-post-content h2,
.fpga-hub-page .wp-block-post-content .wp-block-heading {
	font-style: normal;
	font-weight: 700;
	font-size: 28px;
	line-height: 1.5;
	color: var(--global-palette5);
	margin-top: 1.75em;
	margin-bottom: 0;
	text-wrap: wrap;
	overflow-wrap: normal;
	hyphens: manual;
}

.fpga-hub-page .entry-content h3,
.fpga-hub-page .wp-block-post-content h3 {
	font-style: normal;
	font-weight: 700;
	font-size: 24px;
	line-height: 1.5;
	color: var(--global-palette5);
	margin-top: 1.75em;
	margin-bottom: 0;
}

.fpga-hub-page .entry-content h4,
.fpga-hub-page .wp-block-post-content h4 {
	font-style: normal;
	font-weight: 700;
	font-size: 22px;
	line-height: 1.5;
	color: var(--global-palette5);
	margin-top: 1.75em;
	margin-bottom: 0;
}

.fpga-hub-page .wp-block-ub-content-toggle-accordion-title {
	font-style: normal;
	font-weight: 700;
	font-size: 24px;
	line-height: 1.5;
	color: var(--global-palette3);
	margin: 0 !important;
	padding: 10px 10px 10px 25px;
	display: block;
}

.fpga-hub-page .wp-block-ub-content-toggle {
	margin: 20px 0;
	max-width: 100%;
}

.fpga-hub-page .wp-block-ub-content-toggle-accordion {
	position: relative;
	border: 1px solid #f1f1f1 !important;
	margin-bottom: 10px;
}

.fpga-hub-page .wp-block-ub-content-toggle-accordion-title-wrap {
	display: flex;
	align-items: center;
	background-color: #f1f1f1 !important;
	cursor: pointer;
}

.fpga-hub-page .wp-block-ub-content-toggle-accordion-title-wrap > *:first-child {
	flex-grow: 1;
}

.fpga-hub-page .wp-block-ub-content-toggle-accordion-title-wrap .wp-block-ub-content-toggle-accordion-toggle-wrap {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}

.fpga-hub-page .wp-block-ub-content-toggle-accordion-title-wrap .wp-block-ub-content-toggle-accordion-toggle-wrap.right {
	order: 0;
}

.fpga-hub-page .wp-block-ub-content-toggle-accordion-state-indicator {
	display: block;
	margin: 0 10px;
	transition: all 0.5s;
	transform: rotate(0deg);
	color: inherit;
}

.fpga-hub-page .wp-block-ub-content-toggle-accordion-state-indicator.open {
	transform: rotate(90deg);
}

.fpga-hub-page .wp-block-ub-content-toggle-accordion-content-wrap {
	box-sizing: border-box;
	padding: 13px 4%;
	overflow: hidden;
}

.fpga-hub-page .wp-block-ub-content-toggle-accordion .ub-content-initialized {
	opacity: 1;
	position: static;
}

.fpga-hub-page .ub-hide {
	display: none !important;
}

/* Homepage hero + language columns */
.fpga-hub-page .entry-content > h2.has-theme-palette-5-color,
.fpga-hub-page .wp-block-post-content > h2.has-theme-palette-5-color {
	color: #2c5282 !important;
	font-weight: 600;
	text-align: center;
	margin-top: 1rem;
	margin-bottom: 0.75rem;
}

.fpga-hub-page .entry-content > p.has-theme-palette-5-color,
.fpga-hub-page .wp-block-post-content > p.has-theme-palette-5-color {
	color: #2c5282 !important;
	text-align: center;
	max-width: 52rem;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 2rem;
}

.fpga-hub-page .entry-content > .wp-block-columns,
.fpga-hub-page .wp-block-post-content > .wp-block-columns {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem;
	justify-content: center;
	margin: 2rem 0;
}

.fpga-hub-page .entry-content > .wp-block-columns > .wp-block-column,
.fpga-hub-page .wp-block-post-content > .wp-block-columns > .wp-block-column {
	flex: 1 1 220px;
	max-width: 320px;
	min-width: 0;
}

.fpga-hub-page .entry-content .wp-block-column h2,
.fpga-hub-page .entry-content .wp-block-column h2 a,
.fpga-hub-page .wp-block-post-content .wp-block-column h2,
.fpga-hub-page .wp-block-post-content .wp-block-column h2 a {
	color: #2b6cb0 !important;
	text-align: center;
	text-decoration: none;
	font-size: 1.35rem;
	margin-bottom: 0.75rem;
}

.fpga-hub-page .entry-content .wp-block-column > p,
.fpga-hub-page .wp-block-post-content .wp-block-column > p {
	color: #2b6cb0;
	text-align: center;
	font-size: 0.98rem;
	line-height: 1.6;
}

.fpga-hub-page .wp-block-ub-icon .ub_icon {
	display: flex;
	justify-content: center;
	margin: 0.5rem 0 1rem;
}

/* Content Views tutorial card grid */
.fpga-hub-page .pt-cv-wrapper {
	margin-top: 2rem;
}

.fpga-hub-page .pt-cv-blockgrid > .pt-cv-page {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.5rem;
}

.fpga-hub-page .pt-cv-blockgrid .pt-cv-content-item {
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	background: #fff;
	border: 1px solid #e8eaed;
	border-radius: 8px;
	overflow: hidden;
	transition: box-shadow 0.2s;
}

.fpga-hub-page .pt-cv-blockgrid .pt-cv-content-item:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.fpga-hub-page .pt-cv-thumb-wrapper {
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: #f4f4f4;
}

.fpga-hub-page .pt-cv-thumb-wrapper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.fpga-hub-page .pt-cv-thumb-wrapper img[src$=".svg"] {
	object-fit: contain;
	padding: 0.75rem;
	background: #f4f4f4;
}

.fpga-hub-page .pt-cv-remain-wrapper {
	padding: 1rem 1.25rem 1.25rem;
}

.fpga-hub-page .pt-cv-taxoterm a {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: #4caf50;
	text-decoration: none;
	font-weight: 600;
}

.fpga-hub-page .pt-cv-taxoterm.above_title {
	margin-bottom: 0.35rem;
}

.fpga-hub-page .pt-cv-title {
	margin: 0.25rem 0 0.5rem;
	font-size: 18px;
	line-height: 1.3;
}

.fpga-hub-page .pt-cv-title a {
	color: #1a202c;
	text-decoration: none;
	font-weight: 600;
}

.fpga-hub-page .pt-cv-title a:hover {
	color: #0084c6;
}

.fpga-hub-page .pt-cv-content {
	color: #4a5568;
	font-size: 0.95rem;
	line-height: 1.6;
	margin-bottom: 0.75rem;
}

.fpga-hub-page .pt-cv-readmore {
	display: inline-block;
	background: #4caf50;
	color: #fff !important;
	padding: 0.35rem 0.9rem;
	border-radius: 4px;
	text-decoration: none !important;
	font-size: 0.85rem;
	font-weight: 500;
}

.fpga-hub-page .pt-cv-readmore:hover {
	background: #0084c6;
}

/* Video tutorial cards */
.fpga-hub-page .fpga-card-header {
	color: #fff;
	margin-top: 0;
	margin-bottom: 12px;
	text-align: center;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.5;
}

.fpga-hub-page .fpga-card-p {
	color: #e8eaed;
}

.fpga-hub-page .fpga-card-content-video {
	min-height: 120px;
	margin: 0.75rem 0;
}

.fpga-hub-page .fpga-card-content-video img {
	width: 100%;
	border-radius: 6px;
	display: block;
}

.fpga-hub-page .fpga-video-card {
	border-radius: 10px;
	background-color: #4f4f4f;
	padding: 1.5rem;
	margin: 1rem 0 1.5rem;
	max-width: 520px;
}

.fpga-hub-page .fpga-video-card p {
	color: #e8eaed;
}

.fpga-hub-page .wp-block-ub-content-toggle-accordion-content-wrap > .wp-block-columns {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem;
	margin-bottom: 1.5rem;
}

.fpga-hub-page .wp-block-ub-content-toggle-accordion-content-wrap > .wp-block-columns > .wp-block-column {
	flex: 1 1 280px;
	max-width: calc(50% - 0.75rem) !important;
	min-width: 0;
	margin: 0 !important;
}

.fpga-hub-page .wp-block-ub-content-toggle-accordion-content-wrap .wp-block-column:has(.fpga-card-header) {
	max-width: calc(50% - 0.75rem) !important;
	width: auto !important;
}

@media (max-width: 900px) {
	.fpga-hub-page .pt-cv-blockgrid > .pt-cv-page {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 700px) {
	.fpga-hub-page .entry-content .wp-block-column,
	.fpga-hub-page .wp-block-post-content .wp-block-column {
		flex: 1 1 100%;
		max-width: none;
	}

	.fpga-hub-page .wp-block-ub-content-toggle-accordion-content-wrap > .wp-block-columns > .wp-block-column {
		max-width: 100%;
	}
}

@media (max-width: 600px) {
	.fpga-hub-page .pt-cv-blockgrid > .pt-cv-page {
		grid-template-columns: 1fr;
	}
}
