/* ============================================================
   Texno Çinar — XƏBƏR İÇ SƏHİFƏ (news-inner.html)
   Dashboard tipli məqalə layout-u
   ============================================================ */

:root{
  --ni-navy:#07133A;
  --ni-text:#233052;
  --ni-muted:#6F7A91;
  --ni-green:#178A45;
  --ni-green-2:#2E9E58;
  --ni-green-soft:#EEF8F2;
  --ni-border:#E2EBE6;
  --ni-border-2:#EDF2EF;
  --ni-bg:#FAFCFB;
  --ni-shadow:0 18px 42px rgba(25,48,36,.075);
  --ni-shadow-sm:0 10px 26px rgba(25,48,36,.055);
}

.news-inner-page{
  background:
    radial-gradient(circle at 86% 180px, rgba(46,158,88,.08), transparent 280px),
    radial-gradient(circle at 10% 420px, rgba(47,125,244,.055), transparent 260px),
    linear-gradient(180deg,#fbfdfc 0,#fff 52%,#fff 100%);
  color:var(--ni-text);
}

.news-inner-page .wrap{
  max-width:1320px;
}

.news-inner-page a,
.news-inner-page button,
.news-inner-page input{
  font-family:var(--font);
}

.news-inner-page a:focus-visible,
.news-inner-page button:focus-visible,
.news-inner-page input:focus-visible{
  outline:3px solid rgba(46,158,88,.28);
  outline-offset:3px;
}

.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

/* Header */
.ni-header{
  background:rgba(255,255,255,.94);
  border-bottom:1px solid #eef3f0;
  box-shadow:0 8px 28px rgba(25,48,36,.035);
}

.ni-header .nav{
  height:86px;
  gap:18px;
}

.ni-header .brand-logo{
  height:62px;
}

.ni-header .menu{
  gap:7px;
}

.ni-header .menu a{
  color:#07133a;
  font-size:14px;
  font-weight:700;
  padding:10px 11px;
}

.ni-header .menu a:hover,
.ni-header .menu a.active{
  color:var(--ni-green);
  background:#edf8f1;
}

.ni-head-actions{
  gap:10px;
}

.coin-chip,
.student-chip,
.top-icon{
  min-height:50px;
  border:1px solid #dfe8e3;
  background:#fff;
  box-shadow:0 10px 24px rgba(25,48,36,.045);
}

.coin-chip{
  display:flex;
  align-items:center;
  gap:10px;
  padding:7px 9px 7px 11px;
  border-radius:16px;
  color:var(--ni-navy);
}

.coin-chip-icon{
  width:31px;
  height:31px;
  flex:none;
}

.coin-chip b,
.student-chip b{
  display:block;
  color:var(--ni-navy);
  font-size:16px;
  line-height:1.05;
}

.coin-chip small,
.student-chip small{
  display:block;
  color:#7a8496;
  font-size:10.5px;
  font-weight:600;
  line-height:1.2;
  margin-top:3px;
}

.coin-chip i{
  width:25px;
  height:25px;
  display:grid;
  place-items:center;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(135deg,#35ad61,#138348);
  font-style:normal;
  font-size:20px;
  font-weight:800;
  line-height:1;
}

.top-icon{
  position:relative;
  width:50px;
  display:grid;
  place-items:center;
  border-radius:16px;
  color:var(--ni-navy);
}

.top-icon svg{
  width:22px;
  height:22px;
}

.top-icon span{
  position:absolute;
  top:-6px;
  right:-4px;
  min-width:19px;
  height:19px;
  display:grid;
  place-items:center;
  border:2px solid #fff;
  border-radius:999px;
  color:#fff;
  background:#F42626;
  font-size:10px;
  font-weight:800;
}

.student-chip{
  display:flex;
  align-items:center;
  gap:9px;
  padding:5px 10px 5px 6px;
  border-radius:18px;
}

.student-chip img{
  width:42px;
  height:42px;
  border-radius:999px;
  background:#eaf8f0;
  object-fit:cover;
  object-position:center 10%;
}

.student-chip > svg{
  width:14px;
  height:14px;
  color:#6f7a91;
}

/* Page grid */
.news-dashboard{
  padding:24px 0 30px;
}

.news-shell{
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:24px;
  align-items:start;
}

.right-rail{
  position:sticky;
  top:106px;
}

.news-article-card,
.side-panel,
.newsletter-panel{
  border:1px solid var(--ni-border);
  border-radius:18px;
  background:#fff;
  box-shadow:var(--ni-shadow-sm);
}

/* Main article */
.article-column{
  min-width:0;
}

.article-crumb{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:9px;
  min-height:31px;
  margin:13px 0 14px;
  color:#68748b;
  font-size:12.5px;
  font-weight:600;
}

.article-crumb a:hover{
  color:var(--ni-green);
}

.news-article-card{
  overflow:hidden;
  padding:25px 24px 22px;
  box-shadow:var(--ni-shadow);
}

.article-title-block h1{
  max-width:730px;
  color:var(--ni-navy);
  font-size:clamp(28px,3.1vw,40px);
  line-height:1.25;
  font-weight:800;
  margin-bottom:20px;
}

.article-meta-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:23px;
}

.article-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:20px;
  color:#61708d;
  font-size:13px;
  font-weight:600;
}

