/* ==========================================================
   OnPodium Blog — homepage-aligned design.
   SELF-CONTAINED stylesheet. Replaces /css/style.css for blog
   index + every blog post (legacy theme is no longer loaded).
   ========================================================== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&display=swap');

*, *::before, *::after { box-sizing: border-box; }

:root {
	--op-bg: #f4ecdc;
	--op-text: #1d1a14;
	--op-muted: #6b6457;
	--op-line: #e0d5bd;
	--op-surface: #ebe1c8;
	--op-card: #fbf6e8;
	--op-accent: #ff5a2c;
	--op-radius: 14px;
}

html, body {
	margin: 0; padding: 0;
	background: var(--op-bg);
	color: var(--op-text);
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
img { max-width: 100%; display: block; height: auto; }
a { color: inherit; text-decoration: none; }
.serif { font-family: 'Instrument Serif', Georgia, serif; font-style: italic; font-weight: 400; }

/* Hide all decorative leftovers from the old theme --------- */
.bubble-one, .bubble-two, .bubble-three, .bubble-four, .bubble-five, .bubble-six,
.shapes, .shape-one, .shape-two, .shape-three { display: none !important; }
.main-page-wrapper { background: var(--op-bg); }

/* ==========================================================
   Minimal grid system (replaces Bootstrap)
   ========================================================== */
.container, .lg-container {
	max-width: 980px;
	margin: 0 auto;
	padding: 0 32px;
	width: 100%;
}
.row {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -12px;
}
.row > [class*="col-"] { padding: 0 12px; min-width: 0; }
.col-lg-2  { width: 16.6666%; }
.col-lg-3  { width: 25%; }
.col-lg-4  { width: 33.3333%; }
.col-lg-5  { width: 41.6666%; }
.col-lg-6  { width: 50%; }
.col-lg-7  { width: 58.3333%; }
.col-lg-8  { width: 66.6666%; }
.col-lg-9  { width: 75%; }
.col-lg-10 { width: 83.3333%; }
.col-xl-2  { width: 16.6666%; }
.col-xl-3  { width: 25%; }
.col-xl-4  { width: 33.3333%; }
.col-xl-5  { width: 41.6666%; }
.col-xl-6  { width: 50%; }
.col-xl-7  { width: 58.3333%; }
.col-xl-8  { width: 66.6666%; }
.col-xl-9  { width: 75%; }
.col-xl-10 { width: 83.3333%; }
.col-12    { width: 100%; }
@media (max-width: 991px) {
	.col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5,
	.col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10,
	.col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5,
	.col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10,
	.col-md-6 { width: 100%; }
}
@media (max-width: 575px) {
	.col-md-6 { width: 100%; }
}

.d-flex { display: flex; }
.d-lg-flex { display: flex; }
.justify-content-center { justify-content: center; }
.justify-content-between { justify-content: space-between; }
.justify-content-lg-start { justify-content: flex-start; }
.justify-content-lg-end { justify-content: flex-end; }
.align-items-center { align-items: center; }
.text-center { text-align: center; }
.m-auto { margin-left: auto; margin-right: auto; }
.mb-20 { margin-bottom: 20px; }
.mb-40 { margin-bottom: 40px; }
.mt-120, .md-mt-100 { margin-top: 80px; }
.mt-30 { margin-top: 30px; }
.order-lg-1, .order-lg-2, .order-lg-3 { /* no-op */ }
.order-lg-first { order: -1; }
.order-lg-last { order: 1; }
.width-lg { width: 100%; }
.font-gordita, .font-rubik { font-family: 'Inter', sans-serif; }

/* ==========================================================
   NAV (homepage-style)
   ========================================================== */
nav.nav {
	position: sticky; top: 0; z-index: 50;
	background: rgba(244, 236, 220, 0.85);
	backdrop-filter: saturate(180%) blur(14px);
	-webkit-backdrop-filter: saturate(180%) blur(14px);
	border-bottom: 1px solid var(--op-line);
}
nav.nav .nav-inner {
	display: flex; align-items: center; justify-content: space-between;
	padding-top: 16px; padding-bottom: 16px;
}
@media (max-width: 480px) {
	.nav .nav-inner { padding-top: 12px; padding-bottom: 12px; }
}
.nav-logo { display: inline-flex; align-items: center; }
.nav-logo img { height: 24px; width: auto; }
.nav-links { display: flex; gap: 28px; align-items: center; }
.nav-links a {
	color: var(--op-muted);
	font-size: 14px; font-weight: 500;
	transition: color .2s;
}
.nav-links a:hover,
.nav-links a.is-active { color: var(--op-text); }

