/* ГНМЦ · Концепт 4 — картки, форми, таби, акордеони, значки */
.card{
  background:#fff; border-radius:var(--radius-m); box-shadow:var(--shadow-s);
  transition:transform var(--dur-m) var(--ease-out), box-shadow var(--dur-m) var(--ease-out);
}
.news-card{ overflow:hidden; display:flex; flex-direction:column; height:100%; }
.news-card:hover{ transform:translateY(-8px); box-shadow:var(--shadow-l); }
.news-card-media{ position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--grey-150); }
.news-card-media img{ width:100%; height:100%; object-fit:cover; transition:transform var(--dur-l) var(--ease-out); }
.news-card:hover .news-card-media img{ transform:scale(1.08); }
.news-card-media .tag{ position:absolute; top:.8rem; left:.8rem; }
.news-card-body{ padding:1.2rem 1.3rem 1.4rem; display:flex; flex-direction:column; gap:.55rem; flex:1; }
.news-card-date{ font-size:.78rem; color:var(--grey-600); font-weight:600; }
.news-card-body h3{ font-size:1.02rem; margin:0; }
.news-card-body p{ font-size:.88rem; color:var(--grey-600); margin:0; flex:1; }
.news-card-more{ margin-top:.4rem; font-family:var(--font-head); font-weight:700; color:var(--blue-600); font-size:.85rem; display:inline-flex; align-items:center; gap:.35em; }
.news-card-more svg{ width:14px; height:14px; transition:transform var(--dur-s); }
.news-card:hover .news-card-more svg{ transform:translateX(4px); }
.news-card-media--empty{ display:flex; align-items:center; justify-content:center; background:var(--grad-blue); }
.news-card-media--empty svg{ width:44px; height:44px; color:rgba(255,255,255,.6); }

