@font-face {
   font-family: "Modam";
   src: url("../fonts/ModamVF.woff2") format("woff2");
   font-style: normal;
   font-weight: 200 900;
   font-stretch: 70% 100%;
   font-display: swap;
}

.nab-article {
   --nab-accent: #3157d5;
   --nab-accent-soft: #edf2ff;
   --nab-navy: #102551;
   --nab-navy-dark: #071839;
   --nab-text: #43516b;
   --nab-muted: #72809a;
   --nab-border: #dce5f1;
   --nab-panel: #fff;
   --nab-soft: #f5f8fc;
   --nab-section-gap: 24px;
   direction: rtl;
   color: var(--nab-text);
   font-family: "Modam", Tahoma, Arial, sans-serif;
   font-size: 15px;
   font-stretch: 100%;
   line-height: 1.9;
}

.nab-article *,
.nab-article *::before,
.nab-article *::after {
   box-sizing: border-box;
}

.nab-article img {
   max-width: 100%;
}

.nab-article button,
.nab-article input {
   font: inherit;
}

.nab-article > .nab-intro-summary,
.nab-article > .nab-numbered-flow,
.nab-article > .nab-faq-section,
.nab-article > .nab-sources-section {
   margin-bottom: var(--nab-section-gap);
}

.nab-article > :last-child {
   margin-bottom: 0;
}

/* Numbered sections and their dynamic post footer form one continuous card. */
.nab-article .nab-numbered-flow {
   overflow: hidden;
   border-radius: 16px;
   box-shadow: 0 9px 28px rgba(26, 48, 88, .06);
}

.nab-article .nab-numbered-flow > .nab-section,
.nab-article .nab-numbered-flow > .nab-post-tags,
.nab-article .nab-numbered-flow > .nab-post-author {
   margin: 0;
   border-radius: 0;
   box-shadow: none;
}

.nab-article .nab-numbered-flow > :not(:first-child) {
   border-top: 0;
}

.nab-article .nab-numbered-flow > :first-child {
   border-radius: 16px 16px 0 0;
}

.nab-article .nab-numbered-flow > :last-child {
   border-radius: 0 0 16px 16px;
}

.nab-article .nab-numbered-flow > :only-child {
   border-radius: 16px;
}

.nab-article .nab-section {
   padding: clamp(22px, 4vw, 38px);
   border: 1px solid var(--nab-border);
   border-radius: 16px;
   background: var(--nab-panel);
   box-shadow: 0 9px 28px rgba(26, 48, 88, .06);
}

.nab-article .nab-section__header {
   margin-bottom: 24px;
}

.nab-article .nab-section__eyebrow {
   display: flex;
   align-items: center;
   gap: 9px;
   margin-bottom: 8px;
   color: var(--nab-accent);
   font-size: 12px;
   font-weight: 800;
}

.nab-article .nab-section__number {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   font-family: inherit;
   font-size: 12px;
   font-weight: 850;
   line-height: 1.4;
}

/* Long articles skip layout/paint work for sections outside the viewport. */
@supports (content-visibility: auto) {
	.nab-article .nab-numbered-flow > .nab-section,
	.nab-article > .nab-faq-section,
	.nab-article > .nab-sources-section {
		content-visibility: auto;
		contain-intrinsic-size: auto 520px;
	}
}

.nab-article .nab-section__number::after {
   content: "";
   width: 10px;
   height: 2px;
   background: #a8b8ea;
}

.nab-article .nab-section__title,
.nab-article .nab-faq-section__header h2,
.nab-article .nab-faq-section__header h3,
.nab-article .nab-faq-section__header h4,
.nab-article .nab-faq-section__header h5,
.nab-article .nab-faq-section__header h6 {
   margin: 0;
   padding: 0;
   border: 0;
   background: transparent;
   color: var(--nab-navy);
   font: inherit;
   font-size: clamp(1.15rem, 1.8vw, 1.35rem);
   font-weight: 750;
   line-height: 1.55;
   letter-spacing: 0;
}

.nab-article .nab-section__items {
   display: grid;
   gap: 19px;
}

.nab-article .nab-item {
   min-width: 0;
}

.nab-article .nab-richtext,
.nab-article .nab-richtext p,
.nab-article .nab-item p {
   color: var(--nab-text);
   font-size: .9rem;
   line-height: 2;
}

.nab-article .nab-richtext > :first-child,
.nab-article .nab-item div > :first-child,
.nab-article .nab-faq__answer > :first-child {
   margin-top: 0;
}

.nab-article .nab-richtext > :last-child,
.nab-article .nab-item div > :last-child,
.nab-article .nab-faq__answer > :last-child {
   margin-bottom: 0;
}

/* Fixed summary before section one */
.nab-article .nab-intro-summary {
   padding: clamp(24px, 4vw, 38px) clamp(24px, 4vw, 42px);
   border: 1px solid var(--nab-border);
   border-right: 4px solid var(--nab-accent);
   border-radius: 16px;
   background: var(--nab-panel);
   box-shadow: 0 9px 28px rgba(26, 48, 88, .055);
}

.nab-article .nab-intro-summary__label {
   display: block;
   margin-bottom: 8px;
   color: var(--nab-accent);
   font-size: 11px;
   font-weight: 850;
}

.nab-article .nab-intro-summary__title {
   margin: 0 0 10px;
   padding: 0;
   color: var(--nab-navy);
   font: inherit;
   font-size: clamp(1.05rem, 1.7vw, 1.3rem);
   font-weight: 800;
   line-height: 1.65;
}

