/**
 * UXDivi · Blog archive CSS
 * Versión: 1.0.0
 *
 * Scope: body.uxdivi-frontend--blog (aplica vía mu-plugin body_class).
 * Patrón: tokens DS + componentes del archive (extraído de
 *         /rediseno/Blog Archive.html líneas 13-407).
 *
 * NOTA: este CSS conserva el header/footer del Theme Builder de Divi 5.
 * Solo tematiza el <main class="ux-blog"> entre ellos.
 */

/* ═══ Tokens DS ═══ */
body.uxdivi-frontend--blog {
	--brand: #014DFD; --brand-light: #4A7EFF; --brand-2: #0035C4;
	--cyan: #62E5FF; --cyan-2: #8CEEFF;
	--ink: #F5F8FF; --ink-2: #C6D2E8; --ink-3: #8894B3; --ink-4: #566080;
	--bg: #040814; --bg-2: #070C1C; --surface: #0A0F1E; --surface-2: #10172B; --surface-3: #18213E;
	--line: rgba(98,229,255,0.08); --line-2: rgba(255,255,255,0.10); --line-strong: rgba(98,229,255,0.25);
	--success: #22D39A; --warning: #F5B97F; --danger: #FF5E7A;
	--display: 'Bricolage Grotesque', system-ui, sans-serif;
	--body: 'Inter', system-ui, sans-serif;
	--mono: 'JetBrains Mono', ui-monospace, monospace;
	--radius-xl: 28px; --radius-lg: 20px; --radius: 14px; --radius-sm: 10px; --radius-pill: 999px;
	--glow-brand: 0 10px 40px -8px rgba(1,77,253,0.55);
	--grad-primary: linear-gradient(135deg, var(--brand) 0%, var(--brand-light) 100%);
	--ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

/* ═══ Reset scoped al main del blog ═══ */
body.uxdivi-frontend--blog .ux-blog,
body.uxdivi-frontend--blog .ux-blog *,
body.uxdivi-frontend--blog .ux-blog *::before,
body.uxdivi-frontend--blog .ux-blog *::after { box-sizing: border-box; }
body.uxdivi-frontend--blog .ux-blog {
	background: var(--bg);
	color: var(--ink-2);
	font-family: var(--body);
	font-size: 15px;
	line-height: 1.55;
}
body.uxdivi-frontend--blog .ux-blog h1,
body.uxdivi-frontend--blog .ux-blog h2,
body.uxdivi-frontend--blog .ux-blog h3,
body.uxdivi-frontend--blog .ux-blog h4 { font-family: var(--display); color: var(--ink); font-weight: 600; letter-spacing: -0.015em; margin: 0; }
body.uxdivi-frontend--blog .ux-blog p { margin: 0; color: var(--ink-2); }
body.uxdivi-frontend--blog .ux-blog a { color: inherit; text-decoration: none; }
body.uxdivi-frontend--blog .ux-blog button { font-family: inherit; cursor: pointer; }
body.uxdivi-frontend--blog .ux-blog .wrap { max-width: 1280px; margin: 0 auto; padding-left: 32px; padding-right: 32px; }
/* En desktop el grid del layout NO lleva padding interno: queda alineado al ancho del Navbar (1280px). */
body.uxdivi-frontend--blog .blog-layout .wrap { padding-left: 0; padding-right: 0; }

body.uxdivi-frontend--blog .ux-blog .eyebrow { font-family: var(--mono); font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.14em; color: var(--cyan); display: inline-block; }
body.uxdivi-frontend--blog .ux-blog .btn { display: inline-flex; align-items: center; gap: 8px; padding: 13px 22px; border-radius: var(--radius); font-family: var(--display); font-weight: 600; font-size: 14px; transition: transform .15s var(--ease), box-shadow .15s var(--ease); cursor: pointer; }
body.uxdivi-frontend--blog .ux-blog .btn-primary { background: var(--grad-primary); color: #fff; box-shadow: var(--glow-brand); border: 0; }
body.uxdivi-frontend--blog .ux-blog .btn-primary:hover { transform: translateY(-2px); }
body.uxdivi-frontend--blog .ux-blog .btn-ghost { background: rgba(255,255,255,0.04); color: var(--ink); border: 1px solid var(--line-2); }
body.uxdivi-frontend--blog .ux-blog .btn-ghost:hover { border-color: var(--cyan); color: var(--cyan); }
body.uxdivi-frontend--blog .ux-blog .btn .arr { transition: transform .15s var(--ease); }
body.uxdivi-frontend--blog .ux-blog .btn:hover .arr { transform: translateX(3px); }

/* ─── Hero ─── */
body.uxdivi-frontend--blog .blog-hero { position: relative; padding: 64px 0 72px; text-align: center; overflow: hidden; }
body.uxdivi-frontend--blog .blog-hero::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background:
		radial-gradient(900px 460px at 50% 0%, rgba(1,77,253,0.28), transparent 60%),
		radial-gradient(700px 460px at 80% 40%, rgba(98,229,255,0.08), transparent 60%);
}
body.uxdivi-frontend--blog .blog-hero::after {
	content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0.4;
	background:
		repeating-linear-gradient(0deg,  rgba(98,229,255,0.03) 0 1px, transparent 1px 56px),
		repeating-linear-gradient(90deg, rgba(98,229,255,0.03) 0 1px, transparent 1px 56px);
	mask-image: radial-gradient(600px 400px at 50% 40%, #000 30%, transparent 85%);
}
body.uxdivi-frontend--blog .blog-hero .wrap { position: relative; }
body.uxdivi-frontend--blog .blog-hero .pill-top {
	display: inline-flex; align-items: center; gap: 10px;
	padding: 8px 16px; border-radius: 999px;
	background: rgba(98,229,255,0.08); border: 1px solid rgba(98,229,255,0.3);
	color: var(--cyan); font-family: var(--mono); font-size: 11px;
	letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 26px;
}
body.uxdivi-frontend--blog .blog-hero .pill-top .d { width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 10px var(--cyan); }
body.uxdivi-frontend--blog .blog-hero h1 { font-size: clamp(40px, 5.2vw, 62px); line-height: 1.02; letter-spacing: -0.03em; max-width: 860px; margin: 0 auto; }
body.uxdivi-frontend--blog .blog-hero h1 .grad {
	background: linear-gradient(120deg, #FFFFFF 0%, #62E5FF 70%, #8CEEFF 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
body.uxdivi-frontend--blog .blog-hero .sub { margin: 22px auto 36px; font-size: 17px; color: var(--ink-2); line-height: 1.6; max-width: 680px; text-wrap: pretty; }

body.uxdivi-frontend--blog .hero-stats {
	margin: 26px auto 0;
	display: inline-flex; gap: 22px; flex-wrap: wrap; justify-content: center;
	padding: 12px 22px; border-radius: 999px;
	background: rgba(255,255,255,0.025); border: 1px solid var(--line-2);
	font-family: var(--mono); font-size: 11.5px; color: var(--ink-3); letter-spacing: 0.06em;
}
body.uxdivi-frontend--blog .hero-stats .st { display: inline-flex; align-items: center; gap: 8px; }
body.uxdivi-frontend--blog .hero-stats .st b { color: var(--cyan); font-weight: 600; font-family: var(--display); font-size: 13px; }
body.uxdivi-frontend--blog .hero-stats .sep { width: 1px; align-self: stretch; background: var(--line-2); }

/* ─── 2. Layout sidebar + content ─── */
body.uxdivi-frontend--blog .blog-layout { padding: 20px 0 80px; }
body.uxdivi-frontend--blog .blog-layout .wrap { display: grid; grid-template-columns: 280px 1fr; gap: 40px; align-items: start; }

body.uxdivi-frontend--blog .sidebar { position: sticky; top: 24px; display: grid; gap: 28px; }
body.uxdivi-frontend--blog .sb-block { padding: 22px; background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--radius-lg); }
body.uxdivi-frontend--blog .sb-label { display: block; font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 14px; }
body.uxdivi-frontend--blog .sb-search { position: relative; }
body.uxdivi-frontend--blog .sb-search input {
	width: 100%; padding: 11px 14px 11px 38px;
	background: rgba(255,255,255,0.03); border: 1px solid var(--line-2);
	border-radius: 10px; font-family: var(--body); font-size: 13.5px;
	color: var(--ink); outline: none; transition: border-color .15s;
}
body.uxdivi-frontend--blog .sb-search input:focus { border-color: var(--cyan); }
body.uxdivi-frontend--blog .sb-search svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--ink-4); }

body.uxdivi-frontend--blog .cat-list { display: grid; gap: 4px; }
body.uxdivi-frontend--blog .cat-list .cat {
	display: flex; align-items: center; justify-content: space-between;
	padding: 9px 12px; border-radius: 8px;
	color: var(--ink-2); font-size: 13.5px;
	transition: background .15s, color .15s; border: 1px solid transparent;
}
body.uxdivi-frontend--blog .cat-list .cat:hover { background: rgba(98,229,255,0.06); color: var(--ink); }
body.uxdivi-frontend--blog .cat-list .cat .count { font-family: var(--mono); font-size: 11px; color: var(--ink-4); }
body.uxdivi-frontend--blog .cat-list .cat.active {
	background: linear-gradient(90deg, rgba(1,77,253,0.16), rgba(98,229,255,0.06));
	border-color: rgba(98,229,255,0.3); color: var(--ink);
}
body.uxdivi-frontend--blog .cat-list .cat.active .count { color: var(--cyan); }
body.uxdivi-frontend--blog .cat-list .cat .radio { width: 14px; height: 14px; border-radius: 50%; border: 1px solid var(--ink-4); flex-shrink: 0; display: grid; place-items: center; margin-right: 10px; }
body.uxdivi-frontend--blog .cat-list .cat.active .radio { border-color: var(--cyan); }
body.uxdivi-frontend--blog .cat-list .cat.active .radio::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 6px var(--cyan); }
body.uxdivi-frontend--blog .cat-list .cat .left-side { display: flex; align-items: center; }

