/* News page — extends base theme */

/* HERO */
.news-hero{
  position:relative; overflow:hidden;
  padding:64px 0 28px;
  border-bottom:1px solid var(--outline);
}
.news-hero .hero-inner{ position:relative; z-index:1 }
.hero-bg{ position:absolute; inset:0; overflow:hidden; pointer-events:none }
.orb{ position:absolute; width:380px; height:380px; border-radius:999px; filter:blur(32px); opacity:.55;
      background: radial-gradient(closest-side, var(--brand), transparent 70%) }
.orb.o1{ left:-100px; top:-60px; animation:float 12s ease-in-out infinite }
.orb.o2{ right:-120px; top:20%; animation:float 14s ease-in-out infinite reverse }
.orb.o3{ left:40%; bottom:-120px; animation:float 18s ease-in-out infinite }
@keyframes float{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-16px)} }

/* FILTERS */
.filters{ display:grid; gap:14px; margin-top:22px; color:var(--text); }
.search-wrap{ position:relative; max-width:560px }
.search-wrap input{
  width:100%; background:var(--input-bg); border:1px solid var(--input-border); color:var(--text);
  padding:12px 40px 12px 14px; border-radius:12px; outline:none;
  transition:border-color .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease)
}
.search-wrap input::placeholder{ color:#ffffff; opacity:.6 }
.search-wrap input:focus{ border-color:var(--brand); box-shadow:0 0 0 3px var(--focus-ring); background:var(--brand-glass) }
.search-wrap .icon{ position:absolute; right:12px; top:50%; transform:translateY(-50%); opacity:.85; color:var(--text); }

.filters-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px }
@media (max-width: 800px){ .filters-row{ grid-template-columns:1fr } }

.filters-group{ display:grid; gap:8px; }
.filter-label{
  font-weight:800; letter-spacing:.02em; color:var(--text);
  opacity:.95; user-select:none;
}
.chip-row{ display:flex; flex-wrap:wrap; gap:10px }
.tag-chip{
  color:var(--text);
  background:var(--chip-bg);
  border:1px solid var(--chip-border);
  padding:8px 12px; border-radius:999px; cursor:pointer; font-weight:700;
  transition:transform .2s var(--ease), background .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease)
}
.tag-chip:hover{ transform:translateY(-1px) }
.tag-chip.is-active{
  background:linear-gradient(180deg,var(--brand),var(--accent));
  border-color:transparent;
  color:#111;
}

/* GRID */
.news-grid-wrap{ margin:28px auto 70px }
.news-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px }
@media (max-width: 1100px){ .news-grid{ grid-template-columns:repeat(2,1fr) } }
@media (max-width: 700px){ .news-grid{ grid-template-columns:1fr } }

.news-card{
  position:relative; border:1px solid var(--outline); border-radius:16px; overflow:hidden;
  background:var(--card-gradient); box-shadow: var(--surface-elev);
  transform:translateY(10px) scale(.98); opacity:0;
  transition:transform .7s var(--ease), opacity .7s var(--ease), border-color .35s var(--ease)
}
.news-card.revealed{ transform:none; opacity:1 }
.news-card:hover{ border-color:var(--brand-soft-x) }

.news-media{ width:100%; height:220px; object-fit:cover; display:block; transform:scale(1.04) }
.news-body{ padding:14px 14px 16px }
.news-body h3{ margin:.2em 0 .2em }

.meta .tag-inline{ margin-left:4px }

/* Collapsible post body */
.post-body{
  position:relative;
  margin-top:6px;
  max-height:6.8em; overflow:hidden;
  transition:max-height .45s var(--ease)
}
/* soft fade at bottom when collapsed */
.post-body::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:58px;
  background:linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,.65));
  pointer-events:none; opacity:1; transition:opacity .35s var(--ease);
}
.post-body.is-open{ max-height:80vh }
.post-body.is-open::after{ opacity:0 }
.post-body.no-text{ max-height:none }
.post-body.no-text::after{ display:none }

/* Actions row */
.post-actions{ display:flex; gap:10px; align-items:center; margin-top:10px }

/* Stylish animated "Читать дальше" button */
.post-more{
  --ring: var(--focus-ring);
  display:inline-flex; align-items:center; gap:10px;
  font-weight:800; letter-spacing:.01em;
  color:var(--text);
  background:var(--chip-bg);
  border:1px solid var(--chip-border);
  padding:9px 14px; border-radius:999px; cursor:pointer;
  transition:
    transform .2s var(--ease),
    background .25s var(--ease),
    border-color .25s var(--ease),
    box-shadow .25s var(--ease),
    color .25s var(--ease);
}
.post-more:hover{ transform:translateY(-1px); border-color:var(--brand-soft-strong); box-shadow:0 10px 30px var(--brand-glow) }
.post-more:focus-visible{ outline:none; box-shadow:0 0 0 3px var(--ring) }
.post-more::after{
  content:"→";
  display:inline-block;
  transform:translateX(0);
  transition:transform .25s var(--ease), opacity .25s var(--ease);
  opacity:.9;
}
/* when expanded, rotate arrow up and nudge */
.post-more[aria-expanded="true"]::after{
  transform:rotate(-90deg) translateY(1px);
}
/* micro press animation */
.post-more.pulse{ animation:postMorePress .22s var(--ease) }
@keyframes postMorePress{
  0%{ transform:scale(1) }
  50%{ transform:scale(.98) }
  100%{ transform:scale(1) }
}

/* Load more */
.load-more-wrap{ display:grid; place-items:center; margin-top:16px }
.load-more-wrap .btn{ min-width:200px }

/* Ribbon */
.ribbon{ margin:36px 0; border-block:1px solid var(--outline);
  background:linear-gradient(90deg, rgba(255,255,255,.04) 0, transparent 35%, transparent 65%, rgba(255,255,255,.04) 100%) }
.strip-wrap{ overflow:hidden; padding-block:10px }
.marquee{ display:flex; gap:40px; white-space:nowrap; animation:marquee 24s linear infinite }
@keyframes marquee{ from{ transform:translateX(0) } to{ transform:translateX(-50%) } }
.marquee span{ opacity:.7; font-weight:800; letter-spacing:.2em }

/* Reveal helpers */
.reveal{ transform:translateY(12px); opacity:0; transition:transform .8s var(--ease), opacity .8s var(--ease) }
.revealed{ transform:none !important; opacity:1 !important }

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  .news-card,.post-more{ transition:none !important }
}

@media (max-width: 600px){
  .news-hero{padding:48px 0 22px;}
  .filters{gap:12px;}
  .search-wrap{max-width:none;}
  .filters-group{gap:6px;}
  .chip-row{gap:8px;}
  .post-actions{flex-direction:column;align-items:stretch;}
  .post-more{width:100%;justify-content:center;}
}

@media (max-width: 480px){
  .news-media{height:190px;}
  .post-body{font-size:15px;}
  .filters{gap:10px;}
}
