:root {
--main: #e63946;
--main_dark: #c1121f;
--main_light: #f8d7da;
--second: #1b4332;
--second_light: #2d6a4f;
  --gri-inchis: #333333;
  --gri-mediu: #666666;
  --gri-deschis: #AAAAAA;
  --gri-bg: #F4F7FB;
  --alb: #FFFFFF;
  --auriu: #C49A00;
  --linie: #E5E5E5;



  --shadow-card: 0 2px 8px rgba(0,0,0,0.08);
  --shadow-hover: 0 6px 20px rgba(0,0,0,0.14);
  --border-radius: 4px;
  --transition: 0.22s ease;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { font-size: 16px; scroll-behavior: smooth; }

body {
font-family:"Poppins","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background: var(--gri-bg);
  color: var(--second);
  line-height: 1.6;
}

a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
ul { list-style: none; }

/* ============================================
   HEADER & NAVIGAȚIE
============================================ */

.header-top {
  background: var(--second);
  padding: 6px 0;
  border-bottom: 3px solid var(--main);
}

.header-top .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.header-top-left {
  display: flex;
  gap: 16px;
  font-size: 12px;
  color: var(--gri-deschis);
}

.header-top-left a:hover { color: var(--main); }

.header-top-right {
  display: flex;
  gap: 10px;
  align-items: center;
}

.social-link {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--main);
  color: var(--alb);
  font-size: 18px;
  transition: var(--transition);
  border: 1px solid var(--main_light);
  flex-shrink: 0;
}

.social-link:hover {
  background: var(--main);
  border-color: var(--alb);
  color: var(--alb);
}

/* Breaking News Ticker */
.breaking-bar {
  background: var(--main);
  color: var(--alb);
  padding: 8px 0;
  overflow: hidden;
  display: flex;
  align-items: center;
}

.breaking-label {
  background: var(--second);
  color: var(--alb);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  padding: 2px 14px;
  white-space: nowrap;
  flex-shrink: 0;
  margin-right: 16px;
}

.breaking-ticker {
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  animation: ticker 35s linear infinite;
}

@keyframes ticker {
  from { transform: translateX(100vw); }
  to { transform: translateX(-100%); }
}

/* Header Principal */
.header-main {
  background: var(--gri-bg);
  padding: 20px 0;
  border-bottom: 1px solid var(--linie);
}

.header-main .container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.logo {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.logo-text {
  font-size: 42px;
  font-weight: 900;
  color: var(--second);
  line-height: 1;
  letter-spacing: 5px;
  text-align: center;
}

.logo-text span { color: var(--main); }

.logo-tagline {
  font-size: 13px;
  color: var(--gri-mediu);
  letter-spacing: 4px;
  text-transform: uppercase;
  margin-top: 2px;
}

.header-banner {
  background: var(--gri-bg);
  border: 1px solid var(--linie);
  width: 468px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gri-deschis);
  font-size: 12px;
  letter-spacing: 1px;
}

/* Navbar */
.navbar {
  background: var(--second_light);
  position: sticky;
  top: 0;
  z-index: 1000;
}

.navbar .container {
  display: flex;
  align-items: center;
}

.nav-menu {
  display: flex;
  flex: 1;
}

.nav-item {
  position: relative;
}

.nav-link {
  display: block;
  padding: 14px 16px;
  color: #CCCCCC;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.3px;
  text-transform: uppercase;
  transition: var(--transition);
  border-bottom: 3px solid transparent;
}

.nav-link:hover,
.nav-link.activ {
  color: var(--alb);
  border-bottom-color: var(--main);
}

.nav-item:hover .dropdown {
  display: block;
}

.dropdown {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: var(--second);
  min-width: 200px;
  border-top: 2px solid var(--main);
  z-index: 999;
}

.dropdown a {
  display: block;
  padding: 10px 16px;
  color: #CCCCCC;
  font-size: 13px;
  border-bottom: 1px solid #2A2A2A;
  transition: var(--transition);
}

.dropdown a:hover {
  background: var(--main);
  color: var(--alb);
  padding-left: 20px;
}

.nav-search {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 16px;
  border-left: 1px solid #333;
}

.nav-search input {
  background: transparent;
  border: none;
  color: var(--alb);
  font-size: 13px;
  padding: 4px 0;
  width: 180px;
  outline: none;
}

.nav-search input::placeholder { color: #666; }

.nav-search button {
  background: none;
  border: none;
  color: var(--gri-deschis);
  cursor: pointer;
  font-size: 16px;
  transition: var(--transition);
}

.nav-search button:hover { color: var(--main); }

/* ============================================
   CONTAINER GENERAL
============================================ */

.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.layout-main {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 28px;
  padding: 28px 0;
}

/* ============================================
   CARDURI ARTICOLE
============================================ */

.card {
  background: var(--alb);
  border-radius: var(--border-radius);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  transition: var(--transition);
}

.card:hover {
  box-shadow: var(--shadow-hover);
  transform: translateY(-2px);
}

.card-imagine {
  position: relative;
  overflow: hidden;
}

.card-imagine img {
  width: 100%;
  height: 100%;

  transition: transform 0.4s ease;
}

.card:hover .card-imagine img { transform: scale(1.04); }

.card-imagine .badge {
  position: absolute;
  top: 10px;
  left: 10px;
}

.card-continut { padding: 16px; }

.badge {
  display: inline-block;
  background: var(--main);
  color: var(--alb);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 2px;
}

.badge.badge-video { background: #1A1A2E; }
.badge.badge-live { background: var(--main); animation: pulse 1.5s infinite; }
.badge.badge-stiri { background: var(--auriu); color: var(--second); }

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.7; }
}

.card-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 8px 0;
  font-size: 12px;
  color: var(--gri-mediu);
}

.card-meta .categorie-link {
  color: var(--main);
  font-weight: 600;
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.5px;
}

.card-meta .ora { color: var(--gri-deschis); }

.card h2, .card h3 {
  line-height: 1.3;
  color: var(--second);
  transition: color var(--transition);
}

.card:hover h2, .card:hover h3 { color: var(--main); }

.card p.descriere {
  font-size: 14px;
  color: var(--gri-mediu);
  margin-top: 8px;
  line-height: 1.55;
}

.citeste-mai-mult {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--main);
  font-size: 13px;
  font-weight: 600;
  margin-top: 12px;
  transition: gap var(--transition);
}

.citeste-mai-mult:hover { gap: 8px; }


.card-mesaj {
    background: var(--alb);
    border-radius: var(--border-radius);
    box-shadow: var(--shadow-card);
    padding: 16px;
    margin: 24px 0;
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    text-align: center;
}




/* ============================================
   SECȚIUNI HOMEPAGE
============================================ */

.sectiune-titlu {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--second);
}

.sectiune-titlu h2 {
  font-size: 22px;
  font-weight: 700;
  color: var(--second);
}

.sectiune-titlu .linie-rosie {
  width: 4px;
  height: 22px;
  background: var(--main);
  border-radius: 2px;
  flex-shrink: 0;
}

.sectiune-titlu a.vezi-toate {
  margin-left: auto;
  font-size: 12px;
  color: var(--main);
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

/* Hero / Featured */
.hero-grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-template-rows: auto auto;
  gap: 16px;
  margin-bottom: 32px;
}

.hero-principal {
  grid-row: 1 / 3;
}

.hero-principal .card-imagine { height: 380px; }
.hero-principal h2 { font-size: 26px; }
.hero-principal .descriere { font-size: 15px; }

.hero-secundar .card-imagine { height: 160px; }
.hero-secundar h3 { font-size: 16px; }

/* Grid articole */
.grid-4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.grid-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

.grid-2.curs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid var(--linie);
  padding: 8px 0;
  font-weight: 600;
}

.grid-2.curs > div:last-child {
  text-align: right;
}

.grid-1 {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 16px;
}

/* Grid-4 card imagine */
.grid-4 .card-imagine { height: 160px; }
.grid-4 h3 { font-size: 15px; }

.grid-3 .card-imagine { height: 190px; }



    /* Container responsive cu raport 16:9 */
    .video-container {
      position: relative;
      width: 100%;
      margin: auto;
      padding-top: 56.25%; /* 16:9 aspect ratio (9/16 = 0.5625) */
      background: black;
    }
    /* Video poziționat absolut în container */
    .video-container #video {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
    }
    
    

/* ===== BOX ARTICOLE ===== */

	.news_box{display:flex;gap:15px;border-radius:var(--border-radius);line-height:1.6rem;margin-bottom:1.5rem;align-items:stretch;box-shadow: var(--shadow-card);background:var(--alb);  transition: var(--transition);}
	.news_box:hover{  box-shadow: var(--shadow-hover);
  transform: translateY(-2px);color: var(--main);}
.news_img {
    width: 25%;
    aspect-ratio: 16/9;
    flex-shrink: 0;
    border-radius: var(--border-radius) 0 0 var(--border-radius);
    overflow: hidden; /* taie imaginea la colțurile rotunde */
}
	.news_img img {
    width: 100%;
    height: 100%;

    object-position: center;
    display: block;
}
	.news_content{flex:1;padding:1rem;display:flex;flex-direction:column;justify-content:space-between}

	@media (max-width:768px){
	.news_box{flex-direction:column;gap:0.5rem}
	.news_img{width:100%;aspect-ratio:16/9;border-radius:var(--radius6) var(--radius6) 0 0}
    .news_date{
        width:100%;
        flex-direction:row;
        justify-content:center; /* ⭐ centrează tot grupul */
        align-items:center;
        text-align:center;
        gap:5px;                /* spațiu fix între div-uri */
        padding:8px 12px;border-bottom-left-radius:0;border-top-right-radius:var(--radius6);
    }
	}
	
	
/* ============================================
   SIDEBAR
============================================ */

.sidebar {}

.sidebar-widget {
  background: var(--alb);
  border-radius: var(--border-radius);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  margin-bottom: 24px;
}

.sidebar-widget p.curs{
font-size:12px;color:var(--gri-deschis);margin-top:8px
}

.widget-titlu {
  background: var(--second);
  color: var(--alb);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  padding: 12px 16px;
  border-left: 6px solid var(--main);
}

.widget-continut { padding: 16px; }

/* Vreme widget */
.vreme-widget-compact {
  text-align: center;
  padding: 20px 16px;
}

.vreme-widget-compact a{
display:block;margin-top:12px;font-size:12px;color:var(--main);font-weight:600;
}

.vreme-oras {
  font-size: 13px;
  color: var(--gri-mediu);
  text-transform: uppercase;
  letter-spacing: 1px;
}

.vreme-temp {
  font-size: 52px;
  font-weight: 700;
  color: var(--second);
  line-height: 1;
  margin: 8px 0;
}

.vreme-temp sup { font-size: 24px; vertical-align: super; }

.vreme-descriere {
  font-size: 14px;
  color: var(--gri-mediu);
  margin-bottom: 16px;
}

.vreme-detalii {
  display: flex;
  justify-content: space-around;
  border-top: 1px solid var(--linie);
  padding-top: 12px;
}

.vreme-detail-item {
  text-align: center;
}

.vreme-detail-item .label {
  font-size: 10px;
  color: var(--gri-deschis);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.vreme-detail-item .valoare {
  font-size: 15px;
  font-weight: 600;
  color: var(--second);
}

/* Lista stiri sidebar */
.lista-stiri-sidebar { }

.item-stire-sidebar {
  display: flex;
  gap: 10px;
  padding: 12px 0;
  border-bottom: 1px solid var(--linie);
}

.item-stire-sidebar:last-child { border-bottom: none; }

.item-stire-sidebar img {
  width: 72px;
  height: 56px;
  object-fit: cover;
  border-radius: var(--border-radius);
  flex-shrink: 0;
}

.item-stire-sidebar .info h4 {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--second);
  transition: color var(--transition);
}

.item-stire-sidebar:hover h4 { color: var(--main); }

.item-stire-sidebar .info .ora-mica {
  font-size: 11px;
  color: var(--gri-deschis);
  margin-top: 4px;
}

/* ============================================
   BANDA CATEGORII (pe homepage)
============================================ */

.banda-categorii {
  background: var(--alb);
  border-top: 1px solid var(--linie);
  border-bottom: 1px solid var(--linie);
  padding: 16px 0;
  margin-bottom: 28px;
}

.categorii-list {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
}

.btn-categorie {
  display: inline-block;
  padding: 7px 18px;
  border: 1.5px solid var(--linie);
  border-radius: 50px;
  font-size: 13px;
  font-weight: 500;
  color: var(--gri-inchis);
  transition: var(--transition);
  background: var(--alb);
}

.btn-categorie:hover,
.btn-categorie.activ {
  background: var(--main);
  border-color: var(--main);
  color: var(--alb);
}

/* ============================================
   PAGINA CATEGORIE
============================================ */

.hero-categorie {
  background: var(--second);
  color: var(--alb);
  padding: 40px 0;
  margin-bottom: 28px;
}

.hero-categorie .breadcrumb {
  font-size: 12px;
  color: var(--gri-mediu);
  margin-bottom: 8px;
}

.hero-categorie .breadcrumb a { color: var(--gri-deschis); }
.hero-categorie .breadcrumb span { color: var(--main); }