/* Free Tools dropdown */
.nav-dropdown { position: relative; }
.nav-dropdown-toggle {
	background: transparent; border: 0; padding: 0; margin: 0;
	color: var(--op-muted);
	font: inherit; font-size: 14px; font-weight: 500;
	cursor: pointer;
	display: inline-flex; align-items: center; gap: 4px;
	transition: color .2s;
}
.nav-dropdown-toggle:hover,
.nav-dropdown:hover .nav-dropdown-toggle,
.nav-dropdown.is-open .nav-dropdown-toggle { color: var(--op-text); }
.nav-dropdown-toggle svg { width: 10px; height: 10px; transition: transform .2s; }
.nav-dropdown:hover .nav-dropdown-toggle svg,
.nav-dropdown.is-open .nav-dropdown-toggle svg { transform: rotate(180deg); }
.nav-dropdown-menu {
	position: absolute;
	top: calc(100% + 14px);
	left: 50%;
	transform: translateX(-50%) translateY(4px);
	min-width: 240px;
	background: var(--op-card);
	border: 1px solid var(--op-line);
	border-radius: 12px;
	padding: 8px;
	box-shadow: 0 8px 24px rgba(29,26,20,0.08);
	opacity: 0; visibility: hidden;
	transition: opacity .15s, transform .15s, visibility .15s;
	display: flex; flex-direction: column;
	z-index: 60;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.is-open .nav-dropdown-menu {
	opacity: 1; visibility: visible;
	transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu a {
	display: block;
	padding: 10px 12px;
	color: var(--op-text);
	font-size: 14px; font-weight: 500;
	border-radius: 8px;
	transition: background .15s, color .15s;
}
.nav-dropdown-menu a:hover { background: rgba(29,26,20,0.06); color: var(--op-text); }

.nav-cta { display: flex; gap: 10px; align-items: center; }
.btn-ghost {
	color: var(--op-muted);
	padding: 8px 14px;
	font-size: 14px; font-weight: 500;
	transition: color .2s;
}
.btn-ghost:hover { color: var(--op-text); }
.btn-primary {
	display: inline-flex; align-items: center; gap: 8px;
	background: var(--op-text); color: #fff;
	padding: 10px 18px; border-radius: 999px;
	font-size: 14px; font-weight: 600;
	transition: opacity .2s, transform .2s;
}
.btn-primary:hover { opacity: 0.92; transform: translateY(-1px); }

/* Legacy nav fallback (in case any file still has old markup) */
.theme-main-menu, .theme-menu-five {
	position: sticky; top: 0; z-index: 50;
	background: rgba(244, 236, 220, 0.85);
	backdrop-filter: saturate(180%) blur(14px);
	-webkit-backdrop-filter: saturate(180%) blur(14px);
	border-bottom: 1px solid var(--op-line);
}
.theme-main-menu > .d-flex {
	max-width: 980px;
	margin: 0 auto;
	padding: 16px 32px;
	width: 100%;
	justify-content: space-between !important;
	align-items: center;
	gap: 24px;
}
.theme-main-menu .logo { display: inline-flex; align-items: center; }
.theme-main-menu .logo img { height: 24px; width: auto; }

.theme-main-menu .navbar { flex: 1; display: flex; justify-content: center; }
.theme-main-menu .navbar-toggler { display: none; }
.theme-main-menu .nav-container { width: 100%; display: flex; justify-content: center; }
.theme-main-menu .navbar-collapse { display: flex !important; }
.theme-main-menu .navbar-collapse > .d-lg-flex { width: 100%; justify-content: center; }
.theme-main-menu .navbar-nav,
.theme-main-menu #one-page-nav {
	list-style: none; padding: 0; margin: 0;
	display: flex; gap: 28px; align-items: center; flex-direction: row;
}
.theme-main-menu .nav-item { list-style: none; }
.theme-main-menu .nav-link {
	display: inline-block;
	color: var(--op-muted);
	font-size: 14px; font-weight: 500;
	padding: 0;
	transition: color .2s;
}
.theme-main-menu .nav-link:hover,
.theme-main-menu .nav-item.active .nav-link { color: var(--op-text); }

.theme-main-menu .right-widget { display: flex; gap: 10px; align-items: center; }
.theme-main-menu .right-widget .login {
	color: var(--op-muted);
	font-size: 14px; font-weight: 500;
	padding: 8px 14px;
	transition: color .2s;
}
.theme-main-menu .right-widget .login:hover { color: var(--op-text); }
.theme-main-menu .right-widget .demo-button {
	display: inline-flex; align-items: center;
	background: var(--op-text);
	color: #fff;
	padding: 10px 18px;
	border-radius: 999px;
	font-size: 14px; font-weight: 600;
	transition: opacity .2s, transform .2s;
}
.theme-main-menu .right-widget .demo-button:hover { opacity: 0.92; transform: translateY(-1px); }
.theme-main-menu .right-widget .demo-button span {
	background: transparent; color: #fff; padding: 0; line-height: 1;
}

/* ==========================================================
   HERO (blog index header)
   ========================================================== */
.fancy-hero-one {
	background: transparent;
	padding: 56px 0 24px;
	text-align: center;
	border: 0;
	min-height: 0;
}
.fancy-hero-one .container { max-width: 980px; }
.fancy-hero-one .hero-heading {
	font-family: 'Inter', sans-serif;
	font-size: clamp(40px, 6vw, 60px);
	line-height: 1.05;
	letter-spacing: -0.03em;
	font-weight: 600;
	color: var(--op-text);
	margin: 0 auto 14px;
	max-width: 22ch;
}
.fancy-hero-one p {
	font-family: 'Inter', sans-serif;
	font-size: 17px;
	color: var(--op-muted);
	max-width: 60ch;
	margin: 0 auto;
	line-height: 1.55;
}

/* ==========================================================
   BLOG INDEX CARDS
   ========================================================== */
.blog-page-bg, .feature-blog-one {
	background: transparent;
	padding: 24px 0 64px;
}
.feature-blog-one .row { row-gap: 24px; }

.feature-blog-one .post-meta {
	background: var(--op-card);
	border: 1px solid var(--op-line);
	border-radius: 18px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	height: 100%;
	transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
	position: relative;
}
.feature-blog-one .post-meta:hover {
	transform: translateY(-3px);
	border-color: rgba(255, 90, 44, 0.35);
	box-shadow: 0 14px 30px -18px rgba(29, 26, 20, 0.25);
}
.feature-blog-one .post-meta .image-meta {
	width: 100%;
	height: 200px;
	object-fit: cover;
	display: block;
	background: var(--op-surface);
	border-radius: 0;
}
.feature-blog-one .post-meta .tag {
	display: inline-block;
	background: rgba(255, 90, 44, 0.12);
	color: var(--op-accent);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: 5px 11px;
	border-radius: 999px;
	margin: 22px 22px 14px;
	width: max-content;
}
.feature-blog-one .post-meta h3 {
	font-family: 'Inter', sans-serif;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: -0.01em;
	margin: 0 22px 18px;
	flex: 1;
}
.feature-blog-one .post-meta h3 a,
.feature-blog-one .post-meta h3 .title {
	color: var(--op-text);
	font-weight: 600;
	transition: color .2s;
}
.feature-blog-one .post-meta h3 a:hover,
.feature-blog-one .post-meta h3 a:hover .title { color: var(--op-accent); }
/* Make the entire card clickable via the title link's overlay */
.feature-blog-one .post-meta h3 a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}
.feature-blog-one .post-meta .image-meta,
.feature-blog-one .post-meta .tag,
.feature-blog-one .post-meta h3,
.feature-blog-one .post-meta .read-more { position: relative; z-index: 2; }
.feature-blog-one .post-meta .read-more {
	color: var(--op-accent);
	font-size: 13.5px;
	font-weight: 600;
	margin: 0 22px 22px;
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	width: max-content;
	justify-content: flex-start !important;
	transition: color .2s;
}
.feature-blog-one .post-meta .read-more:hover { color: #ff4a18; }
.feature-blog-one .post-meta .read-more span { color: var(--op-accent); }
.feature-blog-one .post-meta .read-more i {
	font-style: normal;
	font-size: 12px;
}
.feature-blog-one .post-meta .read-more i::before { content: "→"; }

/* ==========================================================
   BLOG POST DETAIL
   ========================================================== */
.blog-page-bg > .container > .row { row-gap: 40px; }

.blog-details-post-v1 .post-meta {
	background: transparent;
	border: 0;
	padding: 0;
	margin: 0;
	display: block;
	height: auto;
	overflow: visible;
	box-shadow: none;
	transform: none;
}
.blog-details-post-v1 .post-meta:hover {
	transform: none; box-shadow: none; border: 0;
}
.blog-details-post-v1 .post-meta .image-meta {
	width: 100%;
	height: auto;
	max-height: 420px;
	object-fit: cover;
	border-radius: 18px;
	margin: 0 0 28px;
}
.blog-details-post-v1 .post-meta .tag {
	background: transparent;
	color: var(--op-muted);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
	padding: 0;
	margin: 0 0 16px;
	border-radius: 0;
}
.blog-details-post-v1 .post-meta h1.hero-heading,
.blog-details-post-v1 .post-meta h1 {
	font-family: 'Inter', sans-serif;
	font-size: clamp(32px, 4.4vw, 48px);
	line-height: 1.1;
	letter-spacing: -0.02em;
	font-weight: 600;
	color: var(--op-text);
	margin: 0 0 28px;
}
.blog-details-post-v1 .post-meta p {
	font-family: 'Inter', sans-serif;
	font-size: 17px;
	line-height: 1.7;
	color: var(--op-text);
	margin: 0 0 22px;
}
.blog-details-post-v1 .post-meta h2,
.blog-details-post-v1 .post-meta h2.mark-text {
	font-family: 'Inter', sans-serif;
	font-size: 28px;
	line-height: 1.15;
	letter-spacing: -0.015em;
	font-weight: 600;
	color: var(--op-text);
	margin: 48px 0 18px;
	background: none;
	-webkit-text-fill-color: var(--op-text);
}
.blog-details-post-v1 .post-meta h3 {
	font-family: 'Inter', sans-serif;
	font-size: 22px;
	font-weight: 600;
	letter-spacing: -0.01em;
	color: var(--op-text);
	margin: 36px 0 12px;
}
.blog-details-post-v1 .post-meta h4 {
	font-size: 18px;
	font-weight: 600;
	color: var(--op-text);
	margin: 28px 0 10px;
}
.blog-details-post-v1 .post-meta a {
	color: var(--op-accent);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color .2s;
}
.blog-details-post-v1 .post-meta a:hover { color: #ff4a18; }
.blog-details-post-v1 .post-meta strong { color: var(--op-text); font-weight: 600; }
.blog-details-post-v1 .post-meta ul,
.blog-details-post-v1 .post-meta ol {
	font-size: 17px;
	line-height: 1.7;
	color: var(--op-text);
	margin: 0 0 22px;
	padding-left: 22px;
}
.blog-details-post-v1 .post-meta li { margin-bottom: 8px; }
.blog-details-post-v1 .post-meta blockquote {
	border-left: 3px solid var(--op-accent);
	padding: 6px 0 6px 22px;
	margin: 24px 0;
	font-family: 'Instrument Serif', Georgia, serif;
	font-style: italic;
	font-size: 22px;
	line-height: 1.45;
	color: var(--op-text);
}
.blog-details-post-v1 .post-meta img {
	border-radius: 12px;
	margin: 24px 0;
}
.blog-details-post-v1 .post-meta hr {
	border: 0;
	border-top: 1px solid var(--op-line);
	margin: 36px 0;
}
.blog-details-post-v1 .post-meta table {
	width: 100%;
	border-collapse: collapse;
	margin: 24px 0;
	font-size: 15px;
}
.blog-details-post-v1 .post-meta th,
.blog-details-post-v1 .post-meta td {
	padding: 12px 14px;
	border-bottom: 1px solid var(--op-line);
	text-align: left;
}
.blog-details-post-v1 .post-meta th {
	background: var(--op-surface);
	font-weight: 600;
}

/* Re-theme inline-styled callouts (e.g. <div style="background:#f8f9fa…">) */
.blog-details-post-v1 .post-meta div[style*="background"] {
	background: var(--op-card) !important;
	border: 1px solid var(--op-line) !important;
	border-radius: 14px !important;
	padding: 22px 26px !important;
	margin: 28px 0 !important;
}
.blog-details-post-v1 .post-meta div[style*="e8f4e8"],
.blog-details-post-v1 .post-meta p[style*="e8f4e8"],
.blog-details-post-v1 .post-meta div[style*="e8f4f8"],
.blog-details-post-v1 .post-meta p[style*="e8f4f8"] {
	background: rgba(255, 90, 44, 0.08) !important;
	border: 1px solid rgba(255, 90, 44, 0.25) !important;
	border-radius: 14px !important;
	padding: 22px 26px !important;
	margin: 28px 0 !important;
}
.blog-details-post-v1 .post-meta div[style*="background"] ul { margin-bottom: 0; }

/* ==========================================================
   SIDEBAR
   ========================================================== */
.blog-sidebar-one {
	background: var(--op-card);
	border: 1px solid var(--op-line);
	border-radius: 18px;
	padding: 28px;
	position: sticky;
	top: 96px;
}
.blog-sidebar-one .sidebar-recent-news { margin-bottom: 0; }
.blog-sidebar-one .sidebar-title {
	font-family: 'Inter', sans-serif;
	font-size: 12px;
	font-weight: 700;
	color: var(--op-muted);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	margin: 0 0 18px;
	padding-bottom: 14px;
	border-bottom: 1px solid var(--op-line);
}
.blog-sidebar-one ul { padding: 0; margin: 0; list-style: none; }
.blog-sidebar-one li { margin-bottom: 16px; }
.blog-sidebar-one li:last-child { margin-bottom: 0; }
.blog-sidebar-one li a { display: block; }
.blog-sidebar-one li a .title {
	display: block;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--op-text);
	line-height: 1.4;
	margin-bottom: 4px;
	transition: color .2s;
}
.blog-sidebar-one li a:hover .title { color: var(--op-accent); }
.blog-sidebar-one li a .date {
	display: block;
	font-size: 12.5px;
	color: var(--op-muted);
}

/* Full-width Related Posts (when sidebar drops below article) */
.related-posts-full { margin-top: 32px; }
.related-posts-full .blog-sidebar-one {
	position: static;
	top: auto;
	padding: 32px;
}
.related-posts-full .blog-sidebar-one ul {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 18px 32px;
}
.related-posts-full .blog-sidebar-one li { margin-bottom: 0; }
@media (max-width: 767px) {
	.related-posts-full .blog-sidebar-one ul { grid-template-columns: 1fr; }
}

/* ==========================================================
   FOOTER (homepage-style)
   ========================================================== */
.op-footer {
	padding: 48px 0;
	border-top: 1px solid var(--op-line);
	margin-top: 80px;
}
.op-footer .foot-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 16px;
}
.op-footer .foot-meta {
	color: var(--op-muted);
	font-size: 13px;
}
.op-footer .foot-links {
	display: flex;
	gap: 22px;
	flex-wrap: wrap;
}
.op-footer .foot-links a {
	color: var(--op-muted);
	font-size: 14px;
	transition: color .2s;
}
.op-footer .foot-links a:hover { color: var(--op-text); }
.op-footer .foot-social {
	display: flex;
	gap: 14px;
	align-items: center;
}
.op-footer .foot-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px; height: 32px;
	color: var(--op-muted);
	border-radius: 50%;
	transition: color .2s, background .2s;
}
.op-footer .foot-social a:hover {
	color: var(--op-text);
	background: rgba(29, 26, 20, 0.06);
}
.op-footer .foot-social svg {
	width: 16px; height: 16px;
	display: block;
	fill: currentColor;
}

