/* Lapse Motion v2026.10.28.3 · blog index (the posts page only). Approved canvas board BL-01. */

/* ---------------------------------------------------------------- top band */
.lhb-band{position:relative;overflow:hidden;background:#141414;color:#FFFFFF;isolation:isolate}
.lhb-band .lhb-glow{position:absolute;right:-180px;top:-260px;width:820px;height:820px;border-radius:50%;background:radial-gradient(closest-side,rgba(219,61,60,.34),rgba(219,61,60,0) 70%);z-index:-1;animation:lhb-drift 14s ease-in-out infinite alternate;pointer-events:none}
.lhb-band .lhb-scan{position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 4px);pointer-events:none}
@keyframes lhb-drift{to{transform:translate(-120px,80px)}}
.lhb-in{max-width:1240px;margin:0 auto;padding:84px 20px 46px;box-sizing:border-box}
.lhb-eb{display:flex;align-items:center;gap:12px;margin:0 0 18px;font-family:'Jost',Arial,sans-serif;font-size:13px;font-weight:500;letter-spacing:.22em;line-height:1.3;text-transform:uppercase;color:#EBA3A2}
.lhb-eb::before{content:"";flex:0 0 28px;height:2px;background:#DB3D3C}
.lhb-band h1.lhb-h1{margin:0;padding:0;font-family:'Jost',Arial,sans-serif;font-size:84px;font-weight:500;line-height:1.05;letter-spacing:-.02em;color:#FFFFFF}
.lhb-h1 .lhb-w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.06em}
.lhb-h1 .lhb-w > span{display:inline-block;transform:translateY(105%);animation:lhb-rise 1s cubic-bezier(.2,.8,.2,1) .15s forwards}
@keyframes lhb-rise{to{transform:none}}

.lhb-strip{position:relative;height:150px;background:#0B0B0B;overflow:hidden}
.lhb-strip::before,.lhb-strip::after{content:"";position:absolute;left:0;right:0;height:14px;z-index:2;background:repeating-linear-gradient(90deg,transparent 0 16px,rgba(255,255,255,.18) 16px 30px,transparent 30px 46px);-webkit-mask:linear-gradient(transparent 0 4px,#000 4px 10px,transparent 10px);mask:linear-gradient(transparent 0 4px,#000 4px 10px,transparent 10px)}
.lhb-strip::before{top:0}
.lhb-strip::after{bottom:0}
.lhb-track{position:absolute;top:18px;left:0;display:flex;gap:10px;padding-right:10px;animation:lhb-slide 60s linear infinite}
.lhb-track img{display:block;flex:0 0 auto;width:203px;height:114px;max-width:none;object-fit:cover;border-radius:6px;opacity:.75;filter:saturate(.9)}
@keyframes lhb-slide{to{transform:translateX(-50%)}}
.lhb-band.lhb-off .lhb-track,.lhb-band.lhb-off .lhb-glow{animation-play-state:paused}

/* ---------------------------------------------------------------- layout: posts beside a 320px sidebar */
@media (min-width:922px){
  body.blog .site-content > .ast-container{display:flex;align-items:stretch;gap:48px}
  body.blog .site-content > .ast-container::before,body.blog .site-content > .ast-container::after{display:none}
  body.blog.ast-separate-container.ast-right-sidebar #primary{flex:1 1 auto;width:auto;min-width:0;float:none;margin:64px 0 90px;padding:0;border:0}
  body.blog.ast-separate-container.ast-right-sidebar #secondary{flex:0 0 320px;width:320px;float:none;margin:64px 0 90px;padding:0;border:0}
  body.blog.ast-separate-container.ast-right-sidebar #secondary .sidebar-main{position:sticky;top:100px;padding:0;margin:0}
}
@media (min-width:922px) and (max-width:1099px){
  body.blog .site-content > .ast-container{gap:32px}
  body.blog.ast-separate-container.ast-right-sidebar #secondary{flex-basis:280px;width:280px}
}
@media (max-width:921px){
  body.blog.ast-separate-container.ast-right-sidebar #primary{margin:40px 0 0}
  body.blog.ast-separate-container.ast-right-sidebar #secondary{margin:32px 0 64px}
}

/* ---------------------------------------------------------------- post grid */
body.blog #main > .ast-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;margin:0}
body.blog #main > .ast-row::before,body.blog #main > .ast-row::after{display:none}
body.blog #main .ast-row > article.ast-article-post{width:auto;float:none;margin:0;padding:0;min-width:0}
body.blog #main article .ast-article-inner{height:100%;padding:0;background:#FFFFFF;border:1px solid #E4E3E0;border-radius:18px;overflow:hidden;overflow:clip;box-sizing:border-box;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
body.blog #main article .post-content{position:relative;display:flex;flex-direction:column;height:100%;padding:0 24px 24px;box-sizing:border-box}

/* cover */
body.blog #main article .ast-blog-featured-section{margin:0 -24px 22px;padding:0}
body.blog #main article .post-thumb-img-content,body.blog #main article .post-thumb-img-content > a{display:block;margin:0}
body.blog #main article .post-thumb-img-content{position:relative;aspect-ratio:16/9;overflow:hidden;background:#141414}
body.blog #main article .post-thumb-img-content img{display:block;width:100%;height:100%;object-fit:cover;margin:0;transition:transform .8s cubic-bezier(.2,.8,.2,1)}

/* category tag sits on the cover */
body.blog #main article .entry-meta .cat-links{position:absolute;left:14px;top:14px;z-index:2;margin:0;font-size:0}
body.blog #main article .entry-meta .cat-links a{display:inline-flex;align-items:center;height:30px;padding:0 12px;border-radius:999px;background:rgba(20,20,20,.78);color:#FFFFFF;font-size:12.5px;font-weight:500;line-height:1;text-decoration:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:background .25s}
body.blog #main article .entry-meta .cat-links a + a{margin-left:6px}

/* title */
body.blog #main article h2.entry-title{margin:0 0 12px;padding:0;font-family:'Jost',Arial,sans-serif;font-size:24px;font-weight:500;line-height:1.22}
body.blog #main article h2.entry-title a{color:#141414;text-decoration:none;transition:color .25s}

/* meta: date, reading time, author, each with a small red icon (the "/" and "By" separators are hidden) */
body.blog #main article .entry-header{margin:0 0 14px;padding:0}
body.blog #main article .entry-meta{display:flex;flex-wrap:wrap;align-items:center;row-gap:6px;font-size:0;line-height:1.4;color:#6E7176}
body.blog #main article .entry-meta > span:not(.cat-links){display:inline-flex;align-items:center;gap:6px;margin-right:16px;font-size:13px;color:#6E7176}
body.blog #main article .entry-meta > span:not(.cat-links)::before{content:"";flex:0 0 14px;width:14px;height:14px;background:#DB3D3C;-webkit-mask:var(--lhb-i) center/contain no-repeat;mask:var(--lhb-i) center/contain no-repeat}
body.blog #main article .entry-meta .posted-on{order:1;--lhb-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E")}
body.blog #main article .entry-meta .ast-reading-time{order:2;--lhb-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E")}
body.blog #main article .entry-meta .posted-by{order:3;--lhb-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c1.5-4 4.5-6 8-6s6.5 2 8 6'/%3E%3C/svg%3E")}
body.blog #main article .entry-meta .posted-by a{display:inline;color:#6E7176;text-decoration:none}
body.blog #main article .entry-meta .posted-by a:hover{color:#C0302F}
body.blog #main article .entry-meta .author-name{display:inline;font-size:13px}

/* excerpt */
body.blog #main article .ast-excerpt-container{margin:0 0 20px;padding:0}
body.blog #main article .ast-excerpt-container p{margin:0;font-size:15px;line-height:1.65;color:#3A3D41;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* Read More pill */
body.blog #main article .read-more{margin:auto 0 0;padding:0}
body.blog #main article .read-more a.ast-button{display:inline-flex;align-items:center;gap:10px;height:42px;padding:0 18px;border:1px solid #DB3D3C;border-radius:999px;background:transparent;color:#C0302F;font-family:'Jost',Arial,sans-serif;font-size:14px;font-weight:500;letter-spacing:.06em;line-height:1;text-transform:uppercase;text-decoration:none;box-shadow:none;transition:background .25s,color .25s}
body.blog #main article .read-more a.ast-button::after{content:"";flex:0 0 16px;width:16px;height:16px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .3s}
body.blog #main article .entry-content:empty{display:none}
body.blog #main article .entry-content{margin:0;padding:0}

/* hover and keyboard focus */
body.blog #main article:hover .ast-article-inner,body.blog #main article:focus-within .ast-article-inner{transform:translateY(-6px);box-shadow:0 34px 60px -36px rgba(20,20,20,.55)}
body.blog #main article:hover .post-thumb-img-content img,body.blog #main article:focus-within .post-thumb-img-content img{transform:scale(1.06)}
body.blog #main article:hover .cat-links a,body.blog #main article:focus-within .cat-links a{background:#DB3D3C}
body.blog #main article:hover h2.entry-title a,body.blog #main article:focus-within h2.entry-title a{color:#C0302F}
body.blog #main article:hover .read-more a.ast-button,body.blog #main article:focus-within .read-more a.ast-button{background:#DB3D3C;color:#FFFFFF}
body.blog #main article:hover .read-more a.ast-button::after,body.blog #main article:focus-within .read-more a.ast-button::after{transform:translateX(4px)}
body.blog #main article a:focus-visible{outline:2px solid #141414;outline-offset:3px}

/* newest post on page 1: wide featured card */
body.blog:not(.paged) #main .ast-row > article.ast-article-post:first-child{grid-column:1/-1}
@media (min-width:1200px),(min-width:700px) and (max-width:921px){
  body.blog:not(.paged) #main .ast-row > article:first-child .post-content{justify-content:center;min-height:360px;padding:34px 34px 32px calc(56% + 34px)}
  body.blog:not(.paged) #main .ast-row > article:first-child .ast-blog-featured-section{position:absolute;left:0;top:0;bottom:0;width:56%;margin:0}
  body.blog:not(.paged) #main .ast-row > article:first-child .post-thumb-img-content,body.blog:not(.paged) #main .ast-row > article:first-child .post-thumb-img-content > a{height:100%;aspect-ratio:auto}
  body.blog:not(.paged) #main .ast-row > article:first-child h2.entry-title{font-size:34px;line-height:1.12;margin-bottom:14px}
  body.blog:not(.paged) #main .ast-row > article:first-child .ast-excerpt-container p{-webkit-line-clamp:4;font-size:16px}
  body.blog:not(.paged) #main .ast-row > article:first-child .read-more{margin-top:0}
}

/* cards rise in as the visitor reaches them (classes set by the footer script) */
body.blog #main article.lhb-wait{opacity:0;transform:translateY(28px)}
body.blog #main article.lhb-go{opacity:1;transform:none;transition:opacity .8s cubic-bezier(.2,.8,.2,1) var(--lhb-d,0s),transform .8s cubic-bezier(.2,.8,.2,1) var(--lhb-d,0s)}

/* ---------------------------------------------------------------- pagination */
body.blog .ast-pagination{margin:0;padding:40px 0 0}
body.blog .ast-pagination .nav-links{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px}
body.blog .ast-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:46px;height:46px;margin:0;padding:0 14px;border:1px solid #E4E3E0;border-radius:999px;background:#FFFFFF;color:#141414;font-family:'Jost',Arial,sans-serif;font-size:16px;font-weight:500;line-height:1;text-decoration:none;box-sizing:border-box;transition:border-color .2s,color .2s,background .2s,transform .2s}
body.blog .ast-pagination a.page-numbers:hover{border-color:#DB3D3C;color:#C0302F;transform:translateY(-2px)}
body.blog .ast-pagination .page-numbers.current{background:#DB3D3C;border-color:#DB3D3C;color:#FFFFFF}
body.blog .ast-pagination .page-numbers.dots{border:0;background:transparent;min-width:24px;padding:0}
body.blog .ast-pagination .page-numbers.next,body.blog .ast-pagination .page-numbers.prev{padding:0 20px;background:#141414;border-color:#141414;color:#FFFFFF}
body.blog .ast-pagination .page-numbers.next:hover,body.blog .ast-pagination .page-numbers.prev:hover{background:#DB3D3C;border-color:#DB3D3C;color:#FFFFFF}
body.blog .ast-pagination .ast-right-arrow,body.blog .ast-pagination .ast-left-arrow{font-size:16px}
body.blog .ast-pagination .page-numbers:focus-visible{outline:2px solid #141414;outline-offset:3px}

/* ---------------------------------------------------------------- sidebar box (search and Browse by Category) */
body.blog.ast-separate-container.ast-right-sidebar #secondary .widget,body.blog.ast-two-container.ast-right-sidebar #secondary .widget{margin:0 0 24px;padding:0;background:transparent;border:0;box-shadow:none}
body.blog.ast-separate-container.ast-right-sidebar #secondary .lapse-btb{padding:26px 24px;background:#F4F3F1;border:1px solid #E4E3E0;border-radius:18px;box-sizing:border-box}
body.blog.ast-separate-container.ast-right-sidebar #secondary .lapse-btb .lapse-btb__search{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
body.blog.ast-separate-container.ast-right-sidebar #secondary .lapse-btb .lapse-btb__field{min-width:0}
body.blog.ast-separate-container.ast-right-sidebar #secondary .lapse-btb .lapse-btb__input{min-height:48px}
body.blog.ast-separate-container.ast-right-sidebar #secondary .lapse-btb .lapse-btb__cats{gap:8px}
body.blog.ast-separate-container.ast-right-sidebar #secondary .lapse-btb .lapse-btb__cat{background:#FFFFFF;font-size:13.5px;padding:8px 14px}

/* ---------------------------------------------------------------- tablet and phone */
@media (max-width:1199px){
  .lhb-band h1.lhb-h1{font-size:72px}
}
@media (max-width:921px){
  .lhb-in{padding:64px 20px 36px}
}
@media (max-width:600px){
  .lhb-in{padding:52px 16px 30px}
  body.blog.ast-separate-container #content > .ast-container{padding-left:16px;padding-right:16px}
  .lhb-band h1.lhb-h1{font-size:56px}
  .lhb-strip{height:110px}
  .lhb-track{top:17px}
  .lhb-track img{width:135px;height:76px}
  body.blog #main > .ast-row{grid-template-columns:minmax(0,1fr);gap:20px}
  body.blog #main article .post-content{padding:0 22px 24px}
  body.blog #main article .ast-blog-featured-section{margin:0 -22px 20px}
  body.blog:not(.paged) #main .ast-row > article:first-child h2.entry-title{font-size:26px}
  body.blog .ast-pagination .page-numbers{min-width:42px;height:42px}
}

/* ---------------------------------------------------------------- reduced motion: everything still */
@media (prefers-reduced-motion:reduce){
  .lhb-band .lhb-glow,.lhb-track{animation:none}
  .lhb-h1 .lhb-w > span{animation:none;transform:none}
  body.blog #main article.lhb-wait{opacity:1;transform:none}
  body.blog #main article .ast-article-inner,body.blog #main article .post-thumb-img-content img,body.blog .ast-pagination .page-numbers{transition:none}
  body.blog #main article:hover .ast-article-inner,body.blog #main article:focus-within .ast-article-inner{transform:none}
  body.blog #main article:hover .post-thumb-img-content img,body.blog #main article:focus-within .post-thumb-img-content img{transform:none}
}
body.blog #main article.lhb-wait:focus-within{opacity:1;transform:none}