.direction-card{
  padding:2rem 1.6rem; text-align:left; position:relative; overflow:hidden;
  border:1px solid var(--grey-150);
}
.direction-card::after{
  content:''; position:absolute; inset:0; background:var(--grad-blue);
  opacity:0; transition:opacity var(--dur-m) var(--ease-out); z-index:0;
}
.direction-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-l); border-color:transparent; }
.direction-card:hover::after{ opacity:1; }
.direction-card > *{ position:relative; z-index:1; }
.direction-icon{
  width:60px; height:60px; border-radius:16px; background:var(--blue-100);
  display:flex; align-items:center; justify-content:center; margin-bottom:1.2rem;
  transition:background var(--dur-m);
}
.direction-icon .icon-mask{ width:30px; height:30px; color:var(--blue-600); transition:color var(--dur-m); }
.direction-card:hover .direction-icon{ background:rgba(255,255,255,.2); }
.direction-card:hover .direction-icon .icon-mask{ color:#fff; }
.direction-card h3{ font-size:1.08rem; transition:color var(--dur-m); }
.direction-card:hover h3{ color:#fff; }
.direction-card p{ font-size:.88rem; color:var(--grey-600); transition:color var(--dur-m); margin-bottom:1.1rem; }
.direction-card:hover p{ color:rgba(255,255,255,.92); }
.direction-card .card-link{ font-family:var(--font-head); font-weight:700; font-size:.85rem; color:var(--blue-600); display:inline-flex; gap:.4em; align-items:center; transition:color var(--dur-m); }
.direction-card:hover .card-link{ color:#fff; }
.direction-card .card-link svg{ width:14px; height:14px; transition:transform var(--dur-s); }
.direction-card:hover .card-link svg{ transform:translateX(4px); }

.stat-card{
  background:#fff; border-radius:var(--radius-m); padding:1.8rem 1.5rem; text-align:center;
  box-shadow:var(--shadow-s); transition:transform var(--dur-m), box-shadow var(--dur-m);
}
.stat-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-m); }
.stat-value{ font-family:var(--font-head); font-weight:800; font-size:clamp(1.8rem,4vw,2.6rem); color:var(--blue-700); display:block; }
.stat-label{ font-size:.85rem; color:var(--grey-600); margin-top:.4rem; }

.badge-check{ display:inline-flex; align-items:center; gap:.4em; color:var(--blue-700); font-weight:700; font-size:.85rem; }
.badge-check svg{ width:16px; height:16px; }

/* форми */
.field{ display:flex; flex-direction:column; gap:.4rem; margin-bottom:1.1rem; text-align:left; }
.field label{ font-size:.85rem; font-weight:700; color:var(--ink-soft); font-family:var(--font-head); }
.field input, .field select, .field textarea{
  border:1.5px solid var(--grey-300); border-radius:var(--radius-s); padding:.8em 1em;
  font-size:.95rem; color:var(--ink); transition:border-color var(--dur-s), box-shadow var(--dur-s);
  background:#fff;
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; border-color:var(--blue-600); box-shadow:0 0 0 4px var(--blue-100);
}
.field.has-error input, .field.has-error select, .field.has-error textarea{ border-color:var(--red); }
.field-error{ font-size:.78rem; color:var(--red); min-height:1em; }
.field-hint{ font-size:.78rem; color:var(--grey-600); }
.checkbox-row{ display:flex; align-items:flex-start; gap:.6em; font-size:.85rem; color:var(--grey-600); }
.checkbox-row input{ margin-top:.25em; }

/* таби */
.tabs{ display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:1.6rem; }
.tab-btn{
  padding:.65em 1.3em; border-radius:var(--radius-full); border:1.5px solid var(--grey-300);
  background:#fff; color:var(--grey-600); font-family:var(--font-head); font-weight:700; font-size:.86rem;
  transition:all var(--dur-s);
}
.tab-btn:hover{ border-color:var(--blue-500); color:var(--blue-700); }
.tab-btn.is-active{ background:var(--grad-blue); color:#fff; border-color:transparent; box-shadow:var(--shadow-s); }

/* акордеон */
.accordion-item{ border-bottom:1px solid var(--grey-150); }
.accordion-trigger{
  width:100%; display:flex; justify-content:space-between; align-items:center; gap:1rem;
  padding:1.2rem 0; text-align:left; background:none; border:none;
  font-family:var(--font-head); font-weight:700; color:var(--blue-900); font-size:1rem;
}
.accordion-trigger svg{ width:20px; height:20px; flex-shrink:0; color:var(--blue-600); transition:transform var(--dur-m) var(--ease-in-out); }
.accordion-trigger[aria-expanded="true"] svg{ transform:rotate(180deg); }
.accordion-panel{ max-height:0; overflow:hidden; transition:max-height var(--dur-m) var(--ease-in-out); }
.accordion-panel-inner{ padding-bottom:1.3rem; color:var(--grey-600); font-size:.92rem; }

/* документи-рядок */
.doc-row{
  display:flex; align-items:center; gap:1rem; padding:1rem 1.2rem;
  border-radius:var(--radius-s); transition:background var(--dur-s);
}
.doc-row:hover{ background:var(--blue-050); }
.doc-icon{ width:42px; height:42px; border-radius:10px; background:var(--blue-100); color:var(--blue-700); display:flex; align-items:center; justify-content:center; flex-shrink:0; font-family:var(--font-head); font-weight:800; font-size:.72rem; text-transform:uppercase; }
.doc-row .doc-title{ font-weight:600; color:var(--ink-soft); font-size:.92rem; }
.doc-row .doc-meta{ font-size:.78rem; color:var(--grey-600); }
.doc-row .doc-action{ margin-left:auto; flex-shrink:0; }

.faq-note{ background:var(--blue-050); border-radius:var(--radius-m); padding:1.4rem 1.6rem; font-size:.9rem; color:var(--blue-900); }

/* пусті стани */
.empty-state{ text-align:center; padding:3rem 1rem; color:var(--grey-600); }