/* Legacy footer fallback ----------------------------------- */
.theme-footer-seven {
	background: transparent;
	border-top: 1px solid var(--op-line);
	padding: 56px 0 32px;
	margin-top: 80px;
	color: var(--op-muted);
}
.theme-footer-seven .lg-container,
.theme-footer-seven .container { max-width: 980px; }
.theme-footer-seven .logo img { height: 24px; }
.theme-footer-seven .title {
	font-family: 'Inter', sans-serif;
	font-size: 12px;
	font-weight: 700;
	color: var(--op-muted);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	margin: 0 0 18px;
}
.theme-footer-seven .footer-list { padding: 0; list-style: none; margin: 0; }
.theme-footer-seven .footer-list li { margin-bottom: 10px; }
.theme-footer-seven .footer-list a {
	color: var(--op-muted);
	font-size: 14px;
	transition: color .2s;
}
.theme-footer-seven .footer-list a:hover { color: var(--op-text); }
.theme-footer-seven .bottom-footer {
	border-top: 1px solid var(--op-line);
	padding-top: 24px;
	margin-top: 24px;
}
.theme-footer-seven .footer-nav { padding: 0; list-style: none; margin: 0; gap: 16px; display: flex; }
.theme-footer-seven .footer-nav a { color: var(--op-muted); font-size: 13px; }
.theme-footer-seven .footer-nav a:hover { color: var(--op-text); }
.theme-footer-seven .social-icon { padding: 0; list-style: none; margin: 0; gap: 14px; display: flex; }
.theme-footer-seven .social-icon a {
	color: var(--op-muted);
	font-size: 16px;
	transition: color .2s;
	display: inline-flex; align-items: center;
}
.theme-footer-seven .social-icon a svg { fill: var(--op-muted); transition: fill .2s; }
.theme-footer-seven .social-icon a:hover { color: var(--op-text); }
.theme-footer-seven .social-icon a:hover svg { fill: var(--op-text); }
.theme-footer-seven .copyright {
	color: var(--op-muted);
	font-size: 13px;
	margin: 0;
}

