/* ==========================================================================
   SINGLE POST LAYOUT & STYLING
   ========================================================================== */

/* Typography */
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Karla:wght@400;500;600;700&family=Urbanist:wght@500;600;700&display=swap');

:root {
	--font-lora: 'Lora', serif;
	--font-karla: 'Karla', sans-serif;
	--font-urbanist: 'Urbanist', sans-serif;
	--color-black: #000000;
	--color-white: #FFFFFF;
	--color-accent-yellow: #FDAC21;
	--color-accent-orange: #F49F0D;
	--color-bg-light: #F0F0F0;
	--color-text-dark: #303030;
	--color-border-grey: #DDDDDD;
	--color-faq-dark: #1B1139;
	--color-faq-text: #3F3F3F;
	--color-faq-bg-open: #EDF8FF;
	--color-hover-accent: #0d73e0;
}

/* Page Structure */
.single-post-container {
	max-width: 1350px;
	margin: 50px auto;
	padding: 0 20px;
	display: flex;
	gap: 40px;
	position: relative;
	box-sizing: border-box;
}

.single-post-full-width-container {
	max-width: 1350px;
	margin: 0 auto 50px auto;
	padding: 0 20px;
	width: 100%;
	box-sizing: border-box;
}

/* Sidebar Table of Contents */
.single-post-sidebar {
	width: 387.6px;
	flex-shrink: 0;
	align-self: flex-start;
	position: sticky;
	top: 100px;
	z-index: 100;
	opacity: 1;
}

.single-post-sidebar .toc-header {
	background-color: var(--color-black);
	color: var(--color-white);
	width: 100%;
	height: 70px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-lora);
	font-weight: 700;
	font-size: 30px;
	line-height: 60px;
	letter-spacing: -0.6px;
	text-align: center;
	box-sizing: border-box;
}

.single-post-sidebar .toc-body {
	background-color: var(--color-bg-light);
	width: 100%;
	min-height: 400px;
	max-height: calc(100vh - 220px);
	overflow-y: auto;
	padding: 30px 25px;
	box-sizing: border-box;
	scrollbar-width: thin;
	scrollbar-color: #CCCCCC transparent;
}

/* Custom Scrollbar for TOC Sidebar */
.single-post-sidebar .toc-body::-webkit-scrollbar {
	width: 6px;
}

.single-post-sidebar .toc-body::-webkit-scrollbar-track {
	background: transparent;
}

.single-post-sidebar .toc-body::-webkit-scrollbar-thumb {
	background-color: #CCCCCC;
	border-radius: 10px;
}

.single-post-sidebar .toc-body::-webkit-scrollbar-thumb:hover {
	background-color: var(--color-hover-accent);
}

.single-post-sidebar .toc-body ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.single-post-sidebar .toc-body li {
	margin-bottom: 20px;
}

.single-post-sidebar .toc-body li:last-child {
	margin-bottom: 0;
}

.single-post-sidebar .toc-body a {
	font-family: var(--font-lora);
	font-weight: 400;
	font-size: 18px;
	line-height: 30px;
	letter-spacing: -0.6px;
	color: var(--color-text-dark);
	text-decoration: underline;
	text-decoration-style: solid;
	transition: all 0.3s ease;
	display: block;
}

.single-post-sidebar .toc-body a:hover,
.single-post-sidebar .toc-body a.active {
	color: var(--color-hover-accent);
	text-decoration-color: var(--color-hover-accent);
	transform: translateX(5px);
}

/* Main Content Area */
.single-post-content-area {
	flex-grow: 1;
	max-width: 870px;
	width: 100%;
	box-sizing: border-box;
}

/* Post Header */
.single-post-header {
	margin-bottom: 35px;
}

.single-post-header .post-main-title {
	font-family: var(--font-lora);
	font-weight: 700;
	font-size: 40px;
	line-height: 45.95px;
	letter-spacing: -0.46px;
	color: var(--color-black);
	margin: 0 0 20px 0;
}

.single-post-header .post-meta-info {
	font-family: var(--font-karla);
	font-size: 16px;
	color: #666666;
	margin-bottom: 25px;
	display: flex;
	gap: 15px;
	align-items: center;
}

