/* =============================================================================
   Anatech single blog post restyle
   Design system: "Anatech Blueprint" (captured from the live site).
   Everything is scoped under .anatech-post so no other template is affected.
   ============================================================================= */

.anatech-post {
	--ap-bg: #FFFFFF;
	--ap-surface: #F5F5F5;
	--ap-ink: #000000;
	--ap-accent: #1145BB;
	--ap-accent-hover: #ED4B00;
	--ap-muted: #555555;
	--ap-border: #DBDBDB;
	--ap-r-sm: 12px;
	--ap-r-md: 24px;
	--ap-r-pill: 56px;
	--ap-measure: min( 760px, 100% );
	--ap-sm: 12px;
	--ap-md: 20px;
	--ap-lg: 46px;
	--ap-xl: 64px;
	--ap-anchor-offset: 110px;
}

.anatech-post {
	padding: 0 0 var(--ap-lg) 0;
}

/* Visible only to screen readers, for accessible labels. */
.anatech-post .ap-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Parent theme kills all focus rings; restore a visible one for keyboard users. */
.anatech-post a:focus-visible,
.anatech-post button:focus-visible {
	outline: 2px solid var(--ap-accent) !important;
	outline-offset: 3px;
	border-radius: 4px;
}

/* -----------------------------------------------------------------------------
   1. Hero
   -------------------------------------------------------------------------- */

.anatech-post .blog-single-hero {
	padding: var(--ap-lg) 0 0 0;
}

.anatech-post .blog-single-hero .container {
	align-items: center;
	gap: 48px;
	flex-wrap: nowrap;
}

.anatech-post .blog-single-hero .blog-single-hero-text {
	width: auto;
	flex: 1 1 46%;
	min-width: 0;
	padding-top: 0;
}

.anatech-post .blog-single-hero .blog-single-hero-img {
	width: auto;
	flex: 1 1 54%;
	min-width: 0;
	border-radius: var(--ap-r-md);
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: var(--ap-surface);
}

.anatech-post .blog-single-hero .blog-single-hero-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Hero has no image: the text column takes the full measure instead of leaving a hole. */
.anatech-post .blog-single-hero.is-textonly .blog-single-hero-text {
	flex: 1 1 100%;
	max-width: 860px;
}

/* Eyebrow: category plus reading time, one line, one separator dot. */
.anatech-post .ap-eyebrow {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0 0 18px 0;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ap-muted);
	line-height: 1.2;
}

.anatech-post .ap-eyebrow a {
	color: var(--ap-accent);
}

.anatech-post .ap-eyebrow a:hover,
.anatech-post .ap-eyebrow a:focus {
	color: var(--ap-accent-hover);
}

.anatech-post .ap-eyebrow .ap-dot {
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--ap-accent);
	flex: 0 0 4px;
}

/* The parent theme wrapped the H1 in a white card on a white ground and ran the
   reading-time label inline with the headline. Both are removed here. */
.anatech-post .blog-single-hero .blog-single-hero-text .title {
	display: block;
	width: auto;
	max-width: none;
	padding: 0;
	background: transparent;
	border-radius: 0;
}

.anatech-post .blog-single-hero .blog-single-hero-text .title h1 {
	display: block;
	margin: 0;
	font-size: clamp(1.85rem, 2.9vw, 2.75rem);
	line-height: 1.1;
	letter-spacing: -0.02em;
	font-weight: 500;
	color: var(--ap-ink);
	text-wrap: balance;
}

/* Author card */
.anatech-post .blog-single-hero .author-info {
	position: relative;
	display: flex;
	align-items: center;
	gap: 16px;
	padding-left: 0;
	margin-top: 32px;
}

.anatech-post .blog-single-hero .author-info .author-img {
	position: static;
	flex: 0 0 60px;
	width: 60px;
	height: 60px;
	border-radius: var(--ap-r-sm);
	overflow: hidden;
	background: var(--ap-surface);
}

.anatech-post .blog-single-hero .author-info .author-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.anatech-post .blog-single-hero .author-info .author-name p {
	margin: 0;
	font-size: 13px;
	line-height: 1.3;
	color: var(--ap-muted);
}

