/* bv-blog.css: the Bruviti Blog Post Page page's own styles. GENERATED by
   tools/build-page-css.py from the design package page; do not edit by hand. */
/*@section:reset*/
body.bv-design.blog-page{font-size:16px;line-height:normal}
body.bv-design.blog-page::before{content:none}
body.bv-design :where(.bvp-blog) :where(h1,h2,h3,h4,p){color:inherit;letter-spacing:normal;position:static;font-size:inherit;line-height:inherit;font-weight:inherit;overflow-wrap:normal}
body.bv-design :where(.bvp-blog) a{transition:none;position:static}
@media (hover:hover){body.bv-design :where(.bvp-blog) a:hover{text-decoration:none}}body.bv-design :where(.bvp-blog) :where(img,svg,video){max-width:none;height:revert}
body.bv-design :where(.bvp-blog) :where(img,picture,video,canvas,svg){display:revert}
body.bv-design :where(.bvp-blog) :where(*)::before,body.bv-design :where(.bvp-blog) :where(*)::after{box-sizing:content-box}
body.bv-design :where(.bvp-blog) .container{width:auto;overflow:visible}
body.bv-design :where(.bvp-blog, .xv) *{max-width:none}
/*@page:Bruviti Blog Post Page.html -> .bvp-blog (kept 37, pruned 4)*/
body.bv-design :where(.bvp-blog) .bh{padding-top:0!important;padding-bottom:64px!important;text-align:left;display:block}
body.bv-design :where(.bvp-blog) .bh .crumb,body.bv-design :where(.bvp-blog) .bh-c .crumb{margin:0 0 56px;padding:14px 0 0;font-size:12px;color:rgba(255,255,255,.6)}
body.bv-design :where(.bvp-blog) .bh .tag{display:inline-block;font-family:"IBM Plex Mono",monospace;font-size:13px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--orange);margin-bottom:0}
body.bv-design :where(.bvp-blog) .bh h1{margin-top:16px;font-size:56px;line-height:1.14;font-weight:300;letter-spacing:-.02em;text-wrap:balance}
body.bv-design :where(.bvp-blog) .ar{padding:64px 0 96px}
body.bv-design :where(.bvp-blog) .arw{max-width:1320px;margin:0 auto;padding:0 40px}
body.bv-design :where(.bvp-blog) .arw>*:not(.intro){max-width:820px;margin-left:auto;margin-right:auto}
body.bv-design :where(.bvp-blog) .arw .intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center;padding-bottom:56px;margin-bottom:0;border-bottom:1px solid var(--border)}
body.bv-design :where(.bvp-blog) .arw .intro+p{margin-top:56px}
body.bv-design :where(.bvp-blog) .arw .intro .lede{font-size:21px;line-height:1.6}
body.bv-design :where(.bvp-blog) .arw .intro .img{aspect-ratio:16/9!important}
body.bv-design :where(.bvp-blog) .arw .intro .img{aspect-ratio:4/3;background:#E4E4E4;display:grid;place-items:center;font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#767676}
body.bv-design :where(.bvp-blog) .arw p{font-size:18px;font-weight:300;line-height:1.7;color:var(--body);margin-top:20px;text-wrap:pretty}
body.bv-design :where(.bvp-blog) .arw p.lede{margin-top:0;font-size:21px;line-height:1.6;color:var(--ink)}
body.bv-design :where(.bvp-blog) .arw h2{margin-top:56px;font-size:30px;font-weight:300;line-height:1.25;letter-spacing:-.01em;text-wrap:balance}
body.bv-design :where(.bvp-blog) .arw a{color:var(--copper)}
@media (hover:hover){body.bv-design :where(.bvp-blog) .arw a:hover{color:#7d2f0e}}body.bv-design :where(.bvp-blog) .rp{background:var(--mist);padding:88px 0}
body.bv-design :where(.bvp-blog) .rp+.bl{border-top:0}
body.bv-design :where(.bvp-blog) .arw .intro{align-items:start}
@media (max-width:860px){
body.bv-design :where(.bvp-blog) .bh .tag{display:none}
body.bv-design :where(.bvp-blog) .bh .crumb,body.bv-design :where(.bvp-blog) .bh-c .crumb{margin-bottom:24px!important}
body.bv-design :where(.bvp-blog) .bh h1{margin-top:0!important}
body.bv-design :where(.bvp-blog) .bh{padding-bottom:48px!important}
body.bv-design :where(.bvp-blog) .bh .crumb,body.bv-design :where(.bvp-blog) .bh-c .crumb{margin-bottom:32px}
body.bv-design :where(.bvp-blog) .bh h1{font-size:32px}
body.bv-design :where(.bvp-blog) .ar{padding:40px 0 56px}
body.bv-design :where(.bvp-blog) .arw{padding:0 20px}
body.bv-design :where(.bvp-blog) .arw .intro{grid-template-columns:minmax(0,1fr);gap:28px;padding-bottom:40px}
body.bv-design :where(.bvp-blog) .arw .intro+p{margin-top:40px}
body.bv-design :where(.bvp-blog) .arw .intro .lede,body.bv-design :where(.bvp-blog) .arw p.lede{font-size:19px}
body.bv-design :where(.bvp-blog) .arw p{font-size:17px}
body.bv-design :where(.bvp-blog) .arw h2{margin-top:44px;font-size:24px}
body.bv-design :where(.bvp-blog) .arw h3{font-size:20px}
body.bv-design :where(.bvp-blog) .rp{padding:56px 0}
body.bv-design :where(.bvp-blog) .tbl{font-size:14px}
}
/*@section:shell*/
body.bv-design :where(.bvp-blog) .arw .intro .img{min-width:0;overflow:hidden;position:relative}
body.bv-design :where(.bvp-blog) .arw .intro .img img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
body.bv-design :where(.bvp-blog) .arw .intro .itx>:first-child{margin-top:0}
body.bv-design :where(.bvp-blog) .arw .intro .itx>.lede:not(:first-child){margin-top:20px}
body.bv-design :where(.bvp-blog) .arw .intro .itx>h2+.lede{margin-top:16px}
@media(max-width:860px){body.bv-design :where(.bvp-blog) .arw .intro .img{order:-1}}
body.bv-design :where(.bvp-blog) .arw :where(h3,h4,h5){margin-top:40px;font-size:20px;font-weight:400;line-height:1.3}
body.bv-design :where(.bvp-blog) .arw :where(h3,h4,h5)+p{margin-top:12px}
body.bv-design :where(.bvp-blog) .arw .plist{margin-top:20px}
body.bv-design :where(.bvp-blog) .arw .plist li{font-size:17px}
@media(max-width:860px){body.bv-design :where(.bvp-blog) .arw :where(h3,h4,h5){font-size:18px}}
body.bv-design :where(.bvp-blog) .aimg{min-width:0;overflow:hidden;position:relative}
body.bv-design :where(.bvp-blog) .aimg img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0}
/*@section:midsize*/
@media(min-width:861px) and (max-width:1279px){body.bv-design :where(.bvp-blog) .faqw,body.bv-design :where(.bvp-blog) .wrap.g2:has(>h2:first-child):not(:has(>.res)),body.bv-design :where(.bvp-blog) .wrap.g2:has(>div:first-child>h2:only-child),body.bv-design :where(.bvp-blog) .wrap.g2:has(>div:first-child>h2:first-child+p.sub:last-child),body.bv-design :where(.bvp-blog) .uc>.wrap:has(>.ucg){grid-template-columns:minmax(0,1fr);gap:32px}body.bv-design :where(.bvp-blog) .faqw>:last-child:not(.ucg,.dgrid,.wk),body.bv-design :where(.bvp-blog) .wrap.g2:has(>h2:first-child):not(:has(>.res))>:last-child:not(.ucg,.dgrid,.wk),body.bv-design :where(.bvp-blog) .wrap.g2:has(>div:first-child>h2:only-child)>:last-child:not(.ucg,.dgrid,.wk),body.bv-design :where(.bvp-blog) .wrap.g2:has(>div:first-child>h2:first-child+p.sub:last-child)>:last-child:not(.ucg,.dgrid,.wk),body.bv-design :where(.bvp-blog) .uc>.wrap:has(>.ucg)>:last-child:not(.ucg,.dgrid,.wk){max-width:667px}body.bv-design :where(.bvp-blog) .faqw>:last-child,body.bv-design :where(.bvp-blog) .wrap.g2:has(>h2:first-child):not(:has(>.res))>:last-child,body.bv-design :where(.bvp-blog) .wrap.g2:has(>div:first-child>h2:only-child)>:last-child,body.bv-design :where(.bvp-blog) .wrap.g2:has(>div:first-child>h2:first-child+p.sub:last-child)>:last-child,body.bv-design :where(.bvp-blog) .uc>.wrap:has(>.ucg)>:last-child{margin-top:0}}
/*@section:shared*/
body.bv-design :where(.bvp-blog) :where(h2,h3,h4){text-wrap:pretty}
@media(max-width:860px){body.bv-design :where(.bvp-blog) .tbl td:first-child,body.bv-design :where(.bvp-blog) .tbl th:first-child{white-space:normal;width:30%}}
@media(max-width:374px){body.bv-design :where(.bvp-blog) .tbl td,body.bv-design :where(.bvp-blog) .tbl th{padding-right:8px}}