.hero-categorie h1 {
  font-size: 42px;
  font-weight: 900;
  border-left: 6px solid var(--main);
  padding-left: 16px;
  line-height: 1.1;
}

.hero-categorie p {
  font-size: 15px;
  color: var(--gri-deschis);
  margin-top: 8px;
  padding-left: 22px;
}

.filtru-bar {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-bottom: 24px;
  flex-wrap: wrap;
}

.filtru-bar select {
  padding: 8px 14px;
  border: 1.5px solid var(--linie);
  border-radius: var(--border-radius);
  font-size: 13px;
  color: var(--gri-inchis);
  background: var(--alb);
  cursor: pointer;
  outline: none;
  transition: border-color var(--transition);
}

.filtru-bar select:focus { border-color: var(--main); }

.filtru-bar label {
  font-size: 13px;
  color: var(--gri-mediu);
  font-weight: 500;
}

/* Paginare */
.paginare {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
  margin: 32px 0;
}

.paginare a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1.5px solid var(--linie);
  border-radius: var(--border-radius);
  font-size: 14px;
  color: var(--gri-inchis);
  transition: var(--transition);
}

.paginare a:hover,
.paginare a.activ {
  background: var(--main);
  border-color: var(--main);
  color: var(--alb);
}

/* ============================================
   PAGINA ARTICOL
============================================ */

.layout-articol {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 28px;
  padding: 28px 0;
}

.articol-header {
  margin-bottom: 24px;
}

.articol-breadcrumb {
  font-size: 12px;
  color: var(--gri-mediu);
  margin-bottom: 12px;
}

.articol-breadcrumb a { color: var(--main); }
.articol-breadcrumb a:hover { text-decoration: underline; }

.articol-badge-top {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
}

.articol-titlu {
  font-size: 34px;
  font-weight: 800;
  line-height: 1.2;
  color: var(--second);
  margin-bottom: 14px;
}

.articol-subtitlu {
  font-size: 18px;
  font-weight: 400;
  color: var(--gri-mediu);
  line-height: 1.5;
  border-left: 4px solid var(--main);
  padding-left: 14px;
  margin-bottom: 20px;
}

.articol-meta {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 0;
  border-top: 1px solid var(--linie);
  border-bottom: 1px solid var(--linie);
  margin-bottom: 24px;
  flex-wrap: wrap;
}

.articol-autor {
  display: flex;
  align-items: center;
  gap: 8px;
}

.autor-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
}

.autor-info .autor-nume {
  font-size: 14px;
  font-weight: 600;
  color: var(--second);
}

.autor-info .publicat {
  font-size: 12px;
  color: var(--gri-mediu);
}

.articol-actiuni {
  display: flex;
  gap: 8px;
  margin-left: auto;
}

.btn-actiune {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 7px 14px;
  border: 1.5px solid var(--linie);
  border-radius: 50px;
  font-size: 12px;
  font-weight: 600;
  color: var(--gri-inchis);
  cursor: pointer;
  background: var(--alb);
  transition: var(--transition);
}

.btn-actiune:hover {
  background: var(--main);
  border-color: var(--main);
  color: var(--alb);
}

.articol-imagine-principala {
  width: 100%;
  height: 440px;
  object-fit: cover;
  border-radius: var(--border-radius);
  margin-bottom: 8px;
}

.imagine-legenda {
  font-size: 12px;
  color: var(--gri-mediu);
  font-style: italic;
  margin-bottom: 24px;
  padding-left: 4px;
}

.articol-corp { padding: 16px;  background: var(--alb);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-card);
  border-radius: var(--border-radius);
  font-size: 17px;
  line-height: 1.8;
  color: var(--gri-inchis);
}

.articol-corp p { margin-bottom: 20px; }

.articol-corp h2 {
  font-size: 22px;
  font-weight: 700;
  color: var(--second);
  margin: 32px 0 14px;
  border-left: 4px solid var(--main);
  padding-left: 12px;
}

.articol-corp h3 {
  font-size: 19px;
  font-weight: 700;
  color: var(--second);
  margin: 24px 0 10px;
}

.articol-corp blockquote {
  background: var(--main_light);
  border-left: 5px solid var(--main);
  padding: 16px 20px;
  margin: 24px 0;
  font-style: italic;
  font-size: 18px;
  color: var(--gri-inchis);
  border-radius: 0 var(--border-radius) var(--border-radius) 0;
}

.articol-corp ul {
  list-style: disc;
  padding-left: 24px;
  margin-bottom: 20px;
}

.articol-corp ul li { margin-bottom: 6px; }

.articol-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 28px 0;
  padding-top: 20px;
}

.tag-link {margin-left:5px;
  padding: 5px 12px;
  background: var(--main_dark);
  border: 1px solid var(--linie);
  border-radius: 4px;
  font-size: 12px;
  color: var(--alb);
  transition: var(--transition);
  text-transform: capitalize;
}

.tag-link:hover {
  background: var(--second);
  color: var(--alb);
  border-color: var(--second);
}

/* Articole Corelate */
.articole-corelate {
  margin-top: 32px;
  padding-top: 24px;
  }

/* Comentarii */
.comentarii-sectiune {
  margin-top: 36px;
  padding-top: 24px;
  border-top: 1px solid var(--linie);
}

.comentariu-item {
  padding: 16px 0;
  border-bottom: 1px solid var(--linie);
}

.comentariu-autor {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.comentariu-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--second);
  color: var(--alb);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 14px;
  flex-shrink: 0;
}

.comentariu-text { font-size: 14px; color: var(--gri-inchis); }

.form-comentariu { margin-top: 24px; }
.form-comentariu input,
.form-comentariu textarea {
  width: 100%;
  padding: 10px 14px;
  border: 1.5px solid var(--linie);
  border-radius: var(--border-radius);
  font-size: 14px;
  margin-bottom: 12px;
  outline: none;
  transition: border-color var(--transition);
}

.form-comentariu input:focus,
.form-comentariu textarea:focus { border-color: var(--main); }

.form-comentariu textarea { height: 100px; resize: vertical; }

.btn-trimite {
  background: var(--main);
  color: var(--alb);
  border: none;
  padding: 11px 28px;
  border-radius: var(--border-radius);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background var(--transition);
}

.btn-trimite:hover { background: var(--main_dark); }

/* ============================================
   PAGINA VIDEO YOUTUBE
============================================ */

.hero-video-page {
  background: linear-gradient(135deg, #0F0F0F 0%, #1A1A1A 100%);
  padding: 40px 0;
  margin-bottom: 28px;
}

.hero-video-page h1 {
  font-size: 36px;
  color: var(--alb);
  margin-bottom: 8px;
}

.hero-video-page p { color: var(--gri-deschis); font-size: 15px; }

.video-featured {
  position: relative;
  background: #000;
  border-radius: var(--border-radius);
  overflow: hidden;
  margin-bottom: 28px;
}

.video-wrapper {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
}

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

.video-placeholder {
  position: relative;
  cursor: pointer;
}

.video-placeholder img {
  width: 100%;
  height: 380px;
  object-fit: cover;
}

.video-play-btn {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 72px;
  height: 72px;
  background: rgba(255,0,0,0.9);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: var(--transition);
}

.video-play-btn:hover { background: #FF0000; transform: translate(-50%, -50%) scale(1.08); }

.video-play-btn svg {
  width: 28px;
  height: 28px;
  fill: var(--alb);
  margin-left: 4px;
}

.card-video .card-imagine { height: 185px; }

.video-durata {
  position: absolute;
  bottom: 8px;
  right: 8px;
  background: rgba(0,0,0,0.85);
  color: var(--alb);
  font-size: 11px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 2px;
}

.canal-info {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 6px 0;
}

.canal-avatar {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--main);
}

.canal-nume { font-size: 12px; color: var(--gri-mediu); }
.vizualizari { font-size: 12px; color: var(--gri-deschis); }

/* ============================================
   PAGINA STAREA VREMII
============================================ */

.vreme-hero {
  background: var(--second);
  color: var(--alb);
  padding: 50px 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.vreme-hero::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(200,16,46,0.15) 0%, transparent 60%);
  pointer-events: none;
}

.vreme-hero .oras-principal {
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: var(--gri-deschis);
  margin-bottom: 4px;
}

.vreme-hero .temperatura-mare {
  font-size: 96px;
  font-weight: 900;
  line-height: 1;
  margin: 0;
}

.vreme-hero .temperatura-mare sup {
  font-size: 42px;
  vertical-align: super;
  color: var(--main);
}

.vreme-hero .conditie {
  font-size: 20px;
  color: var(--gri-deschis);
  margin: 8px 0 20px;
}

.vreme-hero .detalii-grid {
  display: flex;
  justify-content: center;
  gap: 40px;
  margin-top: 20px;
}

.vreme-hero .detaliu {
  text-align: center;
}

.vreme-hero .detaliu .label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--gri-deschis);
}

.vreme-hero .detaliu .val {
  font-size: 22px;
  font-weight: 600;
  margin-top: 2px;
}

/* Prognoza orar */
.prognoza-orar {
  background: var(--alb);
  border-radius: var(--border-radius);
  padding: 20px;
  margin-bottom: 28px;
  box-shadow: var(--shadow-card);
  overflow-x: auto;
}

.ore-list {
  display: flex;
  gap: 4px;
  min-width: 700px;
}

.ora-item {
  flex: 1;
  text-align: center;
  padding: 12px 8px;
  border-radius: var(--border-radius);
  transition: background var(--transition);
}

.ora-item:hover, .ora-item.activa {
  background: var(--main_light);
}

.ora-item .ora-text { font-size: 12px; color: var(--gri-mediu); }
.ora-item .icon-vreme { font-size: 22px; margin: 6px 0; }
.ora-item .temp-ora { font-size: 16px; font-weight: 600; color: var(--second); }
.ora-item .ploaie-prob { font-size: 11px; color: #2196F3; }

/* Prognoza 7 zile */
.prognoza-zile {
  background: var(--alb);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-card);
  overflow: hidden;
  margin-bottom: 28px;
}

.zi-item {
  display: flex;
  align-items: center;
  padding: 14px 20px;
  border-bottom: 1px solid var(--linie);
  gap: 16px;
}

.zi-item:last-child { border-bottom: none; }

.zi-item:hover { background: var(--gri-bg); }

.zi-name { font-weight: 600; font-size: 14px; width: 100px; }
.zi-icon { font-size: 24px; width: 40px; text-align: center; }
.zi-descriere { flex: 1; font-size: 13px; color: var(--gri-mediu); }

.zi-temp {
  display: flex;
  gap: 16px;
  font-size: 15px;
  font-weight: 600;
}

.temp-max { color: var(--second); }
.temp-min { color: var(--gri-deschis); }

/* Harta vreme */
.harta-vreme {
  background: var(--alb);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-card);
  overflow: hidden;
  margin-bottom: 28px;
}

.harta-placeholder {
  height: 320px;
  background: #E8F4F8;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}

.harta-placeholder svg { width: 100%; height: 100%; }

/* Orașe grid */
.orase-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
}

.oras-card {
  background: var(--alb);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-card);
  padding: 16px;
  text-align: center;
  cursor: pointer;
  transition: var(--transition);
  border: 2px solid transparent;
}

.oras-card:hover, .oras-card.activ {
  border-color: var(--main);
}

.oras-card .oras-nume { font-size: 16px; font-weight: 600; color: var(--second);text-transform: uppercase; }
.oras-card .oras-icon { font-size: 28px; margin: 6px 0; }
.oras-card .oras-temp { font-size: 14px; font-weight: 700; color: var(--second); }
.oras-card .oras-descriere { font-size: 13px; color: var(--gri-mediu); }
.oras-descriere p{
    margin: 4px 0;
    font-size: 14px;
    color: #333;
}


.oras-descriere p.maxim{
    color: #e63946; /* roșu */
    font-weight: 600;
}

.oras-descriere p.minim{
    color: #00b4d8; /* albastru */
    font-weight: 600;
}
/* ============================================
   PAGINA LOCURI DE MUNCĂ
============================================ */

.job-hero {
  background: var(--second);
  color: var(--alb);
  padding: 50px 0;
  margin-bottom: 0;
}

.job-hero h1 {
  font-size: 40px;
  font-weight: 900;
  margin-bottom: 8px;
}

.job-hero p {
  color: var(--gri-deschis);
  font-size: 16px;
  margin-bottom: 24px;
}

.job-search-bar {
  display: flex;
  gap: 0;
  max-width: 700px;
}

.job-search-bar input {
  flex: 1;
  padding: 14px 18px;
  border: none;
  font-size: 15px;
  outline: none;
  border-radius: var(--border-radius) 0 0 var(--border-radius);
}

.job-search-bar select {
  padding: 14px 14px;
  border: none;
  border-left: 1px solid var(--linie);
  font-size: 14px;
  outline: none;
  cursor: pointer;
  min-width: 120px;
}

.job-search-bar button {
  background: var(--main);
  color: var(--alb);
  border: none;
  padding: 14px 24px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  border-radius: 0 var(--border-radius) var(--border-radius) 0;
  transition: background var(--transition);
}

.job-search-bar button:hover { background: var(--main_dark); }

