/* ==========================================================================
   Digijurist 2026 redesign — UUDISED (uudised.html)
   ==========================================================================
   Owner brief 2026-09-22: an "intelligence briefing" page on the site's charcoal. Depth
   comes from colour, typography, spacing and composition — NOT from
   borders, grids or boxes. Visible rules are kept to a minimum (the active
   tab underline and the search bar's tonal surface). Entries are separated by spacing and tonal background
   differences; secondary metadata lives in the collapsed <details> area.

   Scoped to body[data-page="redesign-uudised"].
   ========================================================================== */

/* Palette: the site's charcoal tokens (owner 2026-09-22: "mulle meeldis see
   must taust enne rohkem"). The nw-* rules below read --nv-* aliases so the
   layout stays independent of the base tokens. */
body[data-page="redesign-uudised"] {
  --nv-bg: var(--dj-bg);
  --nv-bg-2: var(--dj-bg-raised);
  --nv-bg-3: #2b3038;
  --nv-ink: var(--dj-ink);
  --nv-ink-2: var(--dj-ink-2);
  --nv-ink-3: var(--dj-ink-3);
  --nv-steel: #8fa6c0;
  --nv-moon: var(--dj-accent-deep);
  --nv-cyan: var(--dj-accent-deep);
  --nv-glow: var(--dj-accent-wash);
  --nv-rule: var(--dj-hairline);
}

/* ==========================================================================
   1. HERO + MONTHLY STATISTICS
   ========================================================================== */
.nw-hero {
  padding: clamp(56px, 8vw, 96px) 0 clamp(40px, 5vw, 64px);
  background: transparent;
}
.nw-kicker {
  margin: 0;
  font-family: var(--dj-font-mono);
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--nv-steel);
}
.nw-hero__title {
  margin: 22px 0 0;
  max-width: 13em;
  font-size: clamp(42px, 6.2vw, 80px);
  line-height: 1.02;
  letter-spacing: -.02em;
  color: var(--nv-ink);
}
.nw-hero__lead {
  margin: 26px 0 0;
  max-width: 34em;
  font-family: var(--dj-font-ui);
  font-size: clamp(16px, 1.5vw, 19px);
  line-height: 1.6;
  color: var(--nv-ink-2);
}
.nw-hero__status {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
  margin: 26px 0 0;
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--nv-ink-3);
}
.nw-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 12px;
  border-radius: 50%;
  background: var(--nv-cyan);
  box-shadow: 0 0 0 4px var(--nv-glow);
}
.nw-sep {
  display: inline-block;
  margin: 0 .75em;
  color: var(--nv-ink-3);
  opacity: .7;
}

.nw-stats { margin-top: clamp(48px, 6vw, 80px); }
.nw-stats__title {
  margin: 0 0 22px;
  font-family: var(--dj-font-mono);
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--nv-steel);
}
.nw-stats__row {
  display: flex;
  flex-wrap: wrap;
  gap: 28px clamp(48px, 7vw, 104px);
}
.nw-stat {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.nw-stat__count {
  font-size: clamp(48px, 5.4vw, 76px);
  line-height: .92;
  letter-spacing: -.02em;
  color: var(--nv-ink);
  font-variant-numeric: tabular-nums;
}
.nw-stat__label {
  font-family: var(--dj-font-ui);
  font-size: 13px;
  letter-spacing: .02em;
  color: var(--nv-ink-3);
}

/* ==========================================================================
   2. FEED
   ========================================================================== */
.nw-feed {
  padding: 8px 0 clamp(96px, 12vw, 160px);
  background: transparent;
}
.nw-feed__layout { display: block; }
.nw-feed__main { min-width: 0; }

/* --- text tabs: the active feed gets a soft underline + moon-blue --- */
.nw-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 30px;
  margin: 0 0 22px;
}
.nw-tabs button {
  position: relative;
  padding: 10px 0 12px;
  border: 0;
  background: transparent;
  color: var(--nv-ink-3);
  font-family: var(--dj-font-ui);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .01em;
  cursor: pointer;
  transition: color 150ms ease;
}
.nw-tabs button::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  border-radius: 2px;
  background: var(--nv-moon);
  opacity: 0;
  transform: scaleX(.4);
  transform-origin: left center;
  transition: opacity 150ms ease, transform 200ms ease;
}
.nw-tabs button:hover { color: var(--nv-ink-2); }
.nw-tabs button[aria-selected="true"] { color: var(--nv-ink); }
.nw-tabs button[aria-selected="true"]::after {
  opacity: 1;
  transform: scaleX(1);
  box-shadow: 0 0 12px var(--nv-glow);
}
.nw-tabs button:focus-visible {
  outline: none;
  color: var(--nv-ink);
  box-shadow: 0 0 0 3px var(--nv-glow);
  border-radius: 4px;
}

/* --- one search/filter bar on a slightly lighter surface, no borders --- */
.nw-filters {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0 0 20px;
  padding: 6px 8px;
  border-radius: 12px;
  background: var(--nv-bg-2);
}
.nw-search,
.nw-select {
  height: 42px;
  padding: 0 14px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--nv-ink);
  font-family: var(--dj-font-ui);
  font-size: 14px;
  transition: background 150ms ease, box-shadow 150ms ease;
}
.nw-search {
  flex: 1 1 240px;
  min-width: 0;
}
.nw-search::placeholder { color: var(--nv-ink-3); }
.nw-select {
  flex: 0 0 auto;
  padding-right: 32px;
  color: var(--nv-ink-2);
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%237d90ad' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
}
.nw-select option { background: var(--nv-bg-2); color: var(--nv-ink); }
.nw-search:hover, .nw-select:hover { background: rgba(255, 255, 255, .03); }
.nw-search:focus-visible, .nw-select:focus-visible {
  outline: none;
  background: var(--nv-bg-3);
  box-shadow: 0 0 0 2px var(--nv-glow);
}

