/* WI-TH Theme presentation layer. */

:root { --with-gap: 16px; --with-content-ad-gap: 16px; }

/* ---------- WI-TH Independent Header ---------- */
/* Critical header CSS moved to inline #with-child-critical-css in functions.php (2.1.1). */

/* ---------- Single post module grids ---------- */
.with-post-section{width:100%}
.with-post-grid{display:grid!important;grid-template-columns:repeat(var(--with-cols-d,4),minmax(0,1fr))!important;width:100%;box-sizing:border-box;gap:var(--with-gap)}
.with-post-card{min-width:0}
.with-inline-ad-slot{grid-column:1/-1;min-width:0;width:100%}
.with-post-card>a{display:block;min-width:0}
.with-post-image{display:block;width:100%;aspect-ratio:16/9;overflow:hidden}
.with-post-image picture,.with-post-image img{display:block;width:100%;height:100%}
.with-post-image img{object-fit:cover}
.with-post-card h3{max-width:100%;overflow-wrap:break-word}
.with-columns-responsive.with-layout-side .with-post-grid{grid-template-columns:repeat(var(--with-cols-d,2),minmax(0,1fr))!important}
.with-layout-side .with-post-card>a{display:grid;grid-template-columns:minmax(96px,38%) minmax(0,1fr);align-items:center}
.with-columns-manual .with-post-grid{grid-template-columns:repeat(var(--with-cols-d,4),minmax(0,1fr))!important}
.with-columns-manual.with-layout-side .with-post-grid{grid-template-columns:repeat(var(--with-cols-d,2),minmax(0,1fr))!important}
@media(max-width:921px){
	.with-columns-responsive .with-post-grid{grid-template-columns:repeat(var(--with-cols-t,2),minmax(0,1fr))!important}
	.with-columns-manual .with-post-grid,.with-columns-manual.with-layout-side .with-post-grid{grid-template-columns:repeat(var(--with-cols-t,2),minmax(0,1fr))!important}
}
.with-mobile-more-sentinel{display:block;width:100%;height:1px}
.with-desktop-initial-extra{display:none!important}
.with-inline-category{display:none}
.with-mobile-layout-title .with-inline-category{width:max-content;max-width:100%;margin:0 6px 2px 0;padding:3px 6px;border:1px solid #d7dee8;border-radius:4px;background:#fff;color:#475569;font-size:.78rem;font-weight:500;line-height:1.35;vertical-align:middle}
@media(max-width:544px){
	.with-desktop-initial-extra{display:block!important}
	.with-mobile-initial-extra{display:none!important}
	.with-columns-responsive .with-post-grid{grid-template-columns:repeat(var(--with-cols-m,2),minmax(0,1fr))!important}
	.with-columns-manual .with-post-grid,.with-columns-manual.with-layout-side .with-post-grid{grid-template-columns:repeat(var(--with-cols-m,2),minmax(0,1fr))!important}
	.with-layout-side .with-post-card>a{grid-template-columns:minmax(82px,38%) minmax(0,1fr)}
	.with-mobile-layout-title .with-post-image{display:none!important}
	.with-mobile-layout-title .with-inline-category{display:inline-block}
	.with-mobile-layout-title .with-home-card-body{display:block}
	.with-mobile-layout-title .with-home-category-label{display:none!important}
	.with-mobile-one-col .with-inline-category{display:inline-block;width:max-content;max-width:100%;margin:0 6px 2px 0;padding:3px 6px;border:1px solid #d7dee8;border-radius:4px;background:#fff;color:#475569;font-size:.78rem;font-weight:500;line-height:1.35;vertical-align:middle}
	.with-mobile-one-col .with-home-category-label{display:none!important}
	.with-section-latest.with-mobile-layout-title>.with-post-header{display:block!important}
	.with-mobile-layout-top .with-post-card>a{display:block}
	.with-mobile-layout-side .with-post-card>a{display:grid;grid-template-columns:minmax(82px,38%) minmax(0,1fr);align-items:center}
}

/* ---------- Single post top-ad spacing ---------- */
body.single-post .with-main-content{margin-top:var(--with-content-ad-gap)!important;padding-top:0!important}
body.single-post .with-main-content>[data-insertion-position="prepend"]{margin-top:0!important;margin-bottom:0!important}
body.single-post .with-main-content>.with-entry{margin-top:var(--with-content-ad-gap)!important}
.with-content-top-ad{display:block;width:100%;box-sizing:border-box;margin:var(--with-content-ad-gap) 0!important;padding:0!important;clear:both}
.single-post .entry-content>.with-content-top-ad:first-child{margin-top:var(--with-content-ad-gap)!important;margin-bottom:var(--with-content-ad-gap)!important}
.single-post .with-content-top-ad-content-before+*{margin-top:0!important}
.single-post .with-content-top-ad-post-before{margin-top:0!important;margin-bottom:var(--with-content-ad-gap)!important}
.single-post .with-content-top-ad-post-before + article{margin-top:0!important}
.with-content-top-ad>.adsbygoogle,.with-content-top-ad .adsbygoogle{max-width:100%}


/* Category label above title: compact bordered badge */
.with-home-category-label{
	display:inline-block;
	width:max-content;
	max-width:100%;
	margin:0 0 6px;
	padding:4px 7px;
	border:1px solid #d7dee8;
	border-radius:4px;
	background:#fff;
	color:#475569;
	font-size:.78rem;
	font-weight:500;
	line-height:1.4
}

/* ---------- Home listing ---------- */
body.home.blog .with-main-content{margin-top:16px!important;padding-top:0!important}
body.home.blog .with-main-content .ast-row{display:none!important}
.with-home-category-latest{width:100%}
.with-home-post-header{margin:0 0 var(--with-gap)}
.with-home-post-header .with-post-title{margin:0}
.with-home-top-ad{width:100%;box-sizing:border-box;margin:0 0 var(--with-gap)!important}
.with-home-category-latest>.with-home-top-ad+.with-post-section{margin-top:0!important;padding-top:0!important}

.with-home-magazine-grid{
	display:grid!important;
	grid-template-columns:repeat(var(--with-cols-d,4),minmax(0,1fr))!important;
	width:100%;
	align-items:stretch!important;
	gap:var(--with-gap)!important
}
.with-home-category-latest .with-post-card{min-width:0}
.with-home-magazine-grid:not(.with-masonry-enabled)>.with-post-card{
	align-self:stretch!important;
	height:100%!important;
	box-sizing:border-box;
	display:flex;
	flex-direction:column
}
.with-home-magazine-grid:not(.with-masonry-enabled)>.with-post-card>a{
	display:flex!important;
	flex:1 1 auto;
	flex-direction:column;
	height:100%
}
.with-home-magazine-grid:not(.with-masonry-enabled)>.with-post-card>a>.with-home-card-body{
	flex:1 1 auto
}
.with-home-magazine-grid>.with-infeed-ad-card{
	grid-column:auto!important;
	width:auto;
	min-width:0;
	overflow:hidden!important;
	margin:0!important
}
.with-home-magazine-grid:not(.with-masonry-enabled)>.with-infeed-ad-card{
	align-self:stretch!important;
	height:100%!important;
	min-height:0!important;
	max-height:none!important;
	display:flex!important;
	align-items:stretch;
	justify-content:stretch
}
.with-home-magazine-grid:not(.with-masonry-enabled)>.with-infeed-ad-card>.code-block,
.with-home-magazine-grid:not(.with-masonry-enabled)>.with-infeed-ad-card>.with-list-ad-slot,
.with-home-magazine-grid:not(.with-masonry-enabled)>.with-infeed-ad-card>div{
	width:100%!important;
	height:100%!important;
	margin:0!important;
	display:flex!important;
	align-items:center;
	justify-content:center
}
.with-home-magazine-grid>.with-infeed-ad-card .adsbygoogle{
	display:block!important;
	width:100%!important;
	max-width:100%!important
}

.with-home-magazine-grid:not(.with-masonry-enabled)>.with-infeed-ad-card{
	grid-column:span 2!important;
	min-height:250px!important
}
.with-archive-grid:not(.with-masonry-enabled)>.with-infeed-ad-card{
	grid-column:span 2!important;
	min-height:250px!important
}
.with-home-magazine-grid:not(.with-masonry-enabled)>.with-infeed-ad-card .adsbygoogle,
.with-archive-grid:not(.with-masonry-enabled)>.with-infeed-ad-card .adsbygoogle{
	min-height:250px!important;
	height:100%!important
}
@media(max-width:544px){
	.with-home-magazine-grid:not(.with-masonry-enabled)>.with-infeed-ad-card,
	.with-archive-grid:not(.with-masonry-enabled)>.with-infeed-ad-card{
		grid-column:span 1!important;
		min-height:250px!important
	}
}
.with-home-magazine-grid.with-masonry-enabled{display:grid!important;position:relative!important;min-height:1px;gap:var(--with-gap)!important}
.with-home-magazine-grid.with-masonry-enabled.with-masonry-ready{display:block!important;gap:0!important}
.with-home-magazine-grid.with-masonry-enabled.with-masonry-ready>.with-post-card.with-pending-layout{visibility:hidden!important}
.with-home-magazine-grid.with-masonry-enabled>.with-post-card{align-self:start!important;margin:0!important;box-sizing:border-box}
.with-home-magazine-grid.with-masonry-enabled.with-masonry-ready>.with-post-card{align-self:auto!important;margin:0 0 var(--with-gap)!important}
.with-home-post-link{display:block}
.with-card-excerpt{display:block;margin:0!important;font-size:.78rem!important;font-weight:400!important;line-height:1.5!important;opacity:.82;overflow-wrap:break-word}
.with-home-category-latest .with-card-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:auto;padding:6px 10px 10px}
.with-home-category-latest .with-card-tag{display:inline-flex;align-items:center;padding:4px 6px;border:1px solid transparent;border-radius:4px;background:#eef3f8;font-size:.68rem!important;font-weight:400!important;line-height:1.35;color:#5b6775;text-decoration:none;cursor:pointer}
.with-home-category-latest .with-card-tag:hover{border-color:#cbd5e1;background:#e5edf5;color:#334155}
.with-home-category-latest .with-post-image{display:block;width:100%;overflow:hidden}
.with-home-category-latest .with-post-image img{display:block;width:100%!important;height:auto!important}

@media(max-width:921px){
	.with-home-magazine-grid:not(.with-masonry-enabled),
	.with-home-magazine-grid.with-masonry-enabled:not(.with-masonry-ready){
		grid-template-columns:repeat(var(--with-cols-t,2),minmax(0,1fr))!important
	}
}
@media(max-width:544px){
	.with-home-magazine-grid.with-masonry-enabled.with-masonry-ready>.with-post-card{margin-bottom:var(--with-gap)!important}
	.with-home-magazine-grid:not(.with-masonry-enabled),
	.with-home-magazine-grid.with-masonry-enabled:not(.with-masonry-ready){
		grid-template-columns:repeat(var(--with-cols-m,1),minmax(0,1fr))!important
	}
}

/* ---------- Archive/category/tag/search listing ---------- */
body.category .with-main-content,body.tag .with-main-content,body.search .with-main-content,body.archive .with-main-content{margin-top:16px!important;padding-top:0!important}
.with-archive-replacement{width:100%}
.with-archive-top-ad{width:100%;box-sizing:border-box;margin:0 0 var(--with-gap)!important}
.with-archive-grid{
	display:grid!important;
	grid-template-columns:repeat(var(--with-cols-d,4),minmax(0,1fr))!important;
	width:100%;
	align-items:stretch!important;
	gap:var(--with-gap)!important
}
.with-archive-grid>.with-post-card{min-width:0;box-sizing:border-box}
.with-archive-grid:not(.with-masonry-enabled)>.with-post-card{
	align-self:stretch!important;
	height:100%!important;
	display:flex;
	flex-direction:column
}
.with-archive-grid:not(.with-masonry-enabled)>.with-post-card>a{
	display:flex!important;
	flex:1 1 auto;
	flex-direction:column;
	height:100%
}
.with-archive-grid:not(.with-masonry-enabled)>.with-post-card>a>.with-home-card-body{
	flex:1 1 auto
}
.with-archive-grid>.with-infeed-ad-card{
	grid-column:auto!important;
	width:auto;
	min-width:0;
	overflow:hidden!important;
	margin:0!important
}
.with-archive-grid:not(.with-masonry-enabled)>.with-infeed-ad-card{
	align-self:stretch!important;
	height:100%!important;
	min-height:0!important;
	max-height:none!important;
	display:flex!important;
	align-items:stretch;
	justify-content:stretch
}
.with-archive-grid:not(.with-masonry-enabled)>.with-infeed-ad-card>.code-block,
.with-archive-grid:not(.with-masonry-enabled)>.with-infeed-ad-card>.with-list-ad-slot,
.with-archive-grid:not(.with-masonry-enabled)>.with-infeed-ad-card>div{
	width:100%!important;
	height:100%!important;
	margin:0!important;
	display:flex!important;
	align-items:center;
	justify-content:center
}
.with-archive-grid>.with-infeed-ad-card .adsbygoogle{
	display:block!important;
	width:100%!important;
	max-width:100%!important
}
.with-archive-grid.with-masonry-enabled{display:grid!important;position:relative!important;min-height:1px;gap:var(--with-gap)!important}
.with-archive-grid.with-masonry-enabled.with-masonry-ready{display:block!important;gap:0!important}
.with-archive-grid.with-masonry-enabled.with-masonry-ready>.with-post-card.with-pending-layout{visibility:hidden!important}
.with-archive-grid.with-masonry-enabled>.with-post-card{align-self:start!important;margin:0!important;box-sizing:border-box}
.with-archive-grid.with-masonry-enabled.with-masonry-ready>.with-post-card{align-self:auto!important;margin:0 0 var(--with-gap)!important}
.with-archive-replacement .with-card-excerpt{display:block;margin:0!important;font-size:.78rem!important;font-weight:400!important;line-height:1.5!important;opacity:.82;overflow-wrap:break-word}
.with-archive-replacement .with-card-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:auto;padding:6px 10px 10px}
.with-archive-replacement .with-card-tag{display:inline-flex;align-items:center;padding:4px 6px;border:1px solid transparent;border-radius:4px;background:#eef3f8;font-size:.68rem!important;font-weight:400!important;line-height:1.35;color:#5b6775;text-decoration:none;cursor:pointer}
.with-archive-replacement .with-card-tag:hover{border-color:#cbd5e1;background:#e5edf5;color:#334155}
@media(max-width:921px){
	.with-archive-grid:not(.with-masonry-enabled),
	.with-archive-grid.with-masonry-enabled:not(.with-masonry-ready){
		grid-template-columns:repeat(var(--with-cols-t,2),minmax(0,1fr))!important
	}
}
@media(max-width:544px){
	.with-archive-grid.with-masonry-enabled.with-masonry-ready>.with-post-card{margin-bottom:var(--with-gap)!important}
	.with-archive-grid:not(.with-masonry-enabled),
	.with-archive-grid.with-masonry-enabled:not(.with-masonry-ready){
		grid-template-columns:repeat(var(--with-cols-m,1),minmax(0,1fr))!important
	}
}


.with-home-magazine-grid:not(.with-masonry-enabled)>.with-post-card>.with-home-post-link,
.with-archive-grid:not(.with-masonry-enabled)>.with-post-card>.with-home-post-link{
	flex:1 1 auto
}
.with-card-keyword-links{position:relative;z-index:2}


/* ---------- Compact card vertical rhythm ---------- */
.with-post-card .with-home-card-body{
	display:flex!important;
	flex-direction:column;
	align-items:flex-start
}
.with-post-card .with-home-card-body>h3{
	width:100%;
	margin:0 0 6px!important;
	padding:0!important
}
.with-post-card .with-home-card-body>.with-card-excerpt{
	width:100%;
	margin:0!important;
	padding:0!important
}
.with-post-card .with-home-card-body>.with-home-category-label{
	margin-top:0!important;
	margin-bottom:6px!important
}
.with-post-card .with-card-keyword-links{
	margin-top:auto!important
}

/* Ver 1.5.50 — mobile in-feed ad keeps responsive provider ratio.
   Desktop/tablet may reserve 250px, but on a one-column phone layout that fixed
   height distorts responsive ads. Let the ad unit determine its own height. */
@media (max-width:544px){
  .with-home-magazine-grid>.with-infeed-ad-card,
  .with-archive-grid>.with-infeed-ad-card,
  .with-home-magazine-grid:not(.with-masonry-enabled)>.with-infeed-ad-card,
  .with-archive-grid:not(.with-masonry-enabled)>.with-infeed-ad-card{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    align-self:start!important;
  }
  .with-home-magazine-grid>.with-infeed-ad-card>.code-block,
  .with-home-magazine-grid>.with-infeed-ad-card>.with-list-ad-slot,
  .with-home-magazine-grid>.with-infeed-ad-card>div,
  .with-archive-grid>.with-infeed-ad-card>.code-block,
  .with-archive-grid>.with-infeed-ad-card>.with-list-ad-slot,
  .with-archive-grid>.with-infeed-ad-card>div{
    height:auto!important;
    min-height:0!important;
  }
  .with-home-magazine-grid>.with-infeed-ad-card .adsbygoogle,
  .with-archive-grid>.with-infeed-ad-card .adsbygoogle{
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
  }
  .with-home-magazine-grid>.with-infeed-ad-card iframe,
  .with-archive-grid>.with-infeed-ad-card iframe{
    max-width:100%!important;
  }
}