.job-search-bar a {
  background: var(--second);
  color: var(--alb);
  border: none;
  padding: 14px 24px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  border-radius: var(--border-radius) ;
  transition: background var(--transition);
  margin-left: 10px;
}

.job-search-bar a:hover {
  background: var(--second_light);
}
  
.job-stats {
  display: flex;
  gap: 24px;
  margin-top: 16px;
}

.job-stat {
  font-size: 13px;
  color: var(--gri-deschis);
}

.job-stat span { color: var(--alb); font-weight: 600; }

/* Job layout */
.layout-joburi {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 24px;
  padding: 28px 0;
}

/* Filtre joburi */
.job-filtre {
  background: var(--alb);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-card);
  padding: 20px;
  align-self: start;
  position: sticky;
  top: 72px;
}

.filtru-grup { margin-bottom: 20px; }

.filtru-grup:last-child { margin-bottom: 0; }

.filtru-grup-titlu {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--second);
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--linie);
}

.filtru-optiune {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 0;
  cursor: pointer;
}

.filtru-optiune input[type="checkbox"] {
  accent-color: var(--main);
  width: 15px;
  height: 15px;
}

.filtru-optiune label {
  font-size: 13px;
  color: var(--gri-inchis);
  cursor: pointer;
  flex: 1;
}

.filtru-optiune .count {
  font-size: 12px;
  color: var(--gri-deschis);
}

.range-slider {
  width: 100%;
  accent-color: var(--main);
  margin: 8px 0;
}

.range-labels {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: var(--gri-mediu);
}

/* Card job */
.card-job {
  background: var(--alb);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-card);
  padding: 20px;
  border: 2px solid transparent;
  transition: var(--transition);
  cursor: pointer;
  margin-bottom: 14px;
}

.card-job:hover {
  border-color: var(--main);
  box-shadow: var(--shadow-hover);
}

.card-job.featured {
  border-left: 5px solid var(--auriu);
}

.job-header {
  display: flex;
  gap: 14px;
  margin-bottom: 12px;
}

.job-logo {
  width: 52px;
  height: 52px;
  border-radius: var(--border-radius);
  border: 1px solid var(--linie);
  object-fit: cover;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gri-bg);
  font-weight: 700;
  font-size: 18px;
  color: var(--gri-mediu);
}

.job-info h3 {
  font-size: 17px;
  font-weight: 600;
  color: var(--second);
  margin-bottom: 4px;
  transition: color var(--transition);
}

.card-job:hover h3 { color: var(--main); }

.job-companie {
  font-size: 14px;
  color: var(--gri-mediu);
}

.job-detalii {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
}

.job-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  background: var(--gri-bg);
  border-radius: 50px;
  font-size: 12px;
  color: var(--gri-inchis);
}

.job-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--linie);
}

.job-salariu {
  font-size: 15px;
  font-weight: 700;
  color: var(--second);
}

.job-salariu span { color: var(--main); }

.job-timp {
  font-size: 12px;
  color: var(--gri-deschis);
}

.btn-aplica {
  background: var(--main);
  color: var(--alb);
  border: none;
  padding: 8px 20px;
  border-radius: var(--border-radius);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background var(--transition);
}

.btn-aplica:hover { background: var(--main_dark); }

/* ============================================
   FOOTER
============================================ */

footer {
  background: var(--second);
  color: var(--gri-deschis);
  margin-top: 48px;
}

.footer-top {
  padding: 48px 0 32px;
  border-bottom: 1px solid #2A2A2A;
}

.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 40px;
}

.footer-brand .logo-text {
  color: var(--alb);
  font-size: 32px;
}

.footer-brand .logo-text span{
color:var(--main)
}

.footer-brand p {
  font-size: 13px;
  color: var(--gri-deschis);
  margin: 12px 0 20px;
  line-height: 1.6;
}

.footer-social {
  display: flex;
  gap: 10px;
}

.footer-col h4 {
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--alb);
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--main);
  display: inline-block;
}

.footer-col ul li {
  margin-bottom: 8px;
}

.footer-col ul li a {
  color: #dcfce6;
  font-size: 13px;
  transition: color var(--transition);
}

.footer-col ul li a:hover, .footer-col ul li a.activ { color: #feefab; padding-left: 6px;}

.footer-bottom {
  padding: 16px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  color: #ccc;
}

.footer-bottom #footer-container{
display:flex;justify-content:space-between;width:100%
}

.footer-bottom #container > div{
display:flex;gap:16px
}

.footer-bottom a { color: #ccc; }
.footer-bottom a:hover { color: var(--main); }

/* ============================================
   UTILITĂȚI
============================================ */

.spacer-sm { height: 20px; }
.spacer-md { height: 32px; }

.text-main { color: var(--main); }
.text-muted { color: var(--gri-mediu); }

.w-100 { width: 100%; }
.d-none { display: none; }

.alert-info {
  background: var(--second_light);
  border-left: 6px solid var(--main_dark);
  padding: 12px 16px;
  border-radius: var(--border-radius);
  font-size: 14px;
  color: var(--main_dark);
  margin-bottom: 20px;
}

/* ============================================
   RESPONSIVE — COMPLET
============================================ */

/* ── Tablet mare: 1024px ── */
@media (max-width: 1024px) {
  .container { padding: 0 16px; }

  /* Layout principal: sidebar sub conținut */
  .layout-main,
  .layout-articol { grid-template-columns: 1fr 280px; gap: 20px; }

  /* Hero grid: principal mai mic */
  .hero-principal .card-imagine { height: 300px; }
  .hero-principal h2 { font-size: 22px; }

  /* Grile */
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }

  /* Joburi */
  .layout-joburi { grid-template-columns: 240px 1fr; gap: 18px; }

  /* Vreme — orașe */
  .orase-grid { grid-template-columns: repeat(3, 1fr); }

  /* Footer */
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px; }

  /* Logo mai mic */
  .logo-text { font-size: 34px; }

  /* Header banner ascuns pe tablet */
  .header-banner { display: none; }

  /* Nav link mai compact */
  .nav-link { padding: 14px 11px; font-size: 12px; }
}

/* ── Tablet mic / Mobile mare: 768px ── */
@media (max-width: 768px) {
  /* ===== HEADER ===== */
  .header-top { display: none; } /* ascunde bara de sus */

  .header-main { padding: 12px 0; }
  .header-main .container { justify-content: center; }
  .header-banner { display: none; }
  .logo-text { font-size: 30px;  letter-spacing: -1px; }

  /* ===== BREAKING BAR ===== */
  .breaking-label { font-size: 10px; padding: 2px 10px; }
  .breaking-ticker { font-size: 12px; }

  /* ===== NAVBAR — Hamburger ===== */
  .navbar .container { position: relative; justify-content: space-between; padding: 0 16px; }
  .nav-menu { display: none; } /* ascuns implicit */
  .nav-menu.deschis {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--second_light);
    z-index: 999;
    border-top: 2px solid var(--main);
    box-shadow: 0 8px 24px rgba(0,0,0,0.3);
  }
  .nav-menu.deschis .nav-link { padding: 13px 20px; border-bottom: 1px solid #2A2A2A; border-bottom-width: 1px; }
  .nav-menu.deschis .dropdown { display: none !important; } /* ascunde sub-meniuri pe mobile */

  .btn-hamburger {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 10px;
    z-index: 1001;
  }
  .btn-hamburger span {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--alb);
    border-radius: 2px;
    transition: transform 0.25s ease, opacity 0.25s ease;
    transform-origin: center;
  }
  .btn-hamburger.activ span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .btn-hamburger.activ span:nth-child(2) { opacity: 0; transform: scaleX(0); }
  .btn-hamburger.activ span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  .nav-search { border-left: none; padding: 8px 16px; }
  .nav-search input { width: 120px; }

  /* ===== LAYOUT PRINCIPAL ===== */
  .layout-main,
  .layout-articol {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 16px 0;
  }
  .sidebar { order: 2; } /* sidebar DUPĂ conținut pe mobile */

  /* ===== HERO HOMEPAGE ===== */
  .hero-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .hero-principal { grid-row: auto; }
  .hero-principal .card-imagine { height: 220px; }
  .hero-principal h2 { font-size: 20px; }
  .hero-secundar .card-imagine { height: 140px; }

  /* ===== GRILE ===== */
  .grid-4 { grid-template-columns: 1fr 1fr; gap: 12px; }
  .grid-3 { grid-template-columns: 1fr 1fr; gap: 12px; }
  .grid-2 { grid-template-columns: 1fr; }

  /* ===== BANDA CATEGORII ===== */
  .categorii-list { gap: 6px; }
  .btn-categorie { padding: 6px 14px; font-size: 12px; }

  /* ===== ARTICOL ===== */
  .articol-titlu { font-size: 22px; }
  .articol-subtitlu { font-size: 16px; }
  .articol-imagine-principala { height: 220px; }
  .articol-corp { font-size: 15px; }
  .articol-actiuni { flex-wrap: wrap; gap: 6px; }
  .articol-meta { flex-wrap: wrap; gap: 10px; }

  /* Share bar scrollabil orizontal pe mobile */
  .share-bar { overflow-x: auto; white-space: nowrap; }

  /* ===== CATEGORIE ===== */
  .hero-categorie { padding: 24px 0; }
  .hero-categorie h1 { font-size: 28px; }

  /* ===== VIDEO ===== */
  .hero-video-page { padding: 24px 0; }
  .hero-video-page h1 { font-size: 26px; }

  /* Player + playlist: stivuite vertical */
  .video-featured-layout { grid-template-columns: 1fr !important; }

  /* ===== VREME ===== */
  .vreme-hero { padding: 32px 0; }
  .vreme-hero .temperatura-mare { font-size: 64px; }
  .vreme-hero .detalii-grid { gap: 20px; flex-wrap: wrap; justify-content: center; }
  .vreme-hero .detaliu .val { font-size: 18px; }
  .orase-grid { grid-template-columns: repeat(2, 1fr); }
  .zi-item { padding: 12px 16px; gap: 10px; }
  .zi-name { width: 80px; font-size: 13px; }

  /* ===== JOBURI ===== */
  .job-hero { padding: 32px 0; }
  .job-hero h1 { font-size: 28px; }
  .job-search-bar { flex-direction: column; gap: 8px; }
  .job-search-bar input,
  .job-search-bar select,
  .job-search-bar button {
    border-radius: var(--border-radius);
    width: 100%;
  }
  .job-stats { flex-wrap: wrap; gap: 10px; }
  .layout-joburi { grid-template-columns: 1fr; gap: 16px; }
  .job-filtre { position: static; }

  /* Filtre joburi colapsabile pe mobile */
  .job-filtre-toggle {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
  }

  .card-job { padding: 16px; }
  .job-header { flex-wrap: wrap; gap: 10px; }
  .btn-aplica { width: 100%; text-align: center; margin-top: 8px; }
  .job-footer { flex-wrap: wrap; gap: 8px; }

  /* Companii grid: 3 coloane pe mobile */
  .companii-grid { grid-template-columns: repeat(3, 1fr) !important; }

  /* ===== FOOTER ===== */
  .footer-top { padding: 32px 0 24px; }
  .footer-grid { grid-template-columns: 1fr; gap: 24px; }
  .footer-brand p { font-size: 13px; }
  .footer-bottom .container { flex-direction: column; gap: 8px; text-align: center; }

  /* ===== SIDEBAR WIDGETS ===== */
  /* Pe mobile, ascunde sidebar-ul bulky și păstrează doar esențialul */
  .sidebar .sidebar-widget:nth-child(n+8) { display: none; }

  /* Vreme widget mai compact */
  .vreme-temp { font-size: 40px; }
  .vreme-detalii { gap: 16px; }
}

/* ── Mobile mic: 480px ── */
@media (max-width: 480px) {
  /* ===== CONTAINER ===== */
  .container { padding: 0 12px; }

  /* ===== LOGO ===== */
  .logo-text { font-size: 26px;  letter-spacing: -1px; }

  /* ===== GRILE — toate single column ===== */
  .grid-4,
  .grid-3,
  .grid-2 { grid-template-columns: 1fr; gap: 10px; }

  /* ===== HERO ===== */
  .hero-principal .card-imagine { height: 185px; }
  .hero-principal h2 { font-size: 18px; }
  .hero-secundar { display: display; } /* ascunde ştirile secundare pe telefon mic */

  /* ===== ARTICOL ===== */
  .articol-titlu { font-size: 20px; }
  .articol-subtitlu { font-size: 15px; }
  .articol-imagine-principala { height: 180px; }
  .articol-corp { font-size: 14px; line-height: 1.7; }
  .articol-corp blockquote { font-size: 15px; padding: 12px 14px; }
  .articol-actiuni .btn-actiune span { display: none; } /* ascunde numerele din butoane */

  /* ===== VREME ===== */
  .vreme-hero .temperatura-mare { font-size: 52px; }
  .vreme-hero .conditie { font-size: 16px; }
  .vreme-hero .detalii-grid { gap: 14px; }
  .orase-grid { grid-template-columns: 1fr ; gap: 8px; }
  .oras-card { padding: 12px 8px; }
  .oras-card .oras-temp { font-size: 16px; }
  .oras-card .oras-icon { font-size: 22px; }
  .zi-descriere { display: none; } /* economie spațiu pe mobile mic */

  /* ===== JOBURI ===== */
  .job-hero h1 { font-size: 22px; }
  .job-header { flex-direction: column; }
  .job-logo { width: 44px; height: 44px; }
  .job-detalii { gap: 5px; }
  .job-tag { font-size: 11px; padding: 3px 7px; }
  .companii-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 8px; }

  /* ===== VIDEO ===== */
  .hero-video-page h1 { font-size: 22px; }
  .card-video .card-imagine { height: 160px; }

  /* ===== PAGINARE ===== */
  .paginare a { width: 32px; height: 32px; font-size: 13px; }

  /* ===== FOOTER ===== */
  .footer-bottom { font-size: 11px; }
  .footer-social { gap: 8px; }

  /* ===== CATEGORIE ===== */
  .hero-categorie h1 { font-size: 22px; }
  .hero-categorie { padding: 18px 0; }

  /* ===== SECTIUNE TITLU ===== */
  .sectiune-titlu h2 { font-size: 18px; }
  .sectiune-titlu .vezi-toate { font-size: 11px; }

  /* ===== BREAKING NEWS ===== */
  .breaking-bar { padding: 6px 0; }
  .breaking-label { display: none; }

  /* ===== SIDEBAR ===== */
  .sidebar .sidebar-widget:nth-child(n+8) { display: display; }
}

