/* ==========================================================================
 * Site v3: blog group.
 *
 * Pages: /blog/ and its category and paged views (home.php, body.blog), and
 * single posts (single-post.php, body.single-post). Cards (.v3-post-card) come from
 * template-parts/blog/blog-item.php on both.
 *
 * Loaded after css/site-v3.css. Tokens (--v3-*) come from there.
 * No focus styles, by agency rule.
 * ======================================================================== */

/* ---------- Type: no Kudryashev Display or Display Sans hairline ---------- */
body.blog .font-serif,
body.single-post .font-serif,
body.single-post .prose :is(h1,h2,blockquote),
body.blog .gform_wrapper .gform_title,
body.single-post .gform_wrapper .gform_title{font-family:var(--v3-serif)}

/* ==========================================================================
 * Article cards (blog-item.php): blog archive and "Keep reading" on posts
 * ======================================================================== */

.v3-post-card{position:relative;display:flex;flex-direction:column;color:var(--v3-ink);border-radius:0}
.v3-post-card__media{overflow:hidden;border-radius:var(--v3-r);margin-bottom:20px;background:var(--v3-paper)}
.v3-post-card__img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:var(--v3-r);transition:transform .5s ease}
.v3-post-card:hover .v3-post-card__img{transform:scale(1.03)}
.v3-post-card__body{display:flex;flex:1;flex-direction:column;gap:10px}
.v3-post-card__meta{display:flex;flex-wrap:wrap;gap:4px 14px;margin:0;font:500 13px/1.3 var(--v3-sans);letter-spacing:.06em;text-transform:uppercase;color:var(--v3-olive)}
.v3-post-card__meta span+span{position:relative}
.v3-post-card__meta span+span::before{content:"";position:absolute;left:-8px;top:50%;width:3px;height:3px;margin-top:-1.5px;border-radius:50%;background:currentColor}
.v3-post-card__title{margin:0;font:500 20px/1.3 var(--v3-sans);letter-spacing:-.005em;color:var(--v3-ink);text-wrap:balance}
.v3-post-card__title a{color:inherit;text-decoration:none}
/* The title link covers the whole card, so the card is one click target. */
.v3-post-card__title a::after{content:"";position:absolute;inset:0;z-index:1}
.v3-post-card__excerpt{margin:0;font-size:16px;line-height:1.55;color:var(--v3-ink-2);text-wrap:pretty}
.v3-post-card__more{display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding-top:6px;font:500 14px/1 var(--v3-sans);letter-spacing:.06em;text-transform:uppercase;color:var(--v3-ink)}
.v3-post-card__more svg{transition:transform .2s}
.v3-post-card:hover .v3-post-card__more{color:var(--v3-olive)}
.v3-post-card:hover .v3-post-card__more svg{transform:translateX(4px)}
.v3-post-card:hover .v3-post-card__title{color:var(--v3-olive)}

/* Feature card: the newest article, image beside the text. */
.v3-post-card--feature .v3-post-card__title{font:400 clamp(30px,3.2vw,44px)/1.08 var(--v3-serif);letter-spacing:-.01em}
.v3-post-card--feature .v3-post-card__excerpt{font-size:17px}
.v3-post-card--feature .v3-post-card__img{aspect-ratio:16/10}
.v3-post-card--feature .v3-post-card__more{align-self:flex-start;margin-top:8px;min-height:52px;padding:0 26px;border-radius:var(--v3-r);background:var(--v3-olive);color:#fff;font-size:15px;letter-spacing:.04em}
.v3-post-card--feature:hover .v3-post-card__more{background:var(--v3-olive-d);color:#fff}
.v3-post-card--feature:hover .v3-post-card__title{color:var(--v3-ink)}
@media(min-width:768px){
  .v3-post-card--feature{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:0 48px;align-items:center}
  .v3-post-card--feature .v3-post-card__media{margin:0}
  .v3-post-card--feature .v3-post-card__body{gap:14px}
}
@media(min-width:1024px){.v3-post-card--feature{gap:0 64px}}

/* Grid: 1 column on phones, 2 on tablets, 3 on desktop.
 * Remainders never leave one card alone on the last row. */
.v3-post-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:40px 32px}
@media(min-width:768px){
  .v3-post-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 32px}
  /* Odd count on tablets: the last card spans the row, image beside text. */
  .v3-post-grid>.v3-post-card:nth-child(odd):last-child{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 32px;align-items:center}
  .v3-post-grid>.v3-post-card:nth-child(odd):last-child .v3-post-card__media{margin:0}
}
@media(min-width:1024px){
  .v3-post-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:56px 40px}
  .v3-post-grid>.v3-post-card,.v3-post-grid>.v3-post-card:nth-child(odd):last-child{grid-column:span 2;display:flex}
  .v3-post-grid>.v3-post-card:nth-child(odd):last-child .v3-post-card__media{margin-bottom:20px}
  /* Remainder of 2: the last two cards share the row. */
  .v3-post-grid>.v3-post-card:nth-child(3n+1):nth-last-child(2),.v3-post-grid>.v3-post-card:nth-child(3n+1):nth-last-child(2)~.v3-post-card{grid-column:span 3}
  /* Remainder of 1: the last four cards become two rows of two. */
  .v3-post-grid>.v3-post-card:nth-child(3n+1):nth-last-child(4),.v3-post-grid>.v3-post-card:nth-child(3n+1):nth-last-child(4)~.v3-post-card{grid-column:span 3}
  .v3-post-grid>.v3-post-card:only-child{grid-column:1/-1}
}