/* ==========================================================
   TOOLS / MARKETING PAGE OVERRIDES
   ========================================================== */
.fancy-hero-five,
.fancy-hero-four,
.fancy-hero-three,
.fancy-hero-two {
	background: transparent;
	padding: 56px 0 24px;
	min-height: 0;
	text-align: center;
}
.fancy-hero-five { text-align: left; }
.fancy-hero-five .col-xl-9 { max-width: none; margin: 0; }
.fancy-hero-five .sub-heading,
.fancy-hero-five p { margin-left: 0; max-width: none; }
.fancy-hero-five .container,
.fancy-hero-four .container,
.fancy-hero-three .container { max-width: 980px; }
.fancy-hero-five .heading,
.fancy-hero-four .heading,
.fancy-hero-three .heading,
.fancy-hero-five h1,
.fancy-hero-four h1,
.fancy-hero-three h1 {
	font-family: 'Inter', sans-serif;
	font-size: clamp(36px, 5vw, 56px);
	line-height: 1.05;
	letter-spacing: -0.02em;
	font-weight: 600;
	color: var(--op-text);
	margin: 0 0 20px;
}
.fancy-hero-five .sub-heading,
.fancy-hero-five p,
.fancy-hero-four p,
.fancy-hero-three p {
	font-family: 'Inter', sans-serif;
	font-size: 18px;
	line-height: 1.55;
	color: var(--op-muted);
	margin: 0 auto 24px;
	max-width: 720px;
}
/* Hide remaining decorative shapes */
.fancy-hero-five .shapes,
.fancy-hero-four .shapes,
.fancy-hero-three .shapes,
.fancy-hero-two .shapes,
.fancy-hero-five [class*="bubble"],
.fancy-hero-four [class*="bubble"],
.fancy-hero-three [class*="bubble"] { display: none !important; }

