/* Nilkimtek - article reading layer.
   Scoped to .nk-article-single / .nk-article-index so nothing here reaches the
   rest of the site. The Lab Teal tokens are restated locally because Blocksy's
   single template does not load Elementor's global styles. */

.nk-article-single{
  --nk-ink:#07211F; --nk-teal:#0F6B63; --nk-teal-deep:#0A3A37; --nk-teal-bright:#1AA79B;
  --nk-amber:#D9A441; --nk-mist:#EAF6F4; --nk-line:rgba(7,33,31,.13);
}

/* ---- frame ------------------------------------------------------------- */

.nk-article-single .hero-section,
.nk-article-single .entry-content{
  max-width:748px;          /* ~72 characters at 18px: the reading measure */
  margin-inline:auto;
  padding-inline:22px;
}
.nk-article-single .hero-section{ padding-top:44px; padding-bottom:0; }
.nk-article-single .hero-section h1,
.nk-article-single .entry-title{
  font-family:"Space Grotesk",system-ui,sans-serif;
  font-weight:700; font-size:clamp(28px,4.2vw,40px); line-height:1.12;
  letter-spacing:-.01em; color:var(--nk-teal-deep); margin:0 0 4px;
}

/* ---- meta strip -------------------------------------------------------- */

.nk-art-crumb{
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:11px;
  letter-spacing:.08em; text-transform:uppercase; color:rgba(7,33,31,.5);
  margin:0 0 18px; display:flex; gap:8px; flex-wrap:wrap;
}
.nk-art-crumb a{ color:rgba(7,33,31,.5); text-decoration:none; }
.nk-art-crumb a:hover{ color:var(--nk-teal); }
.nk-art-crumb span{ opacity:.45; }

.nk-art-meta{
  display:flex; gap:14px; flex-wrap:wrap; align-items:center;
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:11px;
  letter-spacing:.06em; text-transform:uppercase; color:rgba(7,33,31,.5);
  padding:0 0 26px; margin:0 0 30px; border-bottom:1px solid var(--nk-line);
}
.nk-art-topic{
  background:var(--nk-mist); color:var(--nk-teal-deep);
  border:1px solid rgba(15,107,99,.14); border-radius:999px;
  padding:6px 12px; display:inline-flex; align-items:center; gap:7px;
}
.nk-art-topic::before{
  content:""; width:6px; height:6px; border-radius:50%;
  background:var(--nk-teal-bright); flex:0 0 6px;
}

/* ---- table of contents ------------------------------------------------- */

.nk-art-toc{
  background:var(--nk-mist); border:1px solid rgba(15,107,99,.14);
  border-radius:14px; padding:22px 26px; margin:0 0 38px;
}
.nk-art-toc-h{
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10px;
  letter-spacing:.14em; text-transform:uppercase; color:var(--nk-teal);
  margin:0 0 12px; display:flex; align-items:center; gap:8px;
}
.nk-art-toc-h::before{
  content:""; width:16px; height:2px; background:var(--nk-amber); flex:0 0 16px;
}
.nk-art-toc ol{ margin:0; padding-inline-start:20px; }
.nk-art-toc li{ margin:0 0 7px; font-size:14.5px; line-height:1.5; }
.nk-art-toc li::marker{
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:12px;
  color:rgba(7,33,31,.4);
}
.nk-art-toc a{ color:var(--nk-teal-deep); text-decoration:none; }
.nk-art-toc a:hover{ color:var(--nk-teal); text-decoration:underline; }

/* ---- the prose --------------------------------------------------------- */

.nk-article-single .nk-prose{
  font-family:"IBM Plex Sans",system-ui,sans-serif;
  font-size:18px; line-height:1.72; color:rgba(7,33,31,.82);
}
.nk-article-single .nk-prose > p{ margin:0 0 22px; }
.nk-article-single .nk-prose p.nk-lede{
  font-size:20px; line-height:1.62; color:var(--nk-teal-deep);
  font-weight:500; margin-bottom:34px;
}
.nk-article-single .nk-prose h2{
  font-family:"Space Grotesk",system-ui,sans-serif; font-weight:700;
  font-size:25px; line-height:1.2; letter-spacing:-.005em;
  color:var(--nk-teal-deep); margin:52px 0 16px; scroll-margin-top:100px;
}
.nk-article-single .nk-prose h3{
  font-family:"Space Grotesk",system-ui,sans-serif; font-weight:600;
  font-size:19px; line-height:1.3; color:var(--nk-teal-deep);
  margin:34px 0 12px; scroll-margin-top:100px;
}
.nk-article-single .nk-prose strong{ color:var(--nk-teal-deep); font-weight:600; }
.nk-article-single .nk-prose a{
  color:var(--nk-teal); text-decoration:underline;
  text-underline-offset:3px; text-decoration-thickness:1px;
}
.nk-article-single .nk-prose a:hover{ color:var(--nk-teal-bright); }
.nk-article-single .nk-prose ul,
.nk-article-single .nk-prose ol{ margin:0 0 24px; padding-inline-start:22px; }
.nk-article-single .nk-prose li{ margin:0 0 11px; }
.nk-article-single .nk-prose li::marker{ color:var(--nk-teal); }
.nk-article-single .nk-prose blockquote{
  margin:30px 0; padding:2px 0 2px 22px;
  border-inline-start:2px solid var(--nk-amber);
  color:var(--nk-teal-deep); font-size:19px;
}
.nk-article-single .nk-prose img{ border-radius:14px; height:auto; }
.nk-article-single .nk-prose table{
  width:100%; border-collapse:collapse; margin:0 0 26px; font-size:15px;
}
.nk-article-single .nk-prose th,
.nk-article-single .nk-prose td{
  border:1px solid var(--nk-line); padding:11px 13px; text-align:start;
}
.nk-article-single .nk-prose th{
  background:var(--nk-mist); color:var(--nk-teal-deep); font-weight:600;
}