.anatech-post .blog-single-hero .author-info .author-name h4 {
	margin: 2px 0 0 0;
	font-size: 20px;
	line-height: 1.2;
	font-weight: 500;
	color: var(--ap-ink);
}

.anatech-post .blog-single-hero .author-info .author-name h6 {
	margin: 3px 0 0 0;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ap-muted);
}

/* -----------------------------------------------------------------------------
   2. Body layout, meta and share row
   -------------------------------------------------------------------------- */

.anatech-post .blog-single-content {
	padding: var(--ap-xl) 0 0 0;
}

.anatech-post .blog-single-content-right {
	margin-top: 0;
	font-size: clamp(1rem, 1.1vw, 1.1875rem);
	line-height: 1.65;
	color: var(--ap-ink);
}

.anatech-post .single-content-social {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	margin: 0 0 34px 0;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--ap-border);
}

/* Was a blue pill styled like a button but not clickable. Now plain meta text. */
.anatech-post .single-content-social .ap-published {
	margin: 0;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ap-muted);
	line-height: 1.3;
}

.anatech-post .single-content-social ul.social-contact {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
}

.anatech-post .single-content-social ul.social-contact li {
	margin: 0;
	padding: 0;
}

.anatech-post .single-content-social ul.social-contact li a {
	width: 40px;
	height: 40px;
	padding: 0;
	border-radius: 50%;
	background: var(--ap-surface);
	border: 1px solid var(--ap-border);
	color: var(--ap-ink);
	font-size: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.anatech-post .single-content-social ul.social-contact li a:hover,
.anatech-post .single-content-social ul.social-contact li a:focus,
.anatech-post .single-content-social ul.social-contact li a:active {
	background: var(--ap-accent);
	border-color: var(--ap-accent);
	color: #FFFFFF;
}

.anatech-post .single-content-social ul.social-contact li a:hover i,
.anatech-post .single-content-social ul.social-contact li a:focus i,
.anatech-post .single-content-social ul.social-contact li a:active i {
	color: #FFFFFF;
}

/* -----------------------------------------------------------------------------
   3. Table of contents sidebar and reading progress
   -------------------------------------------------------------------------- */

.anatech-post .blog-single-content .sidebar {
	position: sticky;
	top: 24px;
}

.anatech-post .blog-single-intro {
	background: var(--ap-surface);
	border-radius: var(--ap-r-sm);
	padding: 22px 20px;
	max-height: 70vh;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: var(--ap-border) transparent;
}

/* Also a <button> on the actual markup so it can toggle the list on mobile;
   button chrome is reset so it reads the same as the old static title bar. */
.anatech-post .blog-single-intro .title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	margin: 0 0 14px 0;
	padding: 0 0 14px 0;
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--ap-border);
	font: inherit;
	text-align: left;
	color: inherit;
}

.anatech-post .blog-single-intro .title h6 {
	margin: 0;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ap-muted);
}

/* Chevron is only shown (and functional) on mobile; see the 991px breakpoint. */
.anatech-post .blog-single-intro .toc-toggle-icon {
	display: none;
	flex: 0 0 auto;
	width: 20px;
	height: 20px;
	align-items: center;
	justify-content: center;
	transition: transform 0.25s ease;
}

.anatech-post .blog-single-intro ul {
	margin: 0;
}

.anatech-post .blog-single-intro ul li {
	margin: 0;
	padding: 0;
	line-height: 1.4;
}

.anatech-post .blog-single-intro ul li::before {
	display: none;
}

.anatech-post .blog-single-content .sidebar ul li a {
	display: block;
	padding: 9px 0 9px 14px;
	border-left: 2px solid transparent;
	font-size: 15px;
	line-height: 1.4;
	color: var(--ap-muted);
	transition: color 0.2s ease, border-color 0.2s ease;
}

.anatech-post .blog-single-content .sidebar ul li a:hover,
.anatech-post .blog-single-content .sidebar ul li a:focus {
	color: var(--ap-ink);
	border-left-color: var(--ap-border);
}