.nab-article .nab-intro-summary__content,
.nab-article .nab-intro-summary__content p {
   margin: 0;
   color: var(--nab-text);
   font-size: .84rem;
   line-height: 2;
}

.nab-article .nab-intro-summary__bullets {
   display: flex;
   flex-wrap: wrap;
   gap: 12px 30px;
   margin: 22px 0 0;
   padding: 17px 0 0;
   border-top: 1px solid var(--nab-border);
   list-style: none;
}

.nab-article .nab-intro-summary__bullets li {
   display: flex;
   align-items: center;
   gap: 8px;
   color: var(--nab-text);
   font-size: .72rem;
}

.nab-article .nab-intro-summary__bullets li::before {
   content: "✓";
   color: var(--nab-accent);
   font-weight: 900;
}

/* Callout */
.nab-article .nab-callout {
   display: grid;
   grid-template-columns: 38px 1fr;
   gap: 13px;
   padding: 18px;
   border: 1px solid var(--nab-border);
   border-radius: 12px;
   background: var(--nab-soft);
}

.nab-article .nab-callout > i {
   display: grid;
   place-items: center;
   width: 34px;
   height: 34px;
   border-radius: 9px;
   background: var(--nab-accent-soft);
   color: var(--nab-accent);
   font: 850 14px Arial, sans-serif;
   font-style: normal;
}

.nab-article .nab-callout--warning {
   border-color: #f2d9ad;
   background: #fffaf1;
}

.nab-article .nab-callout--warning > i {
   background: #fff0d1;
   color: #b47613;
}

.nab-article .nab-callout--success {
   border-color: #cce8da;
   background: #f4fbf7;
}

.nab-article .nab-callout--success > i {
   background: #e3f6ec;
   color: #258a5e;
}

.nab-article .nab-callout strong {
   display: block;
   margin-bottom: 4px;
   color: var(--nab-navy);
   font-size: .92rem;
}

.nab-article .nab-callout p {
   margin: 0;
   font-size: .78rem;
}

.nab-article .nab-callout a {
   display: inline-block;
   margin-top: 8px;
   color: var(--nab-accent);
   font-size: .78rem;
   font-weight: 750;
}

/* Quote */
.nab-article .nab-quote {
   position: relative;
   margin: 0;
   padding: 40px 31px 24px;
   border: 0;
   border-radius: 15px;
   background: linear-gradient(135deg, var(--nab-navy), var(--nab-navy-dark));
   color: #fff;
}

.nab-article .nab-quote > span {
   position: absolute;
   top: 1px;
   right: 22px;
   color: #8fa8ef;
   font: 900 68px Georgia, serif;
   opacity: .5;
}

.nab-article .nab-quote__text {
   position: relative;
   z-index: 1;
}

.nab-article .nab-quote__text p {
   margin: 0;
   color: #fff;
   font-size: .9rem;
   line-height: 2;
}

.nab-article .nab-quote footer {
   display: flex;
   align-items: center;
   gap: 10px;
   margin-top: 17px;
   padding-top: 15px;
   border-top: 1px solid rgba(255, 255, 255, .13);
   background: transparent;
   color: #fff;
}

.nab-article .nab-quote footer b {
   font-size: .76rem;
}

.nab-article .nab-quote footer small {
   color: rgba(255, 255, 255, .62);
   font-size: .68rem;
}

/* Steps */
.nab-article .nab-steps {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 11px;
   margin: 0;
   padding: 0;
   list-style: none;
}

.nab-article .nab-steps li {
   display: block;
   min-height: 150px;
   padding: 18px;
   border: 1px solid var(--nab-border);
   border-radius: 13px;
   background: var(--nab-panel);
}

.nab-article .nab-steps li > span {
   display: grid;
   place-items: center;
   width: 35px;
   height: 35px;
   margin-bottom: 18px;
   border-radius: 10px;
   background: var(--nab-accent-soft);
   color: var(--nab-accent);
   font-size: .77rem;
   font-weight: 900;
}

.nab-article .nab-steps small,
.nab-article .nab-steps b {
   display: block;
}

.nab-article .nab-steps small {
   margin-bottom: 3px;
   color: var(--nab-accent);
   font-size: .65rem;
}

.nab-article .nab-steps b {
   color: var(--nab-navy);
   font-size: .92rem;
}

.nab-article .nab-steps p {
   margin: 6px 0 0;
   font-size: .74rem;
   line-height: 1.9;
}

/* Pros / cons and do / don't */
.nab-article .nab-pros-cons,
.nab-article .nab-do-dont {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: 12px;
}

.nab-article .nab-pros-cons > div,
.nab-article .nab-do-dont > div {
   padding: 21px;
   border: 1px solid var(--nab-border);
   border-radius: 13px;
   background: var(--nab-panel);
}

.nab-article .nab-pros-cons h3,
.nab-article .nab-do-dont h3,
.nab-article .nab-tabs h3,
.nab-article .nab-resource h3,
.nab-article .nab-image-split h3,
.nab-article .nab-carousel h3 {
   margin: 0;
   padding: 0;
   color: var(--nab-navy);
   font: inherit;
   font-size: 1rem;
   font-weight: 800;
   line-height: 1.65;
}

.nab-article .nab-pros-cons h3 {
   margin-bottom: 15px;
}

.nab-article .nab-pros-cons h3 span {
   display: inline-grid;
   place-items: center;
   width: 27px;
   height: 27px;
   margin-left: 6px;
   border-radius: 8px;
}

.nab-article .nab-pros-cons__pros h3 span {
   background: #e6f6ee;
   color: #279263;
}