/* ── Print ── */
@media print {
  .navbar, .breaking-bar, .header-top, .sidebar,
  footer, .articol-actiuni, .comentarii-sectiune { display: none !important; }
  .layout-articol { grid-template-columns: 1fr; }
  .articol-titlu { font-size: 24pt; }
  body { background: #fff; color: #000; font-size: 12pt; }
}

/* ===== HAMBURGER — ascuns pe desktop, vizibil pe mobile ===== */
@media (min-width: 769px) {
  .btn-hamburger { display: none !important; }
}

/* ============================================
   CLASE RESPONSIVE — înlocuiesc inline styles
============================================ */

/* Articol — date cheie 3 coloane */
.grid-3-inline {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 12px;
}

/* Articol — form comentariu 2 coloane */
.grid-2-inline {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

/* Articol — share bar */
.share-bar-box {
  padding: 16px;
  background: var(--gri-bg);
  border-radius: var(--border-radius);
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 32px;
  flex-wrap: wrap;
}

/* Video — player + playlist */
.video-player-grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 24px;
  margin-bottom: 36px;
}

/* Joburi — companii top */
.companii-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
}

/* Vreme — info box 4 coloane */
.vreme-info-box {
  background: var(--alb);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-card);
  padding: 20px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  text-align: center;
  margin-bottom: 32px;
}

/* Categorie — card featured orizontal */
.card-featured-row {
  display: flex;
  gap: 0;
  min-height: 220px;
}
.card-featured-img {
  width: 50%;
  flex-shrink: 0;
  min-height: 220px;
}
.card-featured-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.card-featured-content {
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* ============================================
   RESPONSIVE pentru clasele noi
============================================ */

@media (max-width: 768px) {
  /* Articol */
  .grid-3-inline { grid-template-columns: 1fr; gap: 8px; }
  .grid-2-inline { grid-template-columns: 1fr; }
  .share-bar-box { gap: 8px; }
  .share-bar-box .btn-actiune { flex: 1 1 40%; }

  /* Video */
  .video-player-grid { grid-template-columns: 1fr; }

  /* Joburi */
  .companii-grid { grid-template-columns: repeat(3, 1fr); }

  /* Vreme */
  .vreme-info-box { grid-template-columns: repeat(2, 1fr); }

  /* Categorie */
  .card-featured-row { flex-direction: column; }
  .card-featured-img { width: 100%; min-height: 200px; }
  .card-featured-content { padding: 16px; }
}

@media (max-width: 480px) {
  /* Joburi */
  .companii-grid { grid-template-columns: repeat(2, 1fr); }

  /* Vreme */
  .vreme-info-box { grid-template-columns: 1fr 1fr; gap: 10px; padding: 14px; }

  /* Articol */
  .grid-3-inline { grid-template-columns: 1fr; }
  .share-bar-box .btn-actiune { flex: 1 1 100%; }
}

/* ============================================
   VREME — clase curate
============================================ */

.vreme-container { padding-top: 28px; padding-bottom: 32px; }

.vreme-h1 {
  font-size: 28px;
  font-weight: 800;
  color: var(--alb);
  margin-bottom: 4px;
}

.vreme-oras-hero {
  font-size: 14px;
  color: var(--gri-deschis);
  margin-bottom: 4px;
}

.vreme-simtit {
  font-size: 14px;
  color: var(--gri-deschis);
  margin-bottom: 0;
}

.ploaie-mult { color: var(--main); }

.zi-today { background: var(--main_light); }

.zi-cod-galben {
  background: var(--main);
  color: #fff;
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 50px;
  white-space: nowrap;
  flex-shrink: 0;
}

.sectiune-titlu-mt { margin-top: 32px; }

.vreme-search-box {
  background: var(--alb);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-card);
  padding: 14px 16px;
  margin-bottom: 20px;
  display: flex;
  gap: 10px;
  align-items: center;
}

.vreme-search-icon { font-size: 20px; flex-shrink: 0; }

.vreme-search-box input {
  flex: 1;
  border: 1.5px solid var(--linie);
  border-radius: var(--border-radius);
  padding: 9px 12px;
  font-size: 14px;
  outline: none;
  min-width: 0;
}

.vreme-search-box input:focus { border-color: var(--main); }

.vreme-alert {
  background: #FFF3E0;
  border-left: 5px solid #FF9800;
  border-radius: var(--border-radius);
  padding: 14px 18px;
  margin-bottom: 24px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.vreme-alert-icon { font-size: 22px; flex-shrink: 0; }

.vreme-alert-text strong { display: block; color: #E65100; font-size: 14px; margin-bottom: 4px; }
.vreme-alert-text p { font-size: 13px; color: #5D4037; margin-top: 4px; }

.vreme-info-box {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 32px;
}

.vreme-info-item {
  background: var(--alb);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-card);
  padding: 20px 14px;
  text-align: center;
}

.vreme-info-icon { font-size: 30px; margin-bottom: 8px; }
.vreme-info-label { font-size: 13px; font-weight: 600; color: var(--second); margin-bottom: 4px; }
.vreme-info-val { font-size: 20px; font-weight: 700; color: var(--second); }
.vreme-info-val--warn { color: #FF6B35; }
.vreme-info-val--danger { color: var(--main); }
.vreme-info-sub { font-size: 11px; color: var(--gri-mediu); margin-top: 2px; }

/* ============================================
   JOBURI — clase curate
============================================ */

.job-categorii-bar {
  background: var(--alb);
  border-bottom: 1px solid var(--linie);
  padding: 14px 0;
}

.job-filtre-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  font-size: 14px;
}

.filtre-reset { font-size: 12px; color: var(--main); }

.btn-w100 { width: 100%; margin-top: 8px; }

.joburi-lista { min-width: 0; }

.job-sort-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.job-count-text { font-size: 13px; color: var(--gri-mediu); }
.job-count-text strong { color: var(--second); }

.job-sort-right {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--gri-mediu);
}

.job-sort-select {
  padding: 7px 12px;
  border: 1.5px solid var(--linie);
  border-radius: var(--border-radius);
  font-size: 13px;
  outline: none;
}

.card-job--featured {
  background: linear-gradient(135deg, #FFFDE7, #FFF9C4);
  border-left: 5px solid var(--auriu);
}

.job-promoted-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--auriu);
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 10px;
}

.job-descriere {
  font-size: 13px;
  color: var(--gri-mediu);
  margin-bottom: 12px;
  line-height: 1.55;
}

.job-footer-right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.job-badge {
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 50px;
  white-space: nowrap;
}

