/* «Журнал Optor» (templates/articles, components/article_card.html, article_data.html).
   On top of landing.css and public.css: their tokens (--ink, --muted, --line, --soft),
   header, footer, breadcrumbs and chips. Reading column ~70 characters; monochrome, the
   data blocks are framed panels, the call to action is the graphite panel. */

.artKicker{margin:0;font-size:.75rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.artLead{font-size:1.0625rem;line-height:1.55;color:var(--muted);margin:0 0 8px;max-width:720px}
.artSection{margin-top:44px}
.artSection>h2{margin:0 0 16px}
.artGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}

/* -- Rubrics ----------------------------------------------------------------------- */
nav.artRubrics{display:block;margin:22px 0 0;font-weight:400}
.artRubrics ul{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.artRubrics a{display:inline-flex;gap:8px;align-items:center;min-height:36px;padding:7px 12px;border:1px solid var(--line);border-radius:9px;font-size:.8125rem;background:#fff}
.artRubrics a:hover{background:var(--soft)}
.artRubrics a[aria-current]{background:var(--ink);border-color:var(--ink);color:#fff}
.artRubrics span{color:var(--muted);font-size:.75rem}
.artRubrics a[aria-current] span{color:#c9ccd0}

/* -- Card -------------------------------------------------------------------------- */
.artCard{display:flex;flex-direction:column;gap:8px;padding:20px;border:1px solid var(--line);border-radius:12px;background:#fff;min-width:0}
.artCard__cover{display:block;margin:-20px -20px 6px;border-bottom:1px solid var(--line);border-radius:12px 12px 0 0;overflow:hidden;background:#fff}
.artCard__cover img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.artCard__meta{margin:0;font-size:.75rem;color:var(--muted)}
.artCard__title{margin:0;font-size:1.0625rem;line-height:1.3;letter-spacing:-.2px}
.artCard__title a:hover{text-decoration:underline;text-underline-offset:3px}
.artCard__text{margin:0;font-size:.875rem;line-height:1.5;flex:1}

/* -- Article ----------------------------------------------------------------------- */
.artLayout{display:grid;grid-template-columns:minmax(0,720px) minmax(200px,260px);gap:56px;align-items:start;margin-top:14px}
.artBody h1{max-width:none}
.artMeta{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0 0 18px;font-size:.8125rem;color:var(--muted)}
.artMeta__law{padding:1px 8px;border-radius:6px;background:var(--soft)}
.artCover{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;margin:18px 0 0;border:1px solid var(--line);border-radius:14px;background:#fff}
.artSummary{margin:26px 0;padding:20px 22px;border-left:3px solid var(--ink);background:var(--soft);border-radius:0 10px 10px 0}
.artSummary h2{margin:0 0 10px;font-size:1rem}
.artSummary ul{margin:0;padding-left:18px;display:grid;gap:6px;font-size:.9375rem}

.artProse{font-size:1.0625rem;line-height:1.7}
.artProse h2{margin:42px 0 12px;font-size:1.5rem;line-height:1.25;scroll-margin-top:20px}
.artProse h3{margin:28px 0 8px;font-size:1.1875rem;scroll-margin-top:20px}
.artProse p,.artProse ul,.artProse ol{margin:0 0 16px}
.artProse li{margin:4px 0}
.artProse a:not(.btn,.artData__all){text-decoration:underline;text-underline-offset:3px}
.artProse blockquote{margin:22px 0;padding:14px 18px;border:1px solid var(--line);border-radius:10px;font-size:.9375rem}
.artProse blockquote p:last-child{margin:0}
.artProse table{width:100%;border-collapse:collapse;margin:20px 0;font-size:.9375rem;display:block;overflow-x:auto}
.artProse th,.artProse td{padding:9px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.artProse th{font-size:.8125rem;color:var(--muted);font-weight:600}
.artProse code{font-size:.875em;padding:1px 5px;border-radius:5px;background:var(--soft)}

/* -- Contents ---------------------------------------------------------------------- */
.artToc{font-size:.8125rem}
.artToc ol{margin:8px 0 0;padding-left:18px;display:grid;gap:7px}
.artToc a{color:var(--muted)}
.artToc a:hover{color:var(--ink);text-decoration:underline}
.artToc--side{position:sticky;top:24px;padding-left:18px;border-left:1px solid var(--line)}
.artToc--side p{margin:0;font-weight:600}
.artToc--inline{display:none;margin:0 0 22px;padding:12px 16px;border:1px solid var(--line);border-radius:10px}
.artToc--inline summary{cursor:pointer;font-weight:600}

/* -- Data blocks (components/article_data.html) ------------------------------------ */
.artData{margin:28px 0;padding:22px 24px;border:1px solid var(--line);border-radius:14px;background:#fff;font-size:.9375rem;line-height:1.5}
.artData__kicker{margin:0;font-size:.75rem;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--muted)}
.artData__figure{margin:8px 0 14px;font-size:1.125rem}
.artData__figure strong{font-size:2.25rem;font-weight:600;letter-spacing:-.02em;margin-right:4px}
.artData__sub{margin:0 0 8px;font-size:.8125rem;color:var(--muted)}
.artData__list{margin:0 0 16px;padding:0;list-style:none;display:grid;gap:10px}
.artData__list li{display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:10px;background:var(--soft)}
.artData__title{font-weight:500;line-height:1.4}
.artData__meta{font-size:.8125rem;color:var(--muted)}
.artData__facts{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:.8125rem}
.artData__facts--grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:0 0 14px}
.artData__facts--grid div{padding:10px 12px;border-radius:10px;background:var(--soft)}
.artData__facts--grid dt{font-size:.75rem;color:var(--muted)}
.artData__facts--grid dd{margin:2px 0 0;font-weight:600}
.artData__actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;margin:2px 0 0}
.artData__all{font-size:.875rem;font-weight:500}
.artData__all:hover{text-decoration:underline;text-underline-offset:3px}
.artData__note{margin:12px 0 0;font-size:.75rem;color:var(--muted)}

.artCta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 28px;align-items:center;margin:36px 0;padding:26px 28px;border-radius:14px;background:var(--ink);color:#fff}
.artCta__title{margin:0 0 6px;font-size:1.1875rem;font-weight:600;line-height:1.3}
.artCta__text{margin:0;font-size:.875rem;color:#c9ccd0;line-height:1.5}
.artCta__button{border:0;color:var(--ink)}

/* -- Questions, disclaimer --------------------------------------------------------- */
.artFaq{margin-top:40px}
.artFaq h2{font-size:1.5rem;margin:0 0 12px}
.artFaq details{border-bottom:1px solid var(--line);padding:14px 0}
.artFaq summary{cursor:pointer;font-weight:600;font-size:1rem;list-style-position:inside}
.artFaq details p{margin:10px 0 0;line-height:1.6}
.artDisclaimer{margin:20px 0 0;font-size:.75rem;color:var(--muted)}

@media (max-width:1000px){
  .artLayout{grid-template-columns:minmax(0,1fr)}
  .artToc--side{display:none}
  .artToc--inline{display:block}
}
@media (max-width:760px){
  .artProse{font-size:1rem}
  .artProse h2{font-size:1.3125rem}
  .artCta{grid-template-columns:1fr;padding:22px}
  .artData{padding:18px}
  .artData__figure strong{font-size:1.875rem}
}