/* ==========================================================================
   Wpis bloga Akademii Data Science - system wizualny v2 (14.09.2026)
   Zasada: tekst badawczy, nie zestaw pudełek. Linie włosowe zamiast ramek,
   liczby w cyfrach tabelarycznych, źródła jako drobny podpis pod elementem.
   Zawsze jasny motyw: strona w Tildzie jest biała.
   Ten plik jest źródłem prawdy; identyczny blok <style> siedzi w każdym wpisie.
   ========================================================================== */
.akd-post{
  --ink:#151b28;          /* tekst */
  --head:#0b1020;         /* nagłówki */
  --mut:#5b6678;          /* podpisy, źródła */
  --rule:#e4e7ef;         /* linia włosowa */
  --rule-strong:#c9cedb;  /* linia pod nagłówkiem sekcji */
  --tint:#f6f7fb;         /* panel */
  --a:#4338ca;            /* akcent */
  --a-soft:#ecebfb;       /* zaznaczenie, tło akcentu */
  --pg:#ffffff;
  max-width:44rem;margin:0 auto;padding:16px 22px 8px;
  background:var(--pg);color:var(--ink);
  font-family:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  font-size:17.5px;line-height:1.72;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  font-variant-numeric:tabular-nums;
}
.akd-post *{box-sizing:border-box}
.akd-post ::selection{background:var(--a-soft);color:var(--head)}
.akd-post :focus-visible{outline:2px solid var(--a);outline-offset:3px;border-radius:2px}

/* --- tytul wpisu ---------------------------------------------------------
   H1 rysuje Tilda (pole „Nazwa" posta). Nie powielamy go w bloku HTML, tylko
   ubieramy w typografie wpisu. Gdyby Tilda zmienila klasy, tytul wroci do jej
   wlasnego stylu i nic sie nie zepsuje. */
.t-feed__post-popup__title.js-feed-post-title,
.t-feed__post__title.js-feed-post-title{
  font-family:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  font-size:clamp(31px,4.6vw,46px);line-height:1.06;letter-spacing:-0.035em;
  font-weight:800;color:#0b1020;text-wrap:balance;margin:0;
}

/* --- typografia ---------------------------------------------------------- */
.akd-post h1{
  font-size:clamp(31px,4.6vw,46px);line-height:1.06;letter-spacing:-0.035em;
  font-weight:800;color:var(--head);margin:0 0 18px;text-wrap:balance;
}
.akd-post h2{
  font-size:clamp(21px,2.7vw,28px);line-height:1.18;letter-spacing:-0.022em;
  font-weight:800;color:var(--head);text-wrap:balance;
  margin:56px 0 14px;padding-top:26px;border-top:1px solid var(--rule-strong);
  scroll-margin-top:80px;
}
.akd-post h3{font-size:18.5px;font-weight:700;color:var(--head);letter-spacing:-0.01em;margin:30px 0 8px}
.akd-post h4{margin:0}
.akd-post p{margin:0 0 18px}
.akd-post ul,.akd-post ol{margin:0 0 18px;padding-left:1.35em}
.akd-post li{margin:7px 0;padding-left:2px}
.akd-post li::marker{color:var(--mut)}
.akd-post ol li::marker{font-weight:700;color:var(--a)}
.akd-post strong{font-weight:700;color:var(--head)}
.akd-post a{
  color:var(--a);text-decoration:underline;text-decoration-thickness:1px;
  text-underline-offset:3px;text-decoration-color:color-mix(in srgb,var(--a) 38%,transparent);
  transition:text-decoration-color .18s ease,color .18s ease;
}
.akd-post a:hover{text-decoration-color:var(--a)}

/* --- nagłówek wpisu ------------------------------------------------------ */
.akd-meta{
  display:flex;flex-wrap:wrap;gap:8px;align-items:baseline;
  font-size:13.5px;letter-spacing:.01em;color:var(--mut);
  margin:0 0 26px;padding-bottom:16px;border-bottom:1px solid var(--rule);
}
.akd-meta span+span::before{content:"";display:inline-block;width:3px;height:3px;border-radius:50%;
  background:var(--rule-strong);margin:0 10px 3px 0;vertical-align:middle}

/* odpowiedź od razu: standfirst, nie ramka */
.akd-answer{
  font-size:clamp(19px,2.1vw,21.5px);line-height:1.55;letter-spacing:-0.012em;
  color:var(--head);margin:0 0 30px;padding:0 0 28px;
  border-bottom:1px solid var(--rule);max-width:38rem;
}

/* --- panel „W skrócie" --------------------------------------------------- */
.akd-tldr{background:var(--tint);border-radius:14px;padding:22px 26px;margin:0 0 30px}
.akd-tldr>b,.akd-practice>b,.akd-when-not>b,.akd-sources>b{
  display:block;font-size:11.5px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--mut);margin:0 0 10px;
}
.akd-tldr ul{margin:0;padding:0;list-style:none;font-size:16.5px}
.akd-tldr li{margin:0;padding:11px 0 11px 22px;border-top:1px solid var(--rule);position:relative}
.akd-tldr li:first-child{border-top:0;padding-top:2px}
.akd-tldr li::before{content:"";position:absolute;left:0;top:1.02em;width:11px;height:1px;background:var(--a)}
.akd-tldr li:first-child::before{top:.72em}