body.uxdivi-frontend--blog .tags-cloud { display: flex; flex-wrap: wrap; gap: 6px; }
body.uxdivi-frontend--blog .tag-pill {
	padding: 6px 11px; border-radius: 999px;
	background: rgba(255,255,255,0.03); border: 1px solid var(--line-2);
	font-family: var(--mono); font-size: 11px; color: var(--ink-2);
	letter-spacing: 0.02em; transition: border-color .15s, color .15s;
}
body.uxdivi-frontend--blog .tag-pill:hover { border-color: var(--cyan); color: var(--cyan); }
body.uxdivi-frontend--blog .tag-pill.lg { font-size: 12.5px; padding: 7px 13px; color: var(--ink); }
body.uxdivi-frontend--blog .tag-pill.md { font-size: 11.5px; }

body.uxdivi-frontend--blog .sb-cta {
	position: relative; padding: 24px 22px 22px; border-radius: var(--radius-lg);
	overflow: hidden;
	background:
		radial-gradient(400px 280px at 100% 0%, rgba(98,229,255,0.2), transparent 60%),
		linear-gradient(160deg, rgba(1,77,253,0.6), rgba(1,77,253,0.15) 50%, rgba(6,11,28,0.9));
	border: 1px solid rgba(98,229,255,0.32);
	box-shadow: 0 20px 50px -20px rgba(1,77,253,0.55);
}
body.uxdivi-frontend--blog .sb-cta::before {
	content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0.4;
	background-image:
		radial-gradient(circle at 20% 90%, rgba(98,229,255,0.18) 0 2px, transparent 2px),
		radial-gradient(circle at 60% 80%, rgba(98,229,255,0.12) 0 1.5px, transparent 1.5px),
		radial-gradient(circle at 85% 20%, rgba(98,229,255,0.22) 0 2px, transparent 2px),
		radial-gradient(circle at 30% 30%, rgba(98,229,255,0.1) 0 1.5px, transparent 1.5px);
}
body.uxdivi-frontend--blog .sb-cta-badge {
	position: relative; display: inline-flex; align-items: center; gap: 8px;
	padding: 5px 11px; border-radius: 999px;
	background: rgba(98,229,255,0.15); border: 1px solid rgba(98,229,255,0.35);
	font-family: var(--mono); font-size: 10px; letter-spacing: 0.14em;
	text-transform: uppercase; color: var(--cyan); margin-bottom: 14px; font-weight: 600;
}
body.uxdivi-frontend--blog .sb-cta h3 { position: relative; font-size: 19px; line-height: 1.2; letter-spacing: -0.02em; color: var(--ink); margin-bottom: 10px; }
body.uxdivi-frontend--blog .sb-cta .sb-cta-body { position: relative; font-size: 13px; color: var(--ink-2); line-height: 1.5; margin-bottom: 14px; }
body.uxdivi-frontend--blog .sb-cta .sb-cta-bul { position: relative; display: grid; gap: 7px; margin-bottom: 18px; list-style: none; padding: 0; }
body.uxdivi-frontend--blog .sb-cta .sb-cta-bul li { display: flex; gap: 7px; font-size: 12.5px; color: var(--ink); align-items: flex-start; }
body.uxdivi-frontend--blog .sb-cta .sb-cta-bul .ck { width: 14px; height: 14px; border-radius: 4px; background: rgba(98,229,255,0.2); border: 1px solid rgba(98,229,255,0.4); color: var(--cyan); display: grid; place-items: center; flex-shrink: 0; margin-top: 2px; }
body.uxdivi-frontend--blog .sb-cta .sb-cta-bul .ck svg { width: 9px; height: 9px; }
/* `.sb-cta-btn` ahora convive con la clase `.uxdivi-glow-btn` (efecto
   conic-gradient brand del DS). Esta regla solo aporta layout (display
   flex full-width + padding sidebar-compact). Los colores/background/
   border-radius los maneja `.uxdivi-glow-btn` desde
   `uxdivi-glow-btn.css`. */
