/* ZdravData articles — long-form prose, reuses variables from styles.css */
.article-header{border-bottom:1px solid var(--line)}
.article-header .nav-links a{font-size:.95rem}

/* breadcrumb */
.breadcrumb{font-size:.85rem; color:var(--slate); padding:22px 0 0}
.breadcrumb a{color:var(--slate); font-weight:600}
.breadcrumb a:hover{color:var(--blue)}
.breadcrumb span{margin:0 6px; color:#b7c4d4}

/* article shell */
.article{max-width:760px; margin:0 auto; padding:14px 0 40px}
.article-eyebrow{color:var(--blue); font-weight:800; letter-spacing:.06em; text-transform:uppercase; font-size:.78rem}
.article h1{font-size:clamp(1.8rem,4vw,2.6rem); margin:10px 0 14px}
.article-meta{color:var(--slate); font-size:.9rem; margin-bottom:8px}
.article-lead{font-size:1.18rem; color:var(--ink); font-weight:500; line-height:1.6; margin:0 0 8px}

.article-body{font-size:1.05rem; line-height:1.75; color:#26333f}
.article-body h2{font-size:1.5rem; margin:38px 0 12px; scroll-margin-top:80px}
.article-body h3{font-size:1.18rem; margin:24px 0 8px}
.article-body p{margin:0 0 16px}
.article-body ul,.article-body ol{margin:0 0 18px; padding-left:22px}
.article-body li{margin-bottom:9px}
.article-body a{color:var(--blue); font-weight:600; text-decoration:underline; text-underline-offset:2px}
.article-body strong{color:var(--ink)}

/* TL;DR / callout box */
.tldr{background:#eef4fb; border:1px solid #d3e2f3; border-left:4px solid var(--blue); border-radius:14px;
  padding:20px 24px; margin:22px 0 28px}
.tldr h2{margin:0 0 10px; font-size:1.15rem; color:var(--blue)}
.tldr ul{margin:0; padding-left:20px}
.tldr li{margin-bottom:7px}

/* law quote */
.article-quote{margin:20px 0; background:var(--bg); border:1px solid var(--line); border-left:4px solid var(--blue);
  border-radius:12px; padding:16px 20px}
.article-quote .src{display:block; font-size:.78rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase;
  color:var(--blue); margin-bottom:8px}
.article-quote p{font-style:italic; color:var(--slate); margin:0 0 8px; font-size:.98rem}
.article-quote p:last-child{margin-bottom:0}

/* steps list */
.article-steps{list-style:none; padding:0; margin:16px 0 22px; counter-reset:astep}
.article-steps li{position:relative; padding:2px 0 14px 44px; margin:0}
.article-steps li::before{counter-increment:astep; content:counter(astep); position:absolute; left:0; top:0;
  width:30px; height:30px; border-radius:50%; background:var(--blue); color:#fff; font-weight:800;
  display:grid; place-items:center; font-size:.95rem}

/* FAQ */
.faq{margin-top:12px}
.faq details{border:1px solid var(--line); border-radius:12px; padding:2px 18px; margin-bottom:10px; background:#fff}
.faq summary{cursor:pointer; font-weight:700; padding:14px 0; list-style:none; color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; float:right; color:var(--blue); font-weight:800; font-size:1.3rem; line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 0 14px; margin:0; color:#26333f}

/* end CTA */
.article-cta{margin:36px 0 0; background:linear-gradient(120deg,var(--blue),var(--blue-d)); border-radius:20px;
  padding:32px 28px; text-align:center; color:#fff}
.article-cta h2{color:#fff; margin:0 0 8px}
.article-cta p{color:#d6e6f8; margin:0 auto 18px; max-width:460px}
.article-cta .btn-primary{background:#fff; color:var(--blue)}
.article-cta .btn-primary:hover{background:#eaf2fd}

/* related / disclaimer */
.article-note{margin-top:26px; font-size:.85rem; color:var(--slate); border-top:1px solid var(--line); padding-top:16px}