/* --- spis treści --------------------------------------------------------- */
.akd-toc{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:18px 0;margin:0 0 40px}
.akd-toc b{display:block;font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);margin-bottom:10px}
.akd-toc ol{margin:0;padding:0;list-style:none;font-size:15.5px;counter-reset:toc;
  columns:2;column-gap:32px}
.akd-toc li{margin:0;counter-increment:toc;break-inside:avoid}
.akd-toc li::before{content:counter(toc,decimal-leading-zero);margin-right:10px;
  font-size:12px;font-weight:700;color:var(--a);font-variant-numeric:tabular-nums}
.akd-toc a{display:inline-block;padding:9px 0;text-decoration:none;color:var(--ink);border-bottom:1px solid transparent}
.akd-toc a:hover{color:var(--a);border-bottom-color:var(--a)}

/* --- liczby ze źródłem --------------------------------------------------- */
.akd-report{margin:34px 0}
.akd-report>b{font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--mut);margin:0 0 6px;padding-bottom:12px;border-bottom:1px solid var(--rule-strong)}
.akd-report .row{
  display:grid;grid-template-columns:150px minmax(0,1fr);gap:8px 24px;align-items:start;
  padding:18px 0;border-bottom:1px solid var(--rule);
}
.akd-report .big{
  font-size:clamp(24px,3.1vw,31px);line-height:1.12;font-weight:800;letter-spacing:-0.03em;
  color:var(--a);font-variant-numeric:tabular-nums;overflow-wrap:break-word;
}
.akd-report .txt{font-size:16px;line-height:1.6}
.akd-report .txt small{display:block;margin-top:8px;font-size:12.5px;line-height:1.5;color:var(--mut)}
.akd-report .txt small a{color:var(--mut);text-decoration-color:var(--rule-strong)}
.akd-report .txt small a:hover{color:var(--a);text-decoration-color:var(--a)}

/* --- tabela -------------------------------------------------------------- */
.akd-table,.akd-figure{
  background:
    linear-gradient(to right,var(--pg) 30%,rgba(255,255,255,0)) left center/44px 100% no-repeat,
    linear-gradient(to left,var(--pg) 30%,rgba(255,255,255,0)) right center/44px 100% no-repeat,
    radial-gradient(farthest-side at 0 50%,rgba(11,16,32,.13),rgba(11,16,32,0)) left center/15px 100% no-repeat,
    radial-gradient(farthest-side at 100% 50%,rgba(11,16,32,.13),rgba(11,16,32,0)) right center/15px 100% no-repeat;
  background-attachment:local,local,scroll,scroll;
}
.akd-table{overflow-x:auto;margin:34px 0;scrollbar-width:thin;scrollbar-color:var(--rule-strong) transparent}
.akd-table::-webkit-scrollbar{height:8px}
.akd-table::-webkit-scrollbar-thumb{background:var(--rule-strong);border-radius:99px}
.akd-table::-webkit-scrollbar-track{background:transparent}
.akd-table table{border-collapse:collapse;width:100%;min-width:560px;font-size:15.5px}
.akd-table th,.akd-table td{padding:13px 18px 13px 0;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}
.akd-table thead th{
  font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);
  padding-bottom:10px;border-bottom:1px solid var(--rule-strong);white-space:nowrap;
}
.akd-table td:first-child,.akd-table tbody th{color:var(--head);font-weight:600}
.akd-table tbody th{font-size:15.5px;letter-spacing:normal;text-transform:none;white-space:normal;
  padding:13px 18px 13px 0;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top;background:none}
.akd-table td b{color:var(--a);font-weight:800;white-space:nowrap}
.akd-table tr:last-child td{border-bottom:1px solid var(--rule-strong)}
.akd-table caption{caption-side:bottom;text-align:left;font-size:12.5px;line-height:1.5;color:var(--mut);padding:12px 0 0}

/* --- diagram ------------------------------------------------------------- */
.akd-figure{margin:36px 0;padding:0;overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--rule-strong) transparent}
.akd-figure::-webkit-scrollbar{height:8px}
.akd-figure::-webkit-scrollbar-thumb{background:var(--rule-strong);border-radius:99px}
.akd-figure svg{display:block;margin:0 auto;color:var(--ink);min-width:600px}
.akd-figure figcaption{font-size:12.5px;line-height:1.5;color:var(--mut);margin-top:14px;
  padding-top:12px;border-top:1px solid var(--rule);text-align:left}

/* --- notka z praktyki ---------------------------------------------------- */
.akd-practice{background:var(--tint);border-radius:14px;padding:20px 26px;margin:30px 0;font-size:16.5px;line-height:1.65}