.single-post-header .post-meta-author-avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	object-fit: cover;
}

.single-post-header .post-featured-image {
	width: 100%;
	max-height: 608.8px;
	object-fit: cover;
	border: 1px solid var(--color-border-grey);
	display: block;
}

/* Paragraphs and General text styling */
.single-post-body-content p {
	font-family: var(--font-lora);
	font-weight: 400;
	font-size: 23.7px;
	line-height: 1.5;
	letter-spacing: 0px;
	text-align: justify;
	color: var(--color-black);
	margin-bottom: 25px;
}

/* H2 Heading Styles */
.single-post-body-content h2 {
	font-family: var(--font-lora);
	font-weight: 700;
	font-size: 36px;
	line-height: 1.2;
	letter-spacing: 0px;
	text-align: justify;
	color: var(--color-black);
	margin: 40px 0 20px 0;
	scroll-margin-top: 120px;
	/* Offset for sticky header if active */
}

/* --------------------------------------------------------------------------
   H3 HEADINGS WITH WRAPPED CONTENT BOXES
   -------------------------------------------------------------------------- */
.h3-boxed-wrapper {
	border: 1px solid var(--color-black);
	margin: 40px 0;
	background: var(--color-white);
	box-sizing: border-box;
}

.h3-boxed-header-row {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	border-bottom: 1px solid var(--color-black);
}

.h3-boxed-title {
	font-family: var(--font-lora);
	font-weight: 700;
	font-size: 32px;
	line-height: 38.29px;
	letter-spacing: -0.46px;
	color: var(--color-black);
	margin: 0;
	padding: 25px 30px;
	display: flex;
	align-items: center;
	flex-grow: 1;
}

.h3-boxed-number-box {
	width: 131.6px;
	background-color: var(--color-accent-orange);
	border-left: 1px solid var(--color-black);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.h3-boxed-number {
	font-family: var(--font-lora);
	font-weight: 700;
	font-size: 53.61px;
	line-height: 38.29px;
	letter-spacing: -0.46px;
	color: var(--color-black);
	display: block;
}

.h3-boxed-image-wrap {
	width: 100%;
	overflow: hidden;
}

.h3-boxed-image-wrap img {
	width: 100%;
	height: 608.8px;
	object-fit: cover;
	display: block;
}

/* --------------------------------------------------------------------------
   WIDGETS: KEY POINTS, FAQ, QUOTES
   -------------------------------------------------------------------------- */

/* Article Key Points Widget */
.wp-block-custom-key-points {
	border: 2px solid var(--color-accent-yellow);
	border-radius: 8px;
	background-color: #FFFDF8;
	padding: 30px 40px;
	margin: 35px 0;
	box-sizing: border-box;
}

.wp-block-custom-key-points .key-points-title {
	font-family: var(--font-lora);
	font-weight: 700;
	font-size: 26px;
	color: var(--color-black);
	margin: 0 0 20px 0;
}

.wp-block-custom-key-points .key-points-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.wp-block-custom-key-points .key-points-list li {
	font-family: var(--font-lora);
	font-size: 20px;
	line-height: 1.6;
	color: var(--color-text-dark);
	position: relative;
	padding-left: 25px;
	margin-bottom: 12px;
}

.wp-block-custom-key-points .key-points-list li::before {
	content: "\2022";
	color: var(--color-accent-orange);
	font-size: 28px;
	position: absolute;
	left: 0;
	top: -2px;
}

.wp-block-custom-key-points .key-points-list li:last-child {
	margin-bottom: 0;
}

/* Custom Quote Block Widget */
.wp-block-custom-quote {
	margin: 40px 0;
	max-width: 910.89px;
	width: 100%;
	box-sizing: border-box;
}

.wp-block-custom-quote .custom-quote-body {
	border-left: 8px solid var(--color-accent-yellow);
	border-top-right-radius: 7.66px;
	border-bottom-right-radius: 7.66px;
	background-color: #FFFDF8;
	padding: 30px 35px;
	margin: 0;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.02);
}

