/*
Theme Name: ICTByte
Theme URI: https://ictbyte.com
Author: ICTByte
Description: A 100% dynamic editorial block theme for technology news. Every homepage rail and grid is rendered from core Query Loop blocks, taxonomies, authors and post meta. No static mock content.
Version: 1.2.1
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ictbyte
Tags: full-site-editing, block-patterns, news, blog, custom-colors, wide-blocks, editor-style
*/

/* ==========================================================================
   1. DARK MODE TOKENS
   Overrides the preset custom properties emitted by theme.json.
   `html:root` out-specifies the global-styles `:root` rule regardless of load order.
   Follows the OS setting; force with <html data-theme="dark|light">.
   ========================================================================== */
@media (prefers-color-scheme: dark) {
	html:root:not([data-theme="light"]) {
		color-scheme: dark;
		--wp--preset--color--paper: #0e0e10;
		--wp--preset--color--surface: #17171a;
		--wp--preset--color--ink: #f2f0ec;
		--wp--preset--color--ink-muted: #a6a6a6;
		--wp--preset--color--border-hairline: #34343a;
		--wp--preset--color--accent: #ef4444;
	}
}
html:root[data-theme="dark"] {
	color-scheme: dark;
	--wp--preset--color--paper: #0e0e10;
	--wp--preset--color--surface: #17171a;
	--wp--preset--color--ink: #f2f0ec;
	--wp--preset--color--ink-muted: #a6a6a6;
	--wp--preset--color--border-hairline: #34343a;
	--wp--preset--color--accent: #ef4444;
}

/* ==========================================================================
   2. BASE
   ========================================================================== */