/* --- kiedy to nie ma sensu ----------------------------------------------- */
.akd-when-not{border:1px solid var(--rule-strong);border-radius:14px;padding:22px 26px;margin:32px 0}
.akd-when-not ul{margin:0;padding:0;list-style:none;font-size:16.5px}
.akd-when-not li{margin:0;padding:11px 0 11px 24px;border-top:1px solid var(--rule);position:relative}
.akd-when-not li:first-child{border-top:0;padding-top:2px}
.akd-when-not li::before{content:"";position:absolute;left:0;top:.92em;width:12px;height:12px;
  background:
    linear-gradient(to bottom,var(--mut),var(--mut)) center/12px 1px no-repeat;
  transform:rotate(45deg);opacity:.85}
.akd-when-not li:first-child::before{top:.62em}
.akd-when-not li::after{content:"";position:absolute;left:0;top:.92em;width:12px;height:12px;
  background:linear-gradient(to bottom,var(--mut),var(--mut)) center/12px 1px no-repeat;
  transform:rotate(-45deg);opacity:.85}
.akd-when-not li:first-child::after{top:.62em}

/* --- baner produktowy ---------------------------------------------------- */
.akd-post a.akd-banner{
  display:block;text-decoration:none;color:inherit;
  border:1px solid var(--rule-strong);border-radius:16px;padding:26px 28px;margin:38px 0;
  background:var(--pg);transition:background .2s ease,border-color .2s ease;
}
.akd-post a.akd-banner:hover{background:var(--tint);border-color:var(--a)}
.akd-banner .t{display:block;font-size:21px;line-height:1.25;font-weight:800;letter-spacing:-0.02em;color:var(--head)}
.akd-banner .d{display:block;font-size:15.5px;line-height:1.6;color:var(--mut);margin-top:8px;max-width:34rem}
.akd-banner .cta{
  display:inline-flex;align-items:center;gap:8px;margin-top:16px;
  font-size:15px;font-weight:700;color:var(--a);
}
.akd-banner .cta svg{width:16px;height:16px;flex:none;transition:transform .22s cubic-bezier(.22,1,.36,1)}
.akd-post a.akd-banner:hover .cta svg{transform:translateX(4px)}

/* --- FAQ ----------------------------------------------------------------- */
.akd-faq{border-bottom:1px solid var(--rule);margin:0}
.akd-faq summary{
  cursor:pointer;padding:18px 36px 18px 0;font-size:16.5px;font-weight:650;color:var(--head);
  list-style:none;position:relative;
}
.akd-faq summary::-webkit-details-marker{display:none}
.akd-faq summary::before,.akd-faq summary::after{
  content:"";position:absolute;right:4px;top:calc(1.55em);width:13px;height:1.5px;
  background:var(--a);transition:transform .24s cubic-bezier(.22,1,.36,1);
}
.akd-faq summary::after{transform:rotate(90deg)}
.akd-faq[open] summary::after{transform:rotate(0deg)}
.akd-faq .a{padding:0 12px 20px 0;font-size:16px;line-height:1.65;color:var(--ink);max-width:38rem}

/* --- źródła i autor ------------------------------------------------------ */
.akd-sources{margin:44px 0 0;padding-top:20px;border-top:1px solid var(--rule-strong)}
.akd-sources ol{margin:0;padding-left:1.3em;font-size:13.5px;line-height:1.6;color:var(--mut)}
.akd-sources li{margin:6px 0;word-break:break-word}
.akd-sources li::marker{color:var(--mut);font-weight:600}
.akd-sources a{color:var(--mut);text-decoration-color:var(--rule-strong)}
.akd-sources a:hover{color:var(--a);text-decoration-color:var(--a)}
.akd-nota{margin:10px 0 0;font-size:12.5px;color:var(--mut)}
.akd-author{display:flex;gap:14px;align-items:center;margin-top:32px;padding-top:22px;border-top:1px solid var(--rule)}
.akd-author img{width:46px;height:46px;border-radius:50%;object-fit:cover;flex:none}
.akd-author .n{font-weight:700;font-size:15.5px;color:var(--head);line-height:1.3}
.akd-author .r{font-size:13px;color:var(--mut);line-height:1.4}

/* --- telefon ------------------------------------------------------------- */
@media (max-width:540px){
  .akd-post{padding:10px 18px 8px;font-size:17px}
  .akd-toc ol{columns:1}
  .akd-tldr,.akd-practice,.akd-when-not{padding:18px 18px}
  .akd-post a.akd-banner{padding:22px 20px}
  .akd-report .row{grid-template-columns:1fr;gap:4px}
  .akd-report .big{font-size:28px}
}

/* Ograniczony ruch: znika przesuniecie i obrot, zostaje zmiana koloru,
   zeby czytelnik nadal widzial, ze cos zareagowalo na jego dzialanie. */
@media (prefers-reduced-motion:reduce){
  .akd-banner .cta svg,
  .akd-post a.akd-banner:hover .cta svg{transform:none;transition:none}
  .akd-faq summary::before,.akd-faq summary::after{transition:none}
}