/* Day Group — blog styling.
   Covers three surfaces that the free widget set renders on its own markup:
   the Resources index grid, the single-article body, and the sidebar.
   Loaded on posts, archives, search and /resources/ only. */

/* The full-bleed unwrap for Theme Builder templates lives in
   dd-components.css, since the 404 template needs it too and that file is
   the one loaded site-wide. */

/* ============ POST GRID (xpro-post-grid) ============
   The widget hands its list to Cube Portfolio, which absolutely positions
   every card from JavaScript. That layout is racy - it silently produces a
   single stacked column whenever it initialises before the card images have
   settled - and it cannot reflow when a webfont lands. So the grid is done in
   CSS instead, and Cube Portfolio's inline geometry is neutralised. The cards
   lay out identically whether its script ran, half-ran, or never ran at all. */
.dd-postgrid .xpro-post-grid-main,
.dd-postgrid .cbp-wrapper{
	display:grid !important;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:16px;
	height:auto !important;
	position:static !important;
	align-items:stretch;
}
.dd-postgrid-3 .xpro-post-grid-main,
.dd-postgrid-3 .cbp-wrapper{grid-template-columns:repeat(3,minmax(0,1fr))}
.dd-postgrid .cbp-wrapper-outer{height:auto !important;position:static !important;overflow:visible !important}
.dd-postgrid .xpro-post-grid-main > .cbp-wrapper-outer{grid-column:1 / -1}
.dd-postgrid .cbp-item{
	position:static !important;
	top:auto !important;left:auto !important;
	width:auto !important;height:auto !important;
	transform:none !important;opacity:1 !important;
}
@media (max-width:1024px){
	.dd-postgrid-3 .xpro-post-grid-main,
	.dd-postgrid-3 .cbp-wrapper{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:767px){
	.dd-postgrid .xpro-post-grid-main,
	.dd-postgrid .cbp-wrapper,
	.dd-postgrid-3 .xpro-post-grid-main,
	.dd-postgrid-3 .cbp-wrapper{grid-template-columns:minmax(0,1fr)}
}

.dd-postgrid .xpro-post-grid-item{
	background:#fff;
	border:1px solid rgba(20,58,66,.12);
	border-radius:16px;
	overflow:hidden;
	display:flex;
	flex-direction:column;
	height:100%;
	transition:box-shadow .2s,border-color .2s;
}
.dd-postgrid .xpro-post-grid-item:hover{
	box-shadow:0 4px 24px rgba(20,58,66,.08);
	border-color:rgba(46,139,153,.35);
}
.dd-postgrid .xpro-post-grid-image{margin:0;line-height:0;background:linear-gradient(135deg,#143A42 0%,#2E8B99 100%)}
.dd-postgrid .xpro-post-grid-image img{width:100%;height:160px;object-fit:cover;display:block}
.dd-postgrid .xpro-post-grid-content{
	padding:20px;
	display:flex;
	flex-direction:column;
	flex:1 1 auto;
}
.dd-postgrid .xpro-post-grid-meta-list{
	list-style:none;margin:0 0 8px;padding:0;
	display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;
}
.dd-postgrid .xpro-post-grid-meta-list li{
	font-family:'Hanken Grotesk',system-ui,sans-serif;
	font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
	color:#7A8E93;display:flex;align-items:center;gap:6px;line-height:1.4;
}
.dd-postgrid .xpro-post-grid-meta-list li i,
.dd-postgrid .xpro-post-grid-meta-list li svg{font-size:11px;width:11px;height:11px;color:#7A8E93}
.dd-postgrid .xpro-post-grid-meta-category a{color:#2E8B99;text-decoration:none}
.dd-postgrid .xpro-post-grid-meta-category a:hover{text-decoration:underline}
.dd-postgrid .xpro-post-grid-title{
	font-family:'Hanken Grotesk',system-ui,sans-serif;
	font-size:17px;font-weight:700;color:#143A42;
	letter-spacing:-.01em;line-height:1.35;margin:0 0 8px;
}
.dd-postgrid a:hover .xpro-post-grid-title{color:#2E8B99}
.dd-postgrid .xpro-post-grid-excerpt{
	font-family:'Source Serif 4',Georgia,serif;
	font-size:14.5px;color:#3D5560;line-height:1.6;
	margin:0 0 14px;flex:1 1 auto;
}
.dd-postgrid .xpro-post-grid-btn{
	align-self:flex-start;
	font-family:'Hanken Grotesk',system-ui,sans-serif;
	font-size:13.5px;font-weight:700;color:#2E8B99;
	background:none;padding:0;border:0;text-decoration:none;
}
.dd-postgrid .xpro-post-grid-btn:after{content:' →';font-weight:600}
.dd-postgrid .xpro-post-grid-btn:hover{color:#143A42}

/* Pagination */
.dd-postgrid .xpro-elementor-post-pagination{
	display:flex;align-items:center;gap:8px;margin-top:32px;flex-wrap:wrap;
}
.dd-postgrid .xpro-elementor-post-pagination .page-numbers{
	font-family:'Hanken Grotesk',system-ui,sans-serif;
	font-size:14px;font-weight:600;
	min-width:38px;height:38px;padding:0 10px;
	display:flex;align-items:center;justify-content:center;gap:6px;
	border-radius:9px;border:1.5px solid rgba(20,58,66,.12);
	background:#fff;color:#3D5560;text-decoration:none;transition:all .15s;
}
.dd-postgrid .xpro-elementor-post-pagination .page-numbers.current{
	background:#2E8B99;color:#fff;border-color:#2E8B99;
}
.dd-postgrid .xpro-elementor-post-pagination .page-numbers:hover:not(.current){
	border-color:#2E8B99;color:#2E8B99;
}
.dd-postgrid .xpro-alert{
	font-family:'Hanken Grotesk',system-ui,sans-serif;
	background:#fff;border:1px solid rgba(20,58,66,.12);border-radius:14px;
	padding:24px;display:block;color:#3D5560;
}
.dd-postgrid .xpro-alert-title{display:block;font-weight:700;color:#143A42;margin-bottom:6px}

/* ============ ARCHIVE HEADING ============
   The archive title is dynamic, and Elementor's heading widget does not run
   shortcodes, so the H1 comes through a text editor and is styled here. */
.dd-arch-h1 h1{
	font-family:'Hanken Grotesk',system-ui,sans-serif;
	font-size:46px;font-weight:800;color:#fff;
	letter-spacing:-.03em;line-height:1.07;margin:0 0 16px;
}
@media (max-width:1024px){.dd-arch-h1 h1{font-size:38px}}
@media (max-width:767px){.dd-arch-h1 h1{font-size:30px}}

/* ============ CATEGORY CHIPS ============ */
.dd-cats{display:flex;gap:8px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.dd-cats li{margin:0}
.dd-cats li:before{content:none}
.dd-cats a{
	display:inline-block;
	font-family:'Hanken Grotesk',system-ui,sans-serif;
	font-size:13px;font-weight:600;
	padding:8px 18px;border-radius:999px;
	border:1.5px solid rgba(20,58,66,.12);
	background:#fff;color:#3D5560;text-decoration:none;transition:all .15s;
}
.dd-cats a:hover{border-color:#2E8B99;color:#2E8B99}
.dd-cats .is-active a,.dd-cats a.is-active{background:#2E8B99;color:#fff;border-color:#2E8B99}

/* ============ PILLAR / FEATURED CARD ============ */
.dd-pillar{overflow:hidden}
.dd-pillar-img .elementor-widget-container{line-height:0}
.dd-pillar-img img{width:100%;height:100%;object-fit:cover;display:block}

/* The sidebar link list and the sticky column live in dd-components.css:
   the FAQ page uses them too, and that file is the one loaded site-wide. */

/* ============ ARTICLE BODY ============
   The three legacy posts were pasted from Word, so the markup carries
   data-* spans and inline artefacts. Everything is normalised here rather
   than rewritten, so the client can keep editing in the block editor. */
.dd-post-thumb{margin:0 0 32px;border-radius:18px;overflow:hidden;border:1px solid rgba(20,58,66,.12)}
.dd-post-thumb img{display:block;width:100%;height:auto}

.dd-post-body{font-family:'Source Serif 4',Georgia,serif;color:#3D5560;font-size:17.5px;line-height:1.72}
.dd-post-body > :first-child{margin-top:0}
.dd-post-body p{margin:0 0 20px}
.dd-post-body h2,.dd-post-body h3,.dd-post-body h4{
	font-family:'Hanken Grotesk',system-ui,sans-serif;
	color:#143A42;letter-spacing:-.02em;line-height:1.18;
}
.dd-post-body h2{font-size:30px;font-weight:700;margin:44px 0 14px}
.dd-post-body h3{font-size:22px;font-weight:700;margin:36px 0 12px}
.dd-post-body h4{font-size:17px;font-weight:700;margin:28px 0 10px}
.dd-post-body h2 b,.dd-post-body h3 b,.dd-post-body h4 b,
.dd-post-body h2 strong,.dd-post-body h3 strong,.dd-post-body h4 strong{font-weight:inherit}
.dd-post-body h2:first-child,.dd-post-body h3:first-child{margin-top:0}
.dd-post-body a{color:#2E8B99;text-decoration:underline;text-decoration-color:rgba(46,139,153,.3);text-underline-offset:3px}
.dd-post-body a:hover{text-decoration-color:#2E8B99}
.dd-post-body strong,.dd-post-body b{color:#143A42;font-weight:600}
.dd-post-body ul,.dd-post-body ol{margin:0 0 22px;padding-left:0;list-style:none}
.dd-post-body ol{counter-reset:dd-ol}
.dd-post-body li{position:relative;padding-left:28px;margin:0 0 11px;line-height:1.65}
.dd-post-body ul > li:before{
	content:'';position:absolute;left:6px;top:12px;
	width:7px;height:7px;border-radius:50%;background:#E0913B;
}
.dd-post-body ol > li{counter-increment:dd-ol}
.dd-post-body ol > li:before{
	content:counter(dd-ol);position:absolute;left:0;top:2px;
	font-family:'Hanken Grotesk',system-ui,sans-serif;
	font-size:12px;font-weight:700;color:#2E8B99;
	width:20px;height:20px;border-radius:50%;
	background:rgba(46,139,153,.1);
	display:flex;align-items:center;justify-content:center;
}
.dd-post-body blockquote{
	margin:28px 0;padding:20px 24px;
	background:rgba(46,139,153,.07);
	border-left:3px solid #2E8B99;border-radius:0 12px 12px 0;
	font-size:17px;color:#143A42;
}
.dd-post-body blockquote p:last-child{margin-bottom:0}
.dd-post-body img{max-width:100%;height:auto;border-radius:14px;display:block;margin:28px 0}
.dd-post-body figure{margin:28px 0}
.dd-post-body figcaption{
	font-family:'Hanken Grotesk',system-ui,sans-serif;
	font-size:12.5px;color:#7A8E93;margin-top:8px;
}
.dd-post-body hr{border:0;border-top:1px solid rgba(20,58,66,.12);margin:36px 0}
.dd-post-body table{
	width:100%;border-collapse:collapse;margin:28px 0;
	font-family:'Hanken Grotesk',system-ui,sans-serif;font-size:14.5px;
	border:1px solid rgba(20,58,66,.12);border-radius:12px;overflow:hidden;
}
.dd-post-body th{
	background:#143A42;color:#fff;font-weight:600;text-align:left;
	padding:12px 16px;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;
}
.dd-post-body td{padding:12px 16px;border-top:1px solid rgba(20,58,66,.1);color:#3D5560}
.dd-post-body iframe{max-width:100%;border-radius:14px}
/* Word paste artefacts */
.dd-post-body span[data-ccp-props]{display:inline}
.dd-post-body [style*='font-family']{font-family:inherit !important}
.dd-post-body [style*='font-size']{font-size:inherit !important}
.dd-post-body [style*='background-color']{background:transparent !important}
.dd-post-updated{
	font-family:'Hanken Grotesk',system-ui,sans-serif;
	font-size:12.5px;color:#7A8E93;margin:0 0 8px;
}

/* ============ RESPONSIVE ============ */
@media (max-width:767px){
	.dd-post-body{font-size:16.5px}
	.dd-post-body h2{font-size:25px;margin-top:34px}
	.dd-post-body h3{font-size:20px;margin-top:28px}
	.dd-postgrid .xpro-elementor-post-pagination{gap:6px}
}