/* blog.css: loaded after /styles.css and /product-pages.css on /blog/ pages only. Tokens from styles.css:2. No dark mode (site has none).
   Contrast (WCAG AA 4.5:1): small gold text is #7a6536 (5.61:1 on #fff), never #9b824f (3.68:1). Meta text is --muted #526c7c (>= 4.91:1 on #edf2f6). */
.blog-hero{padding:38px 0 52px;background:var(--navy);color:#fff}
.blog-hero h1{font-size:clamp(28px,3.2vw,44px);line-height:1.65;margin:14px 0 12px}
.blog-hero .product-lead{max-width:780px}
.post-meta{display:flex;flex-wrap:wrap;gap:4px 18px;font-size:13px;color:#adbfca;margin-top:18px}
.post-category{display:inline-block;font-size:12px;font-weight:600;color:#7a6536}
.blog-hero .post-category{color:var(--mint)}
/* Cards */
.post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.post-card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:border-color .25s,transform .25s}
.post-card:hover{border-color:#b8a273;transform:translateY(-3px)}
.post-card>a{display:flex;flex-direction:column;height:100%}
.post-card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:#edf2f6}
.post-card .card-body{display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px;flex:1}
.post-card h2,.post-card h3{font-size:18px;line-height:1.8;margin:0}
.post-card p{font-size:14px;line-height:2;color:var(--muted)}
.post-card .post-meta{margin-top:auto;padding-top:6px;color:var(--muted);font-size:12px}
.blog-pagination{display:flex;justify-content:center;gap:10px;margin-top:36px}
.blog-pagination a,.blog-pagination span{border:1px solid #b9cbd5;border-radius:6px;padding:7px 14px;font-size:13px;color:#005277}
.blog-pagination [aria-current]{background:#005277;color:#fff;border-color:#005277}
/* Post */
.post-wrap{width:min(760px,calc(100% - 36px));margin-inline:auto}
.post-cover{margin:32px 0 0}
.post-cover img{display:block;width:100%;height:auto;border-radius:12px;border:1px solid var(--line)}
.post-cover figcaption{font-size:12px;color:var(--muted);margin-top:10px;text-align:center}
.post-toc{margin:32px 0 0;padding:16px 22px;background:#fff;border:1px solid var(--line);border-radius:10px;font-size:14px}
.post-toc h2{font-size:15px;margin-bottom:6px}
.post-toc ol{margin:0;padding-inline-start:1.3em;list-style-type:persian;line-height:2.1}
.post-toc ol ol{list-style-type:disc;font-size:13px}
.post-toc a{color:var(--teal)}
.post-body{margin-top:36px;font-size:17px;line-height:2.15;color:var(--ink);overflow-wrap:break-word}
.post-body>*+*{margin-top:1.1em}
.post-body h2{font-size:25px;line-height:1.7;margin-top:1.9em}
.post-body h3{font-size:20px;line-height:1.7;margin-top:1.6em}
.post-body a{color:var(--teal);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.35em}
.post-body a:hover{text-decoration-thickness:2px}
.post-body em{font-weight:650}
.post-body strong{font-weight:750}
.post-body :is(ul,ol){padding-inline-start:1.4em}
.post-body ol{list-style-type:persian}
.post-body li+li{margin-top:.35em}
.post-body blockquote{margin-inline:0;padding:14px 20px;border-inline-start:3px solid #b8a273;background:#f1f5f8;border-radius:8px;color:#294e64}
.post-body code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;font-size:.86em;background:#edf2f6;padding:.1em .4em;border-radius:4px;direction:ltr;unicode-bidi:isolate}
.post-body pre{direction:ltr;text-align:left;overflow-x:auto;background:var(--navy);color:#e6eef2;padding:16px 18px;border-radius:10px;font-size:14px;line-height:1.75}
.post-body pre code{background:none;padding:0;font-size:inherit;color:inherit}
.post-body .table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:linear-gradient(to right,#fff 30%,#fff0) 0 0/40px 100% no-repeat local,linear-gradient(to left,#fff 30%,#fff0) 100% 0/40px 100% no-repeat local,linear-gradient(to right,#0002,#0000) 0 0/12px 100% no-repeat scroll,linear-gradient(to left,#0002,#0000) 100% 0/12px 100% no-repeat scroll,#fff}
.post-body table{width:100%;border-collapse:collapse;font-size:15px;font-variant-numeric:tabular-nums}
.post-body :is(th,td){padding:10px 14px;border-bottom:1px solid var(--line);text-align:start;vertical-align:top}
.post-body th{background:#edf2f6;font-weight:650}
.post-body :is(th,td){min-width:8em}
.post-body tr:last-child td{border-bottom:0}
.post-body figure{margin-inline:0}
.post-body img{display:block;max-width:100%;height:auto;border-radius:10px;border:1px solid var(--line)}
.post-body figcaption{font-size:13px;color:var(--muted);text-align:center;margin-top:10px}
.post-body hr{border:0;border-top:1px solid var(--line);margin-block:2.4em}
.post-faq{margin-top:44px}
.post-faq h2{font-size:22px;margin-bottom:6px}
.post-faq details{border-bottom:1px solid var(--line);padding:16px 0}
.post-faq summary{font-weight:600;cursor:pointer}
.post-faq details p{padding-top:12px;color:var(--muted);font-size:15px}
.author-box{display:flex;gap:16px;align-items:flex-start;margin-top:48px;padding-top:26px;border-top:1px solid var(--line)}
.author-box img{width:64px;height:64px;border-radius:50%;flex:none}
.author-box strong{display:block;font-size:16px}
.author-box span{display:block;font-size:13px;color:var(--muted)}
.author-box p{font-size:14px;line-height:2;color:var(--muted);margin-top:6px}
.post-pager{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:40px}
.post-pager a{border:1px solid #ccdce6;border-radius:9px;padding:14px 18px;background:#fff;transition:border-color .25s}
.post-pager a:hover{border-color:#b8a273}
.post-pager .next{grid-column:2}
.post-pager span{display:block;font-size:12px;color:var(--muted)}
.post-pager strong{display:block;font-weight:600;color:var(--teal);font-size:15px;line-height:1.8}
.related{padding:56px 0}
.related h2{font-size:24px;margin-bottom:20px}
/* Additions after the prototype: summary, disclaimer, draft banner, CTA, empty state, feed link */
.page-no{font-size:.6em;font-weight:500;color:#bdd0db}
.post-draft-label{display:inline-block;margin-inline-start:10px;font-size:12px;font-weight:650;color:#8a3b12}
.draft-banner{margin:0;padding:10px 18px;background:#fff4d6;border-bottom:1px solid #e3cf9a;color:#5c4a1f;font-size:14px;font-weight:600;text-align:center}
.post-summary{margin-top:32px;padding:16px 22px 18px;background:#fff;border:1px solid var(--line);border-inline-start:3px solid #b8a273;border-radius:10px}
.post-summary h2{font-size:15px;color:#7a6536;margin-bottom:6px}
.post-summary p,.post-summary li{font-size:15px;line-height:2.05;color:var(--ink)}
.post-summary ul{margin:0;padding-inline-start:1.3em}
.post-note{margin-top:18px;padding:12px 18px;background:#f1f5f8;border:1px solid var(--line);border-radius:10px;font-size:14px;line-height:2;color:#294e64}
.post-summary+.post-toc,.post-note+.post-toc{margin-top:18px}
.author-box .author-logo{object-fit:contain;background:#fff;border:1px solid var(--line)}
.author-box strong a{color:var(--teal);text-decoration:underline;text-underline-offset:.3em}
.cta-primary{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:24px}
.product-cta .cta-next{font-size:13px;color:var(--muted)}
.product-cta .product-links{margin-top:18px}
.blog-empty{color:var(--muted);font-size:16px}
.blog-feed{margin-top:28px;font-size:13px}
.blog-feed a{color:var(--teal);text-decoration:underline;text-underline-offset:.3em}
/* Review fixes 2026-10-12 */
html{scroll-padding-top:16px} /* blog pages use the non-sticky product header; styles.css sets 100px for the home page */
main:focus{outline:none} /* main has tabindex=-1 so the skip link moves focus in every browser */
.blog-hero,.post-card,.post-pager,.post-faq,.post-toc,.author-box{overflow-wrap:anywhere}
.blog-hero h1,.post-card h2,.post-card h3{text-wrap:balance}
.post-card a:focus-visible{outline-offset:-3px} /* inside the card, which clips (overflow:hidden); same trick as .oms-gallery .story */
article>.post-wrap{padding-bottom:66px}
.post-body :is(.table-wrap,pre):focus-visible{outline:3px solid #a38748;outline-offset:2px}
.post-faq summary:focus-visible{outline:3px solid #a38748;outline-offset:4px;border-radius:3px}
.post-body a.url{direction:ltr;unicode-bidi:isolate;overflow-wrap:anywhere}
.post-body a[target=_blank]::after{content:" \2197"}
.blog-hero .breadcrumbs{flex-wrap:nowrap}
.blog-hero .breadcrumbs>*{flex:none}
.blog-hero .breadcrumbs>span:last-child{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(min-width:851px){.product-section .post-grid>.post-card:only-child{grid-column:1/-1}.product-section .post-grid>.post-card:only-child>a{flex-direction:row}.product-section .post-grid>.post-card:only-child img{width:50%;aspect-ratio:16/9;align-self:flex-start}.product-section .post-grid>.post-card:only-child .card-body{justify-content:center;padding:28px 32px}.product-section .post-grid>.post-card:only-child h2{font-size:24px}}
@media(max-width:850px){.post-grid{grid-template-columns:repeat(2,minmax(0,1fr))}article>.post-wrap{padding-bottom:45px}}
@media(max-width:760px){.post-grid,.post-pager{grid-template-columns:1fr}.cta-primary .button{width:100%}.post-pager .next{grid-column:auto}.post-body{font-size:16px;line-height:2.1}.post-body h2{font-size:22px}.post-body h3{font-size:18px}.blog-hero{padding-bottom:40px}}
@media(prefers-reduced-motion:reduce){.post-card{transition:none}.post-card:hover{transform:none}}