/* Generic content/feature blocks (used by tools and marketing pages) */
.fancy-feature-six,
.fancy-feature-five,
.fancy-feature-four,
.fancy-feature-three,
.fancy-feature-two,
.fancy-feature-one,
.fancy-text-block-one,
.fancy-text-block-two,
.fancy-text-block-three,
.fancy-text-block-four,
.fancy-text-block-five,
.fancy-text-block-six,
.fancy-text-block-seven,
.fancy-text-block-eight,
.fancy-text-block-nine,
.fancy-text-block-ten,
.fancy-short-banner-three,
.fancy-short-banner-two,
.fancy-short-banner-one {
	background: transparent;
	padding: 32px 0;
}
.fancy-feature-six .bg-wrapper,
.fancy-feature-five .bg-wrapper,
.fancy-feature-four .bg-wrapper,
.fancy-feature-three .bg-wrapper,
.fancy-feature-two .bg-wrapper,
.fancy-feature-one .bg-wrapper,
.fancy-short-banner-three .bg-wrapper {
	background: var(--op-card);
	border: 1px solid var(--op-line);
	border-radius: var(--op-radius);
	padding: 40px 32px;
	position: relative;
	overflow: hidden;
}
.fancy-feature-six .bg-wrapper > .shapes,
.fancy-feature-six .bg-wrapper > img.shapes,
.fancy-feature-five .bg-wrapper > .shapes,
.fancy-short-banner-three .bg-wrapper > .shapes,
.fancy-short-banner-three .shapes,
.fancy-feature-six .shapes { display: none !important; }

.title-style-one h1, .title-style-one h2,
.title-style-two h1, .title-style-two h2,
.title-style-three h1, .title-style-three h2,
.title-style-four h1, .title-style-four h2,
.title-style-five h1, .title-style-five h2 {
	font-family: 'Inter', sans-serif;
	font-size: clamp(26px, 3vw, 34px);
	line-height: 1.15;
	letter-spacing: -0.015em;
	font-weight: 600;
	color: var(--op-text);
	margin: 0 0 16px;
}
.title-style-one h3, .title-style-two h3,
.title-style-three h3, .title-style-four h3,
.title-style-five h3 {
	font-family: 'Inter', sans-serif;
	font-size: 20px;
	font-weight: 600;
	letter-spacing: -0.01em;
	color: var(--op-text);
	margin: 0 0 12px;
}
.title-style-one .sub-heading,
.title-style-two .sub-heading,
.title-style-three .sub-heading,
.sub-heading { color: var(--op-muted); font-size: 16px; }
.title-style-two h2 .subheading,
.title-style-two h2 span { background: none !important; -webkit-text-fill-color: var(--op-text); color: var(--op-text); }
.title-style-two h2 img { display: none; }
.text-center { text-align: center; }
.mt-40 { margin-top: 40px; } .mt-50 { margin-top: 50px; } .mt-60 { margin-top: 60px; } .mt-80 { margin-top: 80px; } .mt-100 { margin-top: 80px; } .mt-120 { margin-top: 80px; }
.mb-40 { margin-bottom: 40px; } .mb-50 { margin-bottom: 50px; } .mb-60 { margin-bottom: 60px; } .mb-85 { margin-bottom: 64px; }
.pt-20 { padding-top: 20px; } .pb-20 { padding-bottom: 20px; }