html { scroll-behavior: smooth; scroll-padding-top: 7.5rem; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

.wp-block-post-template { padding: 0; margin: 0; list-style: none; }
.wp-block-post-template > .wp-block-post { margin: 0; }
.wp-block-post-template.is-layout-grid { gap: 1.5rem; }

/* Kicker / category label (11px tracked caps) */
.ictbyte-kicker {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin: 0 0 0.35rem;
}
.ictbyte-kicker a { color: var(--wp--preset--color--accent); text-decoration: none; }

.ictbyte-meta,
.ictbyte-byline { font-family: var(--wp--preset--font-family--sans); font-size: 0.75rem; color: var(--wp--preset--color--ink-muted); margin: 0; }

.ictbyte-thumb { margin: 0 0 0.75rem; }
.ictbyte-thumb img { width: 100%; height: auto; object-fit: cover; }

.ictbyte-col-label,
.ictbyte-section-title {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.6875rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-weight: 700;
	margin: 0;
}

/* ==========================================================================
   3. NO-IMAGE FALLBACK (no empty gray boxes, text takes 100% width)
   `.no-thumbnail` is added by functions.php (post_class) so browsers without
   :has() are covered; the :has() rules are the progressive enhancement.
   ========================================================================== */
.wp-block-post:not(:has(.wp-block-post-featured-image)) > .wp-block-group,
.wp-block-post.no-thumbnail > .wp-block-group { width: 100%; max-width: 100%; }
.wp-block-post:not(:has(.wp-block-post-featured-image)) .ictbyte-row-text,
.wp-block-post.no-thumbnail .ictbyte-row-text { flex: 1 1 100%; }
.wp-block-post.no-thumbnail .ictbyte-thumb { display: none; }

/* ==========================================================================
   4. MASTHEAD, JUMP BAR, FOOTER
   ========================================================================== */
.ictbyte-masthead { padding-block: 0.75rem 0; }
.ictbyte-topbar { font-family: var(--wp--preset--font-family--sans); font-size: 0.75rem; color: var(--wp--preset--color--ink-muted); border-bottom: 1px solid var(--wp--preset--color--border-hairline); padding-bottom: 0.5rem; }
.ictbyte-topbar p { margin: 0; }

.ictbyte-jumpbar-wrap {
	position: sticky;
	top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--ictbyte-nav-h));
	z-index: 20;
	background: var(--wp--preset--color--paper);
	border-bottom: 1px solid var(--wp--preset--color--border-hairline);
}
.ictbyte-jumpbar { overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.ictbyte-jumpbar::-webkit-scrollbar { display: none; }
.ictbyte-jumpbar ul { display: flex; gap: 1.5rem; list-style: none; margin: 0; padding: 0.7rem 0; white-space: nowrap; }
.ictbyte-jumpbar a { font: 700 0.6875rem/1 var(--wp--preset--font-family--sans); letter-spacing: 0.1em; text-transform: uppercase; text-decoration: none; }

.ictbyte-main > * + * { margin-block-start: 0; }
.ictbyte-footer { border-top: 3px double var(--wp--preset--color--ink); margin-top: 3rem; padding-block: 2rem; font-family: var(--wp--preset--font-family--sans); font-size: 0.875rem; }
.ictbyte-footer ul { list-style: none; padding: 0; margin: 0; }
.ictbyte-footer li { margin-bottom: 0.4rem; }
.ictbyte-copyright { font-size: 0.75rem; color: var(--wp--preset--color--ink-muted); margin: 0; }

/* ==========================================================================
   5. SECTIONS
   ========================================================================== */
.ictbyte-section { padding-block: 1.75rem; border-top: 1px solid var(--wp--preset--color--border-hairline); }
.ictbyte-section-head { align-items: baseline; border-bottom: 2px solid currentColor; padding-bottom: 0.5rem; margin-bottom: 1.25rem; }
.ictbyte-section-title a { text-decoration: none; }
.ictbyte-section-title a::before { content: ""; display: inline-block; width: 0.55em; height: 0.55em; background: var(--wp--preset--color--accent); margin-right: 0.5em; }
.ictbyte-view-all { margin: 0; font: 600 0.75rem var(--wp--preset--font-family--sans); }
.ictbyte-view-all a { text-decoration: none; color: var(--wp--preset--color--accent); }

/* ==========================================================================
   6. HERO — lead story (2/3) + sidebar list (1/3), 1px column rule
   ========================================================================== */
.ictbyte-hero.is-layout-grid { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 0; padding-top: 1.25rem; }
.ictbyte-hero-col { padding-inline: 1.5rem; }
.ictbyte-hero-col:first-child { padding-left: 0; border-right: 1px solid var(--wp--preset--color--border-hairline); }
.ictbyte-hero-col:last-child { padding-right: 0; }
.ictbyte-hero-col .ictbyte-col-label { color: var(--wp--preset--color--accent); border-bottom: 1px solid var(--wp--preset--color--ink); padding-bottom: 0.4rem; margin-bottom: 0.75rem; }
.ictbyte-hero-side .ictbyte-wire-label { margin-top: 1.5rem; }

.ictbyte-secondary .wp-block-post { padding-bottom: 0.9rem; margin-bottom: 0.9rem; border-bottom: 1px solid var(--wp--preset--color--border-hairline); }
.ictbyte-secondary .wp-block-post:last-child { border-bottom: 0; margin-bottom: 0; }
.ictbyte-secondary .ictbyte-thumb { margin: 0.6rem 0 0; }
.ictbyte-secondary .ictbyte-thumb img { max-height: 150px; }
/* NYT-style density: only the first side story carries an image */
.ictbyte-secondary .wp-block-post:not(:first-child) .ictbyte-thumb { display: none; }

.ictbyte-lede .ictbyte-thumb { margin: 0 0 0.9rem; }
.ictbyte-lede .ictbyte-kicker a { background: var(--wp--preset--color--accent); color: #fff; padding: 0.2em 0.65em; border-radius: 2px; }
.ictbyte-lede .wp-block-post-title { margin: 0.4rem 0 0.75rem; letter-spacing: -0.02em; line-height: 1.08; }
.ictbyte-lede .wp-block-post-excerpt__excerpt { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ictbyte-lede-byline { gap: 0.9rem; align-items: center; flex-wrap: wrap; padding-top: 0.5rem; border-top: 1px solid var(--wp--preset--color--border-hairline); }
.ictbyte-lede-byline .wp-block-post-author__avatar img { border-radius: 50%; }

.ictbyte-wire-item { gap: 0.75rem; align-items: baseline; flex-wrap: nowrap; padding: 0.65rem 0; border-bottom: 1px dotted var(--wp--preset--color--ink-muted); }
.ictbyte-wire-item .ictbyte-wire-time { flex: 0 0 4.2rem; font-variant-numeric: tabular-nums; font-weight: 600; color: var(--wp--preset--color--accent); }
.ictbyte-wire-item .wp-block-post-title { font-family: var(--wp--preset--font-family--sans); font-weight: 600; line-height: 1.35; margin: 0; }

@media (max-width: 900px) {
	.ictbyte-hero.is-layout-grid { grid-template-columns: 1fr; }
	.ictbyte-hero-col { padding-inline: 0 !important; }
	.ictbyte-hero-col:first-child { border-right: 0; padding-bottom: 1.25rem; border-bottom: 1px solid var(--wp--preset--color--border-hairline); margin-bottom: 1.25rem; }
}

/* ==========================================================================
   7. CATEGORY LAYOUTS
   ========================================================================== */
/* Responsive collapse for every grid-based post template */
@media (max-width: 900px) { .wp-block-post-template.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .wp-block-post-template.is-layout-grid { grid-template-columns: 1fr; } }

/* AI & ML — featured + stacked summaries */
.ictbyte-asym.is-layout-grid { grid-template-columns: 3fr 2fr; gap: 2rem; }
.ictbyte-q-stack .wp-block-post { padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid var(--wp--preset--color--border-hairline); }
.ictbyte-q-stack .wp-block-post:last-child { border-bottom: 0; }
@media (max-width: 781px) { .ictbyte-asym.is-layout-grid { grid-template-columns: 1fr; } }

/* Cybersecurity — high-contrast alert listing */
.ictbyte-section--alert { background: var(--wp--preset--color--ink); color: var(--wp--preset--color--paper); padding-inline: clamp(1rem, 3vw, 2rem); border-top: 0; }
.ictbyte-section--alert a,
.ictbyte-section--alert .wp-block-post-excerpt { color: inherit; }
.ictbyte-section--alert .ictbyte-meta { color: inherit; opacity: 0.75; }
.ictbyte-section--alert .ictbyte-view-all a { color: inherit; }
.ictbyte-alert-item { border-left: 4px solid var(--wp--preset--color--accent); padding: 0.75rem 1rem; background: rgb(128 128 128 / 0.12); margin-bottom: 0.75rem; }
.ictbyte-alert-tags { gap: 0.4rem; flex-wrap: wrap; }
.ictbyte-section--alert .ictbyte-kicker a { background: var(--wp--preset--color--accent); color: #fff; padding: 0.2em 0.6em; border-radius: 2px; }
.ictbyte-chip a { border: 1px solid currentColor; padding: 0.1em 0.5em; border-radius: 99px; font: 600 0.6875rem var(--wp--preset--font-family--sans); text-decoration: none; }
.ictbyte-chip { margin: 0; }

/* Hardware — horizontal split rows */
.ictbyte-row { gap: 1rem; align-items: flex-start; flex-wrap: nowrap; }
.ictbyte-row .ictbyte-thumb { flex: 0 0 34%; margin: 0; }
.ictbyte-row .ictbyte-row-text { flex: 1 1 0; min-width: 0; }
@media (max-width: 560px) { .ictbyte-row { flex-wrap: wrap; } .ictbyte-row .ictbyte-thumb { flex: 1 1 100%; } }

/* Software & Dev — monospaced metadata */
.ictbyte-mono .ictbyte-meta,
.ictbyte-mono .ictbyte-kicker,
.ictbyte-mono .ictbyte-byline { font-family: var(--wp--preset--font-family--mono); text-transform: none; letter-spacing: 0; font-size: 0.75rem; }
.ictbyte-dev-item { border: 1px solid var(--wp--preset--color--border-hairline); border-left: 3px solid var(--wp--preset--color--accent); padding: 1rem; background: var(--wp--preset--color--surface); }
.ictbyte-dev-meta { gap: 0.75rem; flex-wrap: wrap; margin-bottom: 0.4rem; }
.ictbyte-dev-meta p { margin: 0; }

/* Opinion — circular avatars, italic headlines */
.ictbyte-op-item { text-align: center; }
.ictbyte-op-item .wp-block-post-author { justify-content: center; flex-direction: column; align-items: center; gap: 0.5rem; }
.ictbyte-op-item .wp-block-post-author__avatar img { border-radius: 50%; border: 1px solid var(--wp--preset--color--border-hairline); }
.ictbyte-title--italic,
.ictbyte-title--italic a { font-style: italic; }

/* Policy — broadsheet briefing */
.ictbyte-brief { padding-top: 1rem; border-top: 3px solid var(--wp--preset--color--ink); }
.ictbyte-excerpt--long { font-size: 1.0625rem; line-height: 1.7; }
.ictbyte-brief-meta { gap: 0.75rem; align-items: center; flex-wrap: wrap; }

/* Enterprise — dense rows */
.ictbyte-dense { gap: 0.9rem; align-items: baseline; flex-wrap: nowrap; padding: 0.55rem 0; border-bottom: 1px solid var(--wp--preset--color--border-hairline); }
.ictbyte-dense-time { flex: 0 0 8.5rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ictbyte-badge { margin: 0; flex: 0 0 auto; }
.ictbyte-badge a { border: 1px solid var(--wp--preset--color--accent); color: var(--wp--preset--color--accent); padding: 0.1em 0.55em; border-radius: 99px; font: 700 0.625rem var(--wp--preset--font-family--sans); letter-spacing: 0.06em; text-transform: uppercase; text-decoration: none; }
.ictbyte-dense .wp-block-post-title { margin: 0; font-family: var(--wp--preset--font-family--sans); font-weight: 600; }
@media (max-width: 640px) { .ictbyte-dense { flex-wrap: wrap; } .ictbyte-dense-time { flex-basis: 100%; } }

/* Startups — 2x2 bento */
.ictbyte-bento-card { background: var(--wp--preset--color--surface); border: 1px solid var(--wp--preset--color--border-hairline); border-radius: 10px; padding: 1.25rem; height: 100%; box-sizing: border-box; }
.wp-block-post-template.ictbyte-bento > .wp-block-post { display: flex; }
.wp-block-post-template.ictbyte-bento > .wp-block-post > * { flex: 1; }

/* ==========================================================================
   8. BRAND (logo image or text wordmark)
   ========================================================================== */
:root { --ictbyte-nav-h: 3rem; }
.ictbyte-brand { margin: 0.9rem 0 0.6rem; text-align: center; line-height: 1; }
.ictbyte-brand a { text-decoration: none; display: inline-block; }
.ictbyte-wordmark { font-family: var(--wp--preset--font-family--display); font-weight: 800; letter-spacing: -0.025em; font-size: clamp(2.25rem, 6vw, 3.5rem); line-height: 1; }
.ictbyte-brand .ictbyte-logo { display: block; width: auto; height: auto; max-width: min(var(--ictbyte-logo-w, 320px), 80vw); margin-inline: auto; }
.ictbyte-logo--dark { display: none !important; }
/* Dark mode: swap to the dark logo when one was uploaded (OS setting, or the manual toggle) */
@media (prefers-color-scheme: dark) {
	html:root:not([data-theme="light"]) .ictbyte-logo--dark { display: block !important; }
	html:root:not([data-theme="light"]) .ictbyte-logo--light:has(+ .ictbyte-logo--dark) { display: none !important; }
}
html:root[data-theme="dark"] .ictbyte-logo--dark { display: block !important; }
html:root[data-theme="dark"] .ictbyte-logo--light:has(+ .ictbyte-logo--dark) { display: none !important; }
html:root[data-theme="light"] .ictbyte-logo--dark { display: none !important; }

/* ==========================================================================
   9. STICKY NAV BAR
   <header> becomes display:contents so the bar sticks to the whole page.
   ========================================================================== */
header.wp-block-template-part { display: contents; }
.ictbyte-navbar {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 50;
	background: var(--wp--preset--color--paper);
	border-top: 1px solid var(--wp--preset--color--ink);
	border-bottom: 3px double var(--wp--preset--color--ink);
	transition: box-shadow 0.2s ease;
}
html.ictbyte-stuck .ictbyte-navbar { box-shadow: 0 2px 10px rgb(0 0 0 / 0.08); border-top-color: transparent; }
.ictbyte-navbar-inner { min-height: var(--ictbyte-nav-h); gap: 1rem; }
.ictbyte-navbar-inner > .wp-block-navigation { flex: 1 1 auto; justify-content: center; }
.ictbyte-navbar .wp-block-navigation__container { gap: 0.25rem 1.4rem; }
.ictbyte-navbar .wp-block-navigation-item__content { text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.75rem; font-weight: 700; padding-block: 0.4rem; }
.ictbyte-navbar .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--accent); text-decoration: none; }
.ictbyte-compact-brand { flex: 0 0 auto; display: inline-flex; overflow: hidden; max-width: 0; opacity: 0; white-space: nowrap; transition: max-width 0.25s ease, opacity 0.2s ease; }
.ictbyte-compact-brand a { text-decoration: none; display: inline-flex; align-items: center; }
.ictbyte-compact-brand .ictbyte-wordmark { font-size: 1.35rem; }
.ictbyte-compact-brand .ictbyte-logo { height: 1.75rem; width: auto; max-width: 11rem; display: block; }
html.ictbyte-stuck .ictbyte-compact-brand { max-width: 14rem; opacity: 1; }
@media (max-width: 781px) {
	/* On phones keep the brand visible in the bar next to the menu button */
	.ictbyte-compact-brand { max-width: 14rem; opacity: 1; }
}
.ictbyte-tools { flex: 0 0 auto; gap: 0.25rem; }
.ictbyte-theme-toggle { all: unset; cursor: pointer; display: inline-flex; padding: 0.45rem; border-radius: 50%; color: var(--wp--preset--color--ink); }
.ictbyte-theme-toggle:hover { color: var(--wp--preset--color--accent); }
.ictbyte-theme-toggle:focus-visible { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 2px; }
.ictbyte-search .wp-block-search__button { background: none; border: 0; padding: 0.45rem; color: var(--wp--preset--color--ink); }
.ictbyte-search .wp-block-search__button:hover { color: var(--wp--preset--color--accent); }

/* ==========================================================================
   10. TYPOGRAPHY REFINEMENTS
   ========================================================================== */
h1, h2, h3, h4, .wp-block-post-title { text-wrap: balance; }
.wp-block-post-excerpt__excerpt { text-wrap: pretty; }
.ictbyte-title a { text-decoration: none; }
.ictbyte-title a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
.ictbyte-article .wp-block-post-title { font-size: clamp(2.25rem, 5vw, 3.25rem); letter-spacing: -0.02em; line-height: 1.08; }
.ictbyte-article .wp-block-post-excerpt { color: var(--wp--preset--color--ink-muted); font-style: italic; }
.ictbyte-article .wp-block-post-content { font-size: 1.1875rem; line-height: 1.72; }
.ictbyte-article .wp-block-post-content > p:first-of-type::first-letter { font-family: var(--wp--preset--font-family--display); float: left; font-size: 4.1em; line-height: 0.82; padding: 0.06em 0.1em 0 0; font-weight: 700; }
.ictbyte-article .wp-block-post-content h2,
.ictbyte-article .wp-block-post-content h3 { margin-top: 2.2rem; }
.ictbyte-article .wp-block-post-content blockquote { border-left: 3px solid var(--wp--preset--color--accent); padding-left: 1.25rem; font-style: italic; font-size: 1.3rem; }
.ictbyte-article .wp-block-post-content img { height: auto; }
.ictbyte-article figcaption { font-family: var(--wp--preset--font-family--sans); font-size: 0.75rem; color: var(--wp--preset--color--ink-muted); }

/* ==========================================================================
   11. ARTICLE: progress, share, sidebar, related
   ========================================================================== */
.ictbyte-progress { position: fixed; top: var(--wp-admin--admin-bar--height, 0px); left: 0; right: 0; height: 3px; z-index: 60; pointer-events: none; }
.ictbyte-progress span { display: block; height: 100%; background: var(--wp--preset--color--accent); transform: scaleX(0); transform-origin: 0 50%; will-change: transform; }

.ictbyte-updated { margin: 0; }
.ictbyte-share { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.6rem; padding-block: 0.6rem; margin-block: 0.5rem 1rem; border-block: 1px solid var(--wp--preset--color--border-hairline); font-family: var(--wp--preset--font-family--sans); }
.ictbyte-share-label { font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; margin-right: 0.25rem; }
.ictbyte-share a,
.ictbyte-share button { font: 600 0.75rem var(--wp--preset--font-family--sans); color: var(--wp--preset--color--ink); text-decoration: none; background: none; border: 1px solid var(--wp--preset--color--border-hairline); border-radius: 99px; padding: 0.3em 0.85em; cursor: pointer; }
.ictbyte-share a:hover,
.ictbyte-share button:hover { border-color: var(--wp--preset--color--accent); color: var(--wp--preset--color--accent); }

.ictbyte-article-cols { gap: 2.5rem; margin-top: 1.5rem; }
.ictbyte-sidebar { position: sticky; top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--ictbyte-nav-h) + 1rem); align-self: flex-start; }
.ictbyte-sidebar .ictbyte-col-label { color: var(--wp--preset--color--accent); border-bottom: 1px solid var(--wp--preset--color--ink); padding-bottom: 0.4rem; margin-bottom: 0.5rem; }
.ictbyte-mostread { counter-reset: mr; }
.ictbyte-mostread .wp-block-post { counter-increment: mr; padding: 0.7rem 0; border-bottom: 1px solid var(--wp--preset--color--border-hairline); }
.ictbyte-mostread-item { gap: 0.75rem; align-items: flex-start; flex-wrap: nowrap; }
.ictbyte-mostread-item::before { content: counter(mr); font: 800 1.6rem/1 var(--wp--preset--font-family--display); color: var(--wp--preset--color--accent); flex: 0 0 1.4rem; }
.ictbyte-mostread-item .wp-block-post-title { margin: 0; font-weight: 600; line-height: 1.3; }
@media (max-width: 781px) { .ictbyte-sidebar { position: static; } }

.ictbyte-related { margin-top: 2.5rem; padding-top: 1.25rem; border-top: 3px solid var(--wp--preset--color--ink); }
.ictbyte-related .ictbyte-section-title { margin-bottom: 1rem; }

/* ==========================================================================
   12. AD SLOTS (only rendered when code is saved; space reserved to avoid CLS)
   ========================================================================== */
.ictbyte-ad { margin: 1.25rem auto; text-align: center; max-width: 100%; }
.ictbyte-ad-label { display: block; font: 600 0.625rem var(--wp--preset--font-family--sans); letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--ink-muted); margin-bottom: 0.3rem; }
.ictbyte-ad-slot { min-height: var(--ictbyte-ad-h, 250px); display: flex; justify-content: center; align-items: center; overflow: hidden; }
.ictbyte-ad--header,
.ictbyte-ad--home,
.ictbyte-ad--home_mid { max-width: var(--wp--style--global--wide-size, 1340px); padding-inline: 1rem; }
.ictbyte-ad--header { margin-block: 0.75rem; }
.ictbyte-ad--inline { clear: both; margin-block: 2rem; padding-block: 0.75rem; border-block: 1px solid var(--wp--preset--color--border-hairline); }
@media (max-width: 781px) { .ictbyte-ad--header .ictbyte-ad-slot { min-height: 60px; } }
@media print { .ictbyte-ad, .ictbyte-progress, .ictbyte-navbar, .ictbyte-share { display: none !important; } }