/* ---- FAQ --------------------------------------------------------------- */

.nk-art-faq{ margin:56px 0 0; }
.nk-art-faq h2{
  font-family:"Space Grotesk",system-ui,sans-serif; font-weight:700;
  font-size:25px; color:var(--nk-teal-deep); margin:0 0 20px;
  scroll-margin-top:100px;
}
.nk-art-q{
  border:1px solid var(--nk-line); border-radius:12px;
  padding:0 18px; margin:0 0 10px; background:#fff;
}
.nk-art-q summary{
  cursor:pointer; list-style:none; padding:16px 26px 16px 0; position:relative;
  font-family:"IBM Plex Sans",system-ui,sans-serif; font-weight:600;
  font-size:16px; line-height:1.45; color:var(--nk-teal-deep);
}
.nk-art-q summary::-webkit-details-marker{ display:none; }
.nk-art-q summary::after{
  content:""; position:absolute; inset-inline-end:2px; top:50%;
  width:9px; height:9px; margin-top:-6px;
  border-inline-end:2px solid var(--nk-teal); border-bottom:2px solid var(--nk-teal);
  transform:rotate(45deg); transition:transform .2s ease;
}
.nk-art-q[open] summary::after{ transform:rotate(-135deg); margin-top:-2px; }
.nk-art-a{
  padding:0 0 18px; font-size:16px; line-height:1.68; color:rgba(7,33,31,.74);
}
.nk-art-a p{ margin:0; }

/* ---- closing CTA ------------------------------------------------------- */

.nk-art-cta{
  margin:52px 0 8px; padding:34px 32px; border-radius:18px;
  background:var(--nk-teal-deep); color:#fff;
}
.nk-art-cta-t{
  font-family:"Space Grotesk",system-ui,sans-serif; font-weight:700;
  font-size:21px; line-height:1.25; margin:0 0 10px; color:#fff;
}
.nk-art-cta-b{
  font-size:15.5px; line-height:1.68; color:rgba(234,246,244,.72); margin:0 0 22px;
}
.nk-art-cta-a{ display:flex; gap:12px; flex-wrap:wrap; margin:0; }
.nk-art-btn{
  display:inline-block; padding:13px 22px; border-radius:8px;
  background:var(--nk-teal-bright); color:#04211F !important;
  font-weight:600; font-size:14.5px; text-decoration:none !important;
  transition:transform .16s ease;
}
.nk-art-btn:hover{ transform:translateY(-1px); }
.nk-art-btn-ghost{
  background:transparent; color:#fff !important;
  border:1px solid rgba(234,246,244,.34);
}

/* ---- in-article figure panel -------------------------------------------
   The "proposal" block: a LinkedIn infographic rebuilt as real markup rather
   than pasted in as a raster. Icons are inline SVG, so the panel stays sharp at
   any density, recolours with the brand tokens, adds no image weight, and its
   text is selectable, translatable and readable by search engines. */