.wp-block-custom-quote .custom-quote-text {
	font-family: var(--font-lora);
	font-weight: 600;
	font-size: 22.98px;
	line-height: 35.99px;
	color: var(--color-black);
	margin: 0 0 15px 0;
	font-style: italic;
	text-align: justify;
}

.wp-block-custom-quote .custom-quote-author {
	font-family: var(--font-lora);
	font-weight: 700;
	font-size: 18px;
	color: var(--color-accent-orange);
	display: block;
	text-align: right;
}

/* FAQ Block Widget */
.wp-block-custom-faq {
	margin: 60px 0;
	box-sizing: border-box;
}

.wp-block-custom-faq .faq-section-heading {
	font-family: var(--font-lora);
	font-weight: 700;
	font-size: 40px;
	line-height: 150%;
	color: #35332F;
	text-align: center;
	text-transform: capitalize;
	margin-bottom: 35px;
}

.wp-block-custom-faq .faq-accordion-container {
	max-width: 100%;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	align-items: start;
}

.wp-block-custom-faq .faq-accordion-item {
	background: #FFFFFF;
	border: 1px solid #E2E8F0;
	border-radius: 8px;
	margin-bottom: 0;
	overflow: hidden;
	transition: all 0.3s ease;
}

.wp-block-custom-faq .faq-accordion-question-wrap {
	padding: 22px 25px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	cursor: pointer;
	user-select: none;
	transition: background 0.3s ease;
}

.wp-block-custom-faq .faq-accordion-question {
	font-family: var(--font-lora);
	font-weight: 600;
	font-size: 20.42px;
	line-height: 130%;
	color: var(--color-faq-dark);
}

.wp-block-custom-faq .faq-accordion-toggle-icon {
	font-size: 24px;
	font-weight: bold;
	color: var(--color-faq-dark);
	transition: transform 0.3s ease;
	line-height: 1;
}

.wp-block-custom-faq .faq-accordion-answer-wrap {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s cubic-bezier(0, 1, 0, 1);
}

.wp-block-custom-faq .faq-accordion-answer {
	font-family: var(--font-lora);
	font-weight: 500;
	font-size: 22px;
	line-height: 151%;
	letter-spacing: 0.11px;
	color: var(--color-faq-text);
	padding: 0 25px 22px 25px;
}

/* FAQ Active state */
.wp-block-custom-faq .faq-accordion-item.active {
	background-color: var(--color-faq-bg-open);
	border-color: #BEE3F8;
}

.wp-block-custom-faq .faq-accordion-item.active .faq-accordion-question-wrap {
	background-color: var(--color-faq-bg-open);
}

.wp-block-custom-faq .faq-accordion-item.active .faq-accordion-toggle-icon {
	transform: rotate(45deg);
}

.wp-block-custom-faq .faq-accordion-item.active .faq-accordion-answer-wrap {
	max-height: 1000px;
	transition: max-height 0.3s cubic-bezier(1, 0, 1, 0);
}

/* --------------------------------------------------------------------------
   LEAVE FEEDBACK FORM SECTION
   -------------------------------------------------------------------------- */
.feedback-section {
	margin: 80px 0;
	border-radius: 30px;
	overflow: hidden;
	position: relative;
	box-sizing: border-box;
}

.feedback-bg-container {
	position: relative;
	background-color: #FFFFFF;
	background-size: cover;
	background-position: center;
	padding: 80px 30px;
	/* Small space left and right */
	z-index: 1;
}

/* Feedback background yellow overlay (33% opacity) */
.feedback-bg-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #ffa1006e;
	opacity: 0.33;
	z-index: -1;
}

.feedback-section .feedback-heading {
	font-family: var(--font-lora);
	font-weight: 700;
	font-size: 40px;
	line-height: 150%;
	color: #35332F;
	text-align: center;
	text-transform: capitalize;
	margin: 0 0 10px 0;
}

.feedback-section .feedback-subheading {
	font-family: var(--font-lora);
	font-weight: 600;
	font-size: 27.57px;
	line-height: 43.65px;
	color: #5B5B5B;
	text-align: center;
	margin: 0 0 45px 0;
}

/* Form Styles */
.feedback-form {
	max-width: 100%;
	margin: 0 auto;
}

.feedback-form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 30px;
	margin-bottom: 25px;
}