.anatech-post .blog-single-content .sidebar ul li a.is-active {
	color: var(--ap-accent);
	border-left-color: var(--ap-accent);
}

.anatech-post .progress-main {
	margin-top: 22px;
	padding: 0;
}

.anatech-post .progress-main .progress {
	height: 4px;
	background: var(--ap-border);
	border-radius: 4px;
	overflow: hidden;
}

.anatech-post .progress-main .progress-bar {
	background: var(--ap-accent);
	border-radius: 4px;
}

.anatech-post .progress-main .read-time {
	margin-top: 12px;
	text-align: left;
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ap-muted);
}

/* Mobile reading bar sits above the article wrapper, so it is scoped by body class. */
body.single-post .mobile-progress-bar .progress {
	height: 4px;
	background: #DBDBDB;
}

body.single-post .mobile-progress-bar .progress-bar {
	background: #1145BB;
}

/* -----------------------------------------------------------------------------
   4. Article typography
   -------------------------------------------------------------------------- */

/* Measured reading column: text is capped, media and tables may run wider. */
.anatech-post .blog-single-content-right > p,
.anatech-post .blog-single-content-right > ul,
.anatech-post .blog-single-content-right > ol,
.anatech-post .blog-single-content-right > h2,
.anatech-post .blog-single-content-right > h3,
.anatech-post .blog-single-content-right > h4,
.anatech-post .blog-single-content-right > h5,
.anatech-post .blog-single-content-right > h6,
.anatech-post .blog-single-content-right > blockquote,
.anatech-post .blog-single-content-right > dl {
	max-width: var(--ap-measure);
}

.anatech-post .blog-single-content-right > p {
	margin: 0 0 1.15em 0;
}

/* Lead paragraph */
.anatech-post .blog-single-content-right > p:first-of-type {
	font-size: 1.15em;
	line-height: 1.5;
}

.anatech-post .blog-single-content-right h1,
.anatech-post .blog-single-content-right h2,
.anatech-post .blog-single-content-right h3,
.anatech-post .blog-single-content-right h4,
.anatech-post .blog-single-content-right h5,
.anatech-post .blog-single-content-right h6 {
	color: var(--ap-ink);
	font-weight: 500;
	scroll-margin-top: var(--ap-anchor-offset);
}

/* Section rhythm on long articles comes from spacing alone, not a rule line. */
.anatech-post .blog-single-content-right h2 {
	font-size: clamp(1.5rem, 2vw, 2rem);
	line-height: 1.18;
	letter-spacing: -0.01em;
	margin: 1.4em 0 0.55em 0;
}

.anatech-post .blog-single-content-right h2:first-child {
	margin-top: 0;
}

.anatech-post .blog-single-content-right h3 {
	font-size: clamp(1.25rem, 1.5vw, 1.5rem);
	line-height: 1.25;
	margin: 1.8em 0 0.5em 0;
}

.anatech-post .blog-single-content-right h4 {
	font-size: clamp(1.0625rem, 1.2vw, 1.1875rem);
	line-height: 1.35;
	margin: 1.7em 0 0.45em 0;
}

.anatech-post .blog-single-content-right h5,
.anatech-post .blog-single-content-right h6 {
	font-size: 1rem;
	line-height: 1.4;
	margin: 1.6em 0 0.4em 0;
}

.anatech-post .blog-single-content-right strong,
.anatech-post .blog-single-content-right b {
	font-weight: 700;
}