.nk-fig{
  margin:44px 0; padding:34px 30px 30px; border-radius:20px;
  background:linear-gradient(160deg,#0A3A37 0%,#07211F 100%);
  color:#fff; overflow:hidden;
}
.nk-fig-eyebrow{
  display:flex; align-items:center; gap:8px; margin:0 0 12px;
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10px;
  letter-spacing:.15em; text-transform:uppercase; color:#5EEAD4;
}
.nk-fig-eyebrow::before{
  content:""; width:16px; height:2px; background:#D9A441; flex:0 0 16px;
}
.nk-fig-title{
  font-family:"Space Grotesk",system-ui,sans-serif; font-weight:700;
  font-size:22px; line-height:1.25; color:#fff; margin:0 0 10px;
}
.nk-fig-sub{
  font-size:14px; line-height:1.6; color:rgba(234,246,244,.66);
  margin:0 0 26px; padding:0 0 22px;
  border-bottom:1px solid rgba(234,246,244,.16);
}

.nk-fig-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.nk-fig-card{
  background:rgba(255,255,255,.05); border:1px solid rgba(234,246,244,.16);
  border-radius:14px; padding:20px 18px;
}
.nk-fig-ico{
  width:46px; height:46px; border-radius:50%; margin:0 0 14px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(94,234,212,.10); border:1px solid rgba(94,234,212,.26);
}
.nk-fig-ico svg{ width:24px; height:24px; display:block; }
.nk-fig-card-t{
  font-family:"Space Grotesk",system-ui,sans-serif; font-weight:700;
  font-size:14.5px; line-height:1.28; letter-spacing:.01em;
  text-transform:uppercase; color:#fff; margin:0 0 8px;
}
.nk-fig-card-b{
  font-size:13.5px; line-height:1.6; color:rgba(234,246,244,.66); margin:0;
}

.nk-fig-apps{ margin:26px 0 0; padding:24px 0 0; border-top:1px solid rgba(234,246,244,.16); }
.nk-fig-apps-h{
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10px;
  letter-spacing:.15em; text-transform:uppercase; color:rgba(234,246,244,.5);
  margin:0 0 14px;
}
.nk-fig-app-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.nk-fig-app{
  display:flex; gap:14px; align-items:flex-start;
  background:rgba(255,255,255,.04); border:1px solid rgba(234,246,244,.12);
  border-radius:12px; padding:16px 16px;
}
.nk-fig-app svg{ width:22px; height:22px; flex:0 0 22px; margin-top:1px; }
.nk-fig-app-t{
  font-weight:600; font-size:14px; line-height:1.3; color:#fff; margin:0 0 5px;
}
.nk-fig-app-b{
  font-size:13px; line-height:1.55; color:rgba(234,246,244,.62); margin:0;
}
.nk-fig-note{
  margin:22px 0 0; font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:10.5px; letter-spacing:.05em; color:rgba(234,246,244,.42);
}

/* ---- [nk_panel]: two application columns, a chart, a property strip ---- */

.nk-panel-cols{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.nk-panel-col{
  background:rgba(255,255,255,.05); border:1px solid rgba(234,246,244,.16);
  border-radius:14px; padding:18px 18px 8px;
}
.nk-panel-col-h{
  display:flex; align-items:center; gap:9px; margin:0 0 14px;
  font-family:"Space Grotesk",system-ui,sans-serif; font-weight:700;
  font-size:15px; text-transform:uppercase; letter-spacing:.02em; color:#fff;
}
.nk-panel-col-h span{
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10px;
  letter-spacing:.1em; color:#04211F; background:#5EEAD4;
  border-radius:5px; padding:3px 6px;
}
.nk-panel-row{ display:flex; gap:12px; align-items:flex-start; margin:0 0 14px; }
.nk-panel-row svg{ width:20px; height:20px; flex:0 0 20px; margin-top:2px; }
.nk-panel-row-t{ font-weight:600; font-size:13.5px; line-height:1.3; color:#fff; margin:0 0 4px; }
.nk-panel-row-b{ font-size:12.5px; line-height:1.55; color:rgba(234,246,244,.62); margin:0; }

.nk-chart{ margin:24px 0 0; padding:20px 18px 14px; background:rgba(255,255,255,.04);
  border:1px solid rgba(234,246,244,.14); border-radius:14px; }
.nk-chart-h{
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10px;
  letter-spacing:.14em; text-transform:uppercase; color:rgba(234,246,244,.5);
  margin:0 0 12px;
}
.nk-chart-svg{ width:100%; height:auto; display:block; overflow:visible; }
.nk-chart-note{ margin:12px 0 0; font-size:12px; line-height:1.55; color:rgba(234,246,244,.55); }

.nk-panel-props{ margin:24px 0 0; padding:22px 0 0; border-top:1px solid rgba(234,246,244,.16); }
.nk-panel-prop-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.nk-panel-prop svg{ width:20px; height:20px; margin:0 0 8px; display:block; }
.nk-panel-prop-t{
  font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10.5px;
  letter-spacing:.06em; text-transform:uppercase; color:#fff; margin:0 0 4px; line-height:1.35;
}
.nk-panel-prop-b{ font-size:12px; line-height:1.5; color:rgba(234,246,244,.55); margin:0; }

@media (max-width:640px){
  .nk-fig{ padding:26px 20px 24px; margin:34px -2px; border-radius:16px; }
  .nk-fig-grid,.nk-fig-app-grid{ grid-template-columns:1fr; }
  .nk-fig-title{ font-size:19px; }
  .nk-panel-cols{ grid-template-columns:1fr; }
  .nk-panel-prop-grid{ grid-template-columns:repeat(2,1fr); }
  /* the chart's label column needs the width more than the page does */
  .nk-chart{ padding:16px 12px 12px; }
}

@media (prefers-reduced-motion:reduce){
  .nk-art-btn,.nk-art-q summary::after{ transition:none; }
  .nk-art-btn:hover{ transform:none; }
}

@media (max-width:600px){
  .nk-article-single .nk-prose{ font-size:17px; }
  .nk-article-single .nk-prose p.nk-lede{ font-size:18.5px; }
  .nk-article-single .nk-prose h2{ font-size:22px; margin-top:42px; }
  .nk-art-cta{ padding:26px 22px; }
  .nk-art-toc{ padding:18px 20px; }
}