.nab-article .nab-pros-cons__cons h3 span {
   background: #fcebed;
   color: #d74a55;
}

.nab-article .nab-pros-cons ul {
   display: grid;
   gap: 9px;
   margin: 0;
   padding: 0 18px 0 0;
   font-size: .82rem;
}

.nab-article .nab-pros-cons__conclusion {
   margin-top: 11px;
   padding: 13px 16px;
   border-right: 3px solid var(--nab-accent);
   border-radius: 8px;
   background: var(--nab-soft);
}

.nab-article .nab-do-dont > div > span {
   display: inline-flex;
   padding: 5px 9px;
   border-radius: 99px;
   font-size: .65rem;
   font-weight: 850;
}

.nab-article .nab-do-dont__do > span {
   background: #e6f6ee;
   color: #258c5e;
}

.nab-article .nab-do-dont__dont > span {
   background: #fcebed;
   color: #d74a55;
}

.nab-article .nab-do-dont h3 {
   margin: 14px 0 7px;
}

.nab-article .nab-do-dont p {
   margin: 0;
   font-size: .82rem;
   line-height: 1.9;
}

/* Stats */
.nab-article .nab-stats {
   display: grid;
   grid-template-columns: repeat(var(--nab-stat-count, 3), minmax(0, 1fr));
   overflow: hidden;
   border: 1px solid var(--nab-border);
   border-radius: 14px;
   background: var(--nab-panel);
}

.nab-article .nab-stats > div {
   display: grid;
   align-content: center;
   justify-items: center;
   min-height: 145px;
   padding: 18px;
   border-left: 1px solid var(--nab-border);
   text-align: center;
}

.nab-article .nab-stats > div:last-child {
   border-left: 0;
}

.nab-article .nab-stats strong {
   color: var(--nab-accent);
   font-size: 1.8rem;
   font-weight: 900;
   line-height: 1.2;
}

.nab-article .nab-stats strong em {
   margin-right: 3px;
   font-size: .72rem;
   font-style: normal;
}

.nab-article .nab-stats span {
   margin-top: 4px;
   color: var(--nab-navy);
   font-size: .78rem;
   font-weight: 750;
}

.nab-article .nab-stats small {
   margin-top: 4px;
   color: var(--nab-muted);
   font-size: .66rem;
}

/* Table */
.nab-article .nab-table-wrap {
   overflow-x: auto;
   border: 1px solid var(--nab-border);
   border-radius: 13px;
}

.nab-article .nab-table {
   width: 100%;
   min-width: 620px;
   margin: 0;
   border: 0;
   border-collapse: collapse;
   background: var(--nab-panel);
   font-size: .78rem;
}

.nab-article .nab-table caption {
   padding: 12px 15px;
   background: var(--nab-soft);
   color: var(--nab-navy);
   font-weight: 800;
   text-align: right;
}

.nab-article .nab-table th {
   padding: 14px 16px;
   border: 0;
   background: var(--nab-navy);
   color: #fff;
   font-size: .75rem;
   text-align: right;
}

.nab-article .nab-table td {
   padding: 14px 16px;
   border: 0;
   border-bottom: 1px solid var(--nab-border);
   background: transparent;
   color: var(--nab-text);
}

.nab-article .nab-table tr:last-child td {
   border-bottom: 0;
}

.nab-article .nab-table td:first-child {
   color: var(--nab-navy);
   font-weight: 800;
}

.nab-article .nab-table .nab-table__best {
   background: var(--nab-accent-soft);
   color: var(--nab-accent);
   font-weight: 800;
}

/* Glossary */
.nab-article .nab-glossary {
   display: grid;
   gap: 9px;
   margin: 0;
}

.nab-article .nab-glossary > div {
   display: grid;
   grid-template-columns: 185px 1fr;
   gap: 20px;
   padding: 17px 19px;
   border: 1px solid var(--nab-border);
   border-radius: 11px;
   background: var(--nab-panel);
}

.nab-article .nab-glossary dt {
   color: var(--nab-navy);
   font-size: .95rem;
   font-weight: 850;
}

.nab-article .nab-glossary dt a {
   color: inherit;
}

.nab-article .nab-glossary dt small {
   display: block;
   margin-top: 4px;
   color: var(--nab-accent);
   font-size: .64rem;
   font-weight: 750;
}

.nab-article .nab-glossary dd {
   margin: 0;
   font-size: .82rem;
   line-height: 1.9;
}

.nab-article .nab-glossary dd p {
   margin: 0;
   font-size: inherit;
}

/* Timeline */
.nab-article .nab-timeline {
   display: grid;
   max-width: 760px;
   margin-inline: auto;
}

.nab-article .nab-timeline > div {
   display: grid;
   grid-template-columns: 85px 18px 1fr;
   gap: 14px;
   min-height: 100px;
}

.nab-article .nab-timeline time {
   padding-top: 4px;
   color: var(--nab-muted);
   font-size: .7rem;
   text-align: left;
}

.nab-article .nab-timeline > div > span {
   width: 13px;
   height: 13px;
   position: relative;
   margin-top: 5px;
   border: 3px solid var(--nab-soft);
   border-radius: 50%;
   background: var(--nab-muted);
   box-shadow: 0 0 0 1px var(--nab-border);
}

.nab-article .nab-timeline > div:not(:last-child) > span::after {
   content: "";
   width: 1px;
   position: absolute;
   top: 14px;
   bottom: -84px;
   right: 3px;
   background: var(--nab-border);
}

.nab-article .nab-timeline > div.is-active > span {
   background: var(--nab-accent);
   box-shadow: 0 0 0 4px var(--nab-accent-soft);
}

