/* ==========================================================================
   Atlas Sport — "Blog" (post index, category and tag archives)
   Paired with atlas-blog.php
   Mobile-first; the desktop layout starts at 993px, matching the theme's own
   breakpoint. Between 768px and 992px the grid goes two columns wide but the
   cards keep their mobile row shape, which reads better on a tablet than a
   half-empty three-column grid.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Host container. Shoptimizer's header.php leaves
   #content > .shoptimizer-archive > .col-full open, so without this the page
   renders inside the theme's 1170px box. Scoped to the body class added in
   atlas-blog.php, never to .col-full globally.
   .archive-header keeps its box (only the breadcrumb is removed, in PHP) so
   notices still have somewhere to render. The theme's own blog title goes,
   though: the hero already carries the h1.
   -------------------------------------------------------------------------- */

.atlas-blog-page .site-content .shoptimizer-archive .col-full {
	max-width: none;
	padding: 0;
}
.atlas-blog-page .site-content .shoptimizer-archive { margin-bottom: 0; }
.atlas-blog-page .archive-header { padding: 0; }
.atlas-blog-page .content-area { width: 100%; clear: both; }
.atlas-blog-page .entry-header,
.atlas-blog-page .blog-title { display: none; }
.atlas-blog-page .entry-content { margin: 0; }

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

.atlas-bl {
	--bl-dark: #12291B;
	--bl-hero: #07301A;
	--bl-green: #37765A;
	--bl-green-dark: #2E6B4F;
	--bl-lime: #7AC943;
	--bl-body: #515C57;
	--bl-quiet: #7c877e;
	--bl-cream: #f4f8f1;
	--bl-line: #eceee9;

	width: 100%;
	margin: 0;
	background: #fff;
	color: var(--bl-body);
	font-family: 'Open Sans', Roboto, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
}

.atlas-bl a { color: inherit; text-decoration: none; }
.atlas-bl ul { margin: 0; padding: 0; list-style: none; }
.atlas-bl li::before { content: none !important; } /* kill theme tick bullets */
.atlas-bl img { max-width: 100%; }
.atlas-bl__svg { display: block; width: 100%; height: 100%; }

.atlas-bl .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* --- shared type ------------------------------------------------------- */

.atlas-bl__h1 {
	margin: 0 0 10px;
	font-size: 30px;
	font-weight: 800;
	line-height: 1.18;
	letter-spacing: -.028em;
	color: #fff;
	text-shadow: 0 2px 14px rgba(4, 26, 13, .5);
}

.atlas-bl__h2 {
	margin: 0;
	font-size: 22px;
	font-weight: 800;
	line-height: 1.24;
	letter-spacing: -.022em;
	color: var(--bl-dark);
	text-wrap: balance;
}
.atlas-bl__h2--light { color: #fff; }

.atlas-bl__eyebrow {
	display: block;
	margin-bottom: 12px;
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #8CD84B;
}

/* Reading time, used on both the lead card and the grid cards. */
.atlas-bl__time {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 500;
	line-height: 1;
	color: var(--bl-quiet);
}
.atlas-bl__time > span:first-child {
	display: flex;
	flex: 0 0 auto;
	width: 13px;
	height: 13px;
}

/* "Citește articolul" / "Citește mai mult" */
.atlas-bl__more {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	color: var(--bl-green);
}
.atlas-bl__morearrow {
	display: flex;
	flex: 0 0 auto;
	width: 16px;
	height: 16px;
	transition: transform .18s ease;
}

/* Photo placeholder, for posts with no featured image. */
.atlas-bl__ph {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: #f2f5ef;
	color: #636E67;
}
.atlas-bl__ph > .atlas-bl__svg { width: 24px; height: 24px; }
.atlas-bl__ph > span {
	font-size: 11px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: .07em;
	text-transform: uppercase;
}

/* --- 1. hero ----------------------------------------------------------- */

.atlas-bl__hero {
	position: relative;
	background: var(--bl-hero);
	padding: 24px 20px 28px;
	overflow: hidden;
}
.atlas-bl__heroimg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 45%;
}
.atlas-bl__heroscrim {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(7, 48, 26, .78) 0%, rgba(7, 48, 26, .88) 46%, rgba(6, 42, 23, .96) 100%);
}
.atlas-bl__herogrid {
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: .16;
	background-image:
		linear-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px);
	background-size: 34px 34px;
}
.atlas-bl__heroglow {
	position: absolute;
	right: -110px;
	top: -160px;
	width: 400px;
	height: 400px;
	pointer-events: none;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(122, 201, 67, .20) 0%, rgba(122, 201, 67, 0) 68%);
}
.atlas-bl__heroinner { position: relative; z-index: 2; }

