/* sdg-info.css — info/view sahifasidagi SDG hero va news slider.
   Har bir SDG rangi --sdg-color o'zgaruvchisidan keladi (PHP inline style bilan beriladi). */

/* ============ HERO (breadcrumb o'rniga) — bitta to'liq SVG ============ */
.sdg-hero{width:100%;line-height:0}
.sdg-hero__svg{display:block;width:100%;height:auto}

@media screen and (max-width:480px) {
	.sdg-hero__svg{ 
		width: auto !important;
		height: 90px !important;
		
	}
	
}

/* ============ NEWS SLIDER ============ */
.sdg-news{
  max-width:1320px;margin:35px auto 0;padding:24px 26px 26px;
  background:#f8fafc;border:1px solid #e7ebf1;border-radius:20px;
  font-family:'Segoe UI',system-ui,-apple-system,Roboto,Arial,sans-serif;
}
.sdg-news *{box-sizing:border-box}

.sdg-news__head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap;
}
.sdg-news__head h2{
  margin:0;font-size:18px;font-weight:800;letter-spacing:.4px;color:#0f172a;text-transform:uppercase;
}
.sdg-news__all{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--sdg-color);color:#fff;font-weight:700;font-size:13px;letter-spacing:.4px;
  text-transform:uppercase;text-decoration:none;padding:11px 20px;border-radius:30px;white-space:nowrap;
  transition:filter .15s ease, transform .15s ease;
}
.sdg-news__all:hover{filter:brightness(.92);color:#fff;transform:translateY(-1px)}
.sdg-news__all svg{width:15px;height:15px}

.sdg-news__viewport{position:relative}

.sdg-news__track{
  display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;padding:4px 2px 8px;scrollbar-width:none;
}
.sdg-news__track::-webkit-scrollbar{display:none}

.sdg-news__card{
  flex:0 0 calc((100% - 54px)/4);min-width:230px;scroll-snap-align:start;
  background:#fff;border:1px solid #e7ebf1;border-radius:14px;overflow:hidden;
  transition:transform .15s ease, box-shadow .15s ease;
}
.sdg-news__card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(15,23,42,.12)}
.sdg-news__card a{display:block;text-decoration:none;color:inherit}
.sdg-news__card .thumb{aspect-ratio:16/10;overflow:hidden;background:#e2e8f0}
.sdg-news__card .thumb img{width:100%;height:100%;object-fit:cover;display:block}
.sdg-news__card .body{padding:14px 15px 16px}
.sdg-news__card .date{display:flex;align-items:center;gap:6px;color:#64748b;font-size:12px;margin-bottom:8px}
.sdg-news__card .date svg{width:13px;height:13px;opacity:.7}
.sdg-news__card h3{
  margin:0 0 10px;font-size:15px;line-height:1.35;font-weight:700;color:#0f172a;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.sdg-news__card .lbl{font-size:13px;font-weight:800;color:var(--sdg-color)}
.sdg-news__card .tags{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.sdg-news__card .tags .tag{width:34px;height:34px;border-radius:6px;overflow:hidden;display:inline-flex;flex:0 0 auto}
.sdg-news__card .tags .tag img{width:100%;height:100%;object-fit:contain;display:block}

.sdg-news__arrow{
  position:absolute;top:42%;transform:translateY(-50%);z-index:3;
  width:42px;height:42px;border-radius:50%;border:1px solid #e7ebf1;background:#fff;color:#0f172a;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 14px rgba(15,23,42,.14);transition:.15s;
}
.sdg-news__arrow svg{width:18px;height:18px}
.sdg-news__arrow:hover{background:var(--sdg-color);color:#fff;border-color:var(--sdg-color)}
.sdg-news__arrow--prev{left:-14px}
.sdg-news__arrow--next{right:-14px}

.sdg-news__dots{display:flex;justify-content:center;gap:8px;margin-top:18px}
.sdg-news__dot{
  width:8px;height:8px;border-radius:50%;border:0;background:#cbd5e1;cursor:pointer;padding:0;
  transition:.2s;
}
.sdg-news__dot.is-active{background:var(--sdg-color);width:22px;border-radius:5px}

@media(max-width:980px){.sdg-news__card{flex-basis:calc((100% - 36px)/3)}}
@media(max-width:680px){
  .sdg-news__card{flex-basis:calc((100% - 18px)/2)}
  .sdg-news__arrow{display:none}
}
@media(max-width:460px){.sdg-news__card{flex-basis:86%}}