/* Forms (tools generators) */
.checkout-section { padding: 24px 0; }
.form-style-light {
	background: var(--op-card);
	border: 1px solid var(--op-line);
	border-radius: var(--op-radius);
	padding: 12px;
	max-width: 820px;
	margin: 0 auto;
}
.input-group-meta { margin-bottom: 16px; }
.input-group-meta label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: var(--op-text);
	margin-bottom: 6px;
}
.input-group-meta input,
.input-group-meta select,
.input-group-meta textarea,
.form-style-light input,
.form-style-light select,
.form-style-light textarea {
	width: 100%;
	padding: 12px 14px;
	font: inherit;
	font-size: 15px;
	background: #fff;
	color: var(--op-text);
	border: 1px solid var(--op-line);
	border-radius: 10px;
	outline: none;
	transition: border-color .15s, box-shadow .15s;
}
.input-group-meta textarea { min-height: 100px; resize: vertical; }
.input-group-meta input:focus,
.input-group-meta select:focus,
.input-group-meta textarea:focus,
.form-style-light input:focus,
.form-style-light select:focus,
.form-style-light textarea:focus {
	border-color: var(--op-text);
	box-shadow: 0 0 0 3px rgba(29,26,20,0.08);
}
.help-block { font-size: 13px; color: #c0392b; margin-top: 4px; min-height: 0; }

.theme-btn-one,
.btn-lg.theme-btn-one,
button.theme-btn-one {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--op-text);
	color: #fff;
	border: 0;
	padding: 12px 22px;
	border-radius: 999px;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	transition: opacity .2s, transform .2s;
	text-decoration: none;
}
.theme-btn-one:hover { color: #fff; opacity: 0.92; transform: translateY(-1px); }

.btn-link {
	background: transparent !important;
	border: 0 !important;
	color: var(--op-text);
	cursor: pointer;
}
.collapse { display: none; }
.collapse.show { display: block; }

/* --- FAQ accordion --- */
.accordion-style-three { margin: 24px 0 40px; }
.accordion-style-three .card {
	background: var(--op-card);
	border: 1px solid var(--op-line);
	border-radius: 14px;
	margin: 0 0 12px;
	overflow: hidden;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.accordion-style-three .card:hover { border-color: rgba(29,26,20,0.18); }
.accordion-style-three .card.is-open { border-color: var(--op-accent); box-shadow: 0 6px 20px -12px rgba(29,26,20,0.18); }
.accordion-style-three .card-header { background: transparent; padding: 0; border: 0; }
.accordion-style-three .card-header h5 { margin: 0; }
.accordion-style-three .btn-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	padding: 18px 22px;
	font-size: 16px;
	font-weight: 600;
	color: var(--op-text);
	text-align: left;
	line-height: 1.4;
}
.accordion-style-three .btn-link::after {
	content: "";
	flex: 0 0 12px;
	width: 12px;
	height: 12px;
	border-right: 2px solid var(--op-text);
	border-bottom: 2px solid var(--op-text);
	transform: rotate(45deg);
	transform-origin: 60% 60%;
	transition: transform .2s ease;
}
.accordion-style-three .card.is-open .btn-link::after { transform: rotate(-135deg); }
.accordion-style-three .card-body {
	padding: 4px 22px 22px;
	color: var(--op-muted);
	font-size: 15px;
	line-height: 1.65;
}
.accordion-style-three .card-body p { margin: 0 0 12px; }
.accordion-style-three .card-body p:last-child { margin-bottom: 0; }
.accordion-style-three .card-body ul { margin: 8px 0 12px 18px; padding: 0; }
.accordion-style-three .card-body ul li { margin: 0 0 6px; }

/* List/results (name generator etc.) */
.sidebar-keyword { padding: 8px 0; }
.sidebar-keyword ul { list-style: none; padding: 0; margin: 0; }

/* Tables of contents / deep tables on tool pages */
.col-lg-8 .post-meta table { width: 100%; border-collapse: collapse; }

/* Misc utility */
.m-auto { margin-left: auto; margin-right: auto; }

/* Hide all stray decorative shapes globally on these pages */
.shapes, [class^="shape-"], [class*=" shape-"],
[class^="bubble-"], [class*=" bubble-"] { display: none !important; }

/* ==========================================================
   PODCAST NAME IDEAS — page-specific components
   (used by /podcast-name-ideas/* templates)
   ========================================================== */

/* --- Hero: left-align heading and align with article container --- */
.fancy-hero-five { text-align: left; }
.fancy-hero-five .container { max-width: 980px; }
.fancy-hero-five .row { justify-content: flex-start; }
.fancy-hero-five .col-xl-9 {
	width: 100%;
	max-width: none;
	margin: 0;
	float: none;
	text-align: left;
}
.fancy-hero-five .hero-heading,
.fancy-hero-five h1,
.fancy-hero-five .sub-heading,
.fancy-hero-five p {
	text-align: left;
	margin-left: 0;
	margin-right: 0;
	max-width: none;
}

/* --- Article + sidebar layout --- */
.service-details-one { padding-top: 24px; }
.service-details-one .container { max-width: 980px; }
.service-details-one > .container > .row {
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	gap: 56px;
	margin: 0;
}
.service-details-one > .container > .row > [class*="col-"] { padding: 0; }
.service-details-one .col-xl-9 {
	order: 1;
	flex: 1 1 auto;
	width: auto;
	max-width: none;
	min-width: 0;
	float: none;
}
.service-details-one .col-xl-3 {
	order: 2;
	flex: 0 0 240px;
	width: 240px;
	max-width: 240px;
	float: none;
}
.service-details-one .details-wrapper { padding: 0 !important; max-width: none; }

/* --- Inline AI generator promo banner --- */
.fancy-short-banner-eight {
	background: linear-gradient(135deg, var(--op-text) 0%, #2b2519 100%) !important;
	border: 1px solid rgba(255,255,255,0.06);
	border-radius: 20px;
	margin: 40px auto;
	max-width: 916px;
	width: calc(100% - 64px);
	box-sizing: border-box;
	overflow: hidden;
	box-shadow: 0 20px 50px -28px rgba(29,26,20,0.45);
}
/* When the inline banner sits inside the article column, let it fill that column */
.details-wrapper .fancy-short-banner-eight { width: auto; max-width: none; margin-left: 0; margin-right: 0; }
.fancy-short-banner-eight .bg-wrapper { padding: 48px 24px; text-align: center; }
.fancy-short-banner-eight .title-style-twelve h2,
.fancy-short-banner-eight .title-style-twelve .subheading {
	color: #fff !important;
	font-size: clamp(24px, 3vw, 32px);
	line-height: 1.2;
	letter-spacing: -0.02em;
	margin: 0;
}
.fancy-short-banner-eight .title-style-twelve h2 span { color: var(--op-accent); }
.fancy-short-banner-eight p,
.fancy-short-banner-eight .text-dark {
	color: rgba(255,255,255,0.78) !important;
	font-size: 16px;
	margin: 14px 0 24px !important;
	padding: 0 !important;
}
.theme-btn-nine,
.fancy-short-banner-eight .theme-btn-nine {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--op-accent);
	color: #fff !important;
	padding: 14px 28px;
	border-radius: 999px;
	font-weight: 600;
	font-size: 15px;
	text-decoration: none !important;
	transition: transform .15s ease, opacity .15s ease, box-shadow .15s ease;
	box-shadow: 0 10px 24px -10px rgba(255,90,44,0.6);
	border: 0;
}
.theme-btn-nine:hover { transform: translateY(-1px); opacity: 0.95; color: #fff !important; }

/* --- Podcast names list cards --- */
.podcasts-list ul { list-style: none !important; padding: 0 !important; margin: 0; }
.podcasts-list ul li {
	background: var(--op-card) !important;
	border: 1px solid var(--op-line) !important;
	border-radius: 14px !important;
	padding: 18px 20px !important;
	margin-bottom: 12px !important;
	transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.podcasts-list ul li:hover {
	border-color: var(--op-accent) !important;
	box-shadow: 0 10px 24px -16px rgba(29,26,20,0.25);
}
.podcasts-list ul li b {
	display: block;
	font-size: 16px;
	font-weight: 600;
	color: var(--op-text);
	margin-bottom: 4px;
}
.podcasts-list ul li a { text-decoration: none; color: inherit; }
.podcasts-list ul li a:hover b { color: var(--op-accent); }
.podcasts-list ul li p {
	color: var(--op-muted) !important;
	font-size: 14.5px;
	line-height: 1.5;
	margin: 4px 0 8px !important;
}
.podcasts-list ul li > div {
	font-size: 13px !important;
	color: var(--op-muted) !important;
	display: inline-flex;
	flex-wrap: wrap;
	gap: 14px;
}
.podcasts-list ul li > div span { margin-left: 0 !important; }

/* --- Sidebar: Other Podcast categories chips --- */
.sidebar { position: sticky; top: 92px; }
.sidebar .category-list { background: var(--op-card); border: 1px solid var(--op-line); border-radius: 16px; padding: 22px 22px 24px; }
.sidebar .category-list h4 {
	font-size: 16px;
	font-weight: 600;
	color: var(--op-text);
	margin: 0 0 16px;
	letter-spacing: -0.01em;
}
.sidebar .category-list ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.sidebar .category-list li { margin: 0; }
.sidebar .category-list li a {
	display: inline-block;
	padding: 6px 12px;
	font-size: 13px;
	font-weight: 500;
	color: var(--op-muted);
	background: var(--op-bg);
	border: 1px solid var(--op-line);
	border-radius: 999px;
	text-decoration: none;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.sidebar .category-list li a:hover {
	color: #fff;
	background: var(--op-text);
	border-color: var(--op-text);
}

/* --- "Once you've named your show" mid CTA --- */
.fancy-feature-fortyFive {
	max-width: 916px;
	width: calc(100% - 64px);
	margin: 80px auto !important;
	padding: 60px 24px !important;
	background: var(--op-card);
	border: 1px solid var(--op-line);
	border-radius: 24px;
	box-sizing: border-box;
}
.fancy-feature-fortyFive .title-style-eleven h2,
.fancy-feature-fortyFive .title-style-eleven .subheading {
	font-size: clamp(26px, 3.4vw, 36px);
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: var(--op-text);
	margin: 0 0 12px;
}
.fancy-feature-fortyFive .title-style-eleven h2 span { color: var(--op-accent); }
.fancy-feature-fortyFive .title-style-eleven h3,
.fancy-feature-fortyFive .title-style-eleven h3.subheading {
	font-size: 16px;
	line-height: 1.6;
	font-weight: 400;
	color: var(--op-muted);
	margin: 0 auto;
	max-width: 60ch;
}
.theme-btn-one {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--op-text);
	color: #fff !important;
	padding: 14px 28px;
	border-radius: 999px;
	font-weight: 600;
	font-size: 15px;
	text-decoration: none !important;
	transition: opacity .15s ease, transform .15s ease;
}
.theme-btn-one:hover { opacity: 0.92; transform: translateY(-1px); color: #fff !important; }
.cta-note {
	margin: 14px 0 0;
	font-size: 13.5px;
	color: var(--op-muted);
	text-align: center;
}

/* --- Testimonials grid --- */
.client-feedback-slider-six {
	max-width: 916px;
	width: calc(100% - 64px);
	margin: 80px auto !important;
	padding: 0;
	box-sizing: border-box;
}
.client-feedback-slider-six .inner-container { background: transparent; max-width: none; padding: 0; margin: 0; }
.client-feedback-slider-six .container { max-width: none; padding: 0; }
.client-feedback-slider-six .title-style-seven h2,
.client-feedback-slider-six .title-style-seven .subheading {
	font-size: clamp(28px, 3.4vw, 38px);
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: var(--op-text);
	margin: 0 0 8px;
	text-align: center;
}
.client-feedback-slider-six .title-style-seven p {
	color: var(--op-muted);
	font-size: 16px;
	text-align: center;
	margin: 0 0 40px;
}
.client-feedback-slider-six .title-style-seven img { display: block; margin: 0 auto 20px; max-height: 36px; opacity: 0.85; }
.podcasters-slider {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none;
}
.podcasters-slider .item { display: flex; }
.podcasters-slider .feedback-wrapper {
	background: var(--op-card);
	border: 1px solid var(--op-line);
	border-radius: 18px;
	padding: 26px 24px;
	display: flex;
	flex-direction: column;
	gap: 18px;
	width: 100%;
}
.podcasters-slider .feedback-wrapper p {
	color: var(--op-text);
	font-size: 15px;
	line-height: 1.6;
	margin: 0;
	flex: 1;
}
.podcasters-slider .feedback-wrapper .d-flex { display: flex !important; align-items: center; gap: 14px; }
.podcasters-slider .feedback-wrapper .avatar {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
	flex: 0 0 48px;
}
.podcasters-slider .feedback-wrapper .name {
	font-size: 14px;
	font-weight: 600;
	color: var(--op-text);
	margin: 0;
	line-height: 1.35;
}
.podcasters-slider .feedback-wrapper .name span {
	display: block;
	font-size: 12.5px;
	font-weight: 400;
	color: var(--op-muted);
	margin-top: 2px;
}
.podcasters-slider .feedback-wrapper .name span a.link-underline {
	color: var(--op-muted);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.podcasters-slider .feedback-wrapper .name span a.link-underline:hover { color: var(--op-accent); }

/* ==========================================================
   Mobile responsiveness
   ========================================================== */
@media (max-width: 991px) {
	.feature-blog-one .post-meta { height: auto; }
	.blog-sidebar-one { position: static; margin-top: 24px; }
	.sidebar { position: static; margin-top: 24px; }
	.podcasters-slider { grid-template-columns: repeat(2, 1fr); }
	.service-details-one > .container > .row {
		flex-wrap: wrap;
		gap: 32px;
	}
	.service-details-one .col-xl-9,
	.service-details-one .col-xl-3 {
		flex: 1 1 100%;
		width: 100%;
		max-width: 100%;
	}
	.service-details-one .col-xl-9 { order: 1; }
	.service-details-one .col-xl-3 { order: 2; }
	.service-details-one .details-wrapper { max-width: none; }
}
@media (max-width: 820px) {
	.theme-main-menu .navbar { display: none; }
	.theme-main-menu .right-widget .login { display: none; }
	.theme-main-menu > .d-flex { padding: 14px 20px; gap: 12px; }
	.nav-links { display: none; }
	.btn-ghost { display: none; }
	.nav-dropdown-menu { display: none; }
	.fancy-hero-one { padding: 40px 0 16px; }
	.container, .lg-container { padding: 0 20px; }
	.blog-details-post-v1 .post-meta h1 { font-size: clamp(28px, 7vw, 36px); }
	.blog-details-post-v1 .post-meta h2 { font-size: 24px; margin: 36px 0 14px; }
	.blog-details-post-v1 .post-meta .image-meta { max-height: 260px; }
	.podcasters-slider { grid-template-columns: 1fr; }
	.fancy-short-banner-eight .bg-wrapper { padding: 36px 20px; }
	.fancy-feature-fortyFive { padding: 44px 20px !important; margin: 60px 0 !important; }
}
@media (max-width: 480px) {
	.container, .lg-container { padding: 0 16px; }
	.theme-main-menu > .d-flex { padding: 12px 16px; }
	.blog-details-post-v1 .post-meta p,
	.blog-details-post-v1 .post-meta ul,
	.blog-details-post-v1 .post-meta ol { font-size: 16px; }
}