.article-meta span{
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.article-meta svg{
  width:16px;
  height:16px;
  color:#516487;
}

.article-meta .heart{
  color:#e7273e;
}

.article-meta .heart svg{
  color:#e7273e;
}

.share-article{
  min-width:104px;
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  border:1.5px solid #178a45;
  border-radius:10px;
  color:#106c36;
  background:#fff;
  cursor:pointer;
  font-size:13.5px;
  font-weight:800;
  transition:background .18s,color .18s,transform .18s;
}

.share-article svg{
  width:17px;
  height:17px;
}

.share-article:hover{
  color:#fff;
  background:#178a45;
  transform:translateY(-1px);
}

.main-visual{
  margin:0 0 22px;
  overflow:hidden;
  border-radius:12px;
  background:#eaf8f0;
  aspect-ratio:16 / 9;
}

.main-visual img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

.article-copy{
  color:#101a42;
  font-size:16.5px;
  line-height:1.78;
}

.article-copy p{
  margin:0 0 18px;
}
.article-copy ul,
.article-copy ol{
  margin:0 0 20px;
  padding-left:22px;
}
.article-copy li{
  margin:0 0 8px;
}
.article-copy h2,
.article-copy h3,
.article-copy h4{
  margin:24px 0 12px;
  color:#101a42;
  line-height:1.35;
}
.article-copy a{
  color:#14733e;
  font-weight:700;
}
.article-copy img{
  max-width:100%;
  height:auto;
  border-radius:12px;
}

.article-bottom{
  margin-top:12px;
}

.tag-list{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  padding:10px 0 21px;
  color:#17234b;
  border-bottom:1px solid #edf2ef;
}

.tag-list b{
  margin-right:6px;
  font-size:13.5px;
}

.tag-list a{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  padding:0 13px;
  border-radius:999px;
  color:#3f4b62;
  background:#f5f7fa;
  font-size:12px;
  font-weight:700;
}

.tag-list a:hover{
  color:#14733e;
  background:#eaf8f0;
}

.reaction-row{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:13px 20px;
  padding-top:18px;
  color:#17234b;
}

.reaction-row strong{
  font-size:16px;
  font-weight:800;
}

.reaction-row button{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:1px solid #dfe8e3;
  border-radius:999px;
  color:#17234b;
  background:#fff;
  cursor:pointer;
  padding:0 16px;
  font-size:13px;
  font-weight:800;
  box-shadow:0 8px 18px rgba(25,48,36,.045);
}

.reaction-row button svg{
  width:17px;
  height:17px;
  color:#ee2f3f;
}

.share-links{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:10px;
}

.share-links span{
  color:#17234b;
  font-size:13px;
  font-weight:800;
}

.share-links a{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border:1px solid #dfe8e3;
  border-radius:999px;
  color:#66738b;
  background:#fff;
}

.share-links a svg{
  width:16px;
  height:16px;
}

.share-links .facebook{color:#2f7df4}
.share-links .whatsapp{color:#13a946}
.share-links .telegram{color:#2aa8df}

.newsletter-panel input{
  min-height:44px;
  width:100%;
  border:1px solid #dfe8e3;
  border-radius:10px;
  color:#17234b;
  background:#fff;
  padding:0 15px;
  font-size:13px;
  font-weight:600;
}

.newsletter-panel input::placeholder{
  color:#9aa4b2;
}

.newsletter-panel button{
  min-height:44px;
  border:0;
  border-radius:10px;
  color:#fff;
  background:linear-gradient(135deg,#2ead5c,#137e43);
  cursor:pointer;
  font-size:13px;
  font-weight:800;
}

/* Right rail */
.right-rail{
  display:flex;
  flex-direction:column;
  gap:22px;
}

.side-panel{
  padding:22px 20px;
}

.side-panel h2,
.newsletter-panel h2{
  color:#14733e;
  font-size:18px;
  font-weight:800;
  margin-bottom:18px;
}

.mini-article{
  display:grid;
  grid-template-columns:96px minmax(0,1fr);
  grid-template-rows:auto auto auto;
  gap:4px 12px;
  min-height:112px;
  padding:0 0 14px;
  color:#17234b;
}

.mini-article + .mini-article{
  padding-top:14px;
  border-top:1px solid #edf2ef;
}

.mini-article img{
  grid-row:1 / 4;
  width:96px;
  height:102px;
  border-radius:12px;
  object-fit:cover;
  background:#f3f6f8;
}

.mini-article span{
  color:#71809a;
  font-size:11.5px;
  font-weight:600;
}

.mini-article h3{
  color:#17234b;
  font-size:13px;
  line-height:1.45;
  font-weight:800;
}

.mini-article small{
  color:#61708d;
  font-size:11.5px;
  font-weight:600;
}

.mini-article:hover h3{
  color:#14733e;
}

.all-articles{
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:4px;
  border:1.5px solid #178a45;
  border-radius:10px;
  color:#14733e;
  font-size:13px;
  font-weight:800;
}

.all-articles:hover{
  color:#fff;
  background:#178a45;
}

.all-articles svg{
  width:18px;
  height:18px;
}

.category-panel{
  padding-bottom:18px;
}

.category-panel a{
  min-height:37px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:#17234b;
  font-size:13px;
  font-weight:800;
}

.category-panel a + a{
  margin-top:7px;
}

.category-panel span{
  display:flex;
  align-items:center;
  gap:11px;
}

.category-panel svg{
  width:18px;
  height:18px;
  color:#12235b;
}

.category-panel b{
  min-width:31px;
  height:26px;
  display:grid;
  place-items:center;
  border-radius:999px;
  color:#14733e;
  background:#e7f6ed;
  font-size:11px;
}

.newsletter-panel{
  padding:24px 20px 20px;
  text-align:center;
  background:
    radial-gradient(circle at 50% -10px, rgba(46,158,88,.13), transparent 72px),
    linear-gradient(180deg,#f6fbf8,#fff);
}

.mail-icon{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  margin:0 auto 12px;
  border-radius:18px;
  color:#14733e;
  background:#e4f5eb;
  box-shadow:inset 0 0 0 6px rgba(255,255,255,.55);
}

.mail-icon svg{
  width:31px;
  height:31px;
}

.newsletter-panel h2{
  max-width:240px;
  margin:0 auto 9px;
  color:#17234b;
  line-height:1.28;
}

.newsletter-panel p{
  margin:0 auto 16px;
  max-width:255px;
  color:#34415d;
  font-size:12.5px;
  line-height:1.55;
}

.newsletter-panel form{
  display:flex;
  flex-direction:column;
  gap:9px;
}

.news-inner-page footer{
  margin-top:36px;
}

@media(max-width:1320px){
  .ni-header .menu a{
    padding-inline:8px;
    font-size:13px;
  }

  .news-shell{
    grid-template-columns:minmax(0,1fr) 300px;
    gap:20px;
  }
}

@media(max-width:1180px){
  .ni-header .menu{
    display:none;
  }

  .ni-header .burger{
    display:grid;
  }

  .news-shell{
    grid-template-columns:1fr;
  }

  .right-rail{
    grid-column:auto;
    position:static;
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:start;
  }

  .newsletter-panel{
    grid-column:1 / -1;
  }
}

@media(max-width:920px){
  .news-dashboard{
    padding-top:16px;
  }

  .news-shell{
    grid-template-columns:1fr;
  }

  .right-rail{
    position:static;
  }

  .article-crumb{
    margin-top:0;
  }

  .right-rail{
    grid-column:auto;
  }
}

@media(max-width:760px){
  .ni-header .nav{
    height:74px;
  }

  .ni-header .brand-logo{
    height:52px;
  }

  .coin-chip{
    display:none;
  }

  .student-chip{
    padding-right:7px;
  }

  .student-chip span,
  .student-chip > svg{
    display:none;
  }

  .news-inner-page .wrap{
    padding-inline:16px;
  }

  .news-article-card{
    padding:20px 17px;
  }

  .article-meta-line{
    align-items:flex-start;
    flex-direction:column;
  }

  .share-article{
    width:100%;
  }

  .main-visual{
    border-radius:10px;
    aspect-ratio:4 / 3;
  }

  .article-copy{
    font-size:15.5px;
  }

  .reaction-row{
    align-items:flex-start;
    flex-direction:column;
  }

  .share-links{
    margin-left:0;
  }

  .right-rail{
    grid-template-columns:1fr;
  }
}

@media(max-width:560px){
  .top-icon{
    display:none;
  }

  .article-title-block h1{
    font-size:26px;
  }

  .article-meta{
    gap:12px;
  }

  .mini-article{
    grid-template-columns:86px minmax(0,1fr);
  }

  .mini-article img{
    width:86px;
    height:96px;
  }

}

@media(prefers-reduced-motion:reduce){
  .news-inner-page *,
  .news-inner-page *::before,
  .news-inner-page *::after{
    transition:none!important;
    animation:none!important;
  }
}