/* ==========================================================================
   NadlanRadar — single post
   RTL Hebrew. Written with logical properties so nothing needs mirroring.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Frank+Ruhl+Libre:wght@500;700;900&family=Heebo:wght@400;500;700&display=swap');

:root {
	--nr-ink:      #101b26;
	--nr-ink-2:    #4a5a69;
	--nr-ink-3:    #7b8a97;
	--nr-line:     #e2e6e9;
	--nr-line-2:   #f0f3f4;
	--nr-paper:    #ffffff;
	--nr-surface:  #f4f6f7;
	--nr-signal:   #0b6e70;
	--nr-signal-d: #085456;
	--nr-flag:     #a8531b;

	--nr-display: 'Frank Ruhl Libre', Georgia, serif;
	--nr-body:    'Heebo', system-ui, -apple-system, 'Segoe UI', sans-serif;

	--nr-wrap:    1180px;
	--nr-measure: 700px;
	--nr-radius:  4px;
}

/* --------------------------------------------------------------------------
   Shell
   -------------------------------------------------------------------------- */

.nr-main {
	font-family: var(--nr-body);
	color: var(--nr-ink);
	background: var(--nr-paper);
	line-height: 1.75;
}

.nr-article {
	max-width: var(--nr-wrap);
	margin-inline: auto;
	padding-inline: 20px;
	padding-block: 24px 72px;
}

.nr-article__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: 56px;
	align-items: start;
	margin-block-start: 40px;
}

@media (max-width: 980px) {
	.nr-article__layout {
		grid-template-columns: minmax(0, 1fr);
		gap: 48px;
	}
}

/* --------------------------------------------------------------------------
   Breadcrumbs
   -------------------------------------------------------------------------- */

.nr-breadcrumbs ol {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: .8125rem;
	color: var(--nr-ink-3);
}

.nr-breadcrumbs li + li::before {
	content: '\2039';
	margin-inline-end: 6px;
	color: var(--nr-line);
}

.nr-breadcrumbs a {
	color: var(--nr-ink-2);
	text-decoration: none;
}

.nr-breadcrumbs a:hover {
	color: var(--nr-signal);
	text-decoration: underline;
}

/* --------------------------------------------------------------------------
   Headline block
   -------------------------------------------------------------------------- */

.nr-article__head {
	max-width: 860px;
	margin-block-start: 28px;
}

.nr-eyebrow {
	display: inline-block;
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .06em;
	color: var(--nr-signal);
	text-decoration: none;
	padding-block-end: 10px;
}

.nr-eyebrow:hover {
	text-decoration: underline;
}

.nr-article__title {
	font-family: var(--nr-display);
	font-weight: 900;
	font-size: clamp(2rem, 1.35rem + 2.6vw, 3.25rem);
	line-height: 1.15;
	letter-spacing: -0.01em;
	margin: 0;
	color: var(--nr-ink);
}

.nr-article__deck {
	font-size: clamp(1.0625rem, 1rem + .4vw, 1.3125rem);
	line-height: 1.6;
	color: var(--nr-ink-2);
	max-width: var(--nr-measure);
	margin-block: 18px 0;
	font-weight: 400;
}

/* --------------------------------------------------------------------------
   Meta strip — the instrument readout.
   This is the signature element: hairline data cells, tiny labels, and a
   signal dot on "updated". Everything else on the page stays quiet.
   -------------------------------------------------------------------------- */

.nr-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-block-start: 32px;
	padding-block: 18px;
	border-block: 1px solid var(--nr-line);
}

.nr-meta__author {
	display: flex;
	align-items: center;
	gap: 12px;
}

.nr-meta__avatar {
	inline-size: 44px;
	block-size: 44px;
	border-radius: 50%;
	display: block;
}

.nr-meta__byline {
	display: flex;
	flex-direction: column;
	line-height: 1.35;
}

.nr-meta__name {
	font-weight: 700;
	font-size: .9375rem;
	color: var(--nr-ink);
	text-decoration: none;
}

.nr-meta__name:hover {
	color: var(--nr-signal);
}

.nr-meta__credential {
	font-size: .8125rem;
	color: var(--nr-ink-3);
}