.feedback-form-row.single-col {
	grid-template-columns: 1fr;
}

.feedback-field-group {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.feedback-field-group label {
	font-family: var(--font-karla);
	font-weight: 600;
	font-size: 21.51px;
	line-height: 135%;
	color: #170F49;
}

.feedback-input {
	width: 100%;
	height: 83.33px;
	min-height: 83.33px;
	background: #FFFFFF;
	border: none;
	border-radius: 21.51px;
	padding: 10.75px 21.51px;
	box-sizing: border-box;
	font-family: var(--font-karla);
	font-weight: 400;
	font-size: 21.51px;
	line-height: 135%;
	color: #514F6E;
	transition: all 0.3s ease;
	outline: none;
}

.feedback-input::placeholder {
	color: #514F6E;
}

/* User & Envelope & Web Icons for Inputs */
.feedback-input-name {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23514F6E' viewBox='0 0 24 24'%3E%3Cpath d='M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: calc(100% - 25px) center;
	background-size: 28px;
	padding-right: 60px;
}

.feedback-input-email {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23514F6E' viewBox='0 0 24 24'%3E%3Cpath d='M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: calc(100% - 25px) center;
	background-size: 28px;
	padding-right: 60px;
}

.feedback-input-subject {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23514F6E' viewBox='0 0 24 24'%3E%3Cpath d='M14 17H4v2h10v-2zm6-8H4v2h16V9zM4 15h16v-2H4v2zM4 5v2h16V5H4z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: calc(100% - 25px) center;
	background-size: 28px;
	padding-right: 60px;
}

.feedback-input-textarea {
	height: auto !important;
	min-height: 200px !important;
	resize: vertical;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23514F6E' viewBox='0 0 24 24'%3E%3Cpath d='M20 2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zM6 9h12v2H6V9zm8 5H6v-2h8v2zm4-6H6V6h12v2z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: calc(100% - 25px) 25px;
	background-size: 28px;
	padding-right: 60px;
}

.feedback-input:focus {
	box-shadow: 0 0 8px rgba(13, 115, 224, 0.3);
}

.feedback-submit-wrap {
	display: flex;
	justify-content: center;
	margin-top: 35px;
}

.feedback-submit-btn {
	background-color: var(--color-black);
	color: var(--color-white);
	font-family: var(--font-karla);
	font-weight: 700;
	font-size: 20px;
	padding: 20px 50px;
	border: none;
	border-radius: 40px;
	cursor: pointer;
	transition: all 0.3s ease;
	min-width: 250px;
}

.feedback-submit-btn:hover {
	background-color: var(--color-hover-accent);
	color: var(--color-white);
	transform: translateY(-2px);
	box-shadow: 0 5px 15px rgba(13, 115, 224, 0.3);
}

.feedback-message {
	padding: 15px;
	border-radius: 10px;
	margin-bottom: 25px;
	font-family: var(--font-karla);
	font-size: 18px;
	display: none;
}

.feedback-message.success {
	display: block;
	background-color: #DEF7EC;
	color: #03543F;
	border: 1px solid #BCF0DA;
}

.feedback-message.error {
	display: block;
	background-color: #FDE8E8;
	color: #9B1C1C;
	border: 1px solid #F8B4B4;
}

/* --------------------------------------------------------------------------
   FEEDBACK CAROUSEL / SLIDER
   -------------------------------------------------------------------------- */
.feedback-slider-container {
	max-width: 100%;
	margin: 50px auto 0 auto;
	position: relative;
	overflow: hidden;
}

.feedback-slider-heading {
	font-family: var(--font-lora);
	font-weight: 700;
	font-size: 32px;
	color: var(--color-black);
	text-align: center;
	margin-bottom: 30px;
}

.feedback-slider-track-wrap {
	overflow: hidden;
	width: 100%;
}

.feedback-slider-track {
	display: flex;
	transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	gap: 30px;
	padding: 15px 5px;
}

.feedback-card {
	flex: 0 0 calc(33.333% - 20px);
	background: #FFFFFF;
	border: 1px solid var(--color-border-grey);
	border-radius: 20px;
	padding: 30px 25px;
	box-sizing: border-box;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 280px;
	transition: transform 0.3s ease;
}

.feedback-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.06);
}

