/* =============================================================================
   Diakonis — News & Blog Hub  ([diakonis_news_hub])
   Reproduces the original Blog / Actualités layout (horizontal post cards +
   "Suivez-nous / Articles récents" sidebar) with a Blog / Évènements filter and
   a per-card Share row. Design system: navy #170B3A titles · magenta #C434C9
   meta & links · purple #350F79 CTA/active tab · pill buttons. Real px (zoom 0.8).
   ============================================================================= */

#page-container .dkNewsHub { width: 100%; font-family: inherit; }

/* optional heading above everything (off by default) */
#page-container .dkNewsHub__eyebrow { text-align:center; text-transform:uppercase; letter-spacing:3px; font-size:13px; font-weight:600; color:#C434C9; margin:0 0 10px; }
#page-container .dkNewsHub__title { text-align:center; font-family:"Raleway",sans-serif; font-weight:800; color:#170B3A; font-size:35px; line-height:1.3; margin:0 0 30px; }

/* --- two-column layout: main list + sidebar (like the old 3/4 + 1/4) -------- */
#page-container .dkNewsHub__layout { display:flex; gap:50px; align-items:flex-start; }
#page-container .dkNewsHub__main { flex:1 1 auto; min-width:0; }
#page-container .dkNewsHub__sidebar { flex:0 0 260px; width:260px; padding-left:30px; border-left:1px solid #d6d6d6; box-sizing:border-box; }

/* --- filter bar (tabs) ---------------------------------------------------- */
#page-container .dkNewsHub__filter { display:flex; flex-wrap:wrap; gap:12px; margin:0 0 45px; }
#page-container .dkNewsHub__tab {
	appearance:none; cursor:pointer; border:1px solid #E4DCEC; background:#FFFFFF; color:#170B3A !important;
	font-family:inherit; font-size:15px; font-weight:600; line-height:1; padding:13px 28px; border-radius:50px;
	transition:background-color .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease;
}
#page-container .dkNewsHub__tab:hover { border-color:#350F79; color:#350F79 !important; }
#page-container .dkNewsHub__tab.is-active { background:#350F79; border-color:#350F79; color:#FFFFFF !important; box-shadow:0 6px 18px -8px rgba(53,15,121,.6); }
#page-container .dkNewsHub__tab .dkNewsHub__count { opacity:.6; font-weight:700; margin-left:6px; font-size:13px; }

/* --- horizontal post card ------------------------------------------------- */
#page-container .dkNewsHub__list { display:block; }
#page-container .dkNewsHub__card { display:flex; gap:35px; align-items:flex-start; margin:0 0 55px; }
#page-container .dkNewsHub__card:last-child { margin-bottom:0; }
#page-container .dkNewsHub__card[hidden] { display:none; }

#page-container .dkNewsHub__thumb { flex:0 0 40%; max-width:355px; display:block; overflow:hidden; background:#F0ECF5; align-self:stretch; }
#page-container .dkNewsHub__thumb img { width:100%; height:100%; min-height:230px; object-fit:cover; display:block; transition:transform .5s ease; }
#page-container .dkNewsHub__card:hover .dkNewsHub__thumb img { transform:scale(1.04); }

#page-container .dkNewsHub__body { flex:1 1 auto; min-width:0; padding-top:4px; }
#page-container .dkNewsHub__cardtitle { font-size:26px; line-height:1.3; font-weight:600; color:#170B3A !important; margin:0 0 12px; }
#page-container .dkNewsHub__cardtitle a { color:#170B3A !important; text-decoration:none; transition:color .2s ease; }
#page-container .dkNewsHub__cardtitle a:hover { color:#C434C9 !important; }

#page-container .dkNewsHub__meta { font-size:14px; color:#C434C9 !important; margin:0 0 14px; line-height:1.5; }
#page-container .dkNewsHub__meta a { color:#C434C9 !important; text-decoration:none; }
#page-container .dkNewsHub__meta a.dkNewsHub__author { font-weight:700; }
#page-container .dkNewsHub__meta a:hover { color:#170B3A !important; }
#page-container .dkNewsHub__meta .dkNewsHub__sep { color:#C434C9; opacity:.6; margin:0 2px; }

#page-container .dkNewsHub__excerpt {
	font-size:14px; line-height:1.8; color:#666666 !important; margin:0 0 22px;
	display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden;
}

/* --- actions row: Lire + Share -------------------------------------------- */
#page-container .dkNewsHub__actions { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px 20px; }
#page-container .dkNewsHub__more {
	display:inline-block; background:#350F79; color:#FFFFFF !important; font-size:14px; font-weight:700;
	text-decoration:none; padding:13px 34px; border-radius:50px; transition:background-color .2s ease,transform .2s ease;
}
#page-container .dkNewsHub__more:hover { background:#170B3A; transform:translateX(2px); }