/* ==========================================================================
 * Blog archive (home.php): title, categories, feature, grid, pages
 * ======================================================================== */

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.v3-blog__wrap{box-sizing:border-box;width:100%;max-width:1360px;margin:0 auto;padding:0 16px}
@media(min-width:768px){.v3-blog__wrap{padding:0 40px}}

.v3-blog__head{background:var(--v3-paper)}
.v3-blog__head-inner{display:flex;flex-direction:column;gap:24px;padding-top:48px;padding-bottom:40px}
@media(min-width:1024px){.v3-blog__head-inner{flex-direction:row;align-items:flex-end;justify-content:space-between;gap:48px;padding-top:72px;padding-bottom:56px}}
.v3-blog__intro{max-width:640px}
.v3-blog__eyebrow{margin:0 0 12px;font:500 13px/1.3 var(--v3-sans);letter-spacing:.09em;text-transform:uppercase;color:var(--v3-olive)}
.v3-blog__title{margin:0;font:400 clamp(36px,4.4vw,60px)/1.04 var(--v3-serif);letter-spacing:-.01em;color:var(--v3-ink);text-wrap:balance}
.v3-blog__lede{margin:16px 0 0;font-size:17px;line-height:1.55;color:var(--v3-ink);text-wrap:pretty}

/* Category chips: wrap, never scroll sideways. Phones use an even 2-column grid. */
.v3-blog__cats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.v3-blog__cats>.v3-blog__cat:nth-child(odd):last-child{grid-column:1/-1}
@media(min-width:768px){.v3-blog__cats{display:flex;flex-wrap:wrap;justify-content:flex-start}}
@media(min-width:1024px){.v3-blog__cats{justify-content:flex-end;max-width:560px}}
.v3-blog__cat{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border:1px solid #cdc8bb;border-radius:var(--v3-r);background:#fff;font:500 14px/1 var(--v3-sans);letter-spacing:.04em;text-transform:uppercase;color:var(--v3-ink);text-decoration:none;white-space:nowrap;transition:background .2s,border-color .2s,color .2s}
.v3-blog__cat:hover{border-color:var(--v3-olive);color:var(--v3-ink)}
.v3-blog__cat.is-active{background:var(--v3-olive);border-color:var(--v3-olive);color:#fff}

.v3-blog__feature-wrap{padding-top:48px;padding-bottom:56px}
@media(min-width:1024px){.v3-blog__feature-wrap{padding-top:64px;padding-bottom:72px}}
.v3-blog__feature-wrap+.v3-blog__grid-wrap{border-top:1px solid var(--v3-line)}
.v3-blog__grid-wrap{padding-top:48px;padding-bottom:16px}
@media(min-width:1024px){.v3-blog__grid-wrap{padding-top:64px}}
.v3-blog__wrap.v3-blog__grid-wrap{max-width:1360px}
.v3-blog__subhead{margin:0 0 32px;font:400 clamp(28px,2.6vw,36px)/1.1 var(--v3-serif);letter-spacing:-.005em;color:var(--v3-ink)}
.v3-blog__empty{margin:0;font-size:17px;line-height:1.55;color:var(--v3-ink)}
.v3-blog__empty a{color:inherit;text-decoration:underline}

/* Pagination: square 4px, olive current page. */
.v3-blog__pages{padding-top:48px;padding-bottom:72px}
@media(min-width:1024px){.v3-blog__pages{padding-top:56px;padding-bottom:88px}}
.v3-blog__pages ul.page-numbers{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin:0;padding:0;list-style:none}
.v3-blog__pages ul.page-numbers>li{width:auto;height:auto;margin:0;font:500 15px/1 var(--v3-sans)}
.v3-blog__pages .page-numbers>li>:is(a,span){display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:44px;padding:0 12px;border-radius:var(--v3-r);border:1px solid #cdc8bb;color:var(--v3-ink);background:#fff;text-decoration:none;transition:background .2s,border-color .2s}
.v3-blog__pages .page-numbers>li>a:hover{border-color:var(--v3-olive)}
.v3-blog__pages .page-numbers>li>span.current{background:var(--v3-olive);border-color:var(--v3-olive);color:#fff}
.v3-blog__pages .page-numbers>li>span.dots{border-color:transparent;background:none;min-width:24px;padding:0}
/* ==========================================================================
 * Single post (single-post.php)
 * ======================================================================== */

/* Cover image: full bleed, capped. */
body.single-post main>section.h-\[200px\]{height:240px}
@media (min-width:1024px){body.single-post main>section.h-\[200px\]{height:440px}}
body.single-post main>section.h-\[200px\] img{border-radius:0}

/* Article column with the sidebar beside it. Running text is capped at about
 * 70 characters a line (Haas at 17px is narrow, so 500px); images, tables and
 * galleries use the full 720px column. */
body.single-post main>section.container.grid{display:grid;grid-template-columns:minmax(0,1fr);gap:48px;padding-top:48px;padding-bottom:56px}
body.single-post main>section.container.grid>*{grid-column:auto!important;min-width:0}
@media (min-width:1024px){
  body.single-post main>section.container.grid{grid-template-columns:minmax(0,720px) minmax(240px,280px);justify-content:center;gap:56px 96px;padding-top:80px;padding-bottom:80px}
  body.single-post main>section.container.grid>.lg\:col-start-10{grid-column:auto;position:sticky;top:calc(var(--wp-adminbar,0px) + 160px);align-self:start}
}

/* Body copy */
body.single-post .prose{max-width:720px;font-size:17px;line-height:1.65;color:var(--v3-ink);--prose-margin-inline:1.9em}
body.single-post .prose :where(p,li,td,dd){font-size:17px;line-height:1.65;color:var(--v3-ink);letter-spacing:0}
body.single-post .prose p{margin:0 0 1.1em}
body.single-post .prose>:is(p,ul,ol,h2,h3,h4,h5,h6,blockquote),body.single-post .prose .wp-block-group :is(p,ul,ol,h2,h3,h4){max-width:500px}
body.single-post .prose strong{font-weight:500;color:var(--v3-ink)}
body.single-post .prose a:not(.v3-btn):not(.btn):not(.wp-block-button__link){color:var(--v3-ink);text-decoration:underline;text-decoration-color:currentColor;text-decoration-thickness:1px;text-underline-offset:3px}
body.single-post .prose a:not(.v3-btn):not(.btn):not(.wp-block-button__link):hover{color:var(--v3-olive)}

/* Headings */
body.single-post .prose :is(h1,h2,h3,h4,h5,h6){color:var(--v3-ink);text-wrap:balance}
body.single-post .prose h1{font:400 clamp(34px,4vw,52px)/1.06 var(--v3-serif);letter-spacing:-.01em;margin:0 0 32px}
body.single-post .prose h2{font:400 clamp(28px,2.6vw,36px)/1.12 var(--v3-serif);letter-spacing:-.005em;margin:1.9em 0 .55em}
body.single-post .prose h3{font:500 20px/1.3 var(--v3-sans);letter-spacing:-.005em;margin:1.6em 0 .5em}
body.single-post .prose :is(h4,h5,h6){font:500 18px/1.35 var(--v3-sans);margin:1.4em 0 .4em}
body.single-post .prose :is(h2,h3,h4)+:is(h3,h4){margin-top:.6em}
body.single-post .prose h3 strong,body.single-post .prose h2 strong,body.single-post .prose h4 strong{font-weight:inherit}

/* Lists */
body.single-post .prose :is(ul,ol){margin:0 0 1.2em;padding-left:1.35em}
body.single-post .prose ul{list-style:disc}
body.single-post .prose ol{list-style:decimal}
body.single-post .prose li{padding:0 0 0 .3em!important;margin:0 0 .45em}
body.single-post .prose li::marker{color:var(--v3-olive)}
body.single-post .prose ol>li::marker{font-weight:500}
body.single-post .prose li>:is(ul,ol){margin:.45em 0 0}
body.single-post .prose li p{margin:0}

/* Images: 4px corners, never stretched, capped. */
body.single-post .prose img{display:block;max-width:100%;height:auto!important;border-radius:var(--v3-r);margin:0}
body.single-post .prose figure.wp-block-image img{width:100%;max-height:640px;object-fit:cover}
body.single-post .prose figure.wp-block-image.is-resized img{width:auto;max-width:100%;object-fit:contain}
body.single-post .prose :is(figure,.wp-block-image){margin:2em 0}
body.single-post .prose .wp-block-image>figure{margin:0}
/* Small centred images sit on the text edge, like everything else in the column. */
body.single-post .prose figcaption,body.single-post .prose .wp-element-caption{margin-top:10px;font-size:14px;line-height:1.45;color:var(--v3-ink-2);text-align:left}

/* Galleries: a simple even grid. */
body.single-post .prose .wp-block-gallery{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px!important}
body.single-post .prose .wp-block-gallery>figure{width:auto!important;margin:0!important}
body.single-post .prose .wp-block-gallery img{width:100%!important;height:100%!important;aspect-ratio:4/3;object-fit:cover}
body.single-post .prose .wp-block-gallery>figure:nth-child(odd):last-child{grid-column:1/-1}
body.single-post .prose .wp-block-gallery>figure:nth-child(odd):last-child img{aspect-ratio:16/9}

/* Columns and groups: no boxes, just spacing. */
body.single-post .prose :is(.wp-block-columns,.wp-block-group){gap:24px;margin:2em 0}
body.single-post .prose :is(.wp-block-group,.wp-block-group__inner-container,.wp-block-columns,.wp-block-column)>:first-child{margin-top:0}
body.single-post .prose :is(.wp-block-group,.wp-block-group__inner-container,.wp-block-columns,.wp-block-column)>:last-child{margin-bottom:0}

/* Tables: hairline rows, no cage of borders. */
body.single-post .prose figure.wp-block-table{max-width:100%;overflow-x:auto;margin:2em 0;-webkit-overflow-scrolling:touch}
body.single-post .prose figure.wp-block-table.alignfull{width:auto;margin-left:0;margin-right:0}
body.single-post .prose table{width:100%;min-width:0;border-collapse:collapse;font-size:15px;line-height:1.5;table-layout:auto!important;overflow-wrap:normal;word-break:normal;hyphens:manual}
body.single-post .prose :is(th,td){padding:12px 16px 12px 0;border:0;border-bottom:1px solid var(--v3-line);text-align:left;vertical-align:top;font-size:15px;line-height:1.5;color:var(--v3-ink);width:auto;background:none!important;word-break:normal;overflow-wrap:normal}
body.single-post .prose :is(th,td):last-child{padding-right:0}
body.single-post .prose th,body.single-post .prose thead td{font:500 15px/1.4 var(--v3-sans)}
body.single-post .prose thead :is(th,td),body.single-post .prose tbody tr:first-child th{border-bottom-color:var(--v3-ink)}
body.single-post .prose tbody tr:first-child td strong:only-child{font-weight:500}
body.single-post .prose .is-style-stripes{border-bottom:0}
body.single-post .prose .is-style-stripes tbody tr:nth-child(odd){background:none}
@media (max-width:767px){body.single-post .prose table{min-width:520px}}

/* Blockquote: serif pull quote with a single olive rule, no box or icon. */
body.single-post .prose blockquote{margin:2em 0;padding:4px 0 4px 24px;border:0;border-left:2px solid var(--v3-olive);text-align:left;font:400 24px/1.3 var(--v3-serif);color:var(--v3-ink);quotes:none}
body.single-post .prose blockquote::before,body.single-post .prose blockquote::after{content:none!important;display:none!important}
body.single-post .prose blockquote p{font:inherit;color:inherit;margin:0 0 .5em;text-align:left!important}
body.single-post .prose blockquote em{font-style:normal}
body.single-post .prose blockquote p:last-child{margin:0}
body.single-post .prose blockquote cite{display:block;margin-top:12px;font:500 14px/1.3 var(--v3-sans);font-style:normal;letter-spacing:.04em;text-transform:uppercase;color:var(--v3-ink-2)}

body.single-post .prose hr{margin:2.5em 0;border:0;border-top:1px solid var(--v3-line)}
body.single-post .prose>:last-child{margin-bottom:0}

/* Inline CTAs: core button blocks and theme buttons use the olive 4px button. */
body.single-post .prose :is(.wp-block-button__link,.wp-element-button,a.btn){display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;border-radius:var(--v3-r);background:var(--v3-olive);color:#fff!important;border:0;font:500 15px/1 var(--v3-sans);letter-spacing:.04em;text-transform:uppercase;text-decoration:none}
body.single-post .prose :is(.wp-block-button__link,.wp-element-button,a.btn):hover{background:var(--v3-olive-d)}
body.single-post .prose .wp-block-buttons{margin:2em 0;gap:12px}
body.single-post main .gform_wrapper .gform_title{font:400 30px/1.1 var(--v3-serif)}

/* Consultation CTA at the end of every post (single-post.php). */
body.single-post .prose .v3-post-cta{margin:56px 0 0;padding:32px 28px;background:var(--v3-paper);border-radius:var(--v3-r)}
body.single-post .prose .v3-post-cta .v3-post-cta__title{margin:0;font:400 clamp(28px,2.6vw,34px)/1.1 var(--v3-serif);letter-spacing:-.005em;color:var(--v3-ink)}
body.single-post .prose .v3-post-cta .v3-post-cta__text{margin:10px 0 24px;font-size:17px;line-height:1.55;color:var(--v3-ink)}
body.single-post .prose .v3-post-cta .v3-btn{border-radius:var(--v3-r)}
@media (min-width:768px){body.single-post .prose .v3-post-cta{padding:40px}}

/* Sidebar: author and post details */
body.single-post main>section.container.grid>.lg\:col-start-10{gap:24px}
body.single-post main>section.container.grid>.lg\:col-start-10>.border-y{padding:0 0 24px;border-top:0;border-bottom:1px solid var(--v3-line);gap:16px}
@media (max-width:1023px){body.single-post main>section.container.grid>.lg\:col-start-10>.border-y{padding-top:24px;border-top:1px solid var(--v3-line)}}
body.single-post main>section.container.grid>.lg\:col-start-10 .w-\[60px\]{flex:none;width:56px;height:56px}
body.single-post main>section.container.grid>.lg\:col-start-10 .h6{font:500 18px/1.3 var(--v3-sans);color:var(--v3-ink)}
body.single-post main>section.container.grid>.lg\:col-start-10 .border-y .text-sm{font-size:15px;line-height:1.45;color:var(--v3-ink-2)}
body.single-post main>section.container.grid>.lg\:col-start-10>[class*="text-[#737373]"]{gap:10px;font-size:15px;line-height:1.4;color:var(--v3-ink)}
body.single-post main>section.container.grid>.lg\:col-start-10>[class*="text-[#737373]"]>.grid{grid-template-columns:88px minmax(0,1fr);gap:16px;align-items:center}
body.single-post main>section.container.grid>.lg\:col-start-10>[class*="text-[#737373]"]>.grid>:first-child{grid-column:auto;font:500 13px/1.3 var(--v3-sans);letter-spacing:.06em;color:var(--v3-olive)}
body.single-post main>section.container.grid>.lg\:col-start-10>[class*="text-[#737373]"]>.grid>:last-child{grid-column:auto}
body.single-post main>section.container.grid>.lg\:col-start-10 .cursor-pointer{padding:0 12px 0 0;color:var(--v3-ink)}
/* Share row: the X mark is a white glyph on a filled circle (rule 7). */
body.single-post main>section.container.grid>.lg\:col-start-10 .cursor-pointer:has(path[fill="white"]){display:none}

/* "Keep reading" under each post: three cards, one even row. */
body.single-post main>section.v3-related{display:block;padding-top:72px;padding-bottom:80px;border-top:1px solid var(--v3-line)}
body.single-post .v3-related__title{margin:0 0 32px;font:400 clamp(30px,3.2vw,42px)/1.06 var(--v3-serif);letter-spacing:-.01em;color:var(--v3-ink)}
@media(min-width:1024px){body.single-post .v3-related .v3-post-card__img{aspect-ratio:16/10}}