.feedback-card-comment {
	font-family: var(--font-lora);
	font-size: 18px;
	line-height: 1.6;
	color: var(--color-faq-text);
	margin-bottom: 20px;
	display: -webkit-box;
	-webkit-line-clamp: 5;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.feedback-card-user-info {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	border-top: 1px solid #F1F2F9;
	padding-top: 15px;
}

.feedback-card-avatar {
	width: 70px;
	height: 70px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid var(--color-accent-yellow);
}

.feedback-card-name {
	font-family: var(--font-lora);
	font-weight: 600;
	font-size: 18px;
	color: var(--color-black);
	text-align: center;
}

/* Slider Controls */
.feedback-slider-controls {
	display: flex;
	justify-content: center;
	gap: 20px;
	margin-top: 30px;
}

.feedback-slider-arrow {
	background: var(--color-black);
	color: var(--color-white);
	border: none;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	font-size: 20px;
}

.feedback-slider-arrow:hover {
	background: var(--color-hover-accent);
	color: var(--color-white);
}

.feedback-slider-arrow:disabled {
	background: #CCCCCC;
	cursor: not-allowed;
	color: #666666;
}

/* --------------------------------------------------------------------------
   RELATED POSTS RECOMMENDATION SECTION
   -------------------------------------------------------------------------- */
.related-posts-section {
	margin-top: 80px;
	padding-top: 60px;
	border-top: 1px solid var(--color-border-grey);
	box-sizing: border-box;
}

.related-posts-section .section-heading {
	font-family: var(--font-lora);
	font-weight: 700;
	font-size: 40px;
	color: var(--color-black);
	text-align: center;
	margin-bottom: 50px;
}

/* Related Posts Grid (Reuses Editor's Choice Design classes) */
.related-posts-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 25px;
	margin-bottom: 50px;
}

.editors-choice-card.category-grid-card {
	background: #FFFFFF;
	display: flex;
	flex-direction: column;
	border-bottom: 1px solid #DBDADA;
	overflow: hidden;
	transition: transform 0.3s ease;
}

.editors-choice-card.category-grid-card:hover {
	transform: translateY(-4px);
}

.editors-choice-card-img-wrap {
	width: 100%;
	overflow: hidden;
	position: relative;
}

.editors-choice-card-img-wrap a {
	display: block;
}

.editors-choice-card-img {
	width: 100%;
	height: 220px;
	object-fit: cover;
	display: block;
	transition: transform 0.3s ease;
}

.editors-choice-card-img-wrap:hover .editors-choice-card-img {
	transform: scale(1.03);
}

.editors-choice-card-content {
	padding: 20px 15px;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	border: 1px solid #E2E8F0;
	border-top: none;
}

.editors-choice-meta-row {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
}

.editors-choice-cat-tag {
	font-family: var(--font-karla);
	font-weight: 700;
	font-size: 13px;
	color: #ffffff;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.editors-choice-meta-divider {
	width: 4px;
	height: 4px;
	background: #CCCCCC;
	border-radius: 50%;
}

.editors-choice-date {
	font-family: var(--font-karla);
	font-size: 13px;
	color: #888888;
}

.editors-choice-title {
	font-family: var(--font-lora);
	font-weight: 700;
	font-size: 22px;
	line-height: 1.4;
	margin: 0 0 15px 0;
	flex-grow: 1;
}

.editors-choice-title a {
	color: var(--color-text-dark);
	text-decoration: none;
	transition: color 0.3s ease;
}

.editors-choice-title a:hover {
	color: var(--color-hover-accent);
}

.editors-choice-content-divider {
	height: 1px;
	background: #F1F2F9;
	margin-bottom: 15px;
}

.editors-choice-author-row {
	display: flex;
	align-items: center;
	gap: 10px;
}

.editors-choice-author-avatar {
	width: 35px;
	height: 35px;
	border-radius: 50%;
	object-fit: cover;
}

.editors-choice-author-name {
	font-family: var(--font-lora);
	font-weight: 600;
	font-size: 14px;
	color: var(--color-text-dark);
}