/* Body links are underlined so they are distinguishable without colour alone. */
.anatech-post .blog-single-content-right a {
	color: var(--ap-accent);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.anatech-post .blog-single-content-right a:hover,
.anatech-post .blog-single-content-right a:focus {
	color: var(--ap-accent-hover);
}

/* Lists */
.anatech-post .blog-single-content-right ul,
.anatech-post .blog-single-content-right ol {
	margin: 0 0 1.3em 0;
}

.anatech-post .blog-single-content-right ul li,
.anatech-post .blog-single-content-right ol li {
	margin: 0 0 0.6em 0;
	line-height: 1.6;
}

.anatech-post .blog-single-content-right ul li {
	padding-left: 26px;
}

.anatech-post .blog-single-content-right ul li::before {
	width: 6px;
	height: 6px;
	top: 0.62em;
	background: var(--ap-accent);
}

.anatech-post .blog-single-content-right ol li::before {
	color: var(--ap-accent);
	font-weight: 500;
}

.anatech-post .blog-single-content-right li > ul,
.anatech-post .blog-single-content-right li > ol {
	margin: 0.6em 0 0.2em 0;
}

/* Blockquote: accent rule only, no decorative quote glyphs. */
.anatech-post .blog-single-content-right blockquote {
	margin: 2em 0;
	padding: 2px 0 2px 28px;
	border-left: 3px solid var(--ap-accent);
	font-style: italic;
	font-size: 1.1em;
	line-height: 1.45;
	color: var(--ap-ink);
}

.anatech-post .blog-single-content-right blockquote p::before,
.anatech-post .blog-single-content-right blockquote p::after {
	content: none;
	padding: 0;
}

/* Media */
.anatech-post .blog-single-content-right img {
	height: auto;
	border-radius: var(--ap-r-sm);
}

.anatech-post .blog-single-content-right figure {
	margin: 2.2em 0;
	max-width: 100%;
}

.anatech-post .blog-single-content-right figcaption,
.anatech-post .blog-single-content-right .wp-caption-text {
	margin-top: 10px;
	font-size: 0.8em;
	line-height: 1.5;
	color: var(--ap-muted);
}

.anatech-post .blog-single-content-right .aligncenter {
	margin: 2.2em auto;
	border-radius: var(--ap-r-sm);
}

/* Tables: readable header, hairline rows, horizontal scroll on small screens. */
.anatech-post .blog-single-content-right .table-auto,
.anatech-post .blog-single-content-right .scrollable-table {
	margin: 2.2em 0;
	overflow-x: auto;
	border: 1px solid var(--ap-border);
	border-radius: var(--ap-r-sm);
	-webkit-overflow-scrolling: touch;
}

.anatech-post .blog-single-content-right table {
	width: 100%;
	margin: 0;
	border-collapse: collapse;
	font-size: 0.85em;
}

.anatech-post .blog-single-content-right table tr th {
	padding: 14px 16px;
	border: 0;
	border-right: 1px solid rgba(255, 255, 255, 0.2);
	background: var(--ap-accent);
	color: #FFFFFF;
	font-size: 1em;
	font-weight: 500;
	text-align: left;
	line-height: 1.35;
	white-space: nowrap;
}

.anatech-post .blog-single-content-right table tr th:last-child {
	border-right: 0;
}

.anatech-post .blog-single-content-right table tr td {
	padding: 12px 16px;
	border: 0;
	border-top: 1px solid var(--ap-border);
	font-size: 1em;
	line-height: 1.55;
	vertical-align: top;
}

.anatech-post .blog-single-content-right table tbody tr:nth-child(even) {
	background: var(--ap-surface);
}

/* -----------------------------------------------------------------------------
   5. FAQ accordion inside the article
   -------------------------------------------------------------------------- */

.anatech-post .blog-single-content-right .faq-section {
	margin: var(--ap-xl) 0 0 0;
	padding: 0;
	background: transparent;
	border-radius: 0;
	max-width: var(--ap-measure);
}

.anatech-post .blog-single-content-right .faq-section .container {
	max-width: none;
	width: 100%;
	padding: 0;
	margin: 0;
}

.anatech-post .blog-single-content-right .faq-section .section-title {
	margin-bottom: 18px;
}

.anatech-post .blog-single-content-right .faq-section .section-title h2 {
	margin: 0;
	padding-top: 0;
	border-top: 0;
	font-size: clamp(1.5rem, 2vw, 2rem);
	line-height: 1.18;
	letter-spacing: -0.01em;
}

.anatech-post .faq-section .accordion-item {
	border: 0;
	border-top: 1px solid var(--ap-border);
	border-radius: 0;
	background: transparent;
}

.anatech-post .faq-section .accordion-item:first-child {
	border-top: 1px solid var(--ap-border) !important;
}

.anatech-post .faq-section .accordion-item:last-child {
	border-bottom: 1px solid var(--ap-border);
}

.anatech-post .faq-section .accordion-header {
	position: relative;
	margin: 0;
}

.anatech-post .faq-section .accordion-button {
	position: relative;
	display: block;
	width: 100%;
	padding: 20px 52px 20px 0;
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	font-size: 1.0625rem;
	font-weight: 500;
	line-height: 1.4;
	text-align: left;
	color: var(--ap-ink);
}

.anatech-post .faq-section .accordion-button:not(.collapsed) {
	color: var(--ap-accent);
	border-bottom: 0;
}

.anatech-post .faq-section .accordion-button::after {
	display: none;
}

.anatech-post .faq-section .accordion-button .ap-faq-toggle {
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--ap-surface);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.3s ease, background-color 0.2s ease;
}

