html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}

html {
	box-sizing: border-box;
}
*, *::before, *::after {
	box-sizing: inherit;
}

body {
	font-family: Arial, sans-serif;
	line-height: 1.6;
	color: #333;
	background-color: #fff;
	margin: 0 auto;
	max-width: 1200px;  /* lățime maximă pe desktop */
	padding: 0 5px;    /* margine mică pentru mobile */
}

/* Imaginile să aibă mereu border-radius: 7px */
img {
	border-radius: 7px;
	max-width: 100%;
	height: auto;
	display: block;
}

/* HEADERE, TITLURI, TIPOGRAFIE
----------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
	margin-bottom: 0.5em;
	line-height: 1.2;
}

h1 { font-size: 2em; margin-top: 1em; }
h2 { font-size: 1.75em; margin-top: 1.2em; }
h3 { font-size: 1.5em; margin-top: 1.4em; }
h4 { font-size: 1.2em; }
h5 { font-size: 1em; }
h6 { font-size: 0.95em; }

/* Spațiere între heading și paragraful anterior */
h1, h2, h3, h4, h5, h6 {
	margin-top: 1.5em; 
}

/* Paragrafe */
p {
	margin-bottom: 1em;
}

/* Liste */
ul, ol {
	margin: 1em 0 1em 2em; 
}

li {
	margin-bottom: 0.5em;
}

/* Cite/Blockquote (quotes) */

blockquote {
    background-color: #f9f9f9;
    border-left: 5px solid #ccc;
    margin: 1em 0;
    padding: 30px;
    font-style: italic;
    position: relative;
}
blockquote:before {
	content: '“';
	font-size: 2em;
	position: absolute;
	left: 10px;
	top: 10px;
}

/* Link-uri */
a {
	color: #0073aa;
	text-decoration: none;
	font-weight: 600;
}
a:hover {
	color: #005177;
}

/* HEADER + MENIU BURGER
----------------------------------------------- */
.site-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px;
    position: relative;
    width: 100%; /* Face ca header-ul să fie pe toată lățimea */
    background: #f2f2f2;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
    z-index: 10;
}


 

.site-header .site-branding img {
	max-height: 40px;
}


/* Meniu de navigație - desktop */
.main-navigation {
	display: flex;
}
.main-navigation ul {
	list-style: none;
	display: flex;
	gap: 20px;
	margin: 0;
}
.main-navigation ul li a {
	text-transform: uppercase;
	font-size: 0.9em;
}

/* =========== BURGER MENU =========== */
#menu-toggle {
	display: none; /* ascundem checkbox-ul real */
}

.menu-toggle-label {
	display: none; /* hidden pe desktop, îl vom afișa doar pe mobile */
	cursor: pointer;
	font-size: 1.9em;
	user-select: none;
}

.menu-toggle-label:before {
	content: "☰"; /* simbol hamburger simplu */
}

@media (max-width: 768px) {
	/* Afișăm burger-ul doar pe mobile */
	.menu-toggle-label {
		display: block;
	}
	/* Ascundem meniul de navigație inițial */
	.main-navigation {
		position: absolute;
		top: 60px;
		right: 0;
		background: #fff;
		/* border: 1px solid #ddd; */
		flex-direction: column;
		width: 100%;
		max-height: 0;
		overflow: hidden;
		transition: max-height 0.3s ease;
		z-index: 999;
	}
	.main-navigation ul {
		flex-direction: column;
		gap: 0;
	}
	.main-navigation ul li {
		border-bottom: 1px solid #eee;
	}
	.main-navigation ul li a {
		padding: 10px;
		display: block;
	}

	/* Când checkbox-ul este "bifat", meniu e vizibil */
	#menu-toggle:checked + .menu-toggle-label + .main-navigation {
		max-height: 300px; /* suficient să afișeze toate link-urile */
		border: 1px solid #cac8c8;
	}
}

/* FOOTER
----------------------------------------------- */
.site-footer {
	border-top: 1px solid #ddd;
	padding: 20px 0;
	text-align: center;
	font-size: 0.9em;
	color: #666;
	margin-top: 150px;

}

.footer-widgets {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin-bottom: 20px;
	padding: 0 10px; /* spațiu stânga-dreapta */
}

.footer-widget {
    background: none;
    text-align: left;
    margin-left: 20px;
    margin-right: 20px;
}

.footer-widget-title {
	font-size: 1.1em;
	margin-bottom: 10px;
	border-bottom: 2px solid #000;
	display: inline-block;
	padding-bottom: 5px;
}

.site-footer .site-info {
	margin-top: 10px;
	font-size: 0.8em;
}

