/* =========================================================================
   Raksts (v3, Figma 2274:10625 / mobilais 2276:9385).
   Hero balts, satura rādītājs pa kreisi, saturs 720 px, sānu karte pa labi, saistītie raksti pelēkā sekcijā.
   Kartītes stils: v3-cards.css (aģents pf).
   ========================================================================= */

.art-progress{ position:fixed; left:0; right:0; top:0; z-index:120; height:2px; pointer-events:none; }
.art-progress i{ display:block; height:100%; background:var(--signal-soft); transform:scaleX(0); transform-origin:0 50%; }

/* Ceļš un birkas (kopīgi ar bloga sarakstu) */
.bl-crumbs ol{ display:flex; flex-wrap:wrap; gap:6px 8px; font-size:13px; font-weight:500; color:var(--muted); }
.bl-crumbs li{ color:var(--ink); }
.bl-crumbs li + li::before{ content:"/"; margin-right:8px; color:var(--muted); }
.bl-crumbs a{ color:var(--muted); transition:color 180ms var(--ease-v3); }
.bl-crumbs a.is-last{ color:var(--ink); }
.bl-crumbs a:hover{ color:var(--signal); }
.bl-chip{ display:inline-flex; align-items:center; height:32px; padding:0 13px; border-radius:var(--r-pill); background:var(--panel); font-size:13px; font-weight:500; color:var(--ink); transition:color 180ms; }
a.bl-chip:hover{ color:var(--signal); }

/* ---------- Hero ---------- */
.art-hero{ padding:clamp(28px, 3.4vw, 64px) 0 0; background:var(--white); }
.art-hero__head{ max-width:1060px; margin-top:clamp(24px, 2vw, 36px); }
.art-hero__tags{ display:flex; flex-wrap:wrap; gap:8px; }
.art-hero__title{ margin-top:22px; max-width:22em; text-wrap:balance; }
.art-hero__intro{ margin-top:20px; max-width:40em; }
.art-author{ display:flex; align-items:center; gap:12px; margin-top:24px; }
.art-author__img{ width:36px; height:36px; border-radius:50%; object-fit:cover; flex:none; background:var(--ink); }
.art-author__name{ display:block; font-size:14px; font-weight:500; line-height:1.3; }
.art-author__meta{ display:block; font-size:13px; color:var(--muted); }

.art-cover{ position:relative; margin-top:clamp(28px, 2.4vw, 44px); border-radius:var(--r-lg); overflow:hidden; background:var(--ink); aspect-ratio:1500 / 600; }
.art-cover__clip{ position:absolute; inset:0; }
.art-cover__clip > img, .art-cover__clip picture img{ width:100%; height:100%; object-fit:cover; }