.nab-article .nab-timeline section {
   padding-bottom: 20px;
}

.nab-article .nab-timeline b {
   color: var(--nab-navy);
   font-size: .88rem;
}

.nab-article .nab-timeline p {
   margin: 5px 0 0;
   font-size: .79rem;
   line-height: 1.85;
}

/* Tabs */
.nab-article .nab-tabs {
   overflow: hidden;
   border: 1px solid var(--nab-border);
   border-radius: 13px;
   background: var(--nab-panel);
}

.nab-article .nab-tabs__nav {
   display: flex;
   gap: 4px;
   overflow-x: auto;
   padding: 7px;
   border-bottom: 1px solid var(--nab-border);
   background: var(--nab-soft);
}

.nab-article .nab-tabs [role="tab"] {
   flex: 1 0 110px;
   padding: 10px;
   border: 0;
   border-radius: 8px;
   background: transparent;
   color: var(--nab-text);
   cursor: pointer;
   font-size: .76rem;
   font-weight: 750;
}

.nab-article .nab-tabs [role="tab"].is-active {
   background: #fff;
   color: var(--nab-accent);
   box-shadow: 0 3px 12px rgba(25, 48, 89, .1);
}

.nab-article .nab-tabs [role="tabpanel"] {
   min-height: 135px;
   padding: 24px;
}

.nab-article .nab-tabs h3 {
   margin-bottom: 8px;
}

.nab-article .nab-tabs p {
   margin: 0;
   font-size: .84rem;
   line-height: 1.95;
}

.nab-article [hidden] {
   display: none !important;
}

/* Resource */
.nab-article .nab-resource {
   display: grid;
   grid-template-columns: 72px minmax(0, 1fr) auto;
   align-items: center;
   gap: 18px;
   padding: 20px;
   border: 1px solid var(--nab-border);
   border-radius: 14px;
   background: var(--nab-panel);
}