/* Related Posts Load More Wrap */
.related-load-more-wrap {
	display: flex;
	justify-content: center;
	margin-top: 20px;
}

.related-load-more-btn {
	background-color: var(--color-black);
	color: var(--color-white);
	border: none;
	border-radius: 50px;
	padding: 16px 40px;
	font-family: var(--font-lora);
	font-weight: 600;
	font-size: 18px;
	cursor: pointer;
	transition: all 0.3s ease;
	display: inline-flex;
	align-items: center;
	gap: 12px;
}

.related-load-more-btn:hover {
	background-color: var(--color-hover-accent);
	color: var(--color-white);
}

.related-load-more-btn.loading {
	background-color: #666;
	cursor: not-allowed;
}

.related-load-more-btn svg {
	width: 20px;
	height: 20px;
	fill: currentColor;
}

.related-load-more-btn.loading svg {
	animation: related-spin 1s linear infinite;
}

@keyframes related-spin {
	100% {
		transform: rotate(360deg);
	}
}

/* --------------------------------------------------------------------------
   RESPONSIVE DESIGN BREAKPOINTS
   -------------------------------------------------------------------------- */

@media (max-width: 1200px) {
	.single-post-container {
		flex-direction: column;
	}

	.single-post-sidebar {
		width: 100%;
		position: static;
		margin-bottom: 40px;
	}

	.single-post-sidebar .toc-body {
		max-height: 300px;
	}

	.single-post-content-area {
		max-width: 1000px;
	}

	.related-posts-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 991px) {
	.related-posts-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.feedback-form-row {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.feedback-bg-container {
		padding: 50px 30px;
	}

	.feedback-card {
		flex: 0 0 calc(50% - 15px);
	}
}

@media (max-width: 768px) {
	.single-post-sidebar {
		display: none;
	}

	.single-post-header .post-main-title {
		font-size: 30px;
		line-height: 1.2;
	}

	.single-post-body-content h2 {
		font-size: 26px;
		line-height: 1.2;
	}

	.single-post-body-content p {
		font-size: 20px;
	}

	.h3-boxed-title {
		font-size: 20px;
		padding: 15px 20px;
		line-height: 21.29px;
	}

	.h3-boxed-number-box {
		width: 90px;
	}

	.h3-boxed-number {
		font-size: 36px;
	}

	.h3-boxed-image-wrap img {
		height: 380px;
	}

	.wp-block-custom-key-points {
		padding: 20px 25px;
	}

	.wp-block-custom-faq .faq-section-heading {
		font-size: 32px;
	}

	.wp-block-custom-faq .faq-accordion-question {
		font-size: 18px;
	}

	.wp-block-custom-faq .faq-accordion-answer {
		font-size: 18px;
	}

	.wp-block-custom-faq .faq-accordion-container {
		grid-template-columns: 1fr;
		gap: 15px;
	}

	.feedback-section .feedback-heading {
		font-size: 32px;
	}

	.feedback-section .feedback-subheading {
		font-size: 22px;
		line-height: 1.3;
	}
}

@media (max-width: 600px) {
	.related-posts-grid {
		grid-template-columns: 1fr;
	}

	.feedback-card {
		flex: 0 0 100%;
	}

	.h3-boxed-header-row {
		flex-direction: row;
	}

	.h3-boxed-image-wrap img {
		height: 260px;
	}

	.single-post-sidebar .toc-header {
		font-size: 24px;
	}

	.single-post-sidebar .toc-body a {
		font-size: 20px;
	}
}

/* ============================================================
   Affiliate Disclosure (what-to-buy category posts)
   ============================================================ */
.affiliate-disclosure {
	font-family: var(--font-lora);
	font-style: italic;
	font-size: 0.875rem;
	line-height: 1.6;
	color: #6b6b6b;
	background-color: #fafafa;
	border-left: 3px solid var(--color-accent-yellow);
	padding: 10px 16px;
	margin: 16px 0 0 0;
	border-radius: 0 4px 4px 0;
}

.affiliate-disclosure-link {
	color: #6b6b6b;
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: color 0.2s ease;
}

.affiliate-disclosure-link:hover {
	color: var(--color-accent-orange);
}