.anatech-post .faq-section .accordion-button .ap-faq-toggle svg path {
	stroke: var(--ap-accent);
	transition: stroke 0.2s ease;
}

.anatech-post .faq-section .accordion-button:not(.collapsed) .ap-faq-toggle {
	background: var(--ap-accent);
	transform: translateY(-50%) rotate(180deg);
}

.anatech-post .faq-section .accordion-button:not(.collapsed) .ap-faq-toggle svg path {
	stroke: #FFFFFF;
}

.anatech-post .blog-single-content-right .faq-section .accordion-body {
	padding: 0 52px 24px 0;
	font-size: 1rem;
	line-height: 1.65;
	color: var(--ap-ink);
}

.anatech-post .faq-section .accordion-body p:last-child {
	margin-bottom: 0;
}

/* -----------------------------------------------------------------------------
   6. Closing call to action
   -------------------------------------------------------------------------- */

.anatech-post .have-project-section {
	margin-top: var(--ap-xl);
	padding: var(--ap-lg) 0;
	background: var(--ap-surface);
}

.anatech-post .have-project-section .left-block h2 {
	margin: 0 0 14px 0;
	font-size: clamp(1.5rem, 2.2vw, 2.125rem);
	line-height: 1.15;
	letter-spacing: -0.01em;
}

.anatech-post .have-project-section .left-block > p {
	margin: 0;
	max-width: 34em;
	font-size: 1rem;
	line-height: 1.6;
	color: var(--ap-muted);
}

.anatech-post .have-project-section .left-block .founder-block {
	margin-top: 26px;
	border-radius: var(--ap-r-sm);
}

.anatech-post .have-project-section .founder-block h4 {
	font-size: 18px;
	line-height: 1.2;
}

.anatech-post .have-project-section .founder-block p {
	font-size: 13px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ap-muted);
}

.anatech-post .have-project-section .inquiry-form {
	border-radius: var(--ap-r-md);
}

/* -----------------------------------------------------------------------------
   7. Related posts
   -------------------------------------------------------------------------- */

.anatech-post .related-blog-section {
	padding: var(--ap-xl) 0 var(--ap-md) 0;
}

.anatech-post .related-blog-section .section-title {
	margin-bottom: 0;
}

.anatech-post .related-blog-section .section-title p {
	margin: 0 0 10px 0;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1.2;
	color: var(--ap-muted);
}

.anatech-post .related-blog-section .section-title h2 {
	margin: 0;
	max-width: 15em;
	font-size: clamp(1.5rem, 2vw, 2rem);
	line-height: 1.18;
	letter-spacing: -0.01em;
	font-weight: 500;
}

.anatech-post .related-blog-section .blog-block .blog-img {
	border-radius: var(--ap-r-sm);
	overflow: hidden;
	aspect-ratio: 16 / 10;
	background: var(--ap-surface);
}

.anatech-post .related-blog-section .blog-block .blog-img a {
	display: block;
	height: 100%;
}

.anatech-post .related-blog-section .blog-block .blog-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.45s ease;
}

.anatech-post .related-blog-section .blog-block:hover .blog-img img {
	transform: scale(1.04);
}

.anatech-post .related-blog-section .blog-block .read-time {
	margin: 14px 0 6px 0;
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ap-muted);
	line-height: 1.2;
}

