/* iaks.pl — indigo-chalk palette · Bricolage Grotesque + Bitter · reference-atlas layout
   Hand-written, single stylesheet. No framework, no CDN. */

/* ---------- self-hosted fonts (latin-ext incl. Polish glyphs) ---------- */
@font-face{font-family:"Bricolage";src:url("/assets/fonts/bricolage-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:"Bricolage";src:url("/assets/fonts/bricolage-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:"Bitter";src:url("/assets/fonts/bitter-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Bitter";src:url("/assets/fonts/bitter-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;}

/* ---------- tokens ---------- */
:root{
  --ink:#26346B;          /* indigo primary */
  --ink-deep:#1A2547;     /* darker indigo for masthead */
  --chalk:#F3F0E8;        /* page background */
  --paper:#FBFAF6;        /* content surface */
  --grey:#5C5F58;         /* speckle / muted text */
  --text:#23252A;         /* body ink */
  --brick:#B5532E;        /* accent / CTA */
  --brick-deep:#8F3F22;
  --line:#D9D4C8;         /* hairlines */
  --line-strong:#B9B2A0;
  --rail:#EDE9DE;         /* index-rail surface */
  --maxw:1180px;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{font-size:17px;scroll-behavior:smooth;}
body{
  font-family:"Bitter",Georgia,serif;
  line-height:1.66;color:var(--text);background:var(--chalk);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.disp{font-family:"Bricolage","Bitter",sans-serif;font-weight:700;line-height:1.12;color:var(--ink-deep);letter-spacing:-.01em;}
a{color:var(--ink);text-decoration:none;}
a:hover{color:var(--brick);text-decoration:underline;text-underline-offset:3px;}
img{max-width:100%;height:auto;display:block;}

/* ---------- masthead ---------- */
.masthead{background:var(--ink-deep);color:#EFEDE5;border-bottom:3px solid var(--brick);}
.masthead .bar{max-width:var(--maxw);margin:0 auto;padding:.7rem 1.4rem;display:flex;align-items:center;gap:1rem;}
.brand{display:flex;align-items:center;gap:.6rem;}
.brand svg{display:block;width:38px;height:38px;flex:none;}
.brand .wm{font-family:"Bricolage",sans-serif;font-weight:700;font-size:1.32rem;color:#fff;letter-spacing:-.02em;}
.brand .wm span{color:#C9CEE6;font-weight:600;}
.brand:hover{text-decoration:none;}
.tag{margin-left:auto;font-size:.74rem;text-transform:uppercase;letter-spacing:.16em;color:#A9AEC6;display:none;}
@media(min-width:880px){.tag{display:block;}}

/* mobile nav toggle */
.navtoggle{margin-left:auto;background:transparent;border:1px solid #5b639a;color:#EFEDE5;
  font:600 .82rem/1 "Bricolage",sans-serif;padding:.5rem .8rem;border-radius:3px;cursor:pointer;}
@media(min-width:960px){.navtoggle{display:none;}}

/* ---------- shell: index rail + content ---------- */
.shell{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1fr;gap:0;}
@media(min-width:960px){.shell{grid-template-columns:248px 1fr;gap:2.4rem;padding:0 1.4rem;}}

/* index rail */
.rail{background:var(--rail);border-bottom:1px solid var(--line-strong);}
.rail nav{padding:.3rem 1.4rem 1rem;}
@media(min-width:960px){
  .rail{background:transparent;border:none;align-self:start;position:sticky;top:1.2rem;
    margin-top:2.4rem;border-right:1px solid var(--line);}
  .rail nav{padding:0 1.4rem 0 0;}
}
.rail .idxhead{font-family:"Bricolage",sans-serif;font-weight:700;font-size:.7rem;text-transform:uppercase;
  letter-spacing:.18em;color:var(--grey);margin:.9rem 0 .5rem;}
.rail ul{list-style:none;}
.rail li{margin:0;}
.rail a{display:block;padding:.34rem .7rem;font-size:.92rem;color:var(--text);
  border-left:2px solid transparent;border-radius:0 3px 3px 0;}
.rail a:hover{background:#E4DECF;text-decoration:none;color:var(--ink);}
.rail a[aria-current="page"]{border-left-color:var(--brick);background:#E7E1D2;color:var(--ink-deep);font-weight:700;}
/* collapsible rail groups (pure HTML/CSS via <details>) */
.rail details.idxgroup{margin:0;}
.rail summary.idxhead{display:flex;align-items:center;justify-content:space-between;cursor:pointer;list-style:none;}
.rail summary.idxhead::-webkit-details-marker{display:none;}
.rail summary.idxhead::after{content:"\25B8";font-size:.85em;line-height:1;color:var(--grey);transition:transform .15s ease;}
.rail details[open] summary.idxhead::after{transform:rotate(90deg);}
/* collapsed on mobile */
.rail[data-open="false"] nav{display:none;}
@media(min-width:960px){.rail[data-open="false"] nav{display:block;}}

/* content column */
.content{padding:1.8rem 1.4rem 2.4rem;min-width:0;}
@media(min-width:960px){.content{padding:2.4rem 0 3rem;}}

/* ---------- typography scale ---------- */
.content h1{font-size:2.18rem;margin:.2rem 0 .5rem;}
.content h2{font-size:1.46rem;margin:2.1rem 0 .7rem;padding-top:.3rem;}
.content h3{font-size:1.13rem;margin:1.4rem 0 .4rem;color:var(--ink);}
.content p{margin:0 0 1rem;}
.content ul,.content ol{margin:0 0 1.1rem 1.3rem;}
.content li{margin:.3rem 0;}
.lede{font-size:1.16rem;line-height:1.6;color:#33384a;border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);padding:1rem 0;margin:0 0 1.5rem;}
.kicker{font-family:"Bricolage",sans-serif;font-weight:600;font-size:.74rem;text-transform:uppercase;
  letter-spacing:.2em;color:var(--brick-deep);margin-bottom:.5rem;}
.meta{font-size:.82rem;color:var(--grey);margin-bottom:1.4rem;}

/* breadcrumb */
.crumbs{font-size:.8rem;color:var(--grey);margin-bottom:.9rem;}
.crumbs a{color:var(--grey);}
.crumbs a:hover{color:var(--brick);}

/* hero */
.hero{margin:0 0 1.6rem;border:1px solid var(--line);background:var(--paper);}
.hero img{aspect-ratio:16/7;object-fit:cover;width:100%;}
.hero figcaption{font-size:.76rem;color:var(--grey);padding:.45rem .7rem;border-top:1px solid var(--line);}

/* ---------- index rows (NOT a card grid) ---------- */
.index-list{margin:1.4rem 0;border-top:1px solid var(--line-strong);}
.index-row{display:grid;grid-template-columns:1fr;gap:.2rem;padding:1rem .2rem;border-bottom:1px solid var(--line);}
@media(min-width:620px){.index-row{grid-template-columns:34% 1fr;gap:1.4rem;align-items:baseline;}}
.index-row h3{margin:0;font-size:1.08rem;}
.index-row p{margin:.15rem 0 0;font-size:.94rem;color:#3a3d44;}
.index-row .more{font-size:.82rem;font-family:"Bricolage",sans-serif;font-weight:600;color:var(--brick-deep);}

/* ---------- data table ---------- */
.dtable{width:100%;border-collapse:collapse;margin:1.2rem 0 1.5rem;font-size:.92rem;}
.dtable caption{text-align:left;font-family:"Bricolage",sans-serif;font-weight:600;font-size:.78rem;
  text-transform:uppercase;letter-spacing:.12em;color:var(--grey);padding-bottom:.5rem;}
.dtable th,.dtable td{text-align:left;padding:.6rem .7rem;border-bottom:1px solid var(--line);vertical-align:top;}
.dtable thead th{background:var(--ink-deep);color:#EFEDE5;font-family:"Bricolage",sans-serif;font-weight:600;
  font-size:.82rem;border-bottom:none;}
.dtable tbody tr:nth-child(even){background:var(--paper);}

/* ---------- definition list (glossary) ---------- */
.defs{margin:1.2rem 0;}
.defs dt{font-family:"Bricolage",sans-serif;font-weight:700;color:var(--ink-deep);margin-top:1.1rem;font-size:1.02rem;}
.defs dd{margin:.2rem 0 0;color:#33363d;}

/* ---------- FAQ accordion (custom, no stock callout) ---------- */
.faq{margin:1.6rem 0;border-top:2px solid var(--ink-deep);}
.faq details{border-bottom:1px solid var(--line);}
.faq summary{cursor:pointer;list-style:none;padding:.95rem .2rem .95rem 2rem;position:relative;
  font-family:"Bricolage",sans-serif;font-weight:600;color:var(--ink-deep);font-size:1.02rem;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::before{content:"";position:absolute;left:.35rem;top:1.15rem;width:.7rem;height:.7rem;
  border-right:2px solid var(--brick);border-bottom:2px solid var(--brick);transform:rotate(-45deg);transition:transform .2s;}
.faq details[open] summary::before{transform:rotate(45deg);}
.faq details p{padding:0 .2rem 1.1rem;margin:0;color:#33363d;}

/* ---------- pull / stat strip (single, not 3-card) ---------- */
.figband{display:flex;flex-wrap:wrap;gap:0;margin:1.5rem 0;border:1px solid var(--line-strong);background:var(--paper);}
.figband div{flex:1 1 130px;padding:.9rem 1rem;border-right:1px solid var(--line);}
.figband div:last-child{border-right:none;}
.figband b{display:block;font-family:"Bricolage",sans-serif;font-size:1.5rem;color:var(--brick-deep);line-height:1;}
.figband span{font-size:.78rem;color:var(--grey);}

/* infographic */
.infographic{margin:1.6rem 0;border:1px solid var(--line);background:var(--paper);padding:1rem;}
.infographic svg{width:100%;height:auto;}
.embed{margin:.6rem 0 0;}
.embed summary{cursor:pointer;font-size:.8rem;color:var(--grey);font-family:"Bricolage",sans-serif;}
.embed textarea{width:100%;height:5rem;margin-top:.5rem;font-size:.74rem;font-family:ui-monospace,monospace;
  border:1px solid var(--line-strong);padding:.5rem;color:var(--text);background:#fff;}

/* related links */
.related{margin:2rem 0 0;padding:1.1rem 0 0;border-top:1px solid var(--line-strong);}
.related h2{font-size:1.05rem;margin:0 0 .6rem;}
.related ul{list-style:none;margin:0;columns:2;column-gap:1.6rem;}
.related li{margin:.25rem 0;font-size:.92rem;break-inside:avoid;}

/* cta */
.cta{display:inline-block;background:var(--brick);color:#fff;font-family:"Bricolage",sans-serif;font-weight:600;
  padding:.6rem 1.1rem;border-radius:3px;margin-top:.4rem;}
.cta:hover{background:var(--brick-deep);color:#fff;text-decoration:none;}

/* ============================================================
   Visual refinement pass — pure CSS, no new assets, no JS.
   A typography/rhythm · B tables/stats · C cards · D hero/surface
   ============================================================ */

/* faint paper texture on the chalk background */
body{background-image:radial-gradient(rgba(38,52,107,.025) 1px,transparent 1.4px);background-size:22px 22px;}

/* A · kicker gets a short leading rule */
.kicker{display:inline-flex;align-items:center;gap:.6rem;}
.kicker::before{content:"";width:1.7rem;height:2px;background:var(--brick);}

/* A · comfortable reading measure for prose (lede keeps full width) */
.content p:not(.lede){max-width:72ch;}

/* A · short brick accent rule under section headings (not FAQ / related) */
.content h2{position:relative;}
.content h2::after{content:"";display:block;width:2.4rem;height:3px;margin-top:.5rem;
  background:var(--brick);border-radius:2px;}
.faq h2::after,.related h2::after{display:none;}

/* B · table row hover + bolder stat numerals + accent on the band */
.dtable tbody tr:hover{background:#EDE8DC;}
.figband{border-top:3px solid var(--brick);}
.figband b{font-size:2rem;letter-spacing:-.02em;}

/* C · index rows: hover surface + arrow nudge on "Czytaj" */
.index-row{transition:background .15s ease;border-radius:3px;}
.index-row:hover{background:#EFEADD;}
.index-row .more{display:inline-block;transition:transform .15s ease,color .15s ease;}
.index-row:hover .more{transform:translateX(4px);color:var(--brick);}

/* C · animated underline on prose links */
.content p a,.content .defs a{text-decoration:none;
  background-image:linear-gradient(var(--brick),var(--brick));
  background-size:0% 1.5px;background-position:0 100%;background-repeat:no-repeat;
  transition:background-size .25s ease;}
.content p a:hover,.content .defs a:hover{background-size:100% 1.5px;color:var(--brick-deep);text-decoration:none;}

/* D · hero duotone overlay + figcaption accent */
.hero picture{position:relative;display:block;}
.hero picture::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(38,52,107,.10),rgba(26,37,71,.20));mix-blend-mode:multiply;}
.hero figcaption{border-left:2px solid var(--brick);}

/* ---------- footer ---------- */
.foot{background:var(--ink-deep);color:#C9CEE6;margin-top:2.5rem;border-top:3px solid var(--brick);}
.foot .inner{max-width:var(--maxw);margin:0 auto;padding:2rem 1.4rem;display:grid;gap:1.4rem;grid-template-columns:1fr;}
@media(min-width:720px){.foot .inner{grid-template-columns:1.4fr 1fr 1fr;}}
.foot h4{color:#fff;font-size:.78rem;text-transform:uppercase;letter-spacing:.16em;margin-bottom:.7rem;}
.foot ul{list-style:none;}
.foot li{margin:.3rem 0;font-size:.9rem;}
.foot a{color:#C9CEE6;}
.foot a:hover{color:#fff;}
.foot .colophon{font-size:.86rem;line-height:1.6;color:#9DA3BD;}
.foot .legal{border-top:1px solid #343d6b;font-size:.78rem;color:#888fae;padding:1rem 1.4rem;
  max-width:var(--maxw);margin:0 auto;}

/* skip link + a11y */
.skip{position:absolute;left:-999px;}
.skip:focus{left:1rem;top:.5rem;background:#fff;color:var(--ink);padding:.5rem .8rem;z-index:50;border-radius:3px;}
:focus-visible{outline:2px solid var(--brick);outline-offset:2px;}