/* Звуковий сигнал — decorative frame around semantic article text. */
.news-grid .news-card.news-card--text {
  --card-accent: var(--accent, #88c8ea);
  --frame-mid: color-mix(in srgb, var(--card-accent) 56%, transparent);
  --frame-faint: color-mix(in srgb, var(--card-accent) 24%, transparent);
  --frame-wash: color-mix(in srgb, var(--card-accent) 7%, transparent);
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  align-self: start;
  gap: 0;
  min-width: 0;
  padding: 30px;
  border: 1px solid var(--frame-faint);
  background-image: radial-gradient(ellipse at 100% 0, var(--frame-wash), transparent 65%);
  border-radius:26px 26px 8px 26px; border-color:var(--frame-mid); background-image:linear-gradient(125deg,var(--frame-wash),transparent 70%);
}
.news-grid .news-card.news-card--text::before, .news-grid .news-card.news-card--text::after {content: ''; position: absolute; pointer-events: none; box-sizing: border-box;}
.news-grid .news-card.news-card--text::before {right:20px; top:8px; width:34px; height:12px; background:linear-gradient(var(--frame-mid),var(--frame-mid)) 0 4px/2px 4px no-repeat,linear-gradient(var(--frame-mid),var(--frame-mid)) 7px 2px/2px 8px no-repeat,linear-gradient(var(--card-accent),var(--card-accent)) 14px 0/2px 12px no-repeat,linear-gradient(var(--frame-mid),var(--frame-mid)) 21px 2px/2px 8px no-repeat,linear-gradient(var(--frame-mid),var(--frame-mid)) 28px 4px/2px 4px no-repeat;}
.news-grid .news-card.news-card--text::after {left:24px; bottom:11px; width:38px; height:2px; border-radius:2px; background:var(--frame-mid);}
.news-grid .news-card.news-card--text > .news-copy {padding: 30px;}
.news-card--text h3 {font-size: clamp(22px, 2vw, 27px); line-height: 1.3; overflow-wrap: anywhere;}
.news-grid .news-card.news-card--text:focus-within {outline: 2px solid var(--card-accent); outline-offset: 3px;}
.news-card--text > :is(.news-meta, h3, p, .text-link) {margin-left: 0; margin-right: 0;}
.news-card--text > .news-meta:first-child {margin-top: 0;}

@media (max-width: 540px) {
  .news-grid .news-card.news-card--text > .news-copy {padding: 26px;}
  .news-card--text h3 {font-size: 24px;}
}