/* --- briefing entries: spacing + tonal background, no rules --- */
.nw-rows {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.nw-row {
  margin: 0;
  border-radius: 12px;
  background: transparent;
  transition: background 150ms ease;
}
.nw-row:nth-child(even) { background: rgba(255, 255, 255, .018); }
.nw-row:hover { background: var(--nv-bg-2); }
.nw-row[open] { background: var(--nv-bg-3); }
.nw-row__summary {
  list-style: none;
  padding: 24px 26px 22px;
  cursor: pointer;
}
.nw-row__summary::-webkit-details-marker { display: none; }
.nw-row__summary:focus-visible {
  outline: none;
  border-radius: 12px;
  box-shadow: 0 0 0 2px var(--nv-glow);
}
.nw-row__line1 {
  display: flex;
  align-items: center;
  margin: 0;
  font-size: 11.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--nv-ink-3);
}
.nw-row__line1::before {
  content: "";
  width: 6px;
  height: 6px;
  margin-right: 12px;
  border-radius: 50%;
  background: var(--nv-steel);
  flex: 0 0 auto;
}
.nw-row--riigikohus .nw-row__line1::before { background: var(--nv-moon); }
.nw-row--eu-kohtulahendid .nw-row__line1::before,
.nw-row--eu-oigusaktid .nw-row__line1::before { background: var(--nv-cyan); }
.nw-row__cat { color: var(--nv-steel); }
.nw-row__new { color: var(--nv-cyan); }
.nw-row__title {
  margin: 12px 0 0;
  font-family: var(--dj-font-ui);
  font-size: 19px;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: -.005em;
  color: var(--nv-ink);
  overflow-wrap: anywhere;
}
.nw-row__summary-text {
  margin: 10px 0 0;
  max-width: 62em;
  font-family: var(--dj-font-ui);
  font-size: 15px;
  line-height: 1.6;
  color: var(--nv-ink-2);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.nw-row[open] .nw-row__summary-text {
  display: block;
  -webkit-line-clamp: unset;
}
.nw-row__foot {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px 22px;
  margin: 14px 0 0;
  font-size: 12px;
  color: var(--nv-ink-3);
}
.nw-row__meta { letter-spacing: .04em; }
.nw-row__topics { font-family: var(--dj-font-ui); font-size: 12.5px; }
.nw-row__toggle {
  margin-left: auto;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--nv-steel);
  opacity: .75;
  transition: opacity 150ms ease, color 150ms ease;
}
.nw-row__toggle::after { content: " +"; }
.nw-row[open] .nw-row__toggle::after { content: " –"; }
.nw-row:hover .nw-row__toggle, .nw-row[open] .nw-row__toggle { opacity: 1; color: var(--nv-moon); }

/* expanded detail: same surface, deeper indent — a briefing note, not a box */
.nw-row__expand {
  padding: 0 26px 26px 44px;
}
.nw-changed {
  margin: 0 0 18px;
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--nv-ink-2);
  overflow-wrap: anywhere;
}
.nw-changed b { font-weight: 600; color: var(--nv-moon); }
.nw-row__expand dl {
  display: grid;
  grid-template-columns: 168px minmax(0, 1fr);
  gap: 10px 24px;
  margin: 0;
}
.nw-row__expand dt {
  font-family: var(--dj-font-mono);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--nv-ink-3);
  padding-top: 3px;
}
.nw-row__expand dd {
  margin: 0;
  font-family: var(--dj-font-ui);
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--nv-ink-2);
  overflow-wrap: anywhere;
}
.nw-row__expand dd a { color: var(--nv-moon); text-decoration: none; }
.nw-row__expand dd a:hover { color: var(--nv-cyan); }
.nw-row__auto { font-size: 11px; letter-spacing: .06em; color: var(--nv-ink-3); }
.nw-row__source { margin: 22px 0 0; }
.nw-row__link {
  font-family: var(--dj-font-ui);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--nv-moon);
  text-decoration: none;
  transition: color 150ms ease;
}
.nw-row__link:hover { color: var(--nv-cyan); }

.nw-empty {
  margin: 40px 0 0;
  font-size: 13px;
  color: var(--nv-ink-3);
}

/* ==========================================================================
   3. RESPONSIVE
   ========================================================================== */
@media (max-width: 640px) {
  .nw-hero { padding-top: 40px; }
  .nw-hero__title { font-size: clamp(34px, 9.5vw, 44px); }
  .nw-stats__row { gap: 24px 36px; }
  .nw-stat__count { font-size: 40px; }
  .nw-tabs { gap: 2px 22px; }
  .nw-tabs button { font-size: 13.5px; padding: 8px 0 10px; }
  .nw-filters { flex-wrap: wrap; gap: 2px; padding: 6px; }
  .nw-search { flex: 1 1 100%; }
  .nw-select { flex: 1 1 calc(50% - 2px); min-width: 0; }
  .nw-row__summary { padding: 20px 18px 18px; }
  .nw-row__title { font-size: 17px; }
  .nw-row__expand { padding: 0 18px 22px 18px; }
  .nw-row__expand dl { grid-template-columns: 1fr; gap: 4px 0; }
  .nw-row__expand dt { margin-top: 12px; }
  .nw-row__toggle { margin-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .nw-tabs button::after, .nw-row, .nw-search, .nw-select, .nw-row__toggle, .nw-row__link {
    transition: none;
  }
}