/* Pe mobil, coloanele de footer cad una sub alta */
@media (max-width: 768px) {
	.footer-widgets {
		grid-template-columns: 1fr;
	}
}

/* PAGINA DE HOME (front-page)
----------------------------------------------- */
/* Să aplicăm width:100% la imagini DOAR în front-page */
.front-page .hero-news-item img,
.front-page .top-post img,
.front-page .small-post img {
	width: 100%;
	height: auto;
	
}

/* Zona de hero: 2 coloane pentru 2 știri mari */
.hero-news {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin: 20px 0;
    background: #f0f0f0;
    border-radius: 10px;
    padding: 20px;
}
.hero-news-item {
	padding: 10px;
}
.hero-news-item h2 {
	font-size: 1.2em;
	margin-top: 10px;
	margin-bottom: 10px;
	line-height: 1.3;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* limităm la 2 rânduri */
	-webkit-box-orient: vertical;
}

/* Categoriile pe homepage */
.category-block {
	margin-top: 0px;
}
.category-block h3 {
	margin-bottom: 20px;
	border-bottom: 2px solid #000;
	display: inline-block;
	padding-bottom: 5px;
}

/* 2 postări mari pe primul rând */
.category-block .top-posts {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin-bottom: 20px;
}
.category-block .top-post {
	border: 1px solid #ddd;
	padding: 10px;
	border-radius: 10px; 
}
.category-block .top-post h2 {
	font-size: 1em;
	margin-top: 10px;
	margin-bottom: 10px;
	line-height: 1.3;
	overflow: hidden;
	text-overflow: ellipsis; 
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

/* 4 postări mai mici pe un singur rând sub cele 2 mari */
.category-block .small-posts {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.category-block .small-post {
	border: 1px solid #ddd;
	padding: 10px;
	border-radius: 10px;
}
.category-block .small-post h2 {
	font-size: 1em;
	margin-top: 10px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

/* Responsiv pentru front-page */
@media (max-width: 768px) {
	.hero-news {
		grid-template-columns: 1fr;
	}
	.category-block .top-posts {
		grid-template-columns: 1fr;
	}
	.category-block .small-posts {
		grid-template-columns: 1fr 1fr;
	}
}
@media (max-width: 480px) {
	.category-block .small-posts {
		grid-template-columns: 1fr;
	}
}

/* ARHIVE / SEARCH / TAG
----------------------------------------------- */
.archive-grid, .search-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.archive-grid .post-item, .search-grid .post-item {
	border: 1px solid #ddd;
	padding: 10px;
	border-radius: 10px;
}
.archive-grid .post-item h2, .search-grid .post-item h2 {
	font-size: 1em;
	margin-top: 10px;
	margin-bottom: 10px;
	line-height: 1.3;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
/* Poza 100% width */
.archive-grid .post-item img, .search-grid .post-item img {
	width: 100%;
	height: auto;
}

/* Paginare (arhive/search etc.) */
.pagination {
	text-align: center;
	margin: 20px 0;
}
.pagination .page-numbers {
	border: 1px solid #ccc;
	padding: 6px 10px;
	margin: 0 5px;
	text-decoration: none;
	color: #333;
	
}
.pagination .current {
	background-color: #333;
	color: #fff;
	border-color: #333;
}

/* SINGLE POST
----------------------------------------------- */
/* Margine stânga-dreapta 10px pe mobile */
@media (max-width: 768px) {
	.site-main {
		padding: 0 10px;
	}
}

/* Titlul, imaginea, meta-box + conținut */
.single-header {
	margin: 20px 0;
	text-align: center; /* centrăm titlul */
}
.single-header h1 {
	font-size: 2em;
}

/* Thumbnail centrat, max 850px - for desktop, full pe mobil */
.post-thumbnail {
	margin: 0 auto;
	max-width: 850px;
	width: 100%;
}

/* Box cu info (categoria, data, autor, data update) în 2 coloane, 2 rânduri */
.meta-box {
	display: grid;
	grid-template-columns: 1fr 1fr;
	row-gap: 10px;
	border: 1px solid #ccc;
	padding: 10px;
	margin: 20px auto;
	max-width: 850px;
	background: #fff; /* sau none, cum preferi */
	border-radius: 10px;
	text-align: left !important;
}
.meta-box span {
	display: inline-block;
}
@media (max-width: 768px) {
	.meta-box {
		grid-template-columns: 1fr;
	}
}

.atentie {
	row-gap: 10px;
	border: 1px solid #ccc;
	padding: 10px;
	margin: 20px auto;
	max-width: 850px;
	background: #fff; /* sau none, cum preferi */
	border-radius: 10px;
	text-align: left !important;
}

/* Butoane social media + text "Distribuie:" bold */
.social-buttons {
	margin-bottom: 20px;
	border: 1px solid #ccc;
    padding: 10px;
    margin: 20px auto;
    max-width: 850px;
    background: #fff;
    border-radius: 10px;
    
}
.social-buttons strong {
	margin-right: 0px;
}
.social-buttons a {
    display: inline-block;
    margin-right: 0px;
    padding: 3px 4px;
    border: 1px solid #ddd;
    border-radius: 5px;
    text-decoration: none;
    font-size: 0.9em;
    color: #333;
}

/* Conținut limitat la 700px pe desktop */
.single-content {
	max-width: 750px;
	margin: 0 auto;
	text-align: left;
	font-size: 19px;
}

/* PAGINA 404 */
.error-404 h1 {
	font-size: 3em;
	margin: 50px 0 20px 0;
	text-align: center;
}
.error-404 p {
	text-align: center;
	font-size: 1.2em;
}


/* === HEADER & FOOTER 100% WIDTH BACKGROUND === */
.site-header,
.site-footer {
  /* „tragem” headerul și footerul în afara containerului de 1200px */
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;   /* half the viewport width, dar cu minus */
  margin-right: -50vw;
  width: 100vw;         /* forțăm lățimea să fie cât fereastra */
   
  /* alege ce culoare vrei la fundal */
  background-color: #f0f0f0; 
  /* eventual o bordură: border-bottom: 1px solid #ddd; etc. */
  
  /* spațiu vertical */
  padding: 10px 0;  
}

/* Conținutul din interior (branding, meniu, widgeturi, etc.) 
   rămâne la max 1200px și centrat. */
.site-header > * {
  max-width: 1200px; 
  margin: 0 auto;
  padding: 0 5px; /* mic spațiu lateral */
} 


@media (max-width: 768px) {
    .site-header > * {

  margin: 0;

}
}

.textwidget {
	padding:20px;
}

@media (max-width: 768px) {
    .site-footer > * {

  margin-left:15px;
		margin-right:15px;

}
}

.site-footer > * {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 5px;
}

.yoast-breadcrumbs {
    margin-bottom: 1rem;
    font-size: 0.9rem;
    color: #000000;
    margin-top: 10px;
}
.yoast-breadcrumbs a {
    color: #0073aa;
    text-decoration: none;
}
.yoast-breadcrumbs a:hover {
    text-decoration: underline;
}

.responsive-video {
  position: relative;
  padding-bottom: 56.25%; /* proporție 16:9 */
  height: 0;
  overflow: hidden;
  margin: 1em 0;
  max-width: 100%; /* să nu iasă din container */
}

.responsive-video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


.first-paragraph {
  background: #f5f5f5;
  border-radius: 10px;
  padding: 10px;
  display: inline-block; /* sau block, după preferință */
}



@media (max-width: 768px) {
    .hero-news {
        padding: 0;
    }
}


@media (max-width: 768px) {
  .archive-grid, .search-grid {
    grid-template-columns: 1fr 1fr; 
  }
}

@media (max-width: 480px) {
  .archive-grid, .search-grid {
    grid-template-columns: 1fr; 
  }
}

/* Ascundem dskno și dsknovid în mod implicit (desktop) */
.dskno,
.dsknoafter,
.dsknovid,
.dsknoafterfirst,
.dsknofirst {
  display: none;
}

/* Titlu "Reclamă" pentru dskno */
.dskno::before {
  content: "Reclamă";
  font-size: 12px;
  font-weight: bold;
  color: #000;
  display: block;
  text-align: center;
  padding: 5px 0;
}

/* Titlu "Reclamă Video" pentru dsknovid */
.dsknovid::before {
  content: "Reclamă Video (articolul continuă după reclamă)";
  font-size: 11px;
  font-weight: bold;
  color: #000;
  display: block;
  text-align: center;
  padding: 5px 0;
}

/* Titlu "Reclamă Video" pentru dsknovid */
.dsknofirst::before {
  content: "Reclamă (articolul începe mai jos)";
  font-size: 11px;
  font-weight: bold;
  color: #000;
  display: block;
  text-align: center;
  padding: 5px 0;
}

/* Titlu "Reclamă Video" pentru dsknovid */
.dsknoafterfirst::before {
  content: "Reclamă (articolul începe după reclamă)";
  font-size: 11px;
  font-weight: bold;
  color: #000;
  display: block;
  text-align: center;
  padding: 5px 0;
}


.dsknoafter::before {
  content: "Reclamă (articolul continuă după reclamă)";
  font-size: 11px;
  font-weight: bold;
  color: #000;
  display: block;
  text-align: center;
  padding: 5px 0;
}

/* 
   Doar sub 768px afișăm reclamele și le extindem 
   la lățimea completă a viewport-ului (full width)
*/
@media screen and (max-width: 767px) {
  .dskno,
  .dsknovid,
  .dsknoafter,
  .dsknoafterfirst,
  .dsknofirst {
    position: relative;
    /* Centrare 'truc': scoatem containerul din flux 
       și îl întindem la 100vw */
    left: 50%;
    margin-left: -50vw;
    width: 100vw;
    right: 50%;
    margin-right: -50vw;
    
    background-color: #cdcaca; /* Fundal pentru mobil */
    display: block;
  }
}

/* Stilizare pentru containerul reclamei */
.ad-containercolor {
  background-color: #dbd8d8;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2); /* Shadow doar în partea de jos */
}


.ad-intern {
    max-width: 95%;
    margin: 0 auto;
}


/* === TABLE RESPONSIVE & STYLING === */

/* Container pentru scroll orizontal pe mobile */
.responsive-table {
  width: 100%;
  overflow-x: auto;              /* scroll orizontal unde e cazul */
  -webkit-overflow-scrolling: touch;  /* scrolling mai lin pe iOS */
  margin-bottom: 1em;
}

/* Style de bază pentru toate tabelele */
table {
  width: 100%;                   /* Tabelul ocupă toată lățimea containerului */
  border-collapse: collapse;     /* Înlătură spațiile implicite între celule */
  margin: 0 0 1em 0;             /* Mică margine de jos */
  font-size: 0.95rem;            /* Dimensiune de text ușor mai mică */
  line-height: 1.4;
}

/* Header (Thead) - fundal ușor */
table thead th {
  background-color: #f9f9f9;
  text-align: left;
  font-weight: bold;
}

/* Celule și borduri */
table th,
table td {
  border: 1px solid #ddd;
  padding: 8px 12px;
}

/* Alternanță de rânduri */
table tr:nth-child(even) {
  background-color: #fbfbfb;
}

/* Opțional: Ajustări la rezoluții foarte mici */
@media (max-width: 480px) {
  table th,
  table td {
    padding: 6px 8px;
    font-size: 0.9rem;
  }
}


.single-post .post-thumbnail {
  position: relative;
  width: 100%;
  max-width: 900px;  /* la cât vrei să se limiteze pe desktop */
  margin: 0 auto;
  overflow: hidden;  /* ascundem excesul */
}

/* Pseudo-element pentru a crea un container 16:9. 
   16:9 = 9/16=56.25% (padding-bottom)
*/
.single-post .post-thumbnail::before {
  content: "";
  display: block;
  padding-bottom: 56.25%; /* 16:9 ratio => 9/16 * 100 = 56.25 */
}

/* Imaginea absolut poziționată umple containerul. */
.single-post .post-thumbnail img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;   /* taie marginile în exces */
  object-position: center;
}


/* Container “responsive-video” – forțează aspect ratio 16:9 */
.responsive-video {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 ratio */
  height: 0;
  overflow: hidden;
  max-width: 100%; /* se adaptează la container */
  margin: 1em 0;   /* mic spațiu sus-jos */
}

/* Orice iframe, object sau embed din .responsive-video se scalează pe toată lățimea */
.responsive-video iframe,
.responsive-video object,
.responsive-video embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}






.single-content iframe,
.single-content object,
.single-content embed {
  max-width: 100%;
  height: 350px;
}

/* =======  (restul CSS rămâne neschimbat, inclusiv .front‑page …)  ======= */
.front-page .hero-news-item         { position: relative; overflow: hidden; }
.front-page .hero-news-item::before { content:""; display:block; padding-bottom:56.25%; }
.front-page .hero-news-item img     { position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; }









/* Titlul peste imagine */
.front-page .hero-news-item h2 {
    position: relative;
    z-index: 2;
    margin-top: 10px;
    background: #fff;
    display: inline-block;
    padding: 10px;
    border: 1px solid;
}



.top-post-image {
  position: relative;
  overflow: hidden;
}
.top-post-image::before {
  content: "";
  display: block;
  padding-bottom: 56.25%;
}
.top-post-image img {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.small-post-image {
  position: relative;
  overflow: hidden;
}
.small-post-image::before {
  content: "";
  display: block;
  padding-bottom: 56.25%; /* 16:9 */
}
.small-post-image img {
  position: absolute;
  top: 0; 
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}