/* --- share -------------------------------------------------------------- */
#page-container .dkNewsHub__share { display:flex; align-items:center; gap:7px; }
#page-container .dkNewsHub__shareLabel { font-size:13px; font-weight:600; color:#170B3A; margin-right:2px; }
#page-container .dkNewsHub__sbtn {
	position:relative; width:32px; height:32px; border-radius:50%; border:0; cursor:pointer; padding:0;
	display:inline-flex; align-items:center; justify-content:center;
	background:#F1ECF8; color:#350F79; transition:background-color .2s ease,color .2s ease,transform .2s ease;
}
#page-container .dkNewsHub__sbtn:hover { background:#350F79; color:#FFFFFF; transform:translateY(-2px); }
#page-container .dkNewsHub__sbtn svg { width:16px; height:16px; }
#page-container .dkNewsHub__copied {
	position:absolute; bottom:calc(100% + 8px); left:50%; transform:translateX(-50%);
	background:#170B3A; color:#fff; font-size:11px; font-weight:600; padding:4px 9px; border-radius:5px;
	white-space:nowrap; opacity:0; pointer-events:none; transition:opacity .15s ease;
}
#page-container .dkNewsHub__copied::after { content:""; position:absolute; top:100%; left:50%; transform:translateX(-50%); border:5px solid transparent; border-top-color:#170B3A; }
#page-container .dkNewsHub__sbtn--copy.is-copied .dkNewsHub__copied { opacity:1; }

/* --- sidebar -------------------------------------------------------------- */
#page-container .dkNewsHub__sideTitle { color:#170B3A !important; font-weight:600; font-size:20px; margin:0 0 16px; }
#page-container .dkNewsHub__sideTitle--recent { margin-top:40px; }
#page-container .dkNewsHub__follow { display:flex; gap:10px; flex-wrap:wrap; }
#page-container .dkNewsHub__fbtn { width:34px; height:34px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:#FFFFFF !important; transition:background-color .2s ease,transform .2s ease; }
#page-container .dkNewsHub__fbtn svg { width:16px; height:16px; }
#page-container .dkNewsHub__fbtn--linkedin { background:#350F79; }
#page-container .dkNewsHub__fbtn--instagram { background:#ea2c59; }
#page-container .dkNewsHub__fbtn--x { background:#000000; }
#page-container .dkNewsHub__fbtn--youtube { background:#FF0000; }
#page-container .dkNewsHub__fbtn:hover { background:#C434C9; transform:translateY(-2px); }

#page-container .dkNewsHub__recent { list-style:none; margin:0; padding:0; }
#page-container .dkNewsHub__recent li { margin:0 0 16px; line-height:1.4; }
#page-container .dkNewsHub__recent a { color:#170B3A !important; text-decoration:none; font-size:15px; transition:color .2s ease; }
#page-container .dkNewsHub__recent a:hover { color:#C434C9 !important; }

/* --- empty state ---------------------------------------------------------- */
#page-container .dkNewsHub__empty { color:#666666; font-size:15px; padding:20px 0 40px; }
#page-container .dkNewsHub__empty[hidden] { display:none; }

/* --- responsive (design-system breakpoints) ------------------------------- */
@media (max-width: 1024px) {
	/* The hub section is full-bleed (its Divi row/column carry no side padding)
	   and only gains a gutter once the 1280px row can center (>1024px viewport).
	   At/below the tablet boundary that gutter is 0, so content ran edge-to-edge
	   on phone & tablet — restore a scaling side gutter here. */
	#page-container .dkNewsHub { box-sizing:border-box; padding-left:clamp(20px, 4.2vw, 44px); padding-right:clamp(20px, 4.2vw, 44px); }
	#page-container .dkNewsHub__layout { flex-direction:column; gap:0; }
	#page-container .dkNewsHub__sidebar { flex-basis:auto; width:100%; border-left:0; border-top:1px solid #d6d6d6; padding-left:0; padding-top:34px; margin-top:20px; }
	#page-container .dkNewsHub__follow { margin-bottom:6px; }
}
@media (max-width: 680px) {
	#page-container .dkNewsHub__card { flex-direction:column; gap:18px; margin-bottom:45px; }
	#page-container .dkNewsHub__thumb { flex-basis:auto; width:100%; max-width:none; }
	#page-container .dkNewsHub__thumb img { min-height:0; aspect-ratio:16/9; }
	#page-container .dkNewsHub__cardtitle { font-size:22px; }
	#page-container .dkNewsHub__actions { justify-content:flex-start; }
	#page-container .dkNewsHub__title { font-size:26px; }
	#page-container .dkNewsHub__filter { gap:8px; margin-bottom:30px; }
	#page-container .dkNewsHub__tab { padding:11px 20px; font-size:14px; }
}