.nab-article .nab-resource__icon {
   display: grid;
   place-items: end center;
   width: 68px;
   height: 76px;
   padding-bottom: 12px;
   border-radius: 9px 9px 13px 13px;
   background: linear-gradient(145deg, #5579de, #2849ad);
   box-shadow: 0 10px 22px rgba(57, 89, 179, .22);
   color: #fff;
   font: 900 .72rem Arial, sans-serif;
}

.nab-article .nab-resource small {
   color: var(--nab-accent);
   font-size: .65rem;
   font-weight: 800;
}

.nab-article .nab-resource h3 {
   margin: 4px 0;
}

.nab-article .nab-resource p {
   margin: 0;
   font-size: .79rem;
}

.nab-article .nab-resource footer {
   margin-top: 10px;
   background: transparent;
   color: var(--nab-muted);
   font-size: .65rem;
}

.nab-article .nab-resource > a {
   display: flex;
   align-items: center;
   gap: 8px;
   padding: 11px 14px;
   border-radius: 9px;
   background: var(--nab-accent);
   color: #fff;
   font-size: .73rem;
   font-weight: 800;
   text-decoration: none;
}

.nab-article .nab-resource > a b {
   font-size: 1rem;
}

/* Images */
.nab-article .nab-editorial-image {
   overflow: hidden;
   margin: 0;
   border: 1px solid var(--nab-border);
   border-radius: 15px;
   background: var(--nab-panel);
}

.nab-article .nab-lightbox-trigger {
   display: block;
   width: 100%;
   margin: 0;
   padding: 0;
   border: 0;
   background: transparent;
   cursor: zoom-in;
}

.nab-article .nab-editorial-image__media {
   display: block;
   width: 100%;
   height: auto;
   aspect-ratio: 16 / 8.7;
   object-fit: cover;
}

.nab-article .nab-editorial-image figcaption {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 20px;
   padding: 14px 17px;
   color: var(--nab-muted);
   font-size: .66rem;
}

.nab-article .nab-editorial-image figcaption > span:first-child {
   display: grid;
   gap: 3px;
}

.nab-article .nab-editorial-image figcaption b {
   color: var(--nab-navy);
   font-size: .78rem;
}

.nab-article .nab-image-split {
   display: grid;
   grid-template-columns: 1.05fr .95fr;
   overflow: hidden;
   min-height: 310px;
   border: 1px solid var(--nab-border);
   border-radius: 15px;
   background: var(--nab-panel);
}

.nab-article .nab-image-split--left > img {
   order: 2;
}

.nab-article .nab-image-split > img {
   display: block;
   width: 100%;
   height: 100%;
   min-height: 310px;
   object-fit: cover;
}

.nab-article .nab-image-split > div {
   display: grid;
   align-content: center;
   padding: 30px;
}

.nab-article .nab-image-split small {
   color: var(--nab-accent);
   font-size: .66rem;
   font-weight: 800;
}

.nab-article .nab-image-split h3 {
   margin: 7px 0 10px;
   font-size: 1.15rem;
}

.nab-article .nab-image-split p {
   margin: 0;
   font-size: .84rem;
   line-height: 1.95;
}

.nab-article .nab-image-split a {
   margin-top: 18px;
   color: var(--nab-accent);
   font-size: .74rem;
   font-weight: 800;
}

.nab-article .nab-gallery {
   display: grid;
   grid-template-columns: 1.35fr .8fr;
   grid-auto-rows: 205px;
   gap: 9px;
}

.nab-article .nab-gallery button {
   position: relative;
   overflow: hidden;
   min-width: 0;
   border-radius: 12px;
}

.nab-article .nab-gallery button:first-child {
   grid-row: span 2;
}

.nab-article .nab-gallery img {
   display: block;
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform .35s;
}

.nab-article .nab-gallery button:hover img {
   transform: scale(1.035);
}

.nab-article .nab-gallery button > span {
   position: absolute;
   right: 11px;
   bottom: 10px;
   padding: 6px 9px;
   border: 1px solid rgba(255, 255, 255, .18);
   border-radius: 99px;
   background: rgba(10, 22, 46, .68);
   color: #fff;
   font-size: .63rem;
   backdrop-filter: blur(8px);
}

/* Before / after */
.nab-article .nab-before-after {
   position: relative;
   overflow: hidden;
   aspect-ratio: 16 / 8.5;
   border-radius: 15px;
   background: #101a2a;
   direction: ltr;
}

.nab-article .nab-before-after__base,
.nab-article .nab-before-after__after,
.nab-article .nab-before-after img {
   width: 100%;
   height: 100%;
   position: absolute;
   inset: 0;
   display: block;
   object-fit: cover;
}

.nab-article .nab-before-after__base img {
   filter: grayscale(1) contrast(.86) brightness(.78);
}

.nab-article .nab-before-after__after {
   clip-path: inset(0 calc(100% - var(--nab-split)) 0 0);
}

.nab-article .nab-before-after::after {
   content: "";
   width: 3px;
   position: absolute;
   z-index: 2;
   top: 0;
   bottom: 0;
   left: var(--nab-split);
   background: #fff;
   transform: translateX(-50%);
}

.nab-article .nab-before-after > i {
   display: grid;
   place-items: center;
   width: 38px;
   height: 38px;
   position: absolute;
   z-index: 3;
   top: 50%;
   left: var(--nab-split);
   border: 3px solid #fff;
   border-radius: 50%;
   background: var(--nab-accent);
   box-shadow: 0 6px 20px rgba(0, 0, 0, .28);
   color: #fff;
   font-style: normal;
   transform: translate(-50%, -50%);
}

.nab-article .nab-before-after input {
   width: 100%;
   height: 100%;
   position: absolute;
   z-index: 4;
   inset: 0;
   margin: 0;
   opacity: 0;
   cursor: ew-resize;
}

.nab-article .nab-before-after > span {
   position: absolute;
   z-index: 2;
   top: 14px;
   padding: 7px 10px;
   border-radius: 99px;
   background: rgba(8, 19, 40, .68);
   color: #fff;
   font-size: .66rem;
   backdrop-filter: blur(6px);
}

.nab-article .nab-before-after__before-label {
   right: 14px;
}

.nab-article .nab-before-after__after-label {
   left: 14px;
}

/* Carousel */
.nab-article .nab-carousel {
   overflow: hidden;
   border: 1px solid var(--nab-border);
   border-radius: 15px;
   background: var(--nab-panel);
}

.nab-article .nab-carousel__stage,
.nab-article .nab-carousel__slide {
   position: relative;
   height: 430px;
   overflow: hidden;
}

.nab-article .nab-carousel__slide > img {
   display: block;
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.nab-article .nab-carousel__slide::after {
   content: "";
   position: absolute;
   inset: 42% 0 0;
   background: linear-gradient(transparent, rgba(7, 18, 39, .9));
}

.nab-article .nab-carousel__slide > div {
   position: absolute;
   z-index: 2;
   right: 25px;
   bottom: 22px;
   max-width: calc(100% - 50px);
   color: #fff;
}

.nab-article .nab-carousel__slide small {
   color: rgba(255, 255, 255, .7);
   font-size: .68rem;
}

.nab-article .nab-carousel__slide h3 {
   margin: 5px 0 0;
   color: #fff;
   font-size: 1.18rem;
}

.nab-article .nab-carousel__slide p {
   margin: 5px 0 0;
   color: rgba(255, 255, 255, .78);
   font-size: .78rem;
}

.nab-article .nab-carousel > footer {
   display: flex;
   align-items: center;
   justify-content: space-between;
   min-height: 58px;
   padding: 9px 13px;
   background: var(--nab-panel);
}

.nab-article .nab-carousel__dots,
.nab-article .nab-carousel > footer > span {
   display: flex;
   gap: 6px;
}

.nab-article .nab-carousel__dots button {
   width: 20px;
   height: 4px;
   padding: 0;
   border: 0;
   border-radius: 99px;
   background: var(--nab-border);
   cursor: pointer;
}

.nab-article .nab-carousel__dots button.is-active {
   width: 34px;
   background: var(--nab-accent);
}

.nab-article .nab-carousel > footer > span button {
   width: 36px;
   height: 36px;
   padding: 0;
   border: 1px solid var(--nab-border);
   border-radius: 9px;
   background: var(--nab-soft);
   color: var(--nab-navy);
   cursor: pointer;
}

/* Dynamic tags and author at the end of the continuous numbered flow. */
.nab-article .nab-post-tags {
   display: grid;
   gap: 11px;
   padding: clamp(18px, 3vw, 25px) clamp(22px, 4vw, 38px);
   border: 1px solid var(--nab-border);
   background: var(--nab-panel);
}

.nab-article .nab-post-tags__label {
   color: var(--nab-muted);
   font-size: .68rem;
   font-weight: 750;
}

.nab-article .nab-post-tags__list {
   display: flex;
   flex-wrap: wrap;
   gap: 7px;
}

.nab-article .nab-post-tags__list a {
   display: inline-flex;
   align-items: center;
   min-height: 30px;
   padding: 5px 11px;
   border: 1px solid #dbe4f3;
   border-radius: 999px;
   background: #f3f6fb;
   color: #4562b4;
   font-size: .72rem;
   font-weight: 700;
   line-height: 1.5;
   text-decoration: none;
   transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}

.nab-article .nab-post-tags__list a:hover,
.nab-article .nab-post-tags__list a:focus-visible {
   border-color: #adc0f2;
   background: var(--nab-accent-soft);
   color: var(--nab-accent);
}

.nab-article .nab-post-author {
   display: flex;
   align-items: center;
   gap: 16px;
   padding: clamp(20px, 3.5vw, 30px) clamp(22px, 4vw, 38px);
   border: 1px solid var(--nab-border);
   background: var(--nab-panel);
}

.nab-article .nab-post-author__avatar {
   display: grid;
   place-items: center;
   width: 52px;
   height: 52px;
   flex: 0 0 52px;
   border-radius: 50%;
   background: linear-gradient(145deg, #e8a57d, #bd6d49);
   box-shadow: 0 7px 18px rgba(175, 94, 58, .18);
   color: #fff;
   font-size: 1rem;
   font-weight: 850;
   line-height: 1;
   text-decoration: none;
}

.nab-article .nab-post-author__body {
   min-width: 0;
}

.nab-article .nab-post-author__body > small {
   display: block;
   margin-bottom: 2px;
   color: var(--nab-accent);
   font-size: .64rem;
}

.nab-article .nab-post-author__name {
   display: inline-block;
   color: var(--nab-navy);
   font-size: .88rem;
   font-weight: 800;
   text-decoration: none;
}

.nab-article .nab-post-author__bio,
.nab-article .nab-post-author__bio p {
   margin: 5px 0 0;
   color: var(--nab-text);
   font-size: .76rem;
   line-height: 1.95;
}

/* Fixed, unnumbered sources section after FAQ. */
.nab-article .nab-sources-section {
   padding: clamp(26px, 5vw, 44px) clamp(24px, 5vw, 48px);
   border: 1px solid var(--nab-border);
   border-radius: 16px;
   background: #f8fafc;
   box-shadow: 0 9px 28px rgba(26, 48, 88, .045);
}

.nab-article .nab-sources-section__header {
   margin-bottom: 17px;
}

.nab-article .nab-sources-section__header > span {
   display: block;
   margin-bottom: 7px;
   color: var(--nab-accent);
   font-size: .68rem;
   font-weight: 800;
}

.nab-article .nab-sources-section__header h2,
.nab-article .nab-sources-section__header h3,
.nab-article .nab-sources-section__header h4,
.nab-article .nab-sources-section__header h5,
.nab-article .nab-sources-section__header h6 {
   margin: 0;
   padding: 0;
   color: var(--nab-navy);
   font: inherit;
   font-size: clamp(1.15rem, 2vw, 1.4rem);
   font-weight: 760;
   line-height: 1.65;
}

.nab-article .nab-sources-section__content,
.nab-article .nab-sources-section__content p {
   color: var(--nab-text);
   font-size: .86rem;
   line-height: 2;
}

.nab-article .nab-sources-section__content > :first-child {
   margin-top: 0;
}

.nab-article .nab-sources-section__content > :last-child {
   margin-bottom: 0;
}

.nab-article .nab-sources-list {
   display: grid;
   gap: 9px;
   margin-top: 23px;
}

.nab-article .nab-source-link {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 16px;
   min-height: 64px;
   padding: 12px 16px;
   border: 1px solid #d6e0ed;
   border-radius: 11px;
   background: #f1f5f9;
   color: var(--nab-text);
   text-decoration: none;
   transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.nab-article .nab-source-link:hover,
.nab-article .nab-source-link:focus-visible {
   border-color: #9fb4e9;
   background: #f5f8ff;
   transform: translateY(-1px);
}

.nab-article .nab-source-link > span {
   display: grid;
   gap: 3px;
   min-width: 0;
}

.nab-article .nab-source-link strong {
   color: var(--nab-navy);
   font-size: .78rem;
   font-weight: 800;
   line-height: 1.7;
}

.nab-article .nab-source-link small {
   color: var(--nab-muted);
   font-size: .68rem;
   line-height: 1.75;
}

.nab-article .nab-source-link i {
   display: grid;
   place-items: center;
   width: 29px;
   height: 29px;
   flex: 0 0 29px;
   border-radius: 8px;
   background: var(--nab-accent-soft);
   color: var(--nab-accent);
   font: 800 .78rem Arial, sans-serif;
   font-style: normal;
}

/* ==================================================
  NEXXUS FAQ — SMOOTH ACCORDION
================================================== */

.nab-article .nab-faq-section {
   padding: clamp(22px, 4vw, 36px);
   border: 0;
   border-radius: 16px;
   background: #f4f7fa;
   box-shadow: none;
}

.nab-article .nab-faq-section__header {
   margin-bottom: 25px;
}

.nab-article .nab-faq-section__header > span {
   display: block;
   margin-bottom: 8px;
   color: var(--nab-accent);
   font-size: 0.75rem;
   font-weight: 850;
}

.nab-article .nab-faq-section__header h2,
.nab-article .nab-faq-section__header h3,
.nab-article .nab-faq-section__header h4,
.nab-article .nab-faq-section__header h5,
.nab-article .nab-faq-section__header h6 {
   margin: 0;
   font-size: clamp(1.15rem, 1.8vw, 1.35rem);
   line-height: 1.6;
}

/* لیست پرسش‌ها */
.nab-article .nab-faq-list {
   display: grid;
   gap: 10px;
}

/* کارت هر پرسش */
.nab-article .nab-faq {
   overflow: hidden;
   margin: 0;
   border: 1px solid #d4ddeb;
   border-radius: 12px;
   background: #f8fafc;
   box-shadow: none;

   transition:
	   border-color 0.35s ease,
	   background-color 0.35s ease,
	   box-shadow 0.35s ease;
}

/* حالت باز */
.nab-article .nab-faq[open] {
   border-color: #93abef;
   background: #f4f7fc;
   box-shadow: 0 5px 18px rgba(49, 87, 213, 0.05);
}

/* ردیف پرسش */
.nab-article .nab-faq summary {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 18px;

   min-height: 68px;
   margin: 0;
   padding: 16px 18px;

   color: var(--nab-navy);
   cursor: pointer;
   list-style: none;
   user-select: none;
}

.nab-article .nab-faq summary::-webkit-details-marker {
   display: none;
}

.nab-article .nab-faq summary::marker {
   content: "";
}

/* متن پرسش */
.nab-article .nab-faq__question {
   flex: 1;
   min-width: 0;

   color: var(--nab-navy);
   font-size: 0.82rem;
   font-weight: 800;
   line-height: 1.9;
   text-align: right;
}

/* کادر آیکن */
.nab-article .nab-faq__icon {
   display: grid;
   place-items: center;

   width: 32px;
   height: 32px;
   flex: 0 0 32px;

   border-radius: 9px;
   background: #e8eefc;
   color: var(--nab-accent);

   transform: rotate(0deg);
   transform-origin: center;
   will-change: transform;

   transition:
	   transform 0.5s cubic-bezier(0.22, 1, 0.36, 1),
	   background-color 0.3s ease,
	   color 0.3s ease;
}

/* شکل فلش */
.nab-article .nab-faq__icon svg {
   display: block;
   width: 17px;
   height: 17px;
   fill: none;
   stroke: currentColor;
   stroke-width: 1.9;
   stroke-linecap: round;
   stroke-linejoin: round;
}

/* حالت باز؛ هنگام بسته‌شدن کلاس is-closing اولویت دارد. */
.nab-article .nab-faq[open]:not(.is-closing) .nab-faq__icon {
   transform: rotate(180deg);
   background: #e4ebff;
   color: #3157d5;
}

/* چرخش فلش دقیقاً هم‌زمان با شروع بسته‌شدن */
.nab-article .nab-faq[open].is-closing .nab-faq__icon,
.nab-article .nab-faq.is-closing .nab-faq__icon {
   transform: rotate(0deg);
}

/* ارتفاع details توسط frontend.js انیمیت می‌شود. */
.nab-article .nab-faq__answer {
   display: block;
   padding: 0 20px 20px;
   overflow: hidden;
}

/* پاسخ بسته پس از پایان انیمیشن JavaScript مخفی می‌شود. */
.nab-article .nab-faq:not([open]) > .nab-faq__answer {
   display: none;
}

.nab-article .nab-faq__answer-inner {
   min-height: 0;
   overflow: hidden;
   color: #53617a;
}

.nab-article .nab-faq__answer-inner > :first-child {
   margin-top: 0;
}

.nab-article .nab-faq__answer-inner > :last-child {
   margin-bottom: 0;
}

.nab-article .nab-faq__answer-inner p {
   color: #53617a;
   font-size: 0.78rem;
   font-weight: 400;
   line-height: 2.15;
}

/* دسترسی‌پذیری */
.nab-article .nab-faq summary:focus-visible {
   outline: 2px solid var(--nab-accent);
   outline-offset: -3px;
   border-radius: 10px;
}

/* موبایل */
@media (max-width: 560px) {
   .nab-article .nab-faq-section {
	   padding: 18px 14px;
   }

   .nab-article .nab-faq summary {
	   min-height: 60px;
	   padding: 13px 14px;
	   gap: 12px;
   }

   .nab-article .nab-faq__question {
	   font-size: 0.8rem;
   }

   .nab-article .nab-faq__icon {
	   width: 30px;
	   height: 30px;
	   flex-basis: 30px;
   }

   .nab-article .nab-faq__answer {
	   padding: 0 14px 16px;
   }
}

@media (prefers-reduced-motion: reduce) {
   .nab-article .nab-faq,
   .nab-article .nab-faq__icon {
	   transition-duration: 0.01ms;
   }
}
/* Lightbox */
.nab-lightbox {
   position: fixed;
   z-index: 999999;
   inset: 0;
   display: grid;
   grid-template-columns: 70px minmax(0, 1fr) 70px;
   align-items: center;
   gap: 18px;
   padding: 45px;
   background: rgba(4, 10, 22, .91);
   backdrop-filter: blur(12px);
   direction: ltr;
   font-family: "Modam", Tahoma, Arial, sans-serif;
}

.nab-lightbox[hidden] {
   display: none !important;
}

.nab-lightbox figure {
   justify-self: center;
   overflow: hidden;
   width: 100%;
   max-width: 1200px;
   margin: 0;
   border-radius: 16px;
   background: #101a2a;
   box-shadow: 0 30px 80px rgba(0, 0, 0, .45);
}

.nab-lightbox figure img {
   display: block;
   width: 100%;
   max-height: 78vh;
   object-fit: contain;
}

.nab-lightbox figcaption {
   padding: 14px 18px;
   color: rgba(255, 255, 255, .75);
   direction: rtl;
   font-size: .75rem;
   text-align: right;
}

.nab-lightbox > button {
   display: grid;
   place-items: center;
   justify-self: center;
   width: 48px;
   height: 48px;
   padding: 0px 0px 0px;
   border: 1px solid rgba(255, 255, 255, .16);
   border-radius: 50%;
   background: rgba(255, 255, 255, .08);
   color: #fff;
   cursor: pointer;
   transform: rotate(180deg);
   font-size: 1.25rem;
}

.nab-lightbox .nab-lightbox__close {
   position: absolute;
   top: 18px;
   left: 18px;
}

.nab-lightbox-open {
   overflow: hidden;
}

.nab-widget-notice {
   padding: 18px;
   border: 1px dashed #94a8eb;
   border-radius: 8px;
   background: #f4f7ff;
   color: #3f558d;
   direction: rtl;
   text-align: center;
}

@media (max-width: 780px) {
   .nab-article .nab-steps,
   .nab-article .nab-stats {
	   grid-template-columns: 1fr;
   }

   .nab-article .nab-steps li {
	   min-height: 0;
   }

   .nab-article .nab-stats > div {
	   min-height: 110px;
	   border-left: 0;
	   border-bottom: 1px solid var(--nab-border);
   }

   .nab-article .nab-stats > div:last-child {
	   border-bottom: 0;
   }

   .nab-article .nab-image-split {
	   grid-template-columns: 1fr;
   }

   .nab-article .nab-image-split--left > img {
	   order: 0;
   }

   .nab-article .nab-image-split > img {
	   min-height: 260px;
   }

   .nab-article .nab-gallery {
	   grid-auto-rows: 170px;
   }

   .nab-article .nab-carousel__stage,
   .nab-article .nab-carousel__slide {
	   height: 360px;
   }
}

@media (max-width: 560px) {
   .nab-article {
	   --nab-section-gap: 17px;
	   font-size: 14px;
   }

	.nab-article .nab-numbered-flow {
	   border-radius: 13px;
	}

	.nab-article .nab-numbered-flow > :first-child {
	   border-radius: 13px 13px 0 0;
	}

	.nab-article .nab-numbered-flow > :last-child {
	   border-radius: 0 0 13px 13px;
	}

	.nab-article .nab-numbered-flow > :only-child {
	   border-radius: 13px;
	}

   .nab-article .nab-section,
   .nab-article .nab-faq-section,
	.nab-article .nab-intro-summary,
	.nab-article .nab-sources-section {
	   border-radius: 13px;
   }

	.nab-article .nab-section__title,
	.nab-article .nab-faq-section__header h2,
	.nab-article .nab-faq-section__header h3,
	.nab-article .nab-faq-section__header h4,
	.nab-article .nab-faq-section__header h5,
	.nab-article .nab-faq-section__header h6,
	.nab-article .nab-sources-section__header h2,
	.nab-article .nab-sources-section__header h3,
	.nab-article .nab-sources-section__header h4,
	.nab-article .nab-sources-section__header h5,
	.nab-article .nab-sources-section__header h6 {
	   font-size: 1.12rem;
	}

	.nab-article .nab-richtext,
	.nab-article .nab-richtext p,
	.nab-article .nab-item p {
	   font-size: .86rem;
	}

	.nab-article .nab-post-tags,
	.nab-article .nab-post-author {
	   padding: 18px;
	}

	.nab-article .nab-post-author {
	   align-items: flex-start;
	   gap: 12px;
	}

	.nab-article .nab-post-author__avatar {
	   width: 44px;
	   height: 44px;
	   flex-basis: 44px;
	   font-size: .9rem;
	}

	.nab-article .nab-sources-section {
	   padding: 22px 17px;
	}

	.nab-article .nab-source-link {
	   min-height: 58px;
	   padding: 11px 12px;
	}

   .nab-article .nab-intro-summary__bullets,
   .nab-article .nab-pros-cons,
   .nab-article .nab-do-dont {
	   grid-template-columns: 1fr;
   }

   .nab-article .nab-intro-summary__bullets {
	   display: grid;
	   gap: 10px;
   }

   .nab-article .nab-glossary > div {
	   grid-template-columns: 1fr;
	   gap: 7px;
   }

   .nab-article .nab-timeline > div {
	   grid-template-columns: 67px 18px 1fr;
	   gap: 9px;
   }

   .nab-article .nab-resource {
	   grid-template-columns: 56px 1fr;
	   gap: 13px;
	   padding: 16px;
   }

   .nab-article .nab-resource__icon {
	   width: 55px;
	   height: 64px;
   }

   .nab-article .nab-resource > a {
	   grid-column: 1 / -1;
	   justify-content: center;
   }

   .nab-article .nab-editorial-image figcaption {
	   align-items: flex-start;
	   flex-direction: column;
   }

   .nab-article .nab-gallery {
	   grid-template-columns: 1fr 1fr;
	   grid-auto-rows: 145px;
   }

   .nab-article .nab-gallery button:first-child {
	   grid-column: 1 / -1;
	   grid-row: span 2;
   }

   .nab-article .nab-before-after {
	   aspect-ratio: 4 / 3;
   }

   .nab-article .nab-carousel__stage,
   .nab-article .nab-carousel__slide {
	   height: 310px;
   }

   .nab-article .nab-carousel__slide > div {
	   right: 18px;
	   bottom: 17px;
   }

   .nab-article .nab-faq summary {
	   padding: 14px;
	   font-size: .82rem;
   }

   .nab-lightbox {
	   grid-template-columns: 42px minmax(0, 1fr) 42px;
	   gap: 7px;
	   padding: 56px 8px 20px;
   }

   .nab-lightbox > button {
	   width: 39px;
	   height: 39px;
	   font-size: 1.15rem !important;
   }
}