body.uxdivi-frontend--blog .sb-cta .sb-cta-btn {
	display: flex; width: 100%;
	padding: 12px 18px;
	font-family: var(--display); font-weight: 600; font-size: 13.5px;
	letter-spacing: 0.01em;
}
body.uxdivi-frontend--blog .sb-cta .sb-cta-btn .arr { font-family: var(--mono); }
body.uxdivi-frontend--blog .sb-cta .sb-cta-micro { position: relative; text-align: center; font-family: var(--mono); font-size: 10px; color: var(--ink-3); letter-spacing: 0.08em; margin-top: 10px; }

/* ─── Grid posts ─── */
body.uxdivi-frontend--blog .posts-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 22px; gap: 16px; flex-wrap: wrap; }
body.uxdivi-frontend--blog .posts-head h2 { font-size: 22px; letter-spacing: -0.015em; }
body.uxdivi-frontend--blog .posts-head .small { font-family: var(--mono); font-size: 11px; color: var(--ink-3); letter-spacing: 0.08em; }
body.uxdivi-frontend--blog .posts-head .small b { color: var(--cyan); font-weight: 600; font-family: var(--display); font-size: 13px; }

body.uxdivi-frontend--blog .sort-row { display: flex; gap: 6px; margin-bottom: 22px; flex-wrap: wrap; }
body.uxdivi-frontend--blog .sort-chip {
	padding: 7px 13px; border-radius: 999px;
	background: rgba(255,255,255,0.03); border: 1px solid var(--line-2);
	font-family: var(--mono); font-size: 11px; color: var(--ink-2); letter-spacing: 0.04em;
	transition: border-color .15s, color .15s;
}
body.uxdivi-frontend--blog .sort-chip:hover { border-color: rgba(98,229,255,0.25); color: var(--ink); }
body.uxdivi-frontend--blog .sort-chip.active { border-color: rgba(98,229,255,0.45); color: var(--cyan); background: rgba(98,229,255,0.06); }