.nr-meta__data {
	display: flex;
	gap: 0;
	margin: 0;
}

.nr-meta__cell {
	padding-inline: 18px;
	border-inline-start: 1px solid var(--nr-line);
	line-height: 1.4;
}

.nr-meta__cell:first-child {
	border-inline-start: 0;
	padding-inline-start: 0;
}

.nr-meta__cell:last-child {
	padding-inline-end: 0;
}

.nr-meta__cell dt {
	font-size: .6875rem;
	font-weight: 500;
	letter-spacing: .04em;
	color: var(--nr-ink-3);
	margin: 0;
}

.nr-meta__cell dd {
	margin: 2px 0 0;
	font-size: .875rem;
	font-weight: 500;
	color: var(--nr-ink);
	font-variant-numeric: tabular-nums;
}

.nr-meta__cell--flag dd {
	color: var(--nr-flag);
}

.nr-meta__cell--flag dd::before {
	content: '';
	display: inline-block;
	inline-size: 6px;
	block-size: 6px;
	border-radius: 50%;
	background: var(--nr-flag);
	margin-inline-end: 6px;
	vertical-align: 1px;
}

@media (max-width: 560px) {
	.nr-meta {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* --------------------------------------------------------------------------
   Lead image
   -------------------------------------------------------------------------- */

.nr-article__figure {
	margin: 36px 0 0;
}

.nr-article__figure img {
	inline-size: 100%;
	block-size: auto;
	display: block;
	border-radius: var(--nr-radius);
}

.nr-article__figure figcaption {
	font-size: .8125rem;
	color: var(--nr-ink-3);
	padding-block-start: 10px;
	border-block-end: 1px solid var(--nr-line-2);
	padding-block-end: 14px;
}

/* --------------------------------------------------------------------------
   Article body — Gutenberg output lives here.
   Generous paragraph rhythm on purpose: short paragraphs with real air
   between them, no walls of text.
   -------------------------------------------------------------------------- */

.nr-article__body {
	max-width: var(--nr-measure);
	font-size: 1.125rem;
	line-height: 1.85;
	color: #1c2b38;
}

.nr-article__body > * + * {
	margin-block-start: 1.35em;
}

.nr-article__body p {
	margin: 0;
}

.nr-article__body h2 {
	font-family: var(--nr-display);
	font-weight: 700;
	font-size: 1.75rem;
	line-height: 1.3;
	color: var(--nr-ink);
	margin-block-start: 2.2em;
	padding-block-end: 10px;
	border-block-end: 2px solid var(--nr-ink);
	scroll-margin-block-start: 90px;
}

.nr-article__body h3 {
	font-family: var(--nr-display);
	font-weight: 700;
	font-size: 1.3125rem;
	line-height: 1.4;
	color: var(--nr-ink);
	margin-block-start: 1.9em;
	scroll-margin-block-start: 90px;
}

.nr-article__body h4 {
	font-weight: 700;
	font-size: 1.0625rem;
	margin-block-start: 1.7em;
}

.nr-article__body a {
	color: var(--nr-signal);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}

.nr-article__body a:hover {
	color: var(--nr-signal-d);
	text-decoration-thickness: 2px;
}

.nr-article__body ul,
.nr-article__body ol {
	padding-inline-start: 1.4em;
	margin-block: 0;
}

.nr-article__body li + li {
	margin-block-start: .5em;
}

.nr-article__body ul li::marker {
	color: var(--nr-signal);
}

.nr-article__body blockquote {
	margin-inline: 0;
	padding-inline-start: 22px;
	border-inline-start: 3px solid var(--nr-signal);
	font-family: var(--nr-display);
	font-size: 1.3125rem;
	line-height: 1.55;
	color: var(--nr-ink);
}

.nr-article__body blockquote p {
	margin: 0;
}

.nr-article__body figure img,
.nr-article__body img {
	max-inline-size: 100%;
	block-size: auto;
	border-radius: var(--nr-radius);
}

.nr-article__body figcaption {
	font-size: .8125rem;
	color: var(--nr-ink-3);
	padding-block-start: 8px;
}

/* Tables get real treatment — a lot of this site is numbers. */
.nr-article__body table {
	inline-size: 100%;
	border-collapse: collapse;
	font-size: .9375rem;
	font-variant-numeric: tabular-nums;
}

.nr-article__body thead th {
	background: var(--nr-ink);
	color: #fff;
	font-weight: 500;
	text-align: start;
	padding: 12px 14px;
	font-size: .875rem;
}

.nr-article__body tbody td {
	padding: 12px 14px;
	border-block-end: 1px solid var(--nr-line);
}

.nr-article__body tbody tr:nth-child(even) td {
	background: var(--nr-surface);
}

.nr-article__body .wp-block-table figcaption {
	text-align: start;
}

.nr-article__body code {
	background: var(--nr-surface);
	padding: 2px 6px;
	border-radius: 3px;
	font-size: .9em;
	direction: ltr;
	unicode-bidi: embed;
	display: inline-block;
}

/* Pull-out box: add class "nr-note" to a Gutenberg group block */
.nr-article__body .nr-note {
	background: var(--nr-surface);
	border-inline-start: 3px solid var(--nr-signal);
	padding: 20px 22px;
	border-radius: var(--nr-radius);
	font-size: 1rem;
}

.nr-article__body .nr-note > * + * {
	margin-block-start: .9em;
}

/* --------------------------------------------------------------------------
   Sidebar
   -------------------------------------------------------------------------- */

.nr-sidebar__sticky {
	position: sticky;
	top: 90px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

@media (max-width: 980px) {
	.nr-sidebar__sticky {
		position: static;
	}
}

.nr-card {
	background: var(--nr-paper);
	border: 1px solid var(--nr-line);
	border-radius: var(--nr-radius);
	padding: 20px;
}

.nr-card__title {
	font-family: var(--nr-display);
	font-size: 1.0625rem;
	font-weight: 700;
	margin: 0 0 14px;
	padding-block-end: 10px;
	border-block-end: 1px solid var(--nr-line);
	color: var(--nr-ink);
}

/* TOC */

.nr-toc__list {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: nr-toc;
	font-size: .9375rem;
	line-height: 1.5;
}

.nr-toc__list li {
	counter-increment: nr-toc;
	margin-block-start: 10px;
}

.nr-toc__list li:first-child {
	margin-block-start: 0;
}

.nr-toc__list a {
	display: block;
	color: var(--nr-ink-2);
	text-decoration: none;
	padding-inline-start: 12px;
	border-inline-start: 2px solid transparent;
}

.nr-toc__list a::before {
	content: counter(nr-toc) '.';
	color: var(--nr-ink-3);
	font-size: .8125rem;
	margin-inline-end: 6px;
	font-variant-numeric: tabular-nums;
}

.nr-toc__list a:hover {
	color: var(--nr-signal);
}

.nr-toc__list a.is-active {
	color: var(--nr-ink);
	font-weight: 500;
	border-inline-start-color: var(--nr-signal);
}

/* Lead card */

.nr-lead {
	background: var(--nr-ink);
	border-color: var(--nr-ink);
	color: #fff;
}

.nr-lead .nr-card__title {
	color: #fff;
	border-block-end-color: rgba(255, 255, 255, .18);
}

.nr-lead__text {
	font-size: .9375rem;
	line-height: 1.6;
	color: #c3cdd6;
	margin: 0 0 16px;
}

.nr-field {
	display: block;
	margin-block-end: 12px;
}

.nr-field span {
	display: block;
	font-size: .8125rem;
	color: #c3cdd6;
	margin-block-end: 5px;
}

.nr-field input {
	inline-size: 100%;
	padding: 10px 12px;
	border: 1px solid rgba(255, 255, 255, .22);
	border-radius: var(--nr-radius);
	background: rgba(255, 255, 255, .06);
	color: #fff;
	font-family: inherit;
	font-size: .9375rem;
}

.nr-field input:focus {
	outline: 2px solid var(--nr-signal);
	outline-offset: 1px;
	background: rgba(255, 255, 255, .1);
}

.nr-consent {
	display: flex;
	gap: 8px;
	align-items: flex-start;
	font-size: .75rem;
	line-height: 1.5;
	color: #9fadb9;
	margin-block-end: 14px;
}

.nr-consent input {
	margin-block-start: 3px;
	flex: none;
}

.nr-consent a {
	color: #fff;
	text-decoration: underline;
}

.nr-btn {
	inline-size: 100%;
	padding: 12px 16px;
	border: 0;
	border-radius: var(--nr-radius);
	background: var(--nr-signal);
	color: #fff;
	font-family: inherit;
	font-size: .9375rem;
	font-weight: 700;
	cursor: pointer;
}

.nr-btn:hover {
	background: var(--nr-signal-d);
}

.nr-btn:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

/* Tools */

.nr-tools__list {
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: .9375rem;
}

.nr-tools__list li + li {
	border-block-start: 1px solid var(--nr-line-2);
}

.nr-tools__list a {
	display: block;
	padding-block: 10px;
	color: var(--nr-ink);
	text-decoration: none;
}

.nr-tools__list a:hover {
	color: var(--nr-signal);
}

.nr-tools__list a::after {
	content: '\2039';
	color: var(--nr-ink-3);
	margin-inline-start: 6px;
}

/* --------------------------------------------------------------------------
   Tags, author box, related
   -------------------------------------------------------------------------- */

.nr-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-block-start: 40px;
	max-width: var(--nr-measure);
}

.nr-tag {
	font-size: .8125rem;
	padding: 5px 12px;
	background: var(--nr-surface);
	border-radius: 100px;
	color: var(--nr-ink-2);
	text-decoration: none;
}

.nr-tag:hover {
	background: var(--nr-ink);
	color: #fff;
}

.nr-authorbox {
	display: flex;
	gap: 18px;
	margin-block-start: 40px;
	padding: 24px;
	background: var(--nr-surface);
	border-radius: var(--nr-radius);
	max-width: var(--nr-measure);
}

.nr-authorbox__avatar {
	inline-size: 64px;
	block-size: 64px;
	border-radius: 50%;
	flex: none;
}

.nr-authorbox__name {
	margin: 0 0 6px;
	font-weight: 700;
	font-size: 1rem;
}

.nr-authorbox__name a {
	color: var(--nr-ink);
	text-decoration: none;
}

.nr-authorbox__credential {
	font-weight: 400;
	color: var(--nr-ink-3);
	font-size: .875rem;
	margin-inline-start: 8px;
}

.nr-authorbox__bio {
	margin: 0;
	font-size: .9375rem;
	line-height: 1.65;
	color: var(--nr-ink-2);
}

.nr-authorbox__link {
	display: inline-block;
	margin-block-start: 8px;
	font-size: .8125rem;
	color: var(--nr-signal);
}

.nr-related {
	margin-block-start: 64px;
	padding-block-start: 32px;
	border-block-start: 2px solid var(--nr-ink);
}

.nr-related__title {
	font-family: var(--nr-display);
	font-size: 1.375rem;
	margin: 0 0 24px;
}

.nr-related__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 28px;
}

@media (max-width: 780px) {
	.nr-related__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

.nr-rcard__link {
	text-decoration: none;
	color: inherit;
	display: block;
}

.nr-rcard__media img {
	inline-size: 100%;
	block-size: 170px;
	object-fit: cover;
	border-radius: var(--nr-radius);
	display: block;
}

.nr-rcard__title {
	font-family: var(--nr-display);
	font-size: 1.0625rem;
	line-height: 1.4;
	margin: 12px 0 0;
	color: var(--nr-ink);
}

.nr-rcard__link:hover .nr-rcard__title {
	color: var(--nr-signal);
}

.nr-rcard__date {
	font-size: .8125rem;
	color: var(--nr-ink-3);
	margin: 6px 0 0;
	font-variant-numeric: tabular-nums;
}

/* --------------------------------------------------------------------------
   Reading progress — a thin sweep across the top. The one nod to the name.
   -------------------------------------------------------------------------- */

.nr-progress {
	position: fixed;
	inset-block-start: 0;
	inset-inline: 0;
	block-size: 3px;
	background: transparent;
	z-index: 999;
	pointer-events: none;
}

.nr-progress__bar {
	block-size: 100%;
	inline-size: 0;
	background: var(--nr-signal);
	transition: inline-size .1s linear;
}

@media (prefers-reduced-motion: reduce) {
	.nr-progress__bar {
		transition: none;
	}
}