/* Case study vāks ar projekta ekrānšāviņu: bez pārlūka joslas, bez ritināšanas, plakans fons */
.art-live{ position:absolute; inset:0; overflow:hidden; color:var(--white); background:var(--ink); }
.art-live__glow, .art-live .lv-bar, .art-live__scroll{ display:none; }
.art-live__browser{ position:absolute; z-index:1; left:4%; top:9%; width:60%; bottom:0; display:block; overflow:hidden; border-radius:14px 14px 0 0; background:#fff; }
.art-live__view{ position:absolute; inset:0; overflow:hidden; background:#fff; }
.art-live__view img{ display:block; width:100%; height:auto; transform:none !important; }
.art-live__phone{ position:absolute; z-index:2; left:56%; bottom:-20%; width:13.5%; aspect-ratio:300 / 620; padding:clamp(4px, .45vw, 8px); border-radius:clamp(20px, 2vw, 36px); background:var(--ink); border:1px solid rgba(255,255,255,.18); pointer-events:none; }
.art-live__phone img{ width:100% !important; height:100% !important; object-fit:cover !important; object-position:top; border-radius:clamp(16px, 1.6vw, 28px); }
.art-live__info{ position:absolute; z-index:3; right:4%; top:9%; width:26%; display:flex; flex-direction:column; align-items:flex-start; }
.art-live__label{ display:inline-flex; align-items:center; gap:8px; font-family:var(--font); font-size:13px; color:var(--on-black-muted); }
.art-live__label i{ width:8px; height:8px; border-radius:50%; background:#34c470; }
.art-live__domain{ margin-top:12px; font-size:clamp(26px, 2vw, 38px); font-weight:500; line-height:1.1; letter-spacing:-0.04em; overflow-wrap:anywhere; }
.art-live__meta{ margin-top:8px; font-size:14px; color:var(--on-black-muted); }
.art-live__btns{ display:flex; flex-direction:column; align-items:flex-start; gap:12px; margin-top:24px; }
.art-live__btns .btn--primary{ --bg:var(--white); --fg:var(--ink); }
.art-live__more{ display:inline-flex; align-items:center; gap:6px; font-size:14px; font-weight:500; color:var(--white); text-decoration:underline; text-underline-offset:4px; }
.art-live__more svg, .art-live__links svg{ display:none; }
.art-live__sub{ margin-top:24px; font-size:13px; color:var(--on-black-muted); }
.art-live__links{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.art-live__links a{ display:inline-flex; align-items:center; height:32px; padding:0 12px; border-radius:var(--r-pill); background:rgba(255,255,255,.1); font-size:13px; font-weight:500; color:var(--white); transition:background-color 180ms; }
@media (hover:hover){ .art-live__links a:hover, .art-live__more:hover{ color:var(--signal-soft); } }

/* ---------- Ķermenis ---------- */
.art-body{ padding:clamp(48px, 4.2vw, 80px) 0 clamp(64px, 5.2vw, 100px); background:var(--white); }
.art-layout{ display:grid; grid-template-columns:minmax(0, 250px) minmax(0, 720px) minmax(0, 380px); justify-content:space-between; align-items:start; gap:clamp(32px, 3vw, 60px); }
.art-toc, .art-side{ position:sticky; top:calc(var(--header-h) + 28px); }
.art-toc__label{ display:flex; align-items:center; justify-content:space-between; width:100%; font-size:13px; font-weight:500; color:var(--muted); cursor:default; text-align:left; }
.art-toc__label i{ display:none; }
.art-toc__list{ display:grid; gap:2px; margin-top:14px; counter-reset:none; }
.art-toc__link{ display:block; padding:6px 0 6px 12px; border-left:2px solid transparent; font-size:14px; line-height:1.4; color:var(--muted); transition:color 180ms var(--ease-v3), border-color 180ms var(--ease-v3); }
.art-toc__link.is-active{ color:var(--ink); border-left-color:var(--signal-soft); }
.art-toc__link:hover{ color:var(--ink); }
.art-toc__sub{ font-size:13px; font-weight:500; color:var(--muted); }
.art-share{ margin-top:28px; }
.art-share__row{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.art-share__btn{ display:inline-flex; align-items:center; height:32px; padding:0 12px; border-radius:var(--r-pill); background:var(--panel); font-size:13px; font-weight:500; color:var(--ink); transition:background-color 180ms, color 180ms; }
.art-share__btn:hover{ color:var(--signal); }
.art-share__btn.is-copied{ background:var(--mint); color:var(--ink); }

/* Saturs */
.art-content.prose{ font-size:16px; line-height:1.65; color:#2b2f33; }
.art-content > *{ margin:0; }
.art-content > * + *{ margin-top:18px; }
.art-content > p:first-child{ font-size:var(--fs-lead); line-height:1.6; color:var(--ink); }
.art-content h2{ margin-top:clamp(40px, 3vw, 56px); font-size:var(--fs-h3); font-weight:500; line-height:1.2; letter-spacing:-0.035em; color:var(--ink); scroll-margin-top:calc(var(--header-h) + 24px); }
.art-content h3{ margin-top:28px; font-size:var(--fs-h4); font-weight:500; line-height:1.3; letter-spacing:-0.02em; color:var(--ink); }
.art-content h2 + *, .art-content h3 + *{ margin-top:12px; }
.art-content p{ color:var(--muted); }
.art-content a{ color:var(--ink); text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px; transition:color 180ms; }
.art-content a:hover{ color:var(--signal); }
.art-content strong{ color:var(--ink); font-weight:500; }
.art-content ul:not([class]), .art-content ol:not([class]){ padding:0; list-style:none; }
.art-content ul:not([class]) > li, .art-content ol:not([class]) > li{ max-width:none; padding:14px 0; border-top:1px solid var(--line); font-size:14px; line-height:1.55; color:var(--muted); }
.art-content ul:not([class]) > li:last-child, .art-content ol:not([class]) > li:last-child{ border-bottom:1px solid var(--line); }
.art-content ul:not([class]) > li > strong:first-child, .art-content ol:not([class]) > li > strong:first-child{ display:block; margin-bottom:2px; font-size:16px; color:var(--ink); }
.art-content blockquote{ padding-left:20px; border-left:2px solid var(--signal-soft); font-size:19px; line-height:1.5; color:var(--ink); }
.art-content blockquote cite{ display:block; margin-top:10px; font-size:13px; font-style:normal; color:var(--muted); }
.art-content code{ font-family:var(--mono); font-size:.86em; padding:2px 6px; border-radius:6px; background:var(--panel); color:var(--ink); }
.art-content pre{ overflow-x:auto; padding:18px 22px; border-radius:var(--r-md); background:var(--ink); color:#dfe3e6; font-size:13px; line-height:1.6; }
.art-content pre code{ padding:0; background:none; color:inherit; }
.art-content hr{ border:0; height:1px; background:var(--line); margin-block:40px; }
.art-content img{ border-radius:var(--r-md); height:auto; }
.art-content figure, .art-content .wp-caption{ max-width:100%; }
.art-content figure img, .art-content .wp-caption img{ width:100%; }
.art-content figcaption, .art-content .wp-caption-text{ margin-top:10px; font-size:13px; color:var(--muted); }
.art-content .alignleft{ float:left; margin:6px 24px 14px 0; max-width:50%; }
.art-content .alignright{ float:right; margin:6px 0 14px 24px; max-width:50%; }
.art-content table{ display:block; overflow-x:auto; width:100%; border-collapse:collapse; font-size:14px; line-height:1.45; color:var(--ink); background:var(--panel); border-radius:var(--r-md); }
.art-content th, .art-content td{ padding:13px 18px; text-align:left; vertical-align:top; border-bottom:1px solid var(--line); min-width:130px; }
.art-content thead th{ font-weight:500; color:var(--muted); font-size:13px; }
.art-content tbody tr:last-child td{ border-bottom:0; }
.art-content iframe, .art-content video{ width:100%; border-radius:var(--r-md); }

/* Satura bloki (īskodi) */
.art-results{ display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0, 1fr); padding:24px 28px; border-radius:var(--r-md); background:var(--ink); color:var(--white); }
.art-results.noise::after{ display:none; }
.art-stat{ display:flex; flex-direction:column; gap:6px; padding:0 18px; border-left:1px solid rgba(255,255,255,.12); }
.art-stat:first-child{ padding-left:0; border-left:0; }
.art-stat__value{ font-size:clamp(26px, 1vw + 18px, 38px); font-weight:500; line-height:1.15; letter-spacing:-0.04em; color:var(--white); font-variant-numeric:tabular-nums; white-space:nowrap; }
.art-content .art-stat__value{ color:var(--white); }
.art-content .art-stat__value.c-signal{ color:var(--signal-soft); }
.art-stat__label{ font-size:13px; line-height:1.4; color:var(--on-black-muted); }
.art-takeaway{ display:grid; gap:8px; padding:24px 28px; border-radius:var(--r-md); background:var(--ink); }
.art-takeaway__label{ font-family:var(--font); font-size:13px; font-weight:500; color:var(--on-black-muted); }
.art-content .art-takeaway__text{ font-size:clamp(19px, .4vw + 16px, 24px); font-weight:500; line-height:1.3; letter-spacing:-0.03em; color:var(--white); }
.art-changes{ margin:0; }
.art-changes__row{ display:grid; grid-template-columns:170px minmax(0, 1fr); gap:20px; padding:16px 0; border-top:1px solid var(--line); }
.art-changes dt{ font-family:var(--font); font-size:14px; font-weight:500; color:var(--ink); }
.art-changes dd{ margin:0; font-size:14px; line-height:1.55; color:var(--muted); }
.art-figure__img{ position:relative; overflow:hidden; border-radius:var(--r-md); aspect-ratio:760 / 430; background:var(--panel); }
.art-figure__img img{ width:100%; height:100%; object-fit:cover; border-radius:0; }
.art-content .art-check{ padding:0; list-style:none; }
.art-check li{ display:grid; grid-template-columns:24px minmax(0, 1fr); align-items:center; gap:14px; padding:14px 0; border-top:1px solid var(--line); font-size:15px; line-height:1.4; color:var(--ink); }
.art-check__tick{ display:grid; place-items:center; width:24px; height:24px; border-radius:7px; background:var(--mint); color:var(--ink); }
.art-check__tick svg{ width:13px; height:13px; }
.art-faq__item{ border-top:1px solid var(--line); }
.art-faq__item:last-child{ border-bottom:1px solid var(--line); }
.art-faq__item > *{ margin:0; }
.art-content .art-faq__item p{ margin-top:-6px; }
.art-content .art-faq__item h3{ position:relative; padding:18px 36px 18px 0; font-size:16px; font-weight:500; line-height:1.4; letter-spacing:-0.01em; }
.art-faq__item p{ padding:0 36px 18px 0; font-size:14px; line-height:1.6; color:var(--muted); }
.js .art-faq.is-acc .art-faq__item h3{ cursor:pointer; }
.js .art-faq.is-acc .art-faq__item h3::after{ content:"+"; position:absolute; right:4px; top:16px; font-size:20px; font-weight:400; line-height:1; color:var(--ink); }
.js .art-faq.is-acc .art-faq__item.is-open h3::after{ content:"\2212"; }
.js .art-faq.is-acc .art-faq__item:not(.is-open) > :not(h3){ display:none; }
@media (hover:hover){ .js .art-faq.is-acc .art-faq__item h3:hover{ color:var(--signal); } }

/* Projekta ekrānšāviņi rakstā: bez pārlūka joslas */
.art-content .lv-bar{ display:none; }
.art-livefig__frame{ position:relative; display:block; overflow:hidden; border-radius:var(--r-md); background:var(--panel); text-decoration:none !important; }
.art-livefig__img{ display:block; aspect-ratio:16 / 10; overflow:hidden; }
.art-content .art-livefig__img img{ width:100%; height:100%; object-fit:cover; object-position:top; border-radius:0; }
.art-livefig__btn{ position:absolute; left:14px; bottom:14px; display:inline-flex; align-items:center; height:36px; padding:0 15px; border-radius:var(--r-pill); background:var(--ink); color:var(--white); font-size:13px; font-weight:500; transition:background-color 180ms; }
.art-livefig__btn svg{ display:none; }
.art-livefig__frame:hover .art-livefig__btn{ background:var(--signal); }
.art-livefig figcaption{ margin-top:10px; }
.art-content .art-try{ margin-top:48px; padding:clamp(22px, 2vw, 32px); border-radius:var(--r-lg); background:var(--ink); color:var(--white); }
.art-content .art-try h2.art-try__title{ margin-top:0; color:var(--white); }
.art-content .art-try .art-try__lead{ margin-top:10px; color:var(--on-black-muted); }
.art-try__grid{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:16px; margin-top:22px; }
.art-content .art-try a{ color:inherit; text-decoration:none; }
.art-try__tile{ display:block; min-width:0; }
.art-try__shot{ display:block; overflow:hidden; border-radius:12px; background:#fff; }
.art-try__img{ display:block; overflow:hidden; aspect-ratio:16 / 10; }
.art-content .art-try__img img{ display:block; width:100%; height:100%; margin:0; border-radius:0; object-fit:cover; object-position:top; }
.art-try__row{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 2px 2px; }
.art-content .art-try__row strong{ font-size:15px; font-weight:500; color:var(--white); }
.art-try__go{ flex:none; font-size:13px; font-weight:500; color:var(--on-black-muted); transition:color 180ms; }
.art-try__go svg, .art-try__more svg{ display:none; }
.art-try__tile:hover .art-try__go{ color:var(--signal-soft); }
.art-try__foot{ display:flex; flex-wrap:wrap; align-items:center; gap:12px 22px; margin-top:24px; }
.art-content .art-try .btn{ --bg:var(--white); --fg:var(--ink); color:var(--ink); }
.art-try__more{ font-size:14px; font-weight:500; text-decoration:underline !important; text-underline-offset:4px; }

/* Autora bloks raksta beigās */
.art-byline{ display:flex; align-items:center; gap:14px; margin-top:40px; padding:18px 20px; border-radius:var(--r-md); background:var(--panel); }
.art-byline .art-author__img{ width:40px; height:40px; }
.art-byline strong{ display:block; font-size:16px; font-weight:500; }
.art-byline p{ margin-top:2px; font-size:13px; color:var(--muted); }

/* Sānu karte */
.art-side__inner{ display:grid; gap:16px; }
.art-svc{ display:flex; flex-direction:column; align-items:flex-start; padding:24px; border-radius:var(--r-md); background:var(--ink); color:var(--white); }
.art-svc__label{ font-size:13px; color:var(--on-black-muted); }
.art-svc__price{ display:inline-flex; align-items:center; min-height:28px; margin-top:12px; padding:3px 12px; border-radius:var(--r-pill); background:var(--signal-soft); color:var(--ink); font-size:13px; font-weight:500; }
.art-svc__name{ margin-top:14px; color:var(--white); transition:color 180ms; }
.art-svc__name:hover{ color:var(--signal-soft); }
.art-svc__text{ margin-top:10px; font-size:14px; line-height:1.55; color:var(--on-black-muted); }
.art-svc__btn{ width:100%; margin-top:20px; }
.art-svc__call{ margin-top:14px; font-size:13px; color:var(--on-black-muted); }
.art-svc__call a{ color:var(--white); }
.art-svc__call a:hover{ color:var(--signal-soft); }
.art-proj{ display:grid; gap:12px; padding:10px 10px 18px; border-radius:var(--r-md); background:var(--panel); color:var(--ink); }
.art-proj__img{ display:block; overflow:hidden; border-radius:14px; aspect-ratio:276 / 170; background:var(--white); }
.art-proj__img img{ width:100%; height:100%; object-fit:cover; object-position:top; transition:transform 700ms var(--ease-v3); }
.art-proj__info{ display:grid; gap:2px; padding:0 8px; }
.art-proj__info strong{ font-size:16px; font-weight:500; }
.art-proj__info span{ font-size:13px; color:var(--muted); }
@media (hover:hover){ .art-proj:hover .art-proj__img img{ transform:scale(1.03); } .art-proj:hover strong{ color:var(--signal); } }

/* Saistītie raksti */
.art-rel__grid{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:clamp(16px, 1.2vw, 24px); }
.art-rel__item{ min-width:0; }
.art-rel__item > .blog-card{ height:100%; }

/* ---------- Pielāgošana ---------- */
@media (max-width: 1440px){
  .art-layout{ grid-template-columns:minmax(0, 220px) minmax(0, 720px) minmax(0, 320px); }
}
@media (max-width: 1200px){
  .art-layout{ grid-template-columns:minmax(0, 220px) minmax(0, 1fr); }
  .art-side{ grid-column:2; position:static; }
  .art-side__inner{ grid-template-columns:repeat(2, minmax(0, 1fr)); align-items:start; }
}
@media (max-width: 1024px){
  .art-cover{ aspect-ratio:16 / 10; }
  .art-live__browser{ left:5%; width:90%; top:8%; }
  .art-live__phone, .art-live__info{ display:none; }
}
@media (max-width: 900px){
  .art-layout{ display:flex; flex-direction:column; gap:0; }
  .art-toc, .art-side{ position:static; }
  .art-toc{ order:0; width:100%; margin-bottom:32px; }
  .art-main{ order:1; width:100%; }
  .art-side{ order:2; width:100%; margin-top:32px; }
  .art-side__inner{ grid-template-columns:minmax(0, 1fr); }
  .art-toc__inner{ padding:18px 20px; border-radius:var(--r-md); background:var(--panel); }
  .art-toc__label{ font-size:15px; color:var(--ink); cursor:pointer; }
  .art-toc__label i{ display:block; position:relative; width:12px; height:12px; }
  .art-toc__label i::before, .art-toc__label i::after{ content:""; position:absolute; left:0; right:0; top:5px; height:2px; background:currentColor; transition:transform 200ms var(--ease-v3); }
  .art-toc__label i::after{ transform:rotate(90deg); }
  .art-toc__label[aria-expanded="true"] i::after{ transform:rotate(0); }
  .art-toc__list[hidden]{ display:none; }
  .art-toc__link{ padding:7px 0; border-left:0; font-size:15px; }
  .art-toc__link.is-active{ color:var(--muted); }
  .art-share{ margin-top:18px; padding-top:16px; border-top:1px solid var(--line); }
  .art-share__btn{ background:var(--white); }
}
@media (max-width: 700px){
  .art-hero__title{ margin-top:18px; }
  .art-author{ margin-top:20px; }
  .art-cover{ border-radius:var(--r-md); aspect-ratio:350 / 230; }
  .art-body{ padding:36px 0 56px; }
  .art-content.prose{ font-size:16px; }
  .art-content > p:first-child{ font-size:18px; }
  .art-results{ grid-auto-flow:row; gap:16px; padding:20px; }
  .art-stat{ padding:0; border-left:0; }
  .art-stat + .art-stat{ padding-top:16px; border-top:1px solid rgba(255,255,255,.12); }
  .art-takeaway{ padding:22px; }
  .art-changes__row{ grid-template-columns:minmax(0, 1fr); gap:6px; }
  .art-try__grid{ grid-template-columns:minmax(0, 1fr); }
  .art-content .alignleft, .art-content .alignright{ float:none; margin:0; max-width:100%; }
  .art-content .art-faq__item h3{ font-size:17px; }
  .art-rel__grid{ display:flex; gap:12px; margin-inline:calc(var(--gutter) * -1); padding-inline:var(--gutter); overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-inline:var(--gutter); scrollbar-width:none; }
  .art-rel__grid::-webkit-scrollbar{ display:none; }
  .art-rel__item{ flex:0 0 84%; scroll-snap-align:start; }
}

/* Sekcijas virsraksta labā puse pie labās malas (Figma) */
.section .sec-head__main{ width:100%; }