.reportlist { display:flex; flex-wrap:wrap; width:calc(100% + var(--gutter)); position:relative; right:calc(var(--gutter) / 2); 

--report-padding:32px;
  }
.reportlist li { margin:calc(var(--gutter) / 2); width:calc(25% - var(--gutter)); position:relative; /*border-radius:8px;     overflow: hidden;*/  display:flex; flex-direction:column; 

box-shadow: 0px 8px 16px 0px rgba(167, 141, 252, 0.20);


}



.reportlist li>a.link { position:absolute; display:block; top:0; left:0; width:100%; height:100%;  z-index:5;  }

.reportlist li:has(a.link:hover) > div { background:var(--dark-purple); color:white; }
.reportlist li:has(a.link:hover) img { transform:translate(-50%, -50%) scale(1.1,1.1); }
.reportlist li:has(a.link:focus-visible) { box-shadow: 0 0 0 2px #fbfafc, 0 0 0 5px var(--orange); }

.reportlist li dl.meta dd a { position:relative; z-index:6;}


.reportlist li > div,
.reportlist li > dl { padding:var(--report-padding); overflow:hidden;}

.reportlist li > dl::after { width:100%; height:0; display:block; content:""; clear:both; }  

.reportlist li > div { background:white; color:var(--black3); flex:1;  border-top-left-radius:8px;  border-top-right-radius:8px;  transition:background-color 0.2s ease, color 0.2s ease;} 
.reportlist li > dl  { background:#313033; color:white; margin-top:auto;  padding-top:calc(var(--report-padding) - 8px);    border-bottom-left-radius:8px;  border-bottom-right-radius:8px;}

.reportlist li:not(:has(dl)) > div { border-bottom-left-radius:8px;  border-bottom-right-radius:8px; }

.reportlist li > dl.meta dd a:not(.status):is(:hover,:focus-visible) {  background:var(--yellow); color:black; }



ul.reportlist li > div p.hasext::after {
     content: attr(data-ext); border-radius: 8px;
    color: white; text-transform: uppercase;
    background:var(--red);
    font-size: 18px;
    font-style: normal;
    font-weight: 700;

    line-height: 2.33333em;
    height: 2.33333em;
    min-width: 1.666666666666667em; width:auto;
    text-align: center;
    padding: 0 0.2222em; display:inline-block;   margin-top:12px;
 }
 
 ul.reportlist li > div p:not(:first-child) { font-size:14px; margin-top:1em; }
 ul.reportlist li > div p.date { font-weight:600;  }
 ul.reportlist li > div p:first-child { margin-bottom:16px; }
 ul.reportlist li > div p:first-child span { display:block;  line-height:140%;  font-weight:600;  font-size:var(--bodytext_size);   }
 
 


ul.reportlist li > div p.external span::after {
    content: '\E808';  font-family: 'social'; font-weight: normal !important;

    font-size: 14px;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
    top: -0.25em; margin-left:6px;
	
}




 
@media all and (max-width:1299px) {
	
	.reportlist { --report-padding:24px; } 
}
@media all and (max-width:1199px) {
	
	 
	.reportlist { --report-padding:32px; } 
	.reportlist li { width:calc(33.333% - var(--gutter)); }

    .cardheader + .cards > .reportlist li { width:calc(50% - var(--gutter)); }
}
 
  
@media all and (max-width:899px) {
	
	.reportlist { --report-padding:24px; } 
	.reportlist li { width:calc(50% - var(--gutter)); }
}
 
 
@media all and (max-width:599px) {
	
.reportlist { width:100%; right:0; }
	
	.reportlist li { width:100%; margin-left:0; margin-right:0;   }
    .cardheader + .cards > .reportlist li { width:100%; }

}