.anatech-post .related-blog-section .blog-block h3 {
	margin: 0;
	font-size: 1.0625rem;
	line-height: 1.35;
	font-weight: 500;
}

.anatech-post .related-blog-section .blog-block h3 a {
	color: var(--ap-ink);
}

.anatech-post .related-blog-section .blog-block h3 a:hover,
.anatech-post .related-blog-section .blog-block h3 a:focus {
	color: var(--ap-accent);
}

.anatech-post .related-blog-section .btn-block {
	padding-top: 22px;
}

.anatech-post .custom-slider-nav .custom-next-btn,
.anatech-post .custom-slider-nav .custom-prev-btn {
	width: 48px;
	height: 48px;
	background: var(--ap-surface);
	border: 1px solid var(--ap-border);
}

.anatech-post .custom-slider-nav .custom-next-btn:hover,
.anatech-post .custom-slider-nav .custom-prev-btn:hover,
.anatech-post .custom-slider-nav .custom-next-btn:focus,
.anatech-post .custom-slider-nav .custom-prev-btn:focus {
	background: var(--ap-accent);
	border-color: var(--ap-accent);
}

.anatech-post .custom-slider-nav .custom-next-btn:hover img,
.anatech-post .custom-slider-nav .custom-prev-btn:hover img,
.anatech-post .custom-slider-nav .custom-next-btn:focus img,
.anatech-post .custom-slider-nav .custom-prev-btn:focus img {
	filter: brightness(0) invert(1);
}

/* -----------------------------------------------------------------------------
   8. Responsive
   -------------------------------------------------------------------------- */

@media screen and (max-width: 1199px) {
	.anatech-post {
		--ap-measure: min( 680px, 100% );
		--ap-xl: 52px;
	}

	.anatech-post .blog-single-hero .container {
		gap: 32px;
	}

	.anatech-post .blog-single-hero .author-info .author-img {
		flex: 0 0 52px;
		width: 52px;
		height: 52px;
	}
}

@media screen and (max-width: 991px) {
	.anatech-post {
		--ap-measure: 100%;
		--ap-xl: 46px;
		--ap-anchor-offset: 90px;
	}

	.anatech-post .blog-single-hero .container {
		flex-wrap: wrap;
		flex-direction: column-reverse;
		gap: 26px;
	}

	.anatech-post .blog-single-hero .blog-single-hero-text,
	.anatech-post .blog-single-hero .blog-single-hero-img {
		flex: 1 1 100%;
		width: 100%;
	}

	.anatech-post .blog-single-hero .blog-single-hero-img {
		aspect-ratio: 16 / 9;
	}

	.anatech-post .blog-single-content .sidebar {
		position: static;
		top: auto;
		margin-bottom: 32px;
	}

	.anatech-post .blog-single-intro {
		max-height: none;
	}

	/* Collapsed by default on mobile: a long heading list otherwise pushes the
	   whole article below the fold before the reader sees any content. */
	.anatech-post .blog-single-intro .title {
		cursor: pointer;
	}

	/* While collapsed, the box should read as a single tight pill: drop the
	   divider line and its spacing that only make sense once the list is open. */
	.anatech-post .blog-single-intro:not(.is-expanded) .title {
		margin-bottom: 0;
		padding-bottom: 0;
		border-bottom: 0;
	}

	/* Reading-time text is redundant with the progress bar on mobile and takes
	   up space in the already-tight collapsed sidebar. */
	.anatech-post .progress-main .read-time {
		display: none;
	}

	/* Push "Published + share icons" after the full article body (including the
	   FAQ section) on mobile, without touching the source/DOM order. */
	.anatech-post .blog-single-content-right {
		display: flex;
		flex-direction: column;
	}

	.anatech-post .single-content-social {
		order: 999;
		margin: 26px 0 0 0;
		padding-bottom: 0;
		border-bottom: 0;
	}

	.anatech-post .blog-single-intro .toc-toggle-icon {
		display: flex;
	}

	.anatech-post .blog-single-intro ul {
		display: none;
	}

	.anatech-post .blog-single-intro.is-expanded ul {
		display: block;
	}

	.anatech-post .blog-single-intro.is-expanded .toc-toggle-icon {
		transform: rotate(180deg);
	}

	.anatech-post .have-project-section .left-block {
		padding-right: 0;
		margin-bottom: 26px;
	}
}

