/*
 * 3by400 Blog listing v1 (/3by400-inc/3by400-blog). Loaded ONLY by the blog_v1 category layout
 * (templates/yootheme/html/com_content/category/blog_v1.php). Every rule is scoped under .tb4-blog
 * or html:has(.tb4-blog). Generated by deploy-blog/src/build_page.py from the mock CSS, in mock order:
 *   home-v4-seo.css, home-v8-full.css, home-v9-full.css, home-v9b-full.css, page-blog-v1.css
 * Dropped: mock header/nav/mobile menu/footer (site chrome-v9b/v9c stays). font-family / font /
 * text-transform are !important so YOOtheme typography cannot win.
 * Assets: /images/blog-v1/hero-graphic-blog-frame-2c9a8c10.png, /images/blog-v1/no-image-07ad3665.svg
 * Fonts: /images/home-v4/fonts (already on the server).
 * Neutralizes YOOtheme/UIkit blog listing chrome (sidebar, uk-article leftovers, section padding)
 * when .tb4-blog is present.
 */
@font-face{font-family:"Lato";src:url("/images/home-v4/fonts/Lato-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Lato";src:url("/images/home-v4/fonts/Lato-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Lato";src:url("/images/home-v4/fonts/Lato-Black.ttf") format("truetype");font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:"Libre Baskerville";src:url("/images/home-v4/fonts/LibreBaskerville-VariableFont_wght.ttf") format("truetype");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"Libre Baskerville";src:url("/images/home-v4/fonts/LibreBaskerville-Italic-VariableFont_wght.ttf") format("truetype");font-weight:400 700;font-style:italic;font-display:swap}

/* ---- page level ---- */
html:has(.tb4-blog),body:has(.tb4-blog){overflow-x:clip}
html:has(.tb4-blog) #tm-main > .uk-container{max-width:none;padding-left:0;padding-right:0;width:100%}
html:has(.tb4-blog) #tm-main.uk-section{padding-top:0;padding-bottom:0}
html:has(.tb4-blog) #tm-main .uk-grid{margin:0;display:block}
html:has(.tb4-blog) #tm-main .uk-width-expand\@m{width:100%;max-width:100%}

/* ---- root typography reset inside the listing ---- */
.tb4-blog{display:block;margin:0;padding:0;background:#fff;color:#231F20;font-family:"Lato","Albert Sans","Helvetica Neue",Arial,sans-serif;font-size:16px;font-weight:400;font-style:normal;letter-spacing:normal;line-height:normal;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;box-sizing:border-box;text-align:left;--green:#3DB54A;--lime:#9FCC45;--yellow:#D7DF28;--ink:#231F20;--ink-soft:#3a3637;--muted:#5c5856;--cream:#ffffff;--cream-2:#f7f7f7;--line:#e8e8e8;--white:#ffffff;--serif:"Libre Baskerville","Source Serif Pro",Georgia,serif;--sans:"Lato","Albert Sans","Helvetica Neue",Arial,sans-serif;--gut:max(40px, calc((100vw - 1200px)/2));--tint:#F3F8E6}
:where(.tb4-blog) strong,:where(.tb4-blog) b{font-weight:bolder}
.tb4-blog *,.tb4-blog *::before,.tb4-blog *::after{box-sizing:border-box}
.tb4-blog > section{position:relative;width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.tb4-blog :is(h1,h2,h3,h4,h5,h6,p,a,span,strong,b,em,li,blockquote,footer,figure,figcaption,button,.btn,time){text-transform:none !important;letter-spacing:normal;font-family:var(--sans) !important}
.tb4-blog :is(h1,h2,h3,h4,h5,h6){margin:0;padding:0;color:#231F20;font-weight:700;font-style:normal;line-height:1.2}
.tb4-blog p{margin:0}
.tb4-blog ul,.tb4-blog ol{margin:0;padding:0;list-style:none}
.tb4-blog img{max-width:100%;height:auto;display:block;border:0}
.tb4-blog a{color:inherit;text-decoration:none !important}
.tb4-blog svg{max-width:none}
@media (max-width: 720px){
  .tb4-blog{--gut:20px}
}

/* ---- from home-v4-seo.css ---- */
.tb4-blog{--green:#3DB54A;--lime:#9FCC45;--yellow:#D7DF28;--ink:#231F20;--ink-soft:#3a3637;--muted:#5c5856;--cream:#ffffff;--cream-2:#f7f7f7;--line:#e8e8e8;--white:#ffffff;--serif:"Libre Baskerville", "Source Serif Pro", Georgia, serif;--sans:"Lato", "Albert Sans", "Helvetica Neue", Arial, sans-serif}
.tb4-blog .btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--sans) !important;font-weight:700;font-size:14px;line-height:1;border-radius:6px;padding:12px 18px;border:1.5px solid transparent;cursor:pointer;white-space:nowrap}
.tb4-blog .btn-primary{background:var(--green);color:#fff;border-color:var(--green);padding:13px 20px;font-size:15px}
.tb4-blog .btn-primary:hover{filter:brightness(0.95)}
.tb4-blog .btn-secondary{background:var(--white);color:var(--ink);border-color:#b7b3ae;padding:12px 18px;font-size:15px}
.tb4-blog .hero{display:grid;grid-template-columns:1.05fr 0.95fr;gap:28px;align-items:center;padding:28px 0 22px;min-height:360px}
.tb4-blog .eyebrow{margin:0 0 10px;font-size:12px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase !important;color:var(--green)}
.tb4-blog .hero h1{margin:0 0 14px;font-family:var(--serif) !important;font-weight:700;font-size:42px;line-height:1.15;letter-spacing:-0.015em;color:var(--ink);max-width:14ch}
.tb4-blog .subhead{margin:0 0 10px;font-size:17px;line-height:1.45;color:var(--ink-soft);max-width:38ch}
.tb4-blog .hero-art{display:flex;justify-content:center;align-items:center}
.tb4-blog .hero-art img{width:100%;max-width:580px;mix-blend-mode:multiply}
.tb4-blog .feature-body .eyebrow{color:var(--muted);margin-bottom:6px}
@media (max-width: 860px){
  .tb4-blog .hero{grid-template-columns:1fr;gap:18px;padding:28px 0 20px}
  .tb4-blog .hero h1{font-size:32px;max-width:none}
  .tb4-blog .hero-art{order:-1}
  .tb4-blog .hero-art img{max-width:380px;margin:0 auto}
}
/* ---- from home-v8-full.css ---- */
.tb4-blog{--gut:max(40px, calc((100vw - 1200px)/2));--tint:#F3F8E6}
.tb4-blog .hero{padding:56px var(--gut) 60px;min-height:440px;gap:40px;grid-template-columns:1fr 1.05fr}
.tb4-blog .hero-art img{max-width:660px}
.tb4-blog .hero h1{font-size:48px}
@media (max-width:860px){
  .tb4-blog{--gut:20px}
  .tb4-blog .hero{padding:32px var(--gut) 40px;min-height:0}
  .tb4-blog .hero h1{font-size:34px}
}
/* ---- from home-v9-full.css ---- */
@media (max-width:860px){
  .tb4-blog .hero{grid-template-columns:1fr}
}
/* ---- from home-v9b-full.css ---- */
/* ---- from page-blog-v1.css ---- */
.tb4-blog .pb-hero{padding:48px var(--gut) 52px;min-height:0;grid-template-columns:1fr 1.05fr;align-items:center}
.tb4-blog .crumbs{margin:0 0 22px;font-size:13px;color:var(--muted)}
.tb4-blog .crumbs a{color:#2f8f3a;font-weight:700}
.tb4-blog .crumbs span{margin:0 6px;color:#b7b3ae}
.tb4-blog .pb-hero h1{max-width:14ch;margin-bottom:18px}
.tb4-blog .pb-hero .subhead{max-width:42ch;margin-bottom:26px}
.tb4-blog .pb-hero-art{display:flex;justify-content:center}
.tb4-blog .pb-lap{position:relative;display:block;width:100%;max-width:680px;aspect-ratio:1196/565;line-height:0}
.tb4-blog .pb-lap-frame{position:relative;z-index:2;display:block;width:100%;height:auto;pointer-events:none}
.tb4-blog .pb-lap-screen{position:absolute;z-index:1;left:21.7391%;top:11.5044%;width:56.0201%;height:61.2389%;overflow:hidden;background:#F3F8E6;border-radius:0 0 4px 4px}
.tb4-blog .pb-lap-cover{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.tb4-blog .pb-lap-screen.is-fallback{background:#F3F8E6 url("/images/blog-v1/no-image-07ad3665.svg") center/cover no-repeat}
.tb4-blog .pb-filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.tb4-blog .pb-pill{display:inline-flex;align-items:center;padding:8px 16px;border-radius:999px;font-size:13px;font-weight:700;letter-spacing:.02em;color:#231F20;background:#fff;border:1.5px solid #dfe5d0;text-decoration:none;transition:background .15s,border-color .15s,color .15s}
.tb4-blog .pb-pill:hover{border-color:#3DB54A;color:#2f8f3a}
.tb4-blog .pb-pill.is-active{background:#3DB54A;border-color:#3DB54A;color:#fff}
.tb4-blog .pb-featured{background:#F3F8E6;padding:56px var(--gut) 28px}
.tb4-blog .pb-feature{display:grid;grid-template-columns:1.15fr 1fr;gap:40px;align-items:center;text-decoration:none;color:inherit;max-width:1180px;margin:0 auto}
.tb4-blog .pb-feature-media{border-radius:16px;overflow:hidden;background:#fff;aspect-ratio:16/10;box-shadow:0 18px 40px -22px rgba(35,31,32,.35)}
.tb4-blog .pb-feature-media img{width:100%;height:100%;object-fit:cover;display:block}
.tb4-blog .pb-feature-body{display:flex;flex-direction:column;gap:14px;min-width:0}
.tb4-blog .pb-feature-body h2{margin:0;font-family:var(--serif) !important;font-size:clamp(26px,2.4vw,34px);line-height:1.22;font-weight:700;color:var(--ink);text-wrap:pretty}
.tb4-blog .pb-feature .pb-excerpt{margin:0;font-size:17px;line-height:1.55;color:var(--ink-soft);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tb4-blog .pb-feature .pb-more{margin-top:6px}
.tb4-blog .pb-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;font-size:13px;font-weight:700;color:#6b6764}
.tb4-blog .pb-meta time{font-variant-numeric:tabular-nums}
.tb4-blog .pb-author{color:#6b6764}
.tb4-blog .pb-cat{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;background:#fff;border:1px solid #d6e4b8;color:#2f8f3a;font-size:11px;letter-spacing:.08em;text-transform:uppercase !important}
.tb4-blog .pb-more{font-size:14px;font-weight:800;color:#2f8f3a;letter-spacing:.02em}
.tb4-blog .pb-list{background:#fff;padding:36px var(--gut) 72px}
.tb4-blog .pb-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;max-width:1180px;margin:0 auto}
.tb4-blog .pb-card{background:#fff;border-radius:14px;overflow:hidden;border:1px solid #ececec;box-shadow:0 1px 2px rgba(35,31,32,.06),0 18px 40px -22px rgba(35,31,32,.28);display:flex;flex-direction:column;transition:transform .18s ease,box-shadow .18s ease}
.tb4-blog .pb-card:hover{transform:translateY(-3px);box-shadow:0 2px 4px rgba(35,31,32,.08),0 22px 44px -18px rgba(35,31,32,.35)}
.tb4-blog .pb-card-link{display:flex;flex-direction:column;flex:1;text-decoration:none;color:inherit;min-height:100%}
.tb4-blog .pb-card-media{aspect-ratio:16/10;background:#F3F8E6;overflow:hidden;position:relative}
.tb4-blog .pb-card-media img{width:100%;height:100%;object-fit:cover;display:block}
.tb4-blog .pb-card-media.is-fallback,.tb4-blog .pb-feature-media.is-fallback{background:#F3F8E6 url("/images/blog-v1/no-image-07ad3665.svg") center/cover no-repeat}
.tb4-blog .pb-card-media.is-fallback img,.tb4-blog .pb-feature-media.is-fallback img{display:none}
.tb4-blog .pb-card-body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.tb4-blog .pb-card-body h3{margin:0;font-family:var(--serif) !important;font-size:22px;line-height:1.25;font-weight:700;color:var(--ink);text-wrap:pretty}
.tb4-blog .pb-card .pb-excerpt{margin:0;font-size:15px;line-height:1.5;color:var(--ink-soft);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex:1}
.tb4-blog .pb-card .pb-more{margin-top:4px}
.tb4-blog .pb-pager{display:flex;justify-content:center;align-items:center;gap:6px;margin:48px auto 0;max-width:1180px}
.tb4-blog .pb-page{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 12px;border-radius:10px;font-size:15px;font-weight:800;color:#231F20;background:#F4F4F2;text-decoration:none;border:1px solid transparent}
.tb4-blog .pb-page:hover{border-color:#3DB54A;color:#2f8f3a}
.tb4-blog .pb-page.is-current{background:#3DB54A;color:#fff;border-color:#3DB54A}
.tb4-blog .pb-page.is-disabled{opacity:.4;pointer-events:none}
.tb4-blog .lp-cta{background:#231F20;padding:72px var(--gut);position:relative;overflow:hidden;border-top:6px solid transparent;border-image:linear-gradient(90deg,#3DB54A,#9FCC45 50%,#D7DF28) 1}
.tb4-blog .lp-cta::after{content:"";position:absolute;right:-200px;top:-300px;width:800px;height:800px;border-radius:50%;background:radial-gradient(circle,rgba(159,204,69,.14),rgba(159,204,69,0) 70%);pointer-events:none}
.tb4-blog .lp-cta-inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:40px}
.tb4-blog .lp-cta p{margin:0;font-size:17px;line-height:1.5;color:#c9c6c3;max-width:56ch}
.tb4-blog .lp-cta-actions{display:flex;flex-direction:column;align-items:center;gap:12px;flex:0 0 auto}
.tb4-blog .lp-cta .btn-primary{font-size:17px;padding:17px 30px}
.tb4-blog .pb-cta-h{margin:0 0 12px;font-family:var(--serif) !important;font-size:clamp(28px,3vw,36px);line-height:1.2;color:#fff;font-weight:700}
.tb4-blog .pb-cta-reach{margin-top:16px !important;display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;font-size:15px !important;font-weight:700}
.tb4-blog .pb-cta-reach a{color:#9FCC45}
.tb4-blog .pb-cta-reach span{color:#6b6764}
.tb4-blog .pm-pend{display:none}
html.annot .tb4-blog .pm-pend{display:inline-block;vertical-align:middle;margin-left:6px;padding:3px 7px;border-radius:4px;background:#ff7850;color:#fff;font:900 10px/1.2 var(--sans);font-family:var(--sans) !important;letter-spacing:.06em;font-style:normal}
.tb4-blog .annot-panel{display:none}
html.annot .tb4-blog .annot-panel{display:flex;gap:28px;align-items:flex-start;padding:16px var(--gut);background:#1b2a4a;color:#fff;font-family:var(--sans) !important;border-bottom:4px solid #4f8cff}
html.annot .tb4-blog .ap-col{display:flex;flex-direction:column;gap:4px;flex:0 0 auto}
html.annot .tb4-blog .ap-wide{flex:1 1 auto}
html.annot .tb4-blog .ap-k{font-size:11px;font-weight:900;letter-spacing:.14em;text-transform:uppercase !important;color:#9fc0ff}
html.annot .tb4-blog .ap-v{font-size:15px;font-weight:700;line-height:1.35}
html.annot .tb4-blog .ap-note{display:block;margin-top:4px;font-style:normal;font-size:11.5px;font-weight:700;color:#9fc0ff}
html.annot .tb4-blog [data-tag]{position:relative;outline:2px dashed rgba(79,140,255,.75);outline-offset:6px}
html.annot .tb4-blog [data-tag]::after{content:attr(data-tag);position:absolute;right:calc(100% + 14px);top:50%;transform:translateY(-50%);background:#4f8cff;color:#fff;font:900 12px/1 var(--sans);font-family:var(--sans) !important;letter-spacing:.08em;padding:6px 8px;border-radius:4px;font-style:normal}
html.annot .tb4-blog .eyebrow{outline:2px dashed rgba(255,120,80,.8);outline-offset:4px;display:inline-block;position:relative}
html.annot .tb4-blog .eyebrow::after{content:"<p> not a heading";position:absolute;left:calc(100% + 14px);top:50%;transform:translateY(-50%);white-space:nowrap;background:#ff7850;color:#fff;font:900 10.5px/1 var(--sans);font-family:var(--sans) !important;letter-spacing:.06em;padding:5px 7px;border-radius:4px;text-transform:none !important}
@media (max-width:980px){
  .tb4-blog .pb-feature{grid-template-columns:1fr;gap:24px}
  .tb4-blog .pb-grid{grid-template-columns:1fr 1fr;gap:20px}
}
@media (max-width:860px){
  .tb4-blog .pb-hero{padding:24px var(--gut) 36px;grid-template-columns:1fr;gap:26px}
  .tb4-blog .pb-hero h1{font-size:36px}
  .tb4-blog .pb-lap{max-width:420px;margin:0 auto}
  .tb4-blog .crumbs{margin-bottom:16px}
  .tb4-blog .pb-featured{padding:36px var(--gut) 16px}
  .tb4-blog .pb-list{padding:24px var(--gut) 56px}
  .tb4-blog .pb-grid{grid-template-columns:1fr;gap:20px}
  .tb4-blog .pb-card-body h3{font-size:20px}
  .tb4-blog .pb-feature-body h2{font-size:26px}
  .tb4-blog .lp-cta{padding:52px var(--gut)}
  .tb4-blog .lp-cta-inner{flex-direction:column;align-items:flex-start;gap:26px}
  .tb4-blog .lp-cta-actions{align-items:stretch;width:100%}
  .tb4-blog .lp-cta .btn-primary{width:100%;min-height:54px}
  html.annot .tb4-blog [data-tag]::after{right:auto;left:0;top:-28px;transform:none}
}
/* ---- deploy-blog additions (not in the mock) ---- */
/* "Older" years disclosure next to the 4 newest year pills (all years stay reachable, links = real category views) */
.tb4-blog .pb-older{position:relative;display:inline-block}
.tb4-blog .pb-older > summary{list-style:none;cursor:pointer}
.tb4-blog .pb-older > summary::-webkit-details-marker{display:none}
.tb4-blog .pb-older-list{position:absolute;z-index:5;top:calc(100% + 6px);left:0;display:flex;flex-wrap:wrap;gap:6px;width:max-content;max-width:320px;padding:10px;background:#fff;border:1.5px solid #dfe5d0;border-radius:14px;box-shadow:0 18px 40px -22px rgba(35,31,32,.35)}
.tb4-blog .pb-older-list .pb-pill{padding:6px 12px}
.tb4-blog .pb-crumb-cur{color:var(--muted)}
.tb4-blog .pb-empty{max-width:1180px;margin:0 auto;padding:24px 0;font-size:17px;color:var(--ink-soft)}
.tb4-blog span.pb-page{cursor:default}