.atlas-bl__crumbs {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 18px;
	font-size: 12px;
	font-weight: 500;
	line-height: 1;
	color: #8fb79a;
}
.atlas-bl__crumbs a { color: #c3dbca; }
.atlas-bl__crumbs a:hover { color: #fff; }
.atlas-bl__crumbs [aria-current] { color: #fff; font-weight: 600; }
.atlas-bl__crumbsep {
	display: flex;
	width: 12px;
	height: 12px;
	color: #6f9a7d;
}

.atlas-bl__lead {
	margin: 0 0 18px;
	font-size: 15px;
	line-height: 1.65;
	color: #dbeadf;
	text-wrap: pretty;
}

.atlas-bl__search {
	display: flex;
	align-items: center;
	gap: 10px;
	background: #fff;
	border-radius: 12px;
	padding: 5px 5px 5px 15px;
}
.atlas-bl__searchicon {
	display: flex;
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	color: #98a29a;
}
.atlas-bl__search input[type="search"] {
	flex: 1 1 auto;
	width: 100%;
	min-width: 0;
	height: auto;
	margin: 0;
	padding: 0;
	border: 0;
	outline: none;
	background: none;
	box-shadow: none;
	font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.3;
	color: var(--bl-dark);
}
.atlas-bl__search input[type="search"]:focus { box-shadow: none; }
.atlas-bl__search input::placeholder { color: #98a29a; opacity: 1; }
.atlas-bl__search button {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 38px;
	height: 38px;
	padding: 10px;
	border: 0;
	border-radius: 10px;
	background: var(--bl-green);
	color: #fff;
	cursor: pointer;
	transition: background .18s ease;
}
.atlas-bl__search button:hover { background: var(--bl-green-dark); }

/* --- 2. filtre de subiect ---------------------------------------------- */

.atlas-bl__filters {
	background: #fff;
	border-bottom: 1px solid var(--bl-line);
	padding: 16px 20px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}
.atlas-bl__filters::-webkit-scrollbar { display: none; }
.atlas-bl__filterslabel { display: none; }

.atlas-bl__pills {
	display: flex;
	gap: 8px;
	width: max-content;
}
.atlas-bl__pill {
	flex: 0 0 auto;
	border-radius: 999px;
	padding: 9px 15px;
	background: #f4f6f2;
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	color: var(--bl-body);
	transition: background .18s ease, color .18s ease;
}
.atlas-bl__pill:hover { background: #e6ece1; color: var(--bl-dark); }
.atlas-bl__pill.is-active,
.atlas-bl__pill.is-active:hover { background: var(--bl-green); color: #fff; }

/* --- 3. articol principal ---------------------------------------------- */

.atlas-bl__leadsec {
	background: #fff;
	padding: 22px 20px 24px;
}
.atlas-bl__leadsec .atlas-bl__h2 { margin-bottom: 14px; }

.atlas-bl__leadcard {
	display: flex;
	flex-direction: column;
	background: var(--bl-cream);
	border: 1px solid #e4ece0;
	border-radius: 16px;
	overflow: hidden;
	transition: box-shadow .2s ease, border-color .2s ease;
}
.atlas-bl__leadcard:hover {
	border-color: #cfe0c3;
	box-shadow: 0 18px 40px rgba(20, 50, 28, .14);
}
.atlas-bl__leadcard:hover .atlas-bl__morearrow { transform: translateX(3px); }

.atlas-bl__leadphoto {
	position: relative;
	aspect-ratio: 16 / 10;
	background: #e2e6df;
	overflow: hidden;
}
.atlas-bl__leadphoto img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.atlas-bl__leadbadge {
	position: absolute;
	left: 12px;
	top: 12px;
	border-radius: 999px;
	padding: 6px 12px;
	background: var(--bl-green);
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #fff;
}

.atlas-bl__leadbody { padding: 18px 18px 20px; }
.atlas-bl__leadmeta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 11px;
	margin-bottom: 11px;
}
.atlas-bl__leadtopic {
	background: #fff;
	border: 1px solid #dfe6da;
	border-radius: 999px;
	padding: 5px 11px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	color: var(--bl-green);
}
.atlas-bl__leadtitle {
	margin: 0 0 10px;
	font-size: 22px;
	font-weight: 800;
	line-height: 1.26;
	letter-spacing: -.022em;
	color: var(--bl-dark);
	text-wrap: pretty;
}
.atlas-bl__leadexcerpt {
	margin: 0 0 16px;
	font-size: 15px;
	line-height: 1.65;
	color: var(--bl-body);
	text-wrap: pretty;
}

/* --- 4. grila de articole ---------------------------------------------- */

.atlas-bl__gridsec {
	background: #fff;
	padding: 0 20px 26px;
}
.atlas-bl__gridhead {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 14px;
	margin-bottom: 16px;
}
.atlas-bl__gridnote {
	margin: 6px 0 0;
	font-size: 13px;
	line-height: 1.5;
	color: var(--bl-quiet);
}

/* sortare */
.atlas-bl__sort {
	position: relative;
	display: flex;
	align-items: center;
	flex: 0 0 auto;
	gap: 8px;
	background: #fbfcfa;
	border: 1.5px solid #e6eae2;
	border-radius: 12px;
	padding: 0 12px 0 14px;
}
.atlas-bl__sort select {
	-webkit-appearance: none;
	appearance: none;
	height: 40px;
	margin: 0;
	padding: 0 22px 0 0;
	border: 0;
	outline: none;
	background: none;
	box-shadow: none;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	color: var(--bl-dark);
	cursor: pointer;
}
.atlas-bl__sortarrow {
	position: absolute;
	right: 11px;
	display: flex;
	width: 16px;
	height: 16px;
	pointer-events: none;
	color: #636E67;
}
/* Kept for the no-JS case; atlas-blog.js submits on change and hides it. */
.atlas-bl__sortgo {
	margin-left: 4px;
	border: 0;
	border-radius: 8px;
	padding: 8px 12px;
	background: var(--bl-green);
	font-family: inherit;
	font-size: 12px;
	font-weight: 700;
	color: #fff;
	cursor: pointer;
}
.atlas-bl--js .atlas-bl__sortgo { display: none; }

.atlas-bl__grid {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

/* Card: a row on mobile (square thumbnail, title, reading time), a stacked
   card from 993px up. One set of markup, reordered with flexbox. */
.atlas-bl__card {
	position: relative;
	display: flex;
	gap: 14px;
	background: #fff;
	border: 1px solid var(--bl-line);
	border-radius: 14px;
	padding: 12px;
	overflow: hidden;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.atlas-bl__card:hover {
	border-color: #cfe0c3;
	box-shadow: 0 14px 32px rgba(20, 50, 28, .10);
}
.atlas-bl__card:hover .atlas-bl__morearrow { transform: translateX(3px); }

.atlas-bl__cardphoto {
	position: relative;
	flex: 0 0 auto;
	width: 124px;
	aspect-ratio: 1 / 1;
	border-radius: 10px;
	overflow: hidden;
	background: #f6f8f4;
}
.atlas-bl__cardphoto img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .3s ease;
}
.atlas-bl__card:hover .atlas-bl__cardphoto img { transform: scale(1.03); }

.atlas-bl__cardbody {
	display: flex;
	flex: 1 1 0;
	flex-direction: column;
	min-width: 0;
}
.atlas-bl__cardtopic {
	order: 1;
	margin-bottom: 6px;
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--bl-green);
}
.atlas-bl__cardtitle {
	order: 2;
	margin: 0 0 8px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.32;
	letter-spacing: -.008em;
	color: var(--bl-dark);
	text-wrap: pretty;
}
.atlas-bl__cardexcerpt {
	order: 3;
	display: none;
	margin: 0 0 18px;
	font-size: 15px;
	line-height: 1.65;
	color: var(--bl-body);
	text-wrap: pretty;
}
.atlas-bl__cardtime {
	order: 4;
	margin-top: auto;
}
.atlas-bl__cardmore {
	order: 5;
	display: none;
	margin-top: auto;
}

/* paginare */
.atlas-bl__pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 24px;
}
.atlas-bl__page {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 36px;
	height: 36px;
	padding: 0 11px;
	border: 1px solid #e6eae2;
	border-radius: 10px;
	background: #fbfcfa;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	color: var(--bl-body);
	transition: border-color .18s ease, color .18s ease;
}
.atlas-bl__page:hover { border-color: #cfe0c3; color: var(--bl-dark); }
.atlas-bl__page.is-active,
.atlas-bl__page.is-active:hover {
	border-color: var(--bl-green);
	background: var(--bl-green);
	color: #fff;
}
.atlas-bl__pagegap {
	padding: 0 2px;
	font-size: 14px;
	font-weight: 700;
	color: var(--bl-quiet);
}

/* stare goală */
.atlas-bl__empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	background: var(--bl-cream);
	border: 1px solid #e4ece0;
	border-radius: 16px;
	padding: 34px 22px 30px;
}
.atlas-bl__emptyicon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	margin-bottom: 14px;
	padding: 13px;
	border-radius: 50%;
	background: #fff;
	color: var(--bl-green);
}
.atlas-bl__empty h3 {
	margin: 0 0 8px;
	font-size: 19px;
	font-weight: 800;
	line-height: 1.28;
	letter-spacing: -.018em;
	color: var(--bl-dark);
}
.atlas-bl__empty p {
	margin: 0 0 18px;
	max-width: 420px;
	font-size: 15px;
	line-height: 1.65;
	text-wrap: pretty;
}
.atlas-bl__emptybtn {
	display: flex;
	align-items: center;
	gap: 9px;
	border-radius: 12px;
	padding: 13px 20px;
	background: var(--bl-green);
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	color: #fff;
	transition: background .18s ease;
}
.atlas-bl__emptybtn:hover { background: var(--bl-green-dark); }
.atlas-bl__emptybtn:hover .atlas-bl__morearrow { transform: translateX(3px); }

/* --- 5. CTA ------------------------------------------------------------ */

.atlas-bl__cta {
	position: relative;
	background: var(--bl-dark);
	padding: 30px 20px 32px;
	overflow: hidden;
}
.atlas-bl__ctaglow {
	position: absolute;
	left: -120px;
	bottom: -180px;
	width: 400px;
	height: 400px;
	pointer-events: none;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(122, 201, 67, .22) 0%, rgba(122, 201, 67, 0) 70%);
}
.atlas-bl__ctainner { position: relative; z-index: 2; }
.atlas-bl__ctacopy .atlas-bl__h2 { margin-bottom: 10px; font-size: 24px; }
.atlas-bl__ctacopy p {
	margin: 0 0 20px;
	font-size: 15px;
	line-height: 1.65;
	color: #b6c6b8;
	text-wrap: pretty;
}
.atlas-bl__ctabtns {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.atlas-bl__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	border-radius: 12px;
	padding: 16px 20px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
	transition: background .18s ease;
}
.atlas-bl__btn--lime {
	background: var(--bl-lime);
	color: #06301A;
}
.atlas-bl__btn--lime:hover { background: #6cbb35; }
.atlas-bl__btn--lime:hover .atlas-bl__morearrow { transform: translateX(3px); }
.atlas-bl__btn--ghost {
	background: rgba(255, 255, 255, .1);
	border: 1.5px solid rgba(255, 255, 255, .22);
	padding: 15px 20px;
	color: #fff;
}
.atlas-bl__btn--ghost:hover { background: rgba(255, 255, 255, .16); }

/* On a narrow phone the title and the sort control cannot share a line. */
@media (max-width: 479px) {
	.atlas-bl__sort { width: 100%; }
	.atlas-bl__sort select { flex: 1 1 auto; }
}

/* ==========================================================================
   Tablet — 768px and up. Two cards a row, still in their row shape.
   ========================================================================== */

@media (min-width: 768px) {

	.atlas-bl__hero { padding: 34px 32px 38px; }
	.atlas-bl__h1 { font-size: 38px; }
	.atlas-bl__lead { max-width: 620px; font-size: 16px; }
	.atlas-bl__search { max-width: 460px; }

	.atlas-bl__filters { padding: 18px 32px; }
	.atlas-bl__leadsec { padding: 30px 32px 32px; }
	.atlas-bl__gridsec { padding: 0 32px 34px; }
	.atlas-bl__cta { padding: 40px 32px 42px; }

	.atlas-bl__grid {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}

	.atlas-bl__ctabtns { flex-direction: row; }
	.atlas-bl__btn { flex: 0 0 auto; }
}

/* ==========================================================================
   Desktop — 993px and up. The layout of the mockup: hero copy beside the
   search box, the lead article on two columns, three cards a row.
   ========================================================================== */

@media (min-width: 993px) {

	/* --- hero --- */

	.atlas-bl__hero { padding: 58px 56px 62px; }
	.atlas-bl__heroscrim {
		background: linear-gradient(96deg, rgba(7, 48, 26, .94) 0%, rgba(7, 48, 26, .86) 30%, rgba(8, 52, 28, .62) 52%, rgba(9, 58, 31, .28) 72%, rgba(10, 63, 33, .06) 100%);
	}
	.atlas-bl__herogrid { opacity: .18; background-size: 46px 46px; }
	.atlas-bl__heroglow {
		right: auto;
		top: auto;
		left: -120px;
		bottom: -260px;
		width: 640px;
		height: 640px;
		background: radial-gradient(circle, rgba(122, 201, 67, .18) 0%, rgba(122, 201, 67, 0) 68%);
	}

	.atlas-bl__crumbs { gap: 10px; margin-bottom: 28px; font-size: 14px; }
	.atlas-bl__crumbsep { width: 14px; height: 14px; }

	.atlas-bl__herotop {
		display: flex;
		align-items: flex-end;
		justify-content: space-between;
		gap: 56px;
	}
	.atlas-bl__herocopy { flex: 1 1 0; min-width: 0; }
	.atlas-bl__eyebrow { margin-bottom: 16px; font-size: 12px; }
	.atlas-bl__h1 { margin-bottom: 12px; font-size: 50px; line-height: 1.1; letter-spacing: -.03em; }
	.atlas-bl__lead {
		margin-bottom: 0;
		max-width: 660px;
		font-size: 18px;
		line-height: 1.7;
		color: #e2eee5;
		text-shadow: 0 1px 12px rgba(4, 26, 13, .55);
	}

	.atlas-bl__search {
		flex: 0 0 auto;
		width: 400px;
		max-width: none;
		gap: 12px;
		border-radius: 14px;
		padding: 6px 6px 6px 18px;
	}
	.atlas-bl__searchicon { width: 20px; height: 20px; }
	.atlas-bl__search input[type="search"] { font-size: 15px; }
	.atlas-bl__search button { width: 42px; height: 42px; border-radius: 11px; }

	/* --- filtre --- */

	.atlas-bl__filters {
		display: flex;
		align-items: center;
		gap: 18px;
		padding: 20px 56px;
		overflow: visible;
	}
	.atlas-bl__filterslabel {
		display: block;
		flex: 0 0 auto;
		font-size: 12px;
		font-weight: 700;
		line-height: 1.4;
		letter-spacing: .14em;
		text-transform: uppercase;
		color: #8d968e;
	}
	.atlas-bl__pills { flex-wrap: wrap; gap: 9px; width: auto; }
	.atlas-bl__pill { padding: 10px 18px; font-size: 14px; }

	/* --- articol principal --- */

	.atlas-bl__leadsec { padding: 40px 56px 44px; }
	.atlas-bl__leadsec .atlas-bl__h2 { margin-bottom: 18px; }
	.atlas-bl__h2 { font-size: 28px; letter-spacing: -.026em; line-height: 1.22; }

	.atlas-bl__leadcard {
		flex-direction: row;
		align-items: stretch;
		gap: 44px;
		border-radius: 22px;
	}
	.atlas-bl__leadphoto {
		flex: 0 0 45%;
		aspect-ratio: auto;
	}
	.atlas-bl__leadbadge {
		left: 20px;
		top: 20px;
		padding: 8px 16px;
		font-size: 11px;
		letter-spacing: .11em;
	}
	.atlas-bl__leadbody {
		display: flex;
		flex: 1 1 0;
		flex-direction: column;
		justify-content: center;
		min-width: 0;
		padding: 40px 44px 40px 0;
	}
	.atlas-bl__leadmeta { gap: 14px; margin-bottom: 16px; }
	.atlas-bl__leadtopic { padding: 6px 13px; font-size: 12px; }
	.atlas-bl__time { font-size: 13px; gap: 7px; }
	.atlas-bl__time > span:first-child { width: 15px; height: 15px; }
	.atlas-bl__leadtitle {
		margin-bottom: 14px;
		font-size: 34px;
		line-height: 1.2;
		letter-spacing: -.028em;
	}
	.atlas-bl__leadexcerpt { margin-bottom: 24px; font-size: 17px; line-height: 1.7; }
	.atlas-bl__more { font-size: 15px; gap: 9px; }
	.atlas-bl__morearrow { width: 18px; height: 18px; }

	/* --- grila --- */

	.atlas-bl__gridsec { padding: 0 56px 44px; }
	.atlas-bl__gridhead { align-items: center; gap: 24px; margin-bottom: 22px; }
	.atlas-bl__sort { padding: 0 14px 0 16px; }
	.atlas-bl__sort select { height: 44px; font-size: 14px; }
	.atlas-bl__sortarrow { right: 13px; width: 18px; height: 18px; }

	.atlas-bl__grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 22px;
	}

	.atlas-bl__card {
		flex-direction: column;
		gap: 0;
		border-radius: 18px;
		padding: 0;
	}
	.atlas-bl__cardphoto {
		width: 100%;
		aspect-ratio: 16 / 10;
		border-radius: 0;
	}
	.atlas-bl__cardbody {
		flex: 1 1 auto;
		padding: 20px 22px 22px;
	}

	/* The topic pill moves onto the photograph. It stays in the body in the
	   markup so the mobile row can read it in flow; the card is the
	   positioning context. */
	.atlas-bl__cardtopic {
		position: absolute;
		left: 14px;
		top: 14px;
		z-index: 2;
		margin: 0;
		border-radius: 999px;
		padding: 6px 13px;
		background: rgba(255, 255, 255, .94);
		font-size: 11px;
		letter-spacing: 0;
		text-transform: none;
	}
	.atlas-bl__cardtopic:hover { background: #fff; }

	.atlas-bl__cardtime {
		order: 1;
		margin: 0 0 11px;
		font-size: 12.5px;
	}
	.atlas-bl__cardtitle {
		order: 2;
		margin-bottom: 10px;
		font-size: 20px;
		line-height: 1.28;
		letter-spacing: -.014em;
	}
	.atlas-bl__cardexcerpt { order: 3; display: block; }
	.atlas-bl__cardmore { order: 4; display: flex; }

	.atlas-bl__pagination { gap: 9px; margin-top: 34px; }
	.atlas-bl__page {
		min-width: 44px;
		height: 44px;
		padding: 0 14px;
		border-radius: 12px;
		font-size: 15px;
	}

	.atlas-bl__empty { padding: 48px 32px 44px; }
	.atlas-bl__empty h3 { font-size: 22px; }

	/* --- CTA --- */

	.atlas-bl__cta { padding: 52px 56px; }
	.atlas-bl__ctaglow {
		left: -140px;
		bottom: -220px;
		width: 600px;
		height: 600px;
		background: radial-gradient(circle, rgba(122, 201, 67, .20) 0%, rgba(122, 201, 67, 0) 70%);
	}
	.atlas-bl__ctainner {
		display: flex;
		align-items: center;
		gap: 64px;
	}
	.atlas-bl__ctacopy { flex: 1 1 0; min-width: 0; }
	.atlas-bl__ctacopy .atlas-bl__h2 {
		margin-bottom: 12px;
		font-size: 34px;
		line-height: 1.18;
		letter-spacing: -.028em;
	}
	.atlas-bl__ctacopy p { margin-bottom: 0; max-width: 560px; font-size: 17px; line-height: 1.7; }
	.atlas-bl__ctabtns { flex: 0 0 auto; gap: 14px; }
	.atlas-bl__btn { border-radius: 14px; padding: 17px 26px; font-size: 17px; }
	.atlas-bl__btn--lime { box-shadow: 0 10px 24px rgba(122, 201, 67, .28); }
	.atlas-bl__btn--ghost { padding: 16px 24px; }
}

/* Narrow desktop: the lead photograph would leave the copy squeezed. */
@media (min-width: 993px) and (max-width: 1200px) {
	.atlas-bl__leadcard { gap: 30px; }
	.atlas-bl__leadphoto { flex: 0 0 42%; }
	.atlas-bl__leadbody { padding: 28px 30px 28px 0; }
	.atlas-bl__leadtitle { font-size: 28px; }
	.atlas-bl__h1 { font-size: 42px; }
}

@media (prefers-reduced-motion: reduce) {
	.atlas-bl *,
	.atlas-bl *::before,
	.atlas-bl *::after {
		transition-duration: .01ms !important;
	}
}