@media screen and (max-width: 767px) {
	.anatech-post .blog-single-hero {
		padding-top: 26px;
	}

	.anatech-post .blog-single-content {
		padding-top: 40px;
	}

	.anatech-post .blog-single-content-right {
		margin-top: 0;
	}

	.anatech-post .single-content-social {
		margin-bottom: 26px;
	}

	.anatech-post .blog-single-content-right table tr th,
	.anatech-post .blog-single-content-right table tr td {
		padding: 10px 12px;
	}

	.anatech-post .faq-section .accordion-button {
		padding-right: 44px;
		font-size: 1rem;
	}

	.anatech-post .blog-single-content-right .faq-section .accordion-body {
		padding-right: 0;
	}
}

/* -----------------------------------------------------------------------------
   9. Reduced motion
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.anatech-post .related-blog-section .blog-block .blog-img img,
	.anatech-post .faq-section .accordion-button .ap-faq-toggle,
	.anatech-post .blog-single-content .sidebar ul li a {
		transition: none !important;
	}

	.anatech-post .related-blog-section .blog-block:hover .blog-img img {
		transform: none;
	}
}

/* -----------------------------------------------------------------------------
   10. Copy-link control (a real button, styled like the share links)
   -------------------------------------------------------------------------- */

.anatech-post .single-content-social ul.social-contact li button.copy-link {
	width: 40px;
	height: 40px;
	padding: 0;
	border-radius: 50%;
	background: var(--ap-surface);
	border: 1px solid var(--ap-border);
	color: var(--ap-ink);
	font-size: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.anatech-post .single-content-social ul.social-contact li button.copy-link:hover,
.anatech-post .single-content-social ul.social-contact li button.copy-link:focus,
.anatech-post .single-content-social ul.social-contact li button.copy-link:active {
	background: var(--ap-accent);
	border-color: var(--ap-accent);
	color: #FFFFFF;
}

.anatech-post .single-content-social ul.social-contact li button.copy-link:hover i,
.anatech-post .single-content-social ul.social-contact li button.copy-link:focus i,
.anatech-post .single-content-social ul.social-contact li button.copy-link:active i {
	color: #FFFFFF;
}

/* -----------------------------------------------------------------------------
   11. Related posts: slider controls and card meta
   -------------------------------------------------------------------------- */

/* The parent theme centres the arrows and leaves no gap, so they collide with
   the button above. Align them to the section's left edge and give them air. */
.anatech-post .related-blog-section .related-blog-nav {
	justify-content: flex-start;
	margin-top: 36px;
	width: auto;
}

.anatech-post .related-blog-section .custom-slider-nav .custom-next-btn {
	margin-left: 14px;
}

/* Drop the stray decorative dot before the card reading time. */
.anatech-post .related-blog-section .blog-block .read-time {
	padding-left: 0;
}

.anatech-post .related-blog-section .blog-block .read-time::before {
	display: none;
	content: none;
}

/* -----------------------------------------------------------------------------
   12. Copy-link feedback (replaces a blocking JavaScript alert)
   -------------------------------------------------------------------------- */

.anatech-post .single-content-social ul.social-contact li :is( a, button ).copy-link {
	position: relative;
}

.anatech-post .single-content-social ul.social-contact li :is( a, button ).copy-link.is-copied {
	background: var(--ap-accent);
	border-color: var(--ap-accent);
	color: #FFFFFF;
}

.anatech-post .single-content-social ul.social-contact li :is( a, button ).copy-link.is-copied i {
	color: #FFFFFF;
}

.anatech-post .single-content-social ul.social-contact li :is( a, button ).copy-link.is-copied::after {
	content: "Copied";
	position: absolute;
	bottom: calc(100% + 8px);
	right: 0;
	padding: 5px 10px;
	border-radius: 6px;
	background: var(--ap-ink);
	color: #FFFFFF;
	font-family: "Parkinsans", sans-serif;
	font-size: 11px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
	line-height: 1.2;
}