/* DeAutos.com — Noticias page styles */

.news-hero{
  background: linear-gradient(180deg, #EAF3FB 0%, #F5F8FC 100%);
  border-bottom:1px solid var(--line);
}
.news-hero-inner{max-width:1240px; margin:0 auto; padding:48px 20px 30px}
.news-hero .kicker{
  display:inline-block; background:var(--ar-yellow); color:#3A2A00;
  font-size:11.5px; font-weight:800; letter-spacing:.5px; text-transform:uppercase;
  padding:4px 12px; border-radius:999px;
}
.news-hero h1{
  font-size:38px; line-height:1.1; margin:14px 0 12px;
  color:var(--ar-blue-deep); letter-spacing:-.4px;
}
.news-hero h1 .accent{color:var(--ar-blue-2)}
.news-hero > .news-hero-inner > p{
  color:var(--muted); font-size:16px; margin:0; max-width:780px; line-height:1.5;
}
.news-meta{
  display:flex; gap:24px; margin-top:18px; flex-wrap:wrap;
  font-size:13px; color:var(--muted);
}
.news-meta strong{color:var(--ar-blue-deep); font-weight:800; font-size:15px; margin-right:4px}

/* Toolbar */
.news-toolbar{background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:5}
.news-toolbar-inner{max-width:1240px; margin:0 auto; padding:14px 20px; display:flex; flex-direction:column; gap:10px}
.news-search input{
  width:100%; padding:10px 14px; border:1px solid var(--line);
  border-radius:10px; font-size:14px;
}
.news-search input:focus{outline:2px solid var(--ar-blue); outline-offset:1px}
.news-cats{display:flex; gap:6px; flex-wrap:wrap; overflow-x:auto}
.cat-chip{
  background:#F0F4FA; color:var(--ar-blue-deep);
  border:1px solid transparent; border-radius:999px;
  padding:6px 14px; font-size:13px; font-weight:600;
  cursor:pointer; white-space:nowrap;
}
.cat-chip:hover{background:#E2ECF7}
.cat-chip.active{background:var(--ar-blue-deep); color:#fff}
.news-sources{display:flex; gap:14px; flex-wrap:wrap; font-size:12.5px; color:var(--muted)}
.news-sources label{display:inline-flex; align-items:center; gap:5px; cursor:pointer}
.news-sources input{accent-color:var(--ar-blue); width:14px; height:14px}

/* Featured */
.news-featured{max-width:1240px; margin:24px auto 0; padding:0 20px}
.featured-card{
  display:grid; grid-template-columns: 1.2fr 1fr;
  background:#fff; border:1px solid var(--line); border-radius:16px;
  overflow:hidden; box-shadow: 0 4px 14px rgba(11,42,74,.08);
  transition: transform .15s ease, box-shadow .15s ease;
  color:inherit;
}
.featured-card:hover{transform: translateY(-2px); box-shadow: 0 10px 28px rgba(11,42,74,.14); color:inherit}
.featured-img{
  background:#0B2A4A;
  background-size:cover; background-position:center;
  aspect-ratio:16/10;
  min-height:280px;
}
.featured-body{padding:28px; display:flex; flex-direction:column; gap:10px; justify-content:center}
.featured-meta{display:flex; gap:8px; flex-wrap:wrap}
.featured-body h2{margin:6px 0 4px; font-size:28px; line-height:1.2; color:var(--ar-blue-deep); letter-spacing:-.3px}
.featured-body p{margin:0; color:var(--muted); font-size:15px; line-height:1.5}
.featured-cta{
  margin-top:14px; color:var(--ar-blue-2); font-weight:700; font-size:14px;
}

/* Badges */
.badge-source{
  background:var(--ar-blue-deep); color:#fff;
  padding:3px 10px; border-radius:999px; font-size:11.5px; font-weight:700;
  letter-spacing:.3px;
}
.badge-cat{
  background:#FFF6DA; color:#7A5A00;
  padding:3px 10px; border-radius:999px; font-size:11.5px; font-weight:700;
}
.badge-date{
  color:var(--muted); font-size:12px; font-weight:600;
  display:inline-flex; align-items:center;
}

/* Grid */
.news-grid-wrap{max-width:1240px; margin:0 auto; padding:24px 20px 36px}
.news-grid{
  display:grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap:18px;
}
.news-grid .loading{padding:48px; text-align:center; color:var(--muted); grid-column:1/-1}

.news-card{
  background:#fff; border:1px solid var(--line);
  border-radius:14px; overflow:hidden;
  display:flex; flex-direction:column;
  transition: transform .15s ease, box-shadow .15s ease;
  text-decoration:none; color:inherit;
  position:relative;            /* anchor for absolutely-positioned badges */
}
.news-card:hover{
  transform: translateY(-2px); box-shadow: 0 10px 28px rgba(11,42,74,.14);
  color:inherit;
}
.news-card-img{
  aspect-ratio:16/10;
  background:#0B2A4A;
  background-size:cover; background-position:center;
  position:relative;
}
.news-card-img .img-fallback{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  color:#fff; font-weight:800; font-size:16px; letter-spacing:.5px;
  text-align:center; padding:14px;
  background:linear-gradient(135deg, var(--ar-blue-2), var(--ar-blue-deep));
}
.news-card-badges{
  position:absolute; top:10px; left:10px; display:flex; gap:6px; flex-wrap:wrap;
}
.news-card-body{padding:14px; display:flex; flex-direction:column; gap:8px; flex:1}
.news-card-title{
  margin:0; font-size:16px; line-height:1.3; color:var(--ar-blue-deep);
  font-weight:700;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.news-card-snippet{
  margin:0; color:var(--muted); font-size:13px; line-height:1.45;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.news-card-foot{
  margin-top:auto; display:flex; justify-content:space-between; align-items:center;
  padding-top:8px; border-top:1px dashed var(--line); font-size:12px;
}
.news-card-foot .read-link{color:var(--ar-blue-2); font-weight:700}

/* Disclosure */
.news-disclosure{background:#F5F8FC; border-top:1px solid var(--line)}
.news-disclosure-inner{
  max-width:1100px; margin:0 auto; padding:18px 20px;
}
.news-disclosure p{
  margin:0; color:var(--muted); font-size:13px; text-align:center; line-height:1.5;
}

/* Active nav indicator */
.topnav a.active{background:var(--ar-blue-deep); color:#fff}
.topnav a.active::before{filter: invert(1)}

/* Responsive */
@media (max-width: 900px){
  .featured-card{grid-template-columns: 1fr}
  .featured-img{min-height:200px}
  .featured-body{padding:20px}
  .featured-body h2{font-size:22px}
  .news-hero h1{font-size:28px}
  .news-toolbar{position:static}
}
@media (max-width: 560px){
  .news-hero-inner{padding:30px 16px 22px}
  .news-hero h1{font-size:24px}
  .news-meta{gap:14px; font-size:12px}
  .news-sources{display:none}
}