/* ==========================================================================
   13. RELATED CAROUSEL (mid-article) + INFINITE NEXT STORY
   ========================================================================== */
.ictbyte-carousel { margin: 2rem 0; padding: 1rem 0 1.25rem; border-block: 3px solid var(--wp--preset--color--ink); font-family: var(--wp--preset--font-family--sans); font-size: 1rem; line-height: 1.4; clear: both; }
.ictbyte-car-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.75rem; }
.ictbyte-car-h { font: 700 0.6875rem var(--wp--preset--font-family--sans); letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--accent); }
.ictbyte-car-btns { display: flex; gap: 0.35rem; }
.ictbyte-car-btns button { width: 2rem; height: 2rem; border-radius: 50%; border: 1px solid var(--wp--preset--color--border-hairline); background: var(--wp--preset--color--surface); color: var(--wp--preset--color--ink); font-size: 1.2rem; line-height: 1; cursor: pointer; }
.ictbyte-car-btns button:hover { border-color: var(--wp--preset--color--accent); color: var(--wp--preset--color--accent); }
.ictbyte-car-track { display: flex; gap: 1rem; list-style: none; margin: 0; padding: 0 0 0.5rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.ictbyte-car-card { flex: 0 0 min(15rem, 72%); scroll-snap-align: start; margin: 0; }
.ictbyte-car-card a { display: block; text-decoration: none; color: inherit; }
.ictbyte-car-thumb { display: block; aspect-ratio: 3 / 2; overflow: hidden; margin-bottom: 0.5rem; background: var(--wp--preset--color--border-hairline); }
.ictbyte-car-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ictbyte-car-ttl { display: block; font: 700 1rem/1.3 var(--wp--preset--font-family--display); margin-bottom: 0.25rem; }
.ictbyte-car-card a:hover .ictbyte-car-ttl { text-decoration: underline; text-underline-offset: 0.18em; }
@media (prefers-reduced-motion: reduce) { .ictbyte-car-track { scroll-behavior: auto; } }

.ictbyte-next-divider { display: flex; align-items: center; gap: 1rem; margin: 3.5rem 0 2rem; font: 700 0.6875rem var(--wp--preset--font-family--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--accent); }
.ictbyte-next-divider::before,
.ictbyte-next-divider::after { content: ""; flex: 1; border-top: 3px double var(--wp--preset--color--ink); }
.ictbyte-article--loaded .wp-block-post-navigation-link,
.ictbyte-article--loaded .wp-block-separator { display: none; }
.ictbyte-infinite-status { text-align: center; font: 600 0.8125rem var(--wp--preset--font-family--sans); color: var(--wp--preset--color--ink-muted); margin: 2rem 0; }
.ictbyte-infinite-sentinel { height: 1px; }