body.uxdivi-frontend--blog .grid-posts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }

body.uxdivi-frontend--blog .post-card {
	position: relative; display: flex; flex-direction: column;
	background: var(--surface); border: 1px solid var(--line-2);
	border-radius: var(--radius-lg); overflow: hidden;
	transition: transform .2s, border-color .2s, box-shadow .2s; cursor: pointer;
}
body.uxdivi-frontend--blog .post-card:hover { transform: translateY(-3px); border-color: rgba(98,229,255,0.3); box-shadow: 0 24px 40px -20px rgba(1,77,253,0.35); }
body.uxdivi-frontend--blog .post-card .pc-art { position: relative; aspect-ratio: 16 / 9; background: linear-gradient(135deg, #0b1740, #0a0f1e); overflow: hidden; }
body.uxdivi-frontend--blog .post-card .pc-art img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s; }
body.uxdivi-frontend--blog .post-card:hover .pc-art img { transform: scale(1.04); }
body.uxdivi-frontend--blog .pc-badges { position: absolute; top: 12px; left: 12px; display: flex; gap: 6px; z-index: 2; }
body.uxdivi-frontend--blog .pc-b {
	padding: 4px 9px; border-radius: 5px;
	background: rgba(10,15,30,0.85); backdrop-filter: blur(8px);
	border: 1px solid rgba(98,229,255,0.3);
	font-family: var(--mono); font-size: 9.5px; font-weight: 600;
	letter-spacing: 0.12em; text-transform: uppercase; color: var(--cyan);
}
body.uxdivi-frontend--blog .pc-b.new {
	background: linear-gradient(180deg, rgba(255,211,77,0.25), rgba(255,211,77,0.1));
	border-color: rgba(255,211,77,0.45);
	color: #FFD34D;
}
body.uxdivi-frontend--blog .post-card .pc-body { padding: 20px 22px 20px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
body.uxdivi-frontend--blog .pc-meta-top { display: inline-flex; align-items: center; gap: 9px; font-family: var(--mono); font-size: 10.5px; color: var(--ink-3); letter-spacing: 0.1em; text-transform: uppercase; }
body.uxdivi-frontend--blog .pc-meta-top .dot { color: var(--ink-4); }
body.uxdivi-frontend--blog .pc-meta-top .cat { color: var(--cyan); }
body.uxdivi-frontend--blog .post-card h3 { font-size: 17.5px; line-height: 1.28; letter-spacing: -0.015em; transition: color .15s; text-wrap: balance; color: var(--ink); }
body.uxdivi-frontend--blog .post-card:hover h3 { color: var(--cyan); }
body.uxdivi-frontend--blog .post-card .pc-ex { font-size: 13.5px; color: var(--ink-3); line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
body.uxdivi-frontend--blog .pc-foot {
	display: flex; align-items: center; gap: 9px; margin-top: auto; padding-top: 14px;
	border-top: 1px solid var(--line-2);
	font-size: 12px; color: var(--ink-3);
}
body.uxdivi-frontend--blog .pc-foot .av { width: 22px; height: 22px; border-radius: 50%; overflow: hidden; flex-shrink: 0; border: 1px solid var(--line-2); }
body.uxdivi-frontend--blog .pc-foot .av img { width: 100%; height: 100%; object-fit: cover; }
body.uxdivi-frontend--blog .pc-foot b { color: var(--ink-2); font-weight: 500; }
body.uxdivi-frontend--blog .pc-foot .divider { color: var(--ink-4); }

/* ─── 5. Load more ─── */
body.uxdivi-frontend--blog .load-wrap { margin-top: 56px; text-align: center; }
body.uxdivi-frontend--blog .btn-load {
	display: inline-flex; align-items: center; gap: 10px;
	padding: 14px 28px; border-radius: 999px;
	background: rgba(255,255,255,0.04); border: 1px solid var(--line-2);
	color: var(--ink); font-family: var(--display); font-weight: 500; font-size: 14px;
	transition: border-color .15s, background .15s;
}
body.uxdivi-frontend--blog .btn-load:hover { border-color: rgba(98,229,255,0.4); background: rgba(98,229,255,0.06); }
body.uxdivi-frontend--blog .btn-load svg { color: var(--cyan); }
body.uxdivi-frontend--blog .load-micro { margin-top: 14px; font-family: var(--mono); font-size: 11px; color: var(--ink-3); letter-spacing: 0.08em; }

/* ─── No results ─── */
body.uxdivi-frontend--blog .no-results { text-align: center; padding: 56px 32px; background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--radius-lg); }
body.uxdivi-frontend--blog .no-results h3 { font-size: 22px; color: var(--ink); margin-bottom: 12px; }
body.uxdivi-frontend--blog .no-results p { color: var(--ink-2); margin-bottom: 24px; }

/* ─── AJAX loading state ─── */
body.uxdivi-frontend--blog [data-uxblog-content].is-loading { position: relative; }
body.uxdivi-frontend--blog [data-uxblog-content].is-loading::after {
	content: ""; position: absolute; inset: 0;
	background: rgba(4,8,20,0.55); backdrop-filter: blur(2px);
	border-radius: var(--radius-lg);
	pointer-events: none; z-index: 5;
}
body.uxdivi-frontend--blog [data-uxblog-content].is-loading [data-uxblog-grid] { opacity: 0.4; transition: opacity .2s var(--ease); }
body.uxdivi-frontend--blog [data-uxblog-content].is-loading::before {
	content: ""; position: absolute; left: 50%; top: 200px; z-index: 6;
	width: 32px; height: 32px; margin-left: -16px;
	border: 2px solid rgba(98,229,255,0.2); border-top-color: var(--cyan);
	border-radius: 50%;
	animation: uxblog-spin 0.7s linear infinite;
}
@keyframes uxblog-spin { to { transform: rotate(360deg); } }

/* Search compacto (shortcode insertable en Divi) */
body .uxdivi-blog-search-mini {
	display: inline-flex; align-items: center; gap: 8px;
	height: 38px; padding: 0 12px 0 14px;
	background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
	border-radius: 999px;
	font-family: 'Inter', system-ui, sans-serif;
	transition: border-color .15s ease, background .15s ease;
}
body .uxdivi-blog-search-mini:focus-within { border-color: rgba(98,229,255,0.45); background: rgba(98,229,255,0.06); }
body .uxdivi-blog-search-mini svg { color: #62E5FF; flex-shrink: 0; }
body .uxdivi-blog-search-mini input {
	border: 0; outline: 0; background: transparent;
	color: #F5F8FF; font-size: 13.5px; font-family: inherit;
	min-width: 180px;
}
body .uxdivi-blog-search-mini input::placeholder { color: #8894B3; }
body .uxdivi-blog-search-mini button {
	border: 0; background: transparent; cursor: pointer;
	color: #62E5FF; font-family: 'JetBrains Mono', monospace;
	font-size: 10px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
	padding: 4px 8px; border-radius: 999px;
}
body .uxdivi-blog-search-mini button:hover { background: rgba(98,229,255,0.1); }

/* ─── Responsive ─── */
@media (max-width: 980px) {
	body.uxdivi-frontend--blog .blog-layout .wrap { grid-template-columns: 1fr; gap: 32px; padding-left: 18px; padding-right: 18px; }
	body.uxdivi-frontend--blog .ux-blog__content { order: 1; }
	body.uxdivi-frontend--blog .sidebar { order: 2; position: static; grid-template-columns: 1fr 1fr; gap: 18px; }
	body.uxdivi-frontend--blog .sidebar .sb-cta { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
	body.uxdivi-frontend--blog .ux-blog .wrap { padding-left: 18px; padding-right: 18px; }
	body.uxdivi-frontend--blog .blog-hero { padding: 40px 0 48px; }
	body.uxdivi-frontend--blog .sidebar { grid-template-columns: 1fr; }
	body.uxdivi-frontend--blog .grid-posts { grid-template-columns: 1fr; }
}