.job-badge--hot { background: var(--main_light); color: var(--main); }
.job-badge--fast { background: #E8F5E9; color: #2E7D32; }

/* Logo-uri companii joburi */
.job-logo--bcr { background: #1565C0; color: #fff; }
.job-logo--ibm { background: #1565C0; color: #fff; }
.job-logo--med { background: #2E7D32; color: #fff; font-size: 13px; }
.job-logo--ui  { background: #6A1B9A; color: #fff; }
.job-logo--edu { background: #E65100; color: #fff; }
.job-logo--dhl { background: #B8860B; color: #fff; }
.job-logo--av  { background: #1A237E; color: #fff; font-size: 13px; }

.paginare-dots {
  padding: 0 4px;
  align-self: center;
  color: var(--gri-deschis);
  font-size: 14px;
}

.companii-sectiune {
  padding: 32px 0;
  border-top: 2px solid var(--second);
  margin-top: 16px;
}

.companii-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
}

.companie-card {
  background: var(--alb);
  border: 1.5px solid var(--linie);
  border-radius: var(--border-radius);
  padding: 16px;
  text-align: center;
  transition: border-color var(--transition);
  display: block;
}

.companie-card:hover { border-color: var(--main); }

.companie-nume { font-size: 22px; font-weight: 800; margin-bottom: 4px; }
.companie-joburi { font-size: 12px; color: var(--gri-mediu); }

.cariera-sectiune { padding-bottom: 32px; }

.footer-bottom-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  flex-wrap: wrap;
  gap: 8px;
}

.footer-bottom-links {
  display: flex;
  gap: 16px;
}

.footer-bottom-links a { color: #555; font-size: 12px; }
.footer-bottom-links a:hover { color: var(--main); }

/* ============================================
   RESPONSIVE — Vreme & Joburi
============================================ */

@media (max-width: 768px) {
  /* Vreme */
  .vreme-search-box { flex-wrap: wrap; }
  .vreme-search-box input { width: 100%; }
  .vreme-search-box .btn-trimite { width: 100%; }
  .vreme-alert { flex-direction: column; gap: 8px; }
  .vreme-info-box { grid-template-columns: repeat(2, 1fr); }

  /* Joburi */
  .job-sort-bar { flex-direction: column; align-items: flex-start; gap: 8px; }
  .job-sort-right { margin-left: 0; width: 100%; }
  .job-sort-select { flex: 1; }
  .job-footer { flex-wrap: wrap; gap: 8px; }
  .job-footer-right { flex-wrap: wrap; gap: 6px; }
  .card-job--featured .btn-aplica,
  .card-job .btn-aplica { width: 100%; margin-top: 8px; }
  .job-header { flex-wrap: wrap; }
  .companii-grid { grid-template-columns: repeat(3, 1fr); }
  .cariera-sectiune .grid-3 { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 480px) {
  /* Vreme */
  .vreme-info-box { grid-template-columns: 1fr 1fr; gap: 10px; }
  .vreme-info-item { padding: 14px 10px; }
  .vreme-h1 { font-size: 22px; }
  .vreme-alert-text strong { font-size: 13px; }

  /* Joburi */
  .companii-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .companie-card { padding: 12px 8px; }
  .companie-nume { font-size: 18px; }
  .cariera-sectiune .grid-3 { grid-template-columns: 1fr; }
  .job-tag { font-size: 11px; padding: 3px 6px; }
}

/* ============================================
   BANCURI — clase curate
============================================ */

/* Hero */
.bancuri-hero {
  background: linear-gradient(135deg, #1A1A1A 0%, #2D1515 100%);
  color: var(--alb);
  padding: 40px 0;
  border-bottom: 3px solid var(--main);
}

.bancuri-hero h1 {
  font-size: 38px;
  font-weight: 900;
  margin-bottom: 8px;
}

.bancuri-hero p {
  color: var(--gri-deschis);
  font-size: 16px;
  margin-bottom: 20px;
}

.bancuri-search-bar {
  display: flex;
  max-width: 560px;
  gap: 0;
}

.bancuri-search-bar input {
  flex: 1;
  padding: 12px 16px;
  border: none;
  font-size: 14px;
  outline: none;
  border-radius: var(--border-radius) 0 0 var(--border-radius);
}

.bancuri-search-bar button {
  background: var(--main);
  color: var(--alb);
  border: none;
  padding: 12px 20px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  border-radius: 0 var(--border-radius) var(--border-radius) 0;
  transition: background var(--transition);
  white-space: nowrap;
}

.bancuri-search-bar button:hover { background: var(--main_dark); }

/* Categorii bar */
.bancuri-categorii-bar {
  background: var(--alb);
  border-bottom: 1px solid var(--linie);
  padding: 14px 0;
}

/* Layout principal — conținut + sidebar dreapta */
.bancuri-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 28px;
  padding: 28px 0;
}

.bancuri-main { min-width: 0; }

/* Sort bar */
.bancuri-sort-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.bancuri-count { font-size: 13px; color: var(--gri-mediu); }
.bancuri-count strong { color: var(--second); }

.bancuri-sort-right {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--gri-mediu);
}

.bancuri-sort-select {
  padding: 7px 12px;
  border: 1.5px solid var(--linie);
  border-radius: var(--border-radius);
  font-size: 13px;
  outline: none;
}

/* Card banc */
.card-banc {
  background: var(--alb);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-card);
  padding: 20px;
  margin-bottom: 16px;
  border: 2px solid transparent;
  transition: var(--transition);
}

.card-banc:hover { border-color: var(--main); box-shadow: var(--shadow-hover); }

.card-banc--featured {
  border-left: 5px solid var(--auriu);
  background: linear-gradient(135deg, #FFFDE7, #FFFFFF);
}

/* Header banc */
.banc-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}

.banc-meta {
  display: flex;
  gap: 10px;
  font-size: 12px;
  color: var(--gri-mediu);
  margin-left: auto;
}

.banc-autor strong { color: var(--second); }

/* Badge categorie */
.banc-categorie-badge {
  display: inline-block;
  background: var(--second);
  color: var(--alb);
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 50px;
  letter-spacing: 0.3px;
}

.banc-cat--politica { background: #1565C0; }
.banc-cat--doctor   { background: #2E7D32; }
.banc-cat--animale  { background: #6A1B9A; }
.banc-cat--scoala   { background: #E65100; }
.banc-cat--video    { background: #B71C1C; }

/* Titlu banc */
.banc-titlu-link { text-decoration: none; }

.banc-titlu {
  font-size: 20px;
  font-weight: 700;
  color: var(--second);
  margin-bottom: 12px;
  transition: color var(--transition);
  line-height: 1.3;
}

.banc-titlu-link:hover .banc-titlu { color: var(--main); }

/* Corp banc */
.banc-corp p {
  font-size: 15px;
  color: var(--gri-inchis);
  line-height: 1.7;
  margin-bottom: 8px;
}

.banc-corp p:last-child { margin-bottom: 0; }

.banc-corp--preview {
  position: relative;
  max-height: 160px;
  overflow: hidden;
}

.banc-corp--preview::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 50px;
  background: linear-gradient(transparent, var(--alb));
}

/* Banc cu imagine alaturata */
.banc-cu-imagine {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 0;
}

.banc-cu-imagine .banc-corp { flex: 1; }

.banc-imagine-wrapper { flex-shrink: 0; }

.banc-imagine {
  width: 200px;
  height: 140px;
  object-fit: cover;
  border-radius: var(--border-radius);
}

/* Imagine full width */
.banc-imagine-full {
  width: 100%;
  max-height: 320px;
  object-fit: cover;
  border-radius: var(--border-radius);
  margin-bottom: 14px;
}

/* Video în card banc */
.banc-video-wrapper {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  border-radius: var(--border-radius);
  overflow: hidden;
  margin-bottom: 12px;
}

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

/* Footer banc */
.banc-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--linie);
  flex-wrap: wrap;
  gap: 8px;
}

.banc-actiuni {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

/* Butoane vot */
.btn-vot {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 12px;
  border: 1.5px solid var(--linie);
  border-radius: 50px;
  font-size: 13px;
  font-weight: 500;
  color: var(--gri-inchis);
  background: var(--alb);
  cursor: pointer;
  text-decoration: none;
  transition: var(--transition);
  white-space: nowrap;
}

.btn-vot:hover { background: var(--gri-bg); }

.btn-vot--up:hover  { border-color: #4CAF50; color: #2E7D32; background: #E8F5E9; }
.btn-vot--down:hover { border-color: var(--main); color: var(--main); background: var(--main_light); }

.banc-citeste {
  font-size: 13px;
  font-weight: 600;
  color: var(--main);
  white-space: nowrap;
}

.banc-citeste:hover { text-decoration: underline; }

/* ─── SIDEBAR BANCURI ─── */
.top-bancuri-list { display: flex; flex-direction: column; gap: 2px; }

.top-banc-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--linie);
  text-decoration: none;
  transition: var(--transition);
}

.top-banc-item:last-child { border-bottom: none; }
.top-banc-item:hover .top-banc-titlu { color: var(--main); }

.top-banc-nr {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--gri-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
  color: var(--gri-mediu);
  flex-shrink: 0;
}

.top-banc-nr--gold   { background: #FFD700; color: #7B5800; }
.top-banc-nr--silver { background: #C0C0C0; color: #444; }
.top-banc-nr--bronze { background: #CD7F32; color: #fff; }

.top-banc-titlu { font-size: 13px; font-weight: 600; color: var(--second); line-height: 1.3; transition: color var(--transition); }
.top-banc-meta  { font-size: 11px; color: var(--gri-deschis); margin-top: 2px; }

.sidebar-categorii { display: flex; flex-direction: column; }

.sidebar-cat-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 9px 0;
  border-bottom: 1px solid var(--linie);
  font-size: 13px;
  color: var(--gri-inchis);
  text-decoration: none;
  transition: color var(--transition);
}

.sidebar-cat-item:last-child { border-bottom: none; }
.sidebar-cat-item:hover { color: var(--main); }

.sidebar-cat-count {
  font-size: 12px;
  color: var(--gri-deschis);
  background: var(--gri-bg);
  padding: 2px 8px;
  border-radius: 50px;
}

.sidebar-banner {
  background: var(--gri-bg);
  border: 1px dashed #CCC;
  height: 250px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gri-deschis);
  font-size: 12px;
  letter-spacing: 1px;
  border-radius: var(--border-radius);
  margin-bottom: 24px;
}

.sidebar-adauga-text {
  font-size: 13px;
  color: var(--gri-mediu);
  margin-bottom: 12px;
  line-height: 1.5;
}

.btn-adauga-banc { display: block; text-align: center; }

.banc-aleatoriu-box {
  background: var(--gri-bg);
  border-radius: var(--border-radius);
  padding: 14px;
  margin-bottom: 12px;
  font-size: 14px;
  color: var(--gri-inchis);
  line-height: 1.7;
  font-style: italic;
}

.banc-aleatoriu-box p { margin-bottom: 4px; }
.banc-alt-btn { width: 100%; justify-content: center; }

.newsletter-input {
  width: 100%;
  padding: 9px 12px;
  border: 1.5px solid var(--linie);
  border-radius: var(--border-radius);
  font-size: 13px;
  outline: none;
  margin-bottom: 8px;
  display: block;
}

.newsletter-input:focus { border-color: var(--main); }

/* ─── PAGINA BANC INDIVIDUAL ─── */
.banc-articol {
  background: var(--alb);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-card);
  padding: 28px;
}

.banc-articol-header { margin-bottom: 20px; }

.banc-articol-badges {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.banc-top-badge {
  display: inline-block;
  background: var(--auriu);
  color: var(--second);
  font-size: 11px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 50px;
}

.banc-articol-titlu {
  font-size: 32px;
  font-weight: 900;
  color: var(--second);
  line-height: 1.2;
  margin-bottom: 16px;
}

.banc-articol-meta {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 0;
  border-top: 1px solid var(--linie);
  border-bottom: 1px solid var(--linie);
  flex-wrap: wrap;
}

.banc-autor-info {
  display: flex;
  align-items: center;
  gap: 10px;
}

.banc-autor-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--main);
  color: var(--alb);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 14px;
  flex-shrink: 0;
}

.banc-autor-nume  { font-size: 14px; font-weight: 600; color: var(--second); }
.banc-autor-data  { font-size: 12px; color: var(--gri-mediu); margin-top: 2px; }

.banc-articol-actiuni {
  display: flex;
  gap: 8px;
  margin-left: auto;
  flex-wrap: wrap;
}

/* Conținut banc articol */
.banc-articol-continut { margin: 24px 0; }

.banc-articol-imagine-wrapper { margin-bottom: 20px; }

.banc-articol-imagine {
  width: 100%;
  max-height: 420px;
  object-fit: cover;
  border-radius: var(--border-radius);
  display: block;
}

.banc-imagine-legenda {
  font-size: 12px;
  color: var(--gri-mediu);
  font-style: italic;
  margin-top: 6px;
  padding-left: 4px;
}

.banc-text-box {
  background: var(--gri-bg);
  border-radius: var(--border-radius);
  padding: 20px 24px;
  border-left: 4px solid var(--main);
}

.banc-text-box p {
  font-size: 17px;
  color: var(--gri-inchis);
  line-height: 1.8;
  margin-bottom: 10px;
}

.banc-text-box p:last-child { margin-bottom: 0; }

.banc-punch {
  font-size: 20px !important;
  color: var(--second) !important;
}

/* Secțiune tip alternativ (video în pagina banc) */
.banc-tip-section {
  margin: 24px 0;
  border: 1px solid var(--linie);
  border-radius: var(--border-radius);
  overflow: hidden;
}

.banc-tip-titlu {
  background: var(--second);
  color: var(--alb);
  font-size: 13px;
  font-weight: 600;
  padding: 10px 16px;
  letter-spacing: 0.5px;
}

.banc-tip-section .banc-video-wrapper {
  margin-bottom: 0;
  border-radius: 0;
}

/* Vot principal */
.banc-vot-principal {
  background: var(--gri-bg);
  border-radius: var(--border-radius);
  padding: 24px;
  text-align: center;
  margin: 24px 0;
}

.banc-vot-intrebare {
  font-size: 16px;
  font-weight: 600;
  color: var(--second);
  margin-bottom: 16px;
}

.banc-vot-butoane {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-bottom: 16px;
}

.btn-vot-mare {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 16px 28px;
  border: 2px solid var(--linie);
  border-radius: var(--border-radius);
  background: var(--alb);
  cursor: pointer;
  transition: var(--transition);
}

.btn-vot-mare:hover,
.btn-vot-mare.votat { transform: scale(1.05); }

.btn-vot-mare--up:hover,
.btn-vot-mare--up.votat { border-color: #4CAF50; background: #E8F5E9; }

.btn-vot-mare--down:hover,
.btn-vot-mare--down.votat { border-color: var(--main); background: var(--main_light); }

.btn-vot-icon  { font-size: 28px; }
.btn-vot-nr    { font-size: 20px; font-weight: 700; color: var(--second); }
.btn-vot-label { font-size: 12px; color: var(--gri-mediu); }

.banc-vot-bar {
  height: 8px;
  background: var(--main_light);
  border-radius: 50px;
  overflow: hidden;
  margin: 0 auto 8px;
  max-width: 300px;
}

.banc-vot-bar-fill {
  height: 100%;
  background: #4CAF50;
  border-radius: 50px;
}

.banc-vot-procent { font-size: 13px; color: var(--gri-mediu); }

/* Share */
.share-label { font-size: 13px; font-weight: 600; color: var(--gri-inchis); }

.btn-share {
  display: inline-block;
  padding: 7px 16px;
  border-radius: var(--border-radius);
  font-size: 13px;
  font-weight: 600;
  color: var(--alb);
  transition: opacity var(--transition);
  text-decoration: none;
}

.btn-share:hover { opacity: 0.85; }
.btn-share--fb   { background: #1877F2; }
.btn-share--tw   { background: #1DA1F2; }
.btn-share--wa   { background: #25D366; }
.btn-share--copy { background: var(--gri-inchis); }

.tags-label { font-size: 12px; font-weight: 600; color: var(--gri-mediu); margin-right: 4px; }

/* Bancuri similare (mini carduri) */
.banc-similare { margin-top: 32px; padding-top: 24px; border-top: 2px solid var(--second); }

.card-banc--mic {
  padding: 16px;
  margin-bottom: 0;
  text-decoration: none;
  display: block;
}

.banc-titlu-mic {
  font-size: 16px;
  font-weight: 700;
  color: var(--second);
  margin: 8px 0 8px;
  line-height: 1.3;
  transition: color var(--transition);
}

.card-banc--mic:hover .banc-titlu-mic { color: var(--main); }

.banc-preview-text {
  font-size: 13px;
  color: var(--gri-mediu);
  line-height: 1.6;
  margin-bottom: 10px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.banc-mini-footer {
  display: flex;
  gap: 12px;
  font-size: 12px;
  color: var(--gri-deschis);
  padding-top: 8px;
  border-top: 1px solid var(--linie);
}

.comentariu-actiuni {
  display: flex;
  gap: 10px;
  margin-top: 8px;
}

.comentariu-actiuni button {
  background: none;
  border: none;
  font-size: 12px;
  color: var(--gri-mediu);
  cursor: pointer;
  padding: 0;
}

.comentariu-actiuni button:hover { color: var(--main); }

/* ─── RESPONSIVE BANCURI ─── */
@media (max-width: 1024px) {
  .bancuri-layout { grid-template-columns: 1fr 260px; gap: 20px; }
}

@media (max-width: 768px) {
  /* Layout — sidebar sub conținut */
  .bancuri-layout { grid-template-columns: 1fr; gap: 20px; padding: 16px 0; }

  /* Hero */
  .bancuri-hero { padding: 24px 0; }
  .bancuri-hero h1 { font-size: 26px; }
  .bancuri-search-bar { flex-direction: column; max-width: 100%; gap: 8px; }
  .bancuri-search-bar input,
  .bancuri-search-bar button { border-radius: var(--border-radius); width: 100%; }

  /* Sort bar */
  .bancuri-sort-bar { flex-direction: column; align-items: flex-start; }
  .bancuri-sort-right { margin-left: 0; width: 100%; }
  .bancuri-sort-select { flex: 1; }

  /* Card banc */
  .card-banc { padding: 16px; }
  .banc-titlu { font-size: 18px; }
  .banc-cu-imagine { flex-direction: column; }
  .banc-imagine { width: 100%; height: 180px; }
  .banc-footer { flex-direction: column; align-items: flex-start; }
  .banc-actiuni { flex-wrap: wrap; gap: 4px; }

  /* Pagina banc */
  .banc-articol { padding: 16px; }
  .banc-articol-titlu { font-size: 24px; }
  .banc-articol-meta { flex-direction: column; align-items: flex-start; gap: 10px; }
  .banc-articol-actiuni { margin-left: 0; }
  .banc-vot-butoane { gap: 10px; }
  .btn-vot-mare { padding: 12px 20px; }
  .btn-vot-icon { font-size: 22px; }
  .btn-vot-nr { font-size: 17px; }
  .share-bar-box { flex-wrap: wrap; gap: 6px; }
  .banc-similare .grid-3 { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .bancuri-hero h1 { font-size: 22px; }
  .banc-titlu { font-size: 16px; }
  .banc-text-box p { font-size: 15px; }
  .banc-articol-titlu { font-size: 20px; }
  .banc-vot-butoane { flex-direction: column; align-items: center; }
  .btn-vot-mare { width: 100%; flex-direction: row; justify-content: center; gap: 10px; padding: 12px; }
  .btn-share { padding: 6px 10px; font-size: 12px; }
}

/* ============================================
   CURS VALUTAR — clase curate
============================================ */

/* Hero */
.cv-hero {
  background: linear-gradient(135deg, #0D1B2A 0%, #1B2838 100%);
  color: var(--alb);
  padding: 36px 0;
  border-bottom: 3px solid var(--main);
}

.cv-hero-inner {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 32px;
  align-items: center;
}

.cv-hero-text h1 {
  font-size: 38px;
  font-weight: 900;
  margin-bottom: 8px;
}

.cv-hero-text p {
  color: var(--gri-deschis);
  font-size: 15px;
  margin-bottom: 14px;
}

.cv-update-info {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--gri-deschis);
}

.cv-update-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #4CAF50;
  animation: pulse 2s infinite;
  flex-shrink: 0;
}

/* Calculator valutar */
.cv-convertor-box {
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--border-radius);
  padding: 20px;
  backdrop-filter: blur(8px);
}

.cv-convertor-titlu {
  font-size: 14px;
  font-weight: 600;
  color: var(--alb);
  margin-bottom: 14px;
  letter-spacing: 0.5px;
}

.cv-convertor-row {
  display: flex;
  gap: 0;
  margin-bottom: 8px;
}

.cv-convertor-input {
  flex: 1;
  padding: 11px 14px;
  border: 1.5px solid rgba(255,255,255,0.2);
  border-right: none;
  background: rgba(255,255,255,0.08);
  color: var(--alb);
  font-size: 16px;
  font-weight: 600;
  outline: none;
  border-radius: var(--border-radius) 0 0 var(--border-radius);
  min-width: 0;
}

.cv-convertor-input--result {
  background: rgba(255,255,255,0.04);
  color: #4CAF50;
}

.cv-convertor-input:focus { border-color: var(--main); }

.cv-convertor-select {
  padding: 11px 12px;
  border: 1.5px solid rgba(255,255,255,0.2);
  background: rgba(255,255,255,0.12);
  color: var(--alb);
  font-size: 13px;
  font-weight: 600;
  outline: none;
  cursor: pointer;
  border-radius: 0 var(--border-radius) var(--border-radius) 0;
}

.cv-convertor-select option { background: #1B2838; color: var(--alb); }

.cv-swap-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.cv-swap-btn {
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.2);
  color: var(--alb);
  width: 34px;
  height: 34px;
  border-radius: 50%;
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background var(--transition);
}

.cv-swap-btn:hover { background: var(--main); border-color: var(--main); }

.cv-swap-label { font-size: 13px; color: var(--gri-deschis); }

.cv-convertor-nota {
  font-size: 11px;
  color: var(--gri-deschis);
  margin-top: 10px;
  text-align: center;
}

/* Bandă cursuri rapide */
.cv-cursuri-rapide-bar {
  background: var(--second_light);
  border-bottom: 1px solid #2A2A2A;
  padding: 10px 0;
  overflow-x: auto;
}

.cv-cursuri-rapide {
  display: flex;
  gap: 0;
  min-width: 600px;
}

.cv-rapid-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 20px;
  border-right: 1px solid #2A2A2A;
  white-space: nowrap;
}

.cv-rapid-item:last-child { border-right: none; }

.cv-rapid-moneda { font-size: 13px; font-weight: 700; color: var(--alb); }
.cv-rapid-val    { font-size: 13px; color: var(--gri-deschis); }
.cv-rapid-trend  { font-size: 12px; font-weight: 600; }

/* Conținut principal */
.cv-container { padding-top: 28px; padding-bottom: 40px; }

.cv-sectiune { margin-bottom: 40px; }

.cv-sursa-badge {
  margin-left: auto;
  font-size: 11px;
  background: var(--gri-bg);
  border: 1px solid var(--linie);
  padding: 3px 10px;
  border-radius: 50px;
  color: var(--gri-mediu);
}

/* Filtre */
.cv-filtre {
  display: flex;
  gap: 6px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.cv-filtru-btn {
  padding: 7px 16px;
  border: 1.5px solid var(--linie);
  border-radius: 50px;
  font-size: 13px;
  font-weight: 500;
  color: var(--gri-inchis);
  background: var(--alb);
  cursor: pointer;
  transition: var(--transition);
}

.cv-filtru-btn:hover,
.cv-filtru-btn--activ {
  background: var(--second);
  border-color: var(--second);
  color: var(--alb);
}

/* Tabs monede banci */
.cv-moneda-tabs { display: flex; gap: 4px; margin-left: auto; }

.cv-moneda-tab {
  padding: 5px 14px;
  border: 1.5px solid var(--linie);
  border-radius: var(--border-radius);
  font-size: 13px;
  font-weight: 600;
  color: var(--gri-inchis);
  background: var(--alb);
  cursor: pointer;
  transition: var(--transition);
}

.cv-moneda-tab:hover,
.cv-moneda-tab--activ {
  background: var(--main);
  border-color: var(--main);
  color: var(--alb);
}

/* Tabel comun */
.cv-tabel-wrapper {
  overflow-x: auto;
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-card);
  border: 1px solid var(--linie);
}

.cv-tabel {
  width: 100%;
  border-collapse: collapse;
  background: var(--alb);
  min-width: 600px;
}

.cv-tabel thead tr {
  background: var(--second);
  color: var(--alb);
}

.cv-tabel th {
  padding: 13px 16px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  text-align: left;
  white-space: nowrap;
}

.cv-th-right { text-align: right !important; }

.cv-th-variatie { min-width: 120px; }

.cv-th-moneda { min-width: 220px; }
.cv-th-banca  { min-width: 240px; }

/* Grup header în tabel */
.cv-grup-header td {
  background: #F8F8F6;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--gri-mediu);
  padding: 8px 16px;
  border-bottom: 1px solid var(--linie);
}

/* Rând normal */
.cv-rand {
  border-bottom: 1px solid var(--linie);
  transition: background var(--transition);
}

.cv-rand:hover { background: #FAFAF8; }
.cv-rand:last-child { border-bottom: none; }

.cv-rand--highlight { background: #FFFEF5; }
.cv-rand--metal     { background: #FDFAF0; }
.cv-rand--best      { background: #F0FFF4; }

/* Celulă monedă */
.cv-moneda-cell {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 13px 16px;
}

.cv-flag { font-size: 22px; flex-shrink: 0; }

.cv-moneda-info {
  display: flex;
  flex-direction: column;
}

.cv-cod { font-size: 15px; font-weight: 700; color: var(--second); }
.cv-nume-moneda { font-size: 12px; color: var(--gri-mediu); }

/* Valoare curs */
.cv-valoare { padding: 13px 16px; }
.cv-val-mare { font-size: 16px; font-weight: 700; color: var(--second); }
.cv-val-sub  { font-size: 11px; color: var(--gri-deschis); margin-left: 3px; }

/* Trend */
.cv-trend, .cv-rapid-trend {
  font-size: 12px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 50px;
}

.cv-trend--up, .cv-rapid-trend.cv-trend--up {
  color: #2E7D32;
  background: #E8F5E9;
}

.cv-trend--down, .cv-rapid-trend.cv-trend--down {
  color: #C62828;
  background: #FFEBEE;
}

.cv-trend--neutral { color: var(--gri-mediu); background: var(--gri-bg); }

/* Diferență față de ieri */
.cv-diff { font-size: 13px; font-weight: 600; }
.cv-diff--up      { color: #2E7D32; }
.cv-diff--down    { color: var(--main); }
.cv-diff--neutral { color: var(--gri-mediu); }

/* Celulă td generică */
.cv-tabel td { padding: 13px 16px; vertical-align: middle; }

/* Tabel bănci */
.cv-banca-cell {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 16px;
}

.cv-banca-logo {
  width: 46px;
  height: 36px;
  border-radius: var(--border-radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 800;
  color: var(--alb);
  flex-shrink: 0;
  letter-spacing: 0.5px;
}

.cv-banca-logo--bcr       { background: #003DA5; }
.cv-banca-logo--bnr       { background: #8B0B1E; }
.cv-banca-logo--ing       { background: #FF6600; }
.cv-banca-logo--bt        { background: #0072CE; }
.cv-banca-logo--raiffeisen{ background: #FFD700; color: #333; }
.cv-banca-logo--unicredit { background: #E3001B; }
.cv-banca-logo--alpha     { background: #1A3A6B; }
.cv-banca-logo--garanti   { background: #009A44; }
.cv-banca-logo--cec       { background: #005C8A; }
.cv-banca-logo--firstbank { background: #6B2D8B; }

.cv-banca-info { display: flex; flex-direction: column; }
.cv-banca-nume { font-size: 14px; font-weight: 600; color: var(--second); }
.cv-best-label { font-size: 11px; color: #2E7D32; font-weight: 600; }
.cv-ref-label  { font-size: 11px; color: var(--gri-mediu); }

.cv-banca-val { font-size: 15px; font-weight: 700; }
.cv-val-cumpar { color: #2E7D32; }
.cv-val-vinde  { color: var(--main); }

.cv-marja { font-size: 13px; color: var(--gri-mediu); }
.cv-marja--zero { color: var(--gri-deschis); }

.cv-data-ora { font-size: 12px; color: var(--gri-deschis); white-space: nowrap; }

.cv-nota {
  font-size: 12px;
  color: var(--gri-mediu);
  margin-top: 12px;
  font-style: italic;
  padding: 0 4px;
}

/* Info cards */
.cv-info-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 8px;
}

.cv-info-card {
  background: var(--alb);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-card);
  padding: 20px;
}

.cv-info-icon  { font-size: 28px; margin-bottom: 10px; }
.cv-info-titlu { font-size: 15px; font-weight: 700; color: var(--second); margin-bottom: 8px; }
.cv-info-card p { font-size: 13px; color: var(--gri-mediu); line-height: 1.6; }

/* ── Responsive ── */
@media (max-width: 1024px) {
  .cv-hero-inner { grid-template-columns: 1fr 320px; gap: 20px; }
  .cv-info-grid  { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  .cv-hero { padding: 24px 0; }
  .cv-hero-inner { grid-template-columns: 1fr; gap: 20px; }
  .cv-hero-text h1 { font-size: 26px; }
  .cv-convertor-row { flex-direction: column; }
  .cv-convertor-input  { border-right: 1.5px solid rgba(255,255,255,0.2); border-bottom: none; border-radius: var(--border-radius) var(--border-radius) 0 0; }
  .cv-convertor-select { border-radius: 0 0 var(--border-radius) var(--border-radius); }
  .cv-info-grid { grid-template-columns: 1fr; }
  .cv-th-variatie { display: none; }
  .cv-moneda-tabs { flex-wrap: wrap; margin-left: 0; margin-top: 8px; }
  .sectiune-titlu { flex-wrap: wrap; }
}

@media (max-width: 480px) {
  .cv-hero-text h1 { font-size: 22px; }
  .cv-filtre { gap: 4px; }
  .cv-filtru-btn { padding: 5px 10px; font-size: 12px; }
  .cv-banca-logo { width: 38px; height: 30px; font-size: 10px; }
  .cv-banca-nume { font-size: 13px; }
  .cv-banca-val  { font-size: 13px; }
}

/* ============================================
   CRYPTO — clase curate
============================================ */

/* Hero */
.crypto-hero {
  background: linear-gradient(135deg, #0B0E11 0%, #131722 100%);
  color: var(--alb);
  padding: 32px 0;
  border-bottom: 3px solid #F7931A;
}

.crypto-hero h1 {
  font-size: 36px;
  font-weight: 900;
  margin-bottom: 6px;
}

.crypto-hero p {
  color: var(--gri-deschis);
  font-size: 15px;
  margin-bottom: 18px;
}

.crypto-hero-ticker {
  display: flex;
  gap: 0;
  overflow-x: auto;
  scrollbar-width: none;
}

.crypto-hero-ticker::-webkit-scrollbar { display: none; }

.crypto-ticker-item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 18px;
  border-right: 1px solid rgba(255,255,255,0.08);
  font-size: 13px;
  color: var(--gri-deschis);
  white-space: nowrap;
  flex-shrink: 0;
}

.crypto-ticker-item:last-child { border-right: none; }
.crypto-ticker-item strong { color: var(--alb); font-weight: 700; }
.crypto-ticker-item .up   { color: #4CAF50; font-weight: 600; }
.crypto-ticker-item .down { color: #F44336; font-weight: 600; }

/* Layout */
.crypto-container { padding-top: 28px; padding-bottom: 40px; }

.crypto-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 24px;
  margin-bottom: 40px;
}

.crypto-main { min-width: 0; }

/* Card monedă TRUMP */
.crypto-coin-card {
  background: var(--alb);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-card);
  padding: 24px;
  margin-bottom: 28px;
}

.crypto-coin-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--linie);
}

.crypto-coin-identity {
  display: flex;
  align-items: center;
  gap: 14px;
}

.crypto-coin-logo {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, #1A1A2E, #16213E);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  border: 2px solid var(--linie);
  flex-shrink: 0;
}

.crypto-coin-names { display: flex; flex-direction: column; gap: 2px; }

.crypto-coin-titlu {
  font-size: 22px;
  font-weight: 800;
  color: var(--second);
  margin: 0;
}

.crypto-coin-simbol {
  font-size: 13px;
  font-weight: 700;
  color: var(--gri-mediu);
  letter-spacing: 1px;
}

.crypto-rank {
  font-size: 12px;
  background: var(--gri-bg);
  color: var(--gri-mediu);
  padding: 2px 8px;
  border-radius: 50px;
  border: 1px solid var(--linie);
  margin-left: 4px;
}

.crypto-coin-pret-bloc { text-align: right; }

.crypto-pret-mare {
  font-size: 32px;
  font-weight: 800;
  color: var(--second);
  line-height: 1.1;
}

.crypto-pret-ron {
  font-size: 14px;
  color: var(--gri-mediu);
  margin: 2px 0;
}

.crypto-variatie {
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 50px;
  margin-top: 4px;
}

.crypto-variatie--up   { background: #E8F5E9; color: #2E7D32; }
.crypto-variatie--down { background: #FFEBEE; color: #C62828; }

/* Stats grid */
.crypto-stats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--linie);
  border: 1px solid var(--linie);
  border-radius: var(--border-radius);
  overflow: hidden;
  margin-bottom: 20px;
}

.crypto-stat-item {
  background: var(--alb);
  padding: 14px 16px;
}

.crypto-stat-label { font-size: 11px; color: var(--gri-deschis); text-transform: uppercase; letter-spacing: 0.8px; margin-bottom: 4px; }
.crypto-stat-val   { font-size: 17px; font-weight: 700; color: var(--second); }
.crypto-stat-sub   { font-size: 11px; color: var(--gri-deschis); margin-top: 2px; }

.crypto-val-up   { color: #2E7D32; }
.crypto-val-down { color: var(--main); }

/* Tabs grafic */
.crypto-grafic-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  flex-wrap: wrap;
  gap: 8px;
}

.crypto-grafic-tabs {
  display: flex;
  gap: 4px;
}

.crypto-tab {
  padding: 5px 12px;
  border: 1.5px solid var(--linie);
  border-radius: var(--border-radius);
  background: var(--alb);
  font-size: 12px;
  font-weight: 600;
  color: var(--gri-mediu);
  cursor: pointer;
  transition: var(--transition);
}

.crypto-tab:hover,
.crypto-tab--activ {
  background: var(--second);
  border-color: var(--second);
  color: var(--alb);
}

.crypto-grafic-tip { display: flex; gap: 4px; }

.crypto-tip-btn {
  padding: 5px 10px;
  border: 1.5px solid var(--linie);
  border-radius: var(--border-radius);
  background: var(--alb);
  font-size: 11px;
  font-weight: 600;
  color: var(--gri-mediu);
  cursor: pointer;
  transition: var(--transition);
}

.crypto-tip-btn--activ {
  background: var(--main);
  border-color: var(--main);
  color: var(--alb);
}

/* Canvas grafic */
.crypto-grafic-wrapper {
  height: 300px;
  position: relative;
  margin-bottom: 20px;
}

/* Detalii extinse */
.crypto-detalii-tabel {
  border: 1px solid var(--linie);
  border-radius: var(--border-radius);
  overflow: hidden;
}

.crypto-detalii-titlu {
  background: var(--gri-bg);
  padding: 10px 16px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--gri-mediu);
  border-bottom: 1px solid var(--linie);
}

.crypto-detalii-grid { display: flex; flex-direction: column; }

.crypto-detaliu-rand {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 16px;
  border-bottom: 1px solid var(--linie);
}

.crypto-detaliu-rand:last-child { border-bottom: none; }
.crypto-detaliu-rand:hover { background: var(--gri-bg); }

/* Tabel crypto piață */
.crypto-sectiune-tabel { margin-bottom: 8px; }

.crypto-tabel .cv-th-right { text-align: right; }

.crypto-rank-nr {
  padding: 13px 16px;
  font-size: 13px;
  font-weight: 700;
  color: var(--gri-deschis);
  text-align: center;
}

.crypto-moneda-cell {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 13px 16px;
}

.crypto-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #F7931A;
  color: var(--alb);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 800;
  flex-shrink: 0;
}

.crypto-icon--eth  { background: #627EEA; }
.crypto-icon--bnb  { background: #F0B90B; color: #333; }
.crypto-icon--sol  { background: #9945FF; }
.crypto-icon--xrp  { background: #0085C0; }
.crypto-icon--doge { background: #C3A634; }
.crypto-icon--trump { background: transparent; font-size: 24px; width: 36px; height: 36px; }

.crypto-badge-up {
  display: inline-block;
  background: #E8F5E9;
  color: #2E7D32;
  font-size: 12px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 50px;
  white-space: nowrap;
}

.crypto-badge-down {
  display: inline-block;
  background: #FFEBEE;
  color: #C62828;
  font-size: 12px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 50px;
  white-space: nowrap;
}

.crypto-rand--trump { background: #FFFEF0; border-left: 4px solid #F7931A; }

/* ── SIDEBAR CRYPTO ── */

/* Fear & Greed */
.crypto-fg-box { text-align: center; padding: 8px 0; }

.crypto-fg-arc { position: relative; display: inline-block; }

.crypto-fg-svg { width: 140px; height: 80px; }

.crypto-fg-val {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 30px;
  font-weight: 900;
  color: #4CAF50;
}

.crypto-fg-label { font-size: 18px; font-weight: 700; color: #4CAF50; margin-top: 6px; }
.crypto-fg-sub   { font-size: 12px; color: var(--gri-mediu); margin-top: 2px; }

/* Trending */
.crypto-trending-list { display: flex; flex-direction: column; gap: 2px; }

.crypto-trend-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 0;
  border-bottom: 1px solid var(--linie);
  text-decoration: none;
  transition: var(--transition);
}

.crypto-trend-item:last-child { border-bottom: none; }
.crypto-trend-item:hover .crypto-trend-name { color: var(--main); }

.crypto-trend-nr {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--gri-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  color: var(--gri-mediu);
  flex-shrink: 0;
}

.crypto-trend-info { display: flex; flex-direction: column; flex: 1; }
.crypto-trend-name  { font-size: 13px; font-weight: 700; color: var(--second); transition: color var(--transition); }
.crypto-trend-price { font-size: 11px; color: var(--gri-mediu); }

/* Market stats */
.crypto-market-stats { display: flex; flex-direction: column; gap: 0; margin-bottom: 14px; }

.crypto-market-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid var(--linie);
  font-size: 13px;
}

.crypto-market-row:last-child { border-bottom: none; }
.crypto-market-label { color: var(--gri-mediu); }
.crypto-market-val   { font-weight: 700; color: var(--second); }

/* Dominanță bar */
.crypto-dominanta-bar {
  display: flex;
  height: 28px;
  border-radius: var(--border-radius);
  overflow: hidden;
  font-size: 11px;
  font-weight: 600;
}

.crypto-dom-btc  { background: #F7931A; color: #fff; display:flex; align-items:center; padding: 0 8px; }
.crypto-dom-eth  { background: #627EEA; color: #fff; display:flex; align-items:center; padding: 0 4px; white-space:nowrap; }
.crypto-dom-rest { background: var(--gri-bg); color: var(--gri-mediu); display:flex; align-items:center; padding: 0 6px; }

/* Calculator crypto */
.crypto-calc-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.crypto-calc-input {
  flex: 1;
  padding: 10px 12px;
  border: 1.5px solid var(--linie);
  border-radius: var(--border-radius);
  font-size: 15px;
  font-weight: 600;
  outline: none;
  transition: border-color var(--transition);
  min-width: 0;
}

.crypto-calc-input:focus { border-color: #F7931A; }

.crypto-calc-simbol {
  font-size: 12px;
  font-weight: 700;
  color: var(--gri-mediu);
  white-space: nowrap;
}

.crypto-calc-equals { text-align: center; font-size: 18px; color: var(--gri-deschis); margin: 4px 0; }

.crypto-calc-result {
  font-size: 24px;
  font-weight: 800;
  color: #4CAF50;
  text-align: center;
}

.crypto-calc-result-ron {
  font-size: 13px;
  color: var(--gri-mediu);
  text-align: center;
  margin-top: 2px;
}

/* Știri crypto grid */
.crypto-stiri-sectiune { margin-top: 8px; }

/* ── Responsive ── */
@media (max-width: 1024px) {
  .crypto-layout { grid-template-columns: 1fr 260px; }
  .crypto-stats-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  .crypto-layout { grid-template-columns: 1fr; }
  .crypto-hero h1 { font-size: 26px; }
  .crypto-coin-header { flex-direction: column; }
  .crypto-coin-pret-bloc { text-align: left; }
  .crypto-pret-mare { font-size: 26px; }
  .crypto-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .crypto-grafic-header { flex-direction: column; align-items: flex-start; }
  .crypto-grafic-wrapper { height: 220px; }
  .cv-th-variatie { display: none; }
}

@media (max-width: 480px) {
  .crypto-hero h1 { font-size: 22px; }
  .crypto-stats-grid { grid-template-columns: 1fr 1fr; }
  .crypto-pret-mare { font-size: 22px; }
  .crypto-grafic-tabs { flex-wrap: wrap; }
  .crypto-grafic-wrapper { height: 180px; }
}

/* ============================================
   CALENDAR ORTODOX — clase curate
============================================ */

/* Hero */
.cal-hero {
  background: linear-gradient(135deg, #1A0A00 0%, #3D1A00 50%, #1A0A00 100%);
  color: var(--alb);
  padding: 36px 0;
  border-bottom: 4px solid #C49A00;
  text-align: center;
}

.cal-hero h1 {
  font-size: 38px;
  font-weight: 900;
  margin-bottom: 8px;
  letter-spacing: 1px;
}

.cal-hero p { color: #D4B896; font-size: 15px; }

/* Container */
.cal-container { padding-top: 24px; padding-bottom: 48px; }

/* ═══ CARD AZI ═══ */
.cal-azi-card {
  display: grid;
  grid-template-columns: 180px 1fr 200px;
  gap: 0;
  background: var(--alb);
  border-radius: var(--border-radius);
  box-shadow: 0 4px 20px rgba(0,0,0,0.12);
  overflow: hidden;
  margin-bottom: 28px;
  border: 2px solid #C49A00;
}

.cal-azi-stanga {
  background: linear-gradient(135deg, #1A0A00, #3D1A00);
  color: var(--alb);
  padding: 24px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.cal-azi-eticheta {
  font-size: 11px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #C49A00;
  margin-bottom: 8px;
}

.cal-azi-data {
  font-size: 20px;
  font-weight: 700;
  color: var(--alb);
  margin-bottom: 4px;
}

.cal-azi-zi {
  font-size: 14px;
  color: #D4B896;
  margin-bottom: 12px;
}

.cal-azi-tip {
  font-size: 12px;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 50px;
  letter-spacing: 0.5px;
}

.cal-tip-rosie   { background: var(--main); color: #fff; }
.cal-tip-albastra { background: #1565C0; color: #fff; }
.cal-tip-verde   { background: #2E7D32; color: #fff; }
.cal-tip-normal  { background: rgba(255,255,255,0.15); color: #D4B896; }

.cal-azi-centru {
  padding: 24px 24px;
  border-right: 1px solid var(--linie);
}

.cal-azi-sfinti-titlu {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #C49A00;
  font-weight: 700;
  margin-bottom: 10px;
}

.cal-azi-sfinti {
  font-size: 16px;
  color: var(--second);
  line-height: 1.55;
}

.cal-azi-sfinti strong { font-size: 17px; }

.cal-azi-extra {
  font-size: 13px;
  color: var(--gri-mediu);
  margin-top: 8px;
  line-height: 1.5;
  font-style: italic;
}

.cal-azi-post { margin-top: 12px; }

.cal-post-badge,
.cal-dezlegare-badge,
.cal-sarbatoare-badge {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 50px;
}

.cal-post-badge       { background: #E3F2FD; color: #1565C0; }
.cal-dezlegare-badge  { background: #E8F5E9; color: #2E7D32; }
.cal-sarbatoare-badge { background: #FFF3E0; color: #E65100; }

.cal-azi-dreapta {
  padding: 20px 18px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  background: #FAFAF7;
}

.cal-azi-soare {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  color: var(--gri-inchis);
}

.cal-azi-soare span { display: flex; align-items: center; gap: 6px; }

.cal-azi-onomastica-titlu {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #C49A00;
  font-weight: 700;
  margin-bottom: 4px;
}

/* Nav luni */
.cal-luni-nav {
  margin-bottom: 28px;
  overflow-x: auto;
  scrollbar-width: none;
}

.cal-luni-nav::-webkit-scrollbar { display: none; }

.cal-luni-list {
  display: flex;
  gap: 6px;
  min-width: 700px;
}

.cal-luna-btn {
  flex: 1;
  padding: 10px 8px;
  border: 1.5px solid var(--linie);
  border-radius: var(--border-radius);
  background: var(--alb);
  font-size: 13px;
  font-weight: 600;
  color: var(--gri-inchis);
  text-align: center;
  text-decoration: none;
  transition: var(--transition);
  white-space: nowrap;
}

.cal-luna-btn:hover,
.cal-luna-btn--activ {
  background: #3D1A00;
  border-color: #C49A00;
  color: #C49A00;
}

/* Secțiune lună */
.cal-luna-sectiune { margin-bottom: 40px; }

.cal-luna-titlu {
  font-size: 22px;
  font-weight: 800;
}

/* Grid zile */
.cal-zile-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
}

/* Card zi */
.cal-zi-card {
  background: var(--alb);
  border-radius: var(--border-radius);
  border: 1px solid var(--linie);
  padding: 10px 10px 10px;
  min-height: 90px;
  transition: var(--transition);
  cursor: default;
  display: flex;
  flex-direction: column;
  gap: 4px;
  position: relative;
}

.cal-zi-card:hover {
  box-shadow: var(--shadow-hover);
  transform: translateY(-1px);
  z-index: 1;
}

/* Tipuri de zi */
.cal-zi-card--rosie    { background: #FFF5F5; border-color: #FFCDD2; }
.cal-zi-card--albastra { background: #F3F8FF; border-color: #BBDEFB; }
.cal-zi-card--verde    { background: #F2FFF4; border-color: #C8E6C9; }
.cal-zi-card--duminica { background: #FFFBF0; border-color: #FFE0B2; }
.cal-zi-card--sambata  { background: #F8F8F8; }
.cal-zi-card--azi      {
  border: 2px solid #C49A00 !important;
  background: #FFFDE7 !important;
  box-shadow: 0 0 0 3px rgba(196,154,0,0.15);
}
.cal-zi-card--gasit    {
  border: 2px solid var(--main) !important;
  box-shadow: 0 0 0 3px rgba(200,16,46,0.15) !important;
  animation: blink 0.5s ease 2;
}

@keyframes blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.5; }
}

.cal-zi-header {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 4px;
}

.cal-zi-nr {
  font-size: 18px;
  font-weight: 900;
  color: var(--second);
  line-height: 1;
}

.cal-zi-card--rosie    .cal-zi-nr { color: var(--main); }
.cal-zi-card--albastra .cal-zi-nr { color: #1565C0; }
.cal-zi-card--verde    .cal-zi-nr { color: #2E7D32; }
.cal-zi-card--duminica .cal-zi-nr { color: #E65100; }
.cal-zi-card--azi      .cal-zi-nr { color: #C49A00; }

.cal-zi-sap {
  font-size: 10px;
  color: var(--gri-deschis);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-weight: 600;
}

.cal-azi-dot {
  font-size: 9px;
  font-weight: 800;
  background: #C49A00;
  color: var(--alb);
  padding: 1px 5px;
  border-radius: 3px;
  letter-spacing: 0.5px;
  margin-left: auto;
}

.cal-zi-sfinti {
  font-size: 11px;
  color: var(--gri-inchis);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.cal-zi-extra {
  font-size: 10px;
  color: var(--gri-mediu);
  font-style: italic;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-top: 2px;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
  .cal-zile-grid { grid-template-columns: repeat(7, 1fr); }
  .cal-azi-card  { grid-template-columns: 160px 1fr 180px; }
}

@media (max-width: 768px) {
  .cal-hero h1    { font-size: 26px; }
  .cal-azi-card   { grid-template-columns: 1fr; }
  .cal-azi-stanga { padding: 20px; flex-direction: row; justify-content: space-between; align-items: center; }
  .cal-azi-centru { border-right: none; border-bottom: 1px solid var(--linie); }
  .cal-azi-dreapta { flex-direction: row; flex-wrap: wrap; gap: 12px; }
  .cal-zile-grid  { grid-template-columns: repeat(4, 1fr); }
  .cal-zi-card    { min-height: 80px; }
}

@media (max-width: 480px) {
  .cal-hero h1    { font-size: 22px; }
  .cal-zile-grid  { grid-template-columns: repeat(3, 1fr); gap: 4px; }
  .cal-zi-nr      { font-size: 15px; }
  .cal-zi-sfinti  { font-size: 10px; -webkit-line-clamp: 2; }
  .cal-zi-extra   { display: none; }
  .cal-zi-card    { padding: 7px; min-height: 65px; }
  .cal-azi-stanga { flex-direction: column; text-align: center; }
}


.filtre{
    background:#fff;
    padding:15px;
    border-radius:12px;
    border:1px solid #e5e5e5;
    box-shadow:0 2px 10px rgba(0,0,0,0.06);
    margin-bottom:20px;
}

.filtru-bar{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    margin:0;
}

/* RESET */
.filtru-bar input,
.filtru-bar select,
.filtru-bar button,
.btn-theme{
    margin:0;
    line-height:1;
    vertical-align:middle;
    box-sizing:border-box;
    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;
    font-family:inherit;
}

/* INPUT + SELECT */
.filtru-bar input[type="text"],
.filtru-bar select{
    height:44px;
    padding:0 14px;
    border:1px solid #ccc;
    border-radius:8px;
    background:#fafafa;
    font-size:14px;
    outline:none;
    transition:0.2s;
}

.filtru-bar input[type="text"]{
    min-width:260px;
    flex:1;
}

.filtru-bar select{
    min-width:180px;
    cursor:pointer;
}

/* FOCUS */
.filtru-bar input[type="text"]:focus,
.filtru-bar select:focus{
    border-color:#007bff;
    background:#fff;
    box-shadow:0 0 0 3px rgba(0,123,255,0.12);
}

/* BUTTON GROUP */
.buttons_group{
    display:flex;
    gap:8px;
}

/* BUTTONS */
.filtru-bar button,
.btn-theme{
    height:44px;
    padding:0 18px;
    border-radius:8px;
    font-size:14px;
    font-weight:600;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    cursor:pointer;
    transition:0.2s;
    white-space:nowrap;
}

/* SUBMIT */
.filtru-bar button{
    border:none;
    background:#007bff;
    color:#fff;
}

.filtru-bar button:hover{
    background:#0062d3;
}

/* RESET */
.btn-theme{
    background:#f3f3f3;
    color:#333;
    border:1px solid #ddd;
}

.btn-theme:hover{
    background:#e5e5e5;
}

/* MOBILE */
@media(max-width:768px){

    .filtru-bar{
        flex-direction:column;
        align-items:stretch;
    }

    .filtru-bar input[type="text"],
    .filtru-bar select,
    .buttons_group{
        width:100%;
    }

    .filtru-bar button,
    .btn-theme{
        flex:1;
    }
}



table{
    width:100%;
    border-collapse:collapse;
    background:var(--alb);
    border-radius:4px;
    overflow:hidden;
}

/* HEADER */
thead{
    background:var(--second);
    color:#fff;
}

th, td{
    padding:12px 14px;
    text-align:left;
    font-size:16px;
    border-bottom:1px solid #eee;
    vertical-align:top;
}

/* ROW HOVER */
tbody tr:hover{
    background:#f7f9fc;
}

/* LINKS */
td a{
    color:#007bff;
    text-decoration:none;
    font-weight:600;
}

td a:hover{
    text-decoration:underline;
}

/* BUTTON GROUP (reutilizezi deja) */
.buttons_group{
    display:flex;
    gap:8px;
}

/* =========================
   RESPONSIVE (MOBILE CARD)
   ========================= */
@media(max-width:768px){

    table,
    thead,
    tbody,
    th,
    td,
    tr{
        display:block;
        width:100%;
    }

    thead{
        display:none;
    }

    tr{
        margin-bottom:12px;
        background:#fff;
        border:1px solid #eee;
        border-radius:12px;
        overflow:hidden;
        box-shadow:0 2px 8px rgba(0,0,0,0.05);
    }

    td{
        display:flex;
        justify-content:space-between;
        gap:10px;
        padding:10px 12px;
        border-bottom:1px solid #f1f1f1;
    }

    td:last-child{
        border-bottom:none;
    }

    td::before{
        content:attr(data-label);
        font-weight:700;
        color:#555;
        flex:1;
    }

    td > *{
        flex:1;
        text-align:right;
    }

    .buttons_group{
        justify-content:flex-end;
        flex-wrap:wrap;
    }
}


.btn-edit, .btn-delete{
    height:44px;
    padding:0 18px;
    border-radius:8px;
    font-size:14px;
    font-weight:600;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    cursor:pointer;
    transition:0.2s;
    white-space:nowrap;
}


.btn-edit{
    background:#39ae77;
    color:#fff;
    border:1px solid #ddd;
}

.btn-edit:hover{
    background:#61cb99;
}

.btn-delete{
    background:#bc2c48;
    color:#fff;
    border:1px solid #ddd;
}

.btn-delete:hover{
    background:#d95b75;
}




.pin-yes{
    color:#198754; /* verde */
    font-weight:600;
    text-decoration:none;
}

.pin-no{
    color:#dc3545; /* rosu */
    font-weight:600;
    text-decoration:none;
}

.pin-yes:hover,
.pin-no:hover{
    text-decoration:underline;
}


.success {
    background:#e1fdf0;
    border-left:5px solid #3ec15b;
    padding:14px 18px;
    margin-bottom:24px;
    display:flex;
    gap:12px;
    align-items:center;  /* ← schimbat */
}

.success span{font-size:24px;flex-shrink:0}

.success strong{color:#35b057;font-size:14px}



.error {
    background:#FFF3E0;
    border-left:5px solid #FF9800;
    padding:14px 18px;
    margin-bottom:24px;
    display:flex;
    gap:12px;
    align-items:center;  /* ← schimbat */
}

.error span{font-size:24px;flex-shrink:0}

.error strong{color:#E65100;font-size:14px}

/* ============================================
   NAVBAR — dreapta cu social buttons
============================================ */

/* Grupul din dreapta navbar-ului */
.navbar-right {
  display: flex;
  align-items: center;
  gap: 0;
  flex-shrink: 0;
}

/* Separator vertical */
.navbar-separator {
  width: 1px;
  height: 28px;
  background: rgba(255,255,255,0.12);
  margin: 0 10px;
}

/* Social buttons în navbar */
.navbar-social {
  display: flex;
  align-items: center;
  gap: 4px;
}

.navbar-social-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: var(--border-radius);
  font-family: var(--font-corp);
  font-size: 12px;
  font-weight: 700;
  color: var(--alb);
  text-decoration: none;
  transition: var(--transition);
  white-space: nowrap;
  letter-spacing: 0.2px;
}

/* Facebook */
.navbar-social-btn--fb {
  background: #1877F2;
}

.navbar-social-btn--fb:hover {
  background: #0d65d9;
  transform: translateY(-1px);
  box-shadow: 0 3px 8px rgba(24,119,242,0.4);
}

/* Twitter / X */
.navbar-social-btn--x {
  background: #000;
  border: 1px solid #333;
}

.navbar-social-btn--x:hover {
  background: #1a1a1a;
  border-color: #555;
  transform: translateY(-1px);
  box-shadow: 0 3px 8px rgba(0,0,0,0.4);
}

.navbar-social-btn--wa{
    background:#25D366;
    color:#fff;
}

.navbar-social-btn--wa:hover{
    background:#1ebe5d;
}

/* Ascunde eticheta text pe ecrane mici */
@media (max-width: 1200px) {
  .navbar-social-label { display: none; }
  .navbar-social-btn   { padding: 7px 10px; }
  .navbar-separator    { margin: 0 6px; }
}

/* Pe mobile — social rămâne vizibil în navbar, doar textul dispare */
@media (max-width: 768px) {
  .navbar-social-label { display: none; }
  .navbar-social-btn   { padding: 7px 9px; }
  .navbar-separator    { margin: 0 6px; }
}

@media (max-width: 480px) {
  .navbar-social-btn { padding: 6px 8px; }
  .navbar-separator  { margin: 0 4px; }
}



/* Adsense */
.adsense{
    display:flex;
    width:100%;
    max-width:100%;
    overflow:hidden;
    box-sizing:border-box;
}
.adsense-box{
    width:100%;
    max-width:100%;
    min-width:0;
    overflow:hidden;
    box-sizing:border-box;
}

.adsense-box ins.adsbygoogle{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
}