/*
Theme Name: Henrik Child — Check Three Times
Theme URI: https://henrik.qodeinteractive.com
Description: Mobile-first editorial child theme for Check Three Times, built on Henrik.
Author: Check Three Times
Version: 6.2.50
Text Domain: henrik
Template: henrik
*/

:root {
    --ctt-display: "Poppins", sans-serif;
    --ctt-ink: #111;
    --ctt-paper: #f7f7f4;
    --ctt-card: #fff;
    --ctt-muted: #747474;
    --ctt-rule: rgba(17,17,17,.11);
    --ctt-radius: 16px;
    --ctt-feed: 860px;
}

body { background: var(--ctt-paper); color: var(--ctt-ink); }

h1,h2,h3,h4,h5,h6,.qodef-h1,.qodef-h2,.qodef-h3,.qodef-h4,.qodef-h5,.qodef-h6,.qodef-e-title,.qodef-e-title a {
    font-family: var(--ctt-display); font-weight: 300; text-transform: none; letter-spacing: -.035em;
}

.qodef-e-info,.qodef-e-info *,.qodef-e-info a,.qodef-e-info-category a { font-family: var(--ctt-display); }
.qodef-blog .qodef-blog-item .qodef-e-info > * { font-size: 10px; font-weight: 500; letter-spacing: .08em; line-height: 1.3; color: var(--ctt-muted); }
.qodef-blog .qodef-blog-item .qodef-e-info .qodef-e-info-category a { border: 0; border-radius: 0; padding: 0; margin-right: 10px; }
.qodef-blog .qodef-blog-item .qodef-e-title > a { background-image: none !important; }

/* CTT editorial feed: neutralize Henrik masonry/pinterest positioning. */
.qodef-blog.qodef-layout--masonry > .qodef-grid-inner,
.qodef-blog.qodef-layout--pinterest > .qodef-grid-inner,
.qodef-blog .qodef-grid-inner.qodef--masonry-init {
    display: block !important;
    height: auto !important;
    max-width: var(--ctt-feed);
    margin-left: auto !important;
    margin-right: auto !important;
}
.qodef-blog.qodef-layout--masonry .qodef-grid-masonry-sizer,
.qodef-blog.qodef-layout--masonry .qodef-grid-masonry-gutter,
.qodef-blog.qodef-layout--pinterest .qodef-grid-masonry-sizer,
.qodef-blog.qodef-layout--pinterest .qodef-grid-masonry-gutter { display:none !important; }
.qodef-blog.qodef-layout--masonry > .qodef-grid-inner > .qodef-grid-item,
.qodef-blog.qodef-layout--pinterest > .qodef-grid-inner > .qodef-grid-item {
    position: relative !important; left: auto !important; top: auto !important; transform: none !important;
    width: 100% !important; max-width: 100%; padding-left: 0 !important; padding-right: 0 !important;
}

/* Cards are quiet editorial surfaces. */
.qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item { background: var(--ctt-card); border: 1px solid var(--ctt-rule); border-radius: var(--ctt-radius); overflow: hidden; }
.qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item .qodef-e-inner { overflow: hidden; border-radius: inherit; }

/* Featured image is part of the card, not a square sitting on top of it. */
.qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item .qodef-e-media,
.qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item .qodef-e-media > *,
.qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item .qodef-e-media-image,
.qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item .qodef-e-media-image a { display:block; width:100%; max-width:none; margin:0 !important; }
.qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item .qodef-e-media { overflow:hidden; border-radius: var(--ctt-radius) var(--ctt-radius) 0 0 !important; }
.qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item .qodef-e-media-image,
.qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item .qodef-e-media-image a,
.qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item .qodef-e-media-image img { border-radius: 0 !important; }
.qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item .qodef-e-media-image img { display:block; width:100% !important; height:auto; }
.qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item .qodef-e-content { padding: 26px 28px 30px; }
.qodef-blog .qodef-blog-item .qodef-e-title { line-height:1.08; }
.qodef-blog .qodef-blog-item .qodef-e-excerpt { color:#383838; line-height:1.58; }

/* Give the continuous feed the spacious Tumblr rhythm. */
.qodef-blog.qodef-layout--masonry > .qodef-grid-inner > .qodef-grid-item,
.qodef-blog.qodef-layout--pinterest > .qodef-grid-inner > .qodef-grid-item,
.qodef-blog .qodef-blog-item { margin-bottom: 54px; }

/* Native Henrik infinite-scroll spinner stays quiet and centered. */
.qodef-m-pagination.qodef--infinite-scroll { margin-top: 0; padding: 6px 0 44px; text-align:center; }

@media only screen and (max-width: 680px) {
    #qodef-page-mobile-header { height:64px; background:rgba(247,247,244,.96); border-bottom:1px solid var(--ctt-rule); }
    #qodef-page-mobile-header-inner { padding-left:18px; padding-right:18px; }
    #qodef-page-mobile-header .qodef-mobile-header-logo-link { height:32px; }
    .qodef-mobile-header-opener { margin-left:12px; }
    #qodef-page-inner, body:not([class*=henrik-core]) #qodef-page-inner { padding-top:30px; padding-bottom:54px; }

    h1,.qodef-h1 { font-size:clamp(38px,11vw,52px); line-height:1.02; }
    h2,.qodef-h2 { font-size:clamp(31px,8.7vw,42px); line-height:1.06; }
    h3,.qodef-h3 { font-size:clamp(26px,7.3vw,34px); line-height:1.08; }

    .qodef-blog.qodef-layout--masonry > .qodef-grid-inner,
    .qodef-blog.qodef-layout--pinterest > .qodef-grid-inner,
    .qodef-blog .qodef-grid-inner.qodef--masonry-init { width:100% !important; max-width:none; }

    .qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item { border-radius:14px; }
    .qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item .qodef-e-media { border-radius:14px 14px 0 0 !important; }
    .qodef-blog:not(.qodef-item-layout--info-on-image) .qodef-blog-item .qodef-e-content { padding:20px 18px 23px; }
    .qodef-blog .qodef-blog-item .qodef-e-title { font-size:clamp(27px,7.8vw,38px); line-height:1.06; }
    .qodef-blog .qodef-blog-item .qodef-e-excerpt { font-size:15px; line-height:1.6; margin-top:13px; }
    .qodef-blog.qodef-layout--masonry > .qodef-grid-inner > .qodef-grid-item,
    .qodef-blog.qodef-layout--pinterest > .qodef-grid-inner > .qodef-grid-item,
    .qodef-blog .qodef-blog-item { margin-bottom:34px; }
}

/* ==========================================================
   CTT v0.3 — quieter chrome, smaller cards, centered reading
   ========================================================== */
:root { --ctt-feed: 680px; --ctt-reading: 760px; --ctt-radius: 14px; }

/* Remove Henrik's extra chrome. The logo becomes the navigation trigger. */
#qodef-top-area,
.qodef-blog .qodef-filter-holder,
.qodef-m-filter,
.qodef-search-opener,
.qodef-fullscreen-search-opener,
#qodef-page-sidebar,
.qodef-page-sidebar-section,
#qodef-back-to-top { display:none !important; }

#qodef-page-header { background: var(--ctt-paper) !important; border:0 !important; box-shadow:none !important; }
#qodef-page-header-inner { justify-content:flex-start !important; min-height:72px; padding-left:28px; padding-right:28px; }
#qodef-page-header .qodef-header-logo-link { cursor:pointer; position:relative; z-index:1002; }
#qodef-page-header .qodef-header-navigation { display:none !important; position:absolute !important; left:24px; top:calc(100% - 2px); width:min(360px,calc(100vw - 48px)); padding:18px 20px 20px; background:var(--ctt-card); border:1px solid var(--ctt-rule); border-radius:12px; box-shadow:0 14px 40px rgba(0,0,0,.08); z-index:1001; }
#qodef-page-header.ctt-menu-open .qodef-header-navigation { display:block !important; }
#qodef-page-header .qodef-header-navigation > ul { display:block !important; }
#qodef-page-header .qodef-header-navigation > ul > li { display:block !important; float:none !important; margin:0 !important; padding:0 !important; }
#qodef-page-header .qodef-header-navigation > ul > li > a { display:block !important; padding:8px 0 !important; height:auto !important; line-height:1.35 !important; font-family:var(--ctt-display); font-weight:400; }

/* Smaller desktop feed without reducing source image quality. */
.qodef-blog.qodef--list > .qodef-grid-inner,
.qodef-blog.qodef--list .qodef-grid-inner.qodef--masonry-init,
.qodef-blog-list .qodef-grid-inner { max-width:var(--ctt-feed) !important; margin-left:auto !important; margin-right:auto !important; }

/* Every card image is clipped by the same card radius, including featured/lead cards. */
.qodef-blog .qodef-blog-item,
.qodef-blog-list .qodef-blog-item { overflow:hidden !important; border-radius:var(--ctt-radius) !important; }
.qodef-blog .qodef-blog-item .qodef-e-inner,
.qodef-blog-list .qodef-blog-item .qodef-e-inner { overflow:hidden !important; border-radius:inherit !important; }
.qodef-blog .qodef-blog-item .qodef-e-media,
.qodef-blog .qodef-blog-item .qodef-e-media-image,
.qodef-blog .qodef-blog-item .qodef-e-media-image a,
.qodef-blog-list .qodef-blog-item .qodef-e-media,
.qodef-blog-list .qodef-blog-item .qodef-e-media-image,
.qodef-blog-list .qodef-blog-item .qodef-e-media-image a { overflow:hidden !important; border-radius:var(--ctt-radius) var(--ctt-radius) 0 0 !important; margin:0 !important; }
.qodef-blog .qodef-blog-item .qodef-e-media img,
.qodef-blog-list .qodef-blog-item .qodef-e-media img { display:block !important; width:100% !important; height:auto !important; border-radius:0 !important; transform:none !important; transition:none !important; }
.qodef-blog .qodef-blog-item:hover .qodef-e-media img,
.qodef-blog .qodef-blog-item:hover .qodef-e-media-image,
.qodef-blog .qodef-blog-item:hover .qodef-e-media-image a,
.qodef-blog-list .qodef-blog-item:hover .qodef-e-media img { transform:none !important; }

/* Center all information beneath card images. */
.qodef-blog.qodef--list .qodef-blog-item .qodef-e-content,
.qodef-blog-list .qodef-blog-item .qodef-e-content { text-align:center !important; padding:22px 24px 26px !important; }
.qodef-blog.qodef--list .qodef-blog-item .qodef-e-info,
.qodef-blog-list .qodef-blog-item .qodef-e-info { justify-content:center !important; text-align:center !important; }
.qodef-blog.qodef--list .qodef-blog-item .qodef-e-excerpt { max-width:560px; margin-left:auto; margin-right:auto; }

/* Single article pages: one centered reading column, no sidebar/widgets. */
.single-post #qodef-page-content,
.single-post #qodef-page-content > .qodef-grid-inner,
.single-post .qodef-page-content-section,
.single-post .qodef-blog.qodef--single { width:100% !important; max-width:var(--ctt-reading) !important; margin-left:auto !important; margin-right:auto !important; padding-left:0 !important; padding-right:0 !important; }
.single-post .qodef-blog.qodef--single .qodef-blog-item { background:transparent !important; border:0 !important; border-radius:0 !important; overflow:visible !important; }
.single-post .qodef-blog.qodef--single .qodef-e-content { text-align:center; padding-left:0 !important; padding-right:0 !important; }
.single-post .qodef-blog.qodef--single .qodef-e-text > *:not(.qodef-e-title),
.single-post .qodef-blog.qodef--single .qodef-e-text .entry-content { text-align:left; }
.single-post .qodef-blog.qodef--single .qodef-e-info { justify-content:center; text-align:center; }

/* Appended endless-reading articles. */
#ctt-endless-reading { max-width:var(--ctt-reading); margin:0 auto; }
.ctt-endless-post { padding-top:84px; margin-top:84px; border-top:1px solid var(--ctt-rule); }
.ctt-endless-post__media { margin:0 0 34px; overflow:hidden; border-radius:var(--ctt-radius); }
.ctt-endless-post__media img { width:100%; height:auto; display:block; }
.ctt-endless-post__meta { text-align:center; font:500 10px/1.4 var(--ctt-display); letter-spacing:.08em; text-transform:uppercase; color:var(--ctt-muted); }
.ctt-endless-post__title { text-align:center; margin:14px auto 30px; font-family:var(--ctt-display); font-weight:300; letter-spacing:-.035em; line-height:1.06; }
.ctt-endless-post__content { text-align:left; }
.ctt-endless-post__content > * { max-width:100%; }
.ctt-endless-loader { padding:50px 0; text-align:center; font:400 11px/1.4 var(--ctt-display); letter-spacing:.08em; text-transform:uppercase; color:var(--ctt-muted); }

@media only screen and (max-width:1024px) {
    :root { --ctt-feed:620px; }
}

@media only screen and (max-width:680px) {
    :root { --ctt-feed:100%; --ctt-reading:100%; --ctt-radius:12px; }
    #qodef-page-mobile-header { border:0 !important; box-shadow:none !important; }
    #qodef-page-mobile-header-inner { justify-content:flex-start !important; }
    #qodef-page-mobile-header .qodef-mobile-header-opener { display:none !important; }
    #qodef-page-mobile-header .qodef-mobile-header-logo-link { cursor:pointer; margin:0 !important; position:relative; z-index:1002; }
    #qodef-page-mobile-header .qodef-mobile-header-navigation { left:16px !important; right:16px !important; width:auto !important; top:64px !important; padding:16px 18px 18px !important; background:var(--ctt-card) !important; border:1px solid var(--ctt-rule); border-radius:12px; box-shadow:0 14px 40px rgba(0,0,0,.08); }
    #qodef-page-inner { padding-left:14px !important; padding-right:14px !important; }
    .qodef-blog.qodef--list .qodef-blog-item .qodef-e-content,
    .qodef-blog-list .qodef-blog-item .qodef-e-content { padding:18px 16px 21px !important; }
    .single-post #qodef-page-content { padding-left:4px !important; padding-right:4px !important; }
    .ctt-endless-post { padding-top:58px; margin-top:58px; }
}

/* ==========================================================
   CTT v0.4 — one visual system on every screen
   ========================================================== */
:root {
    --ctt-paper: #ffffff;
    --ctt-card: #ffffff;
    --ctt-feed: 620px;
    --ctt-reading: 720px;
    --ctt-radius: 14px;
}
html, body, #qodef-page-wrapper, #qodef-page-outer, #qodef-page-inner,
#qodef-page-header, #qodef-page-mobile-header { background:#fff !important; }

/* One header/menu concept everywhere: logo at left, navigation hidden until logo click. */
#qodef-page-header,
#qodef-page-mobile-header {
    background:#fff !important;
    border:0 !important;
    box-shadow:none !important;
}
#qodef-page-header-inner,
#qodef-page-mobile-header-inner {
    min-height:64px !important;
    height:64px !important;
    padding:0 20px !important;
    justify-content:flex-start !important;
    align-items:center !important;
}
#qodef-page-header .qodef-header-logo-link,
#qodef-page-mobile-header .qodef-mobile-header-logo-link {
    cursor:pointer !important;
    margin:0 !important;
    position:relative !important;
    z-index:1003 !important;
}
#qodef-page-header .qodef-header-navigation,
#qodef-page-mobile-header .qodef-mobile-header-navigation {
    display:none !important;
    position:absolute !important;
    top:64px !important;
    left:20px !important;
    right:auto !important;
    width:min(340px, calc(100vw - 40px)) !important;
    padding:16px 18px 18px !important;
    background:#fff !important;
    border:1px solid var(--ctt-rule) !important;
    border-radius:12px !important;
    box-shadow:0 14px 40px rgba(0,0,0,.07) !important;
    z-index:1002 !important;
}
#qodef-page-header.ctt-menu-open .qodef-header-navigation,
#qodef-page-mobile-header.ctt-menu-open .qodef-mobile-header-navigation { display:block !important; }
#qodef-page-header .qodef-header-navigation > ul,
#qodef-page-mobile-header .qodef-mobile-header-navigation > ul { display:block !important; }
#qodef-page-header .qodef-header-navigation > ul > li,
#qodef-page-mobile-header .qodef-mobile-header-navigation > ul > li {
    display:block !important; float:none !important; margin:0 !important; padding:0 !important;
}
#qodef-page-header .qodef-header-navigation a,
#qodef-page-mobile-header .qodef-mobile-header-navigation a {
    display:block !important; padding:8px 0 !important; height:auto !important; line-height:1.35 !important;
    font-family:var(--ctt-display) !important; font-weight:400 !important;
}
.qodef-mobile-header-opener { display:none !important; }

/* Keep all homepage/list cards at the same restrained width on desktop and mobile. */
.qodef-blog.qodef--list > .qodef-grid-inner,
.qodef-blog.qodef--list .qodef-grid-inner,
.qodef-blog-list .qodef-grid-inner,
.qodef-blog.qodef-layout--masonry > .qodef-grid-inner,
.qodef-blog.qodef-layout--pinterest > .qodef-grid-inner {
    width:min(100%, var(--ctt-feed)) !important;
    max-width:var(--ctt-feed) !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

/* Henrik's lead/featured layouts use extra wrappers. Clip the entire visual stack as one card. */
.qodef-blog .qodef-blog-item,
.qodef-blog-list .qodef-blog-item,
.qodef-blog .qodef-blog-item .qodef-e-inner,
.qodef-blog-list .qodef-blog-item .qodef-e-inner {
    border-radius:var(--ctt-radius) !important;
    overflow:hidden !important;
}
.qodef-blog .qodef-blog-item .qodef-e-media,
.qodef-blog .qodef-blog-item .qodef-e-media-holder,
.qodef-blog .qodef-blog-item .qodef-e-media-image,
.qodef-blog .qodef-blog-item .qodef-e-media-image > a,
.qodef-blog .qodef-blog-item .qodef-e-image,
.qodef-blog .qodef-blog-item .qodef-e-image > a,
.qodef-blog-list .qodef-blog-item .qodef-e-media,
.qodef-blog-list .qodef-blog-item .qodef-e-media-holder,
.qodef-blog-list .qodef-blog-item .qodef-e-media-image,
.qodef-blog-list .qodef-blog-item .qodef-e-media-image > a {
    display:block !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    border-radius:var(--ctt-radius) var(--ctt-radius) 0 0 !important;
}
.qodef-blog .qodef-blog-item .qodef-e-media img,
.qodef-blog .qodef-blog-item .qodef-e-media-holder img,
.qodef-blog .qodef-blog-item .qodef-e-image img,
.qodef-blog-list .qodef-blog-item .qodef-e-media img {
    display:block !important;
    width:100% !important;
    max-width:none !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    border-radius:0 !important;
    transform:none !important;
    transition:none !important;
}
.qodef-blog .qodef-blog-item:hover img,
.qodef-blog-list .qodef-blog-item:hover img { transform:none !important; }

/* Center every bit of card copy, including lead/featured modules. */
.qodef-blog .qodef-blog-item .qodef-e-content,
.qodef-blog .qodef-blog-item .qodef-e-text,
.qodef-blog .qodef-blog-item .qodef-e-info,
.qodef-blog .qodef-blog-item .qodef-e-title,
.qodef-blog .qodef-blog-item .qodef-e-excerpt,
.qodef-blog-list .qodef-blog-item .qodef-e-content,
.qodef-blog-list .qodef-blog-item .qodef-e-text,
.qodef-blog-list .qodef-blog-item .qodef-e-info,
.qodef-blog-list .qodef-blog-item .qodef-e-title,
.qodef-blog-list .qodef-blog-item .qodef-e-excerpt {
    text-align:center !important;
    justify-content:center !important;
}

/* Single posts: hard-center the actual Henrik content column and remove all side content. */
.single-post #qodef-page-inner,
.single-post #qodef-page-content,
.single-post .qodef-content-grid,
.single-post .qodef-grid-inner,
.single-post .qodef-grid-item,
.single-post .qodef-blog.qodef--single,
.single-post .qodef-blog.qodef--single .qodef-blog-item,
.single-post .qodef-blog.qodef--single .qodef-e-inner {
    width:100% !important;
    max-width:var(--ctt-reading) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    float:none !important;
}
.single-post #qodef-page-content { padding-left:20px !important; padding-right:20px !important; box-sizing:border-box !important; }
.single-post #qodef-page-sidebar,
.single-post .qodef-page-sidebar-section,
.single-post .widget,
.single-post .qodef-search-form,
.single-post .qodef-blog-sidebar { display:none !important; }
.single-post .qodef-blog.qodef--single .qodef-e-title,
.single-post .qodef-blog.qodef--single .qodef-e-info { text-align:center !important; justify-content:center !important; }
.single-post .qodef-blog.qodef--single .qodef-e-content,
.single-post .qodef-blog.qodef--single .qodef-e-text,
.single-post .qodef-blog.qodef--single .qodef-e-text .entry-content { text-align:left !important; }
#ctt-endless-reading { width:100% !important; max-width:var(--ctt-reading) !important; padding:0 20px; box-sizing:border-box; }

@media only screen and (max-width:680px) {
    :root { --ctt-feed:620px; --ctt-reading:720px; }
    #qodef-page-inner { padding-left:14px !important; padding-right:14px !important; }
    #qodef-page-header-inner,
    #qodef-page-mobile-header-inner { padding-left:14px !important; padding-right:14px !important; }
    #qodef-page-header .qodef-header-navigation,
    #qodef-page-mobile-header .qodef-mobile-header-navigation {
        left:14px !important; width:calc(100vw - 28px) !important; max-width:340px !important;
    }
    .single-post #qodef-page-content,
    #ctt-endless-reading { padding-left:4px !important; padding-right:4px !important; }
}

/* ==========================================================
   CTT v0.5 — borderless masthead + article cards
   ========================================================== */
:root { --ctt-nav-gutter: 92px; }

/* The masthead is no longer a bar. It is only a logo/menu anchor. */
#qodef-page-header,
#qodef-page-mobile-header {
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    height:0 !important;
    min-height:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    z-index:1000 !important;
}
#qodef-page-header-inner,
#qodef-page-mobile-header-inner {
    position:relative !important;
    width:100% !important;
    max-width:none !important;
    height:0 !important;
    min-height:0 !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    background:transparent !important;
}

/* Desktop: the 3X/logo sits just to the left of the editorial column. */
#qodef-page-header .qodef-header-logo-link {
    position:absolute !important;
    top:92px !important;
    left:calc(50% - (var(--ctt-feed) / 2) - var(--ctt-nav-gutter)) !important;
    margin:0 !important;
}
#qodef-page-header .qodef-header-navigation {
    top:132px !important;
    left:calc(50% - (var(--ctt-feed) / 2) - var(--ctt-nav-gutter)) !important;
}

/* Remove every remaining Henrik header/sidebar trigger. */
.qodef-header-sticky,
.qodef-header-sticky-holder,
.qodef-side-area-opener,
.qodef-opener-icon.qodef-source--predefined,
#qodef-side-area,
.qodef-mobile-header-opener,
.qodef-header-navigation-opener { display:none !important; }

/* Give the content breathing room without drawing a masthead rectangle. */
#qodef-page-outer { padding-top:72px !important; }

/* The first/single article is a real card too. */
.single-post .qodef-blog.qodef--single .qodef-blog-item {
    width:100% !important;
    max-width:var(--ctt-reading) !important;
    margin:0 auto 54px !important;
    background:#fff !important;
    border:1px solid var(--ctt-rule) !important;
    border-radius:var(--ctt-radius) !important;
    overflow:hidden !important;
}
.single-post .qodef-blog.qodef--single .qodef-blog-item .qodef-e-inner {
    max-width:none !important;
    border-radius:inherit !important;
    overflow:hidden !important;
}
.single-post .qodef-blog.qodef--single .qodef-e-media,
.single-post .qodef-blog.qodef--single .qodef-e-media-image,
.single-post .qodef-blog.qodef--single .qodef-e-media-image > a {
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    border-radius:var(--ctt-radius) var(--ctt-radius) 0 0 !important;
    overflow:hidden !important;
}
.single-post .qodef-blog.qodef--single .qodef-e-media img {
    display:block !important;
    width:100% !important;
    max-width:none !important;
    height:auto !important;
    margin:0 !important;
    border-radius:0 !important;
}
.single-post .qodef-blog.qodef--single .qodef-e-content,
.single-post .qodef-blog.qodef--single .qodef-e-text {
    padding:28px 34px 38px !important;
    box-sizing:border-box !important;
}
.single-post .qodef-blog.qodef--single .qodef-e-title,
.single-post .qodef-blog.qodef--single .qodef-e-info { text-align:center !important; justify-content:center !important; }
.single-post .qodef-blog.qodef--single .entry-content { text-align:left !important; }

/* Every article loaded by endless reading is its own matching card. */
#ctt-endless-reading { max-width:var(--ctt-reading) !important; padding:0 !important; }
.ctt-endless-post {
    margin:54px auto !important;
    padding:0 !important;
    background:#fff !important;
    border:1px solid var(--ctt-rule) !important;
    border-radius:var(--ctt-radius) !important;
    overflow:hidden !important;
}
.ctt-endless-post__media {
    width:100% !important;
    margin:0 !important;
    border-radius:var(--ctt-radius) var(--ctt-radius) 0 0 !important;
}
.ctt-endless-post__media img { width:100% !important; height:auto !important; display:block !important; }
.ctt-endless-post__meta { margin:28px 34px 0 !important; }
.ctt-endless-post__title { margin:12px 34px 28px !important; }
.ctt-endless-post__content { padding:0 34px 38px !important; }

@media only screen and (max-width:900px) {
    /* Same visual idea on phones/tablets: no bar, just the logo at the left edge of the feed. */
    #qodef-page-header { display:none !important; }
    #qodef-page-mobile-header { display:block !important; }
    #qodef-page-mobile-header .qodef-mobile-header-logo-link {
        position:absolute !important;
        top:24px !important;
        left:14px !important;
        margin:0 !important;
    }
    #qodef-page-mobile-header .qodef-mobile-header-navigation {
        top:62px !important;
        left:14px !important;
        width:min(340px, calc(100vw - 28px)) !important;
    }
    #qodef-page-outer { padding-top:72px !important; }
    .single-post .qodef-blog.qodef--single .qodef-e-content,
    .single-post .qodef-blog.qodef--single .qodef-e-text { padding:22px 18px 28px !important; }
    .ctt-endless-post__meta { margin:22px 18px 0 !important; }
    .ctt-endless-post__title { margin:10px 18px 22px !important; }
    .ctt-endless-post__content { padding:0 18px 28px !important; }
}

/* ==========================================================
   CTT v0.5.1 — minimal patch from stable v0.5
   Sticky 3X navigation + separator cleanup only.
   ========================================================== */

/* Hide Henrik's own logo artwork. The navigation itself stays available for the 3X trigger. */
#qodef-page-header .qodef-header-logo-link,
#qodef-page-mobile-header .qodef-mobile-header-logo-link {
    visibility:hidden !important;
    pointer-events:none !important;
}

/* Independent 3X control. Fixed means it remains available while reading/scrolling. */
.ctt-sticky-nav {
    position:fixed;
    top:92px;
    left:calc((100vw - var(--ctt-feed)) / 4);
    transform:translateX(-50%);
    width:58px;
    height:58px;
    padding:0;
    margin:0;
    border:0;
    background:transparent;
    appearance:none;
    cursor:pointer;
    z-index:10020;
}
.ctt-sticky-nav img {
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
}

/* Remove Henrik's decorative black rules without touching CTT card outlines. */
hr,
.qodef-separator,
.qodef-separator-holder,
.qodef-m-separator,
.qodef-e-separator,
.qodef-section-title-line,
.qodef-title-line,
.qodef-line,
[class*="qodef-separator"] {
    border:0 !important;
    border-top:0 !important;
    border-bottom:0 !important;
    box-shadow:none !important;
    background-image:none !important;
}
.qodef-separator:before,
.qodef-separator:after,
.qodef-separator-holder:before,
.qodef-separator-holder:after,
.qodef-m-separator:before,
.qodef-m-separator:after,
.qodef-e-separator:before,
.qodef-e-separator:after,
.qodef-section-title-line:before,
.qodef-section-title-line:after,
.qodef-title-line:before,
.qodef-title-line:after {
    display:none !important;
    content:none !important;
}

@media only screen and (max-width:900px) {
    .ctt-sticky-nav {
        top:24px;
        left:14px;
        transform:none;
        width:48px;
        height:48px;
    }
}


/* ==========================================================
   CTT v0.5.2 — stable v0.5 line
   River Mono + centered home mark + back-to-top.
   ========================================================== */

@font-face {
    font-family: "CTT River Mono";
    src: url("assets/fonts/RiverMono-VF.ttf") format("truetype");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

:root { --ctt-display: "CTT River Mono", monospace; }

/* Retire the sticky/dropdown trigger from 0.5.1. */
.ctt-sticky-nav { display:none !important; }

/* The 3X is now a quiet masthead mark and simple Home link. */
.ctt-home-mark-wrap {
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    padding:28px 18px 18px;
    box-sizing:border-box;
    position:relative;
    z-index:20;
}
.ctt-home-mark {
    display:block;
    width:62px;
    height:62px;
    padding:0;
    margin:0;
    border:0;
    background:transparent;
    text-decoration:none;
}
.ctt-home-mark img {
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
}

/* Henrik's visual header remains out of the way. */
#qodef-page-header,
#qodef-page-mobile-header { border:0 !important; box-shadow:none !important; }

/* Page content no longer needs room reserved for the old floating logo. */
#qodef-page-outer { padding-top:0 !important; }

/* Small utility only after the reader has actually scrolled. */
.ctt-back-to-top {
    position:fixed;
    right:18px;
    bottom:18px;
    width:42px;
    height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid var(--ctt-rule);
    border-radius:50%;
    background:#fff;
    color:var(--ctt-ink);
    font-family:"CTT River Mono", monospace;
    font-size:19px;
    line-height:1;
    cursor:pointer;
    z-index:10010;
    opacity:0;
    visibility:hidden;
    transform:translateY(8px);
    transition:opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.ctt-back-to-top.ctt-is-visible {
    opacity:1;
    visibility:visible;
    transform:none;
}

@media only screen and (max-width:900px) {
    .ctt-home-mark-wrap { padding:20px 14px 12px; }
    .ctt-home-mark { width:52px; height:52px; }
    #qodef-page-outer { padding-top:0 !important; }
    .ctt-back-to-top { right:14px; bottom:14px; width:40px; height:40px; }
}

/* ==========================================================
   CTT v0.5.3 — Full River typography
   Keep Henrik's sizing/layout controls, but make River Mono
   the typeface across editorial content and interface text.
   ========================================================== */
html,
body,
body p,
body a,
body span,
body li,
body div,
body button,
body input,
body textarea,
body select,
body label,
body blockquote,
body cite,
body figcaption,
body table,
body th,
body td,
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body .qodef-h1,
body .qodef-h2,
body .qodef-h3,
body .qodef-h4,
body .qodef-h5,
body .qodef-h6 {
    font-family: "CTT River Mono", monospace !important;
}

/* ==========================================================
   CTT v0.5.4 — tighter editorial scale + circular author image
   ========================================================== */
:root {
    /* Roughly 15% tighter than the v0.5.3 desktop canvas. */
    --ctt-feed: 527px;
    --ctt-reading: 612px;
}

/* Keep list/card and single-post canvases consistently centered at the new scale. */
.qodef-blog.qodef--list > .qodef-grid-inner,
.qodef-blog.qodef--list .qodef-grid-inner.qodef--masonry-init,
.qodef-blog-list .qodef-grid-inner {
    width: 100% !important;
    max-width: var(--ctt-feed) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
.single-post #qodef-page-content,
.single-post #qodef-page-content > .qodef-grid-inner,
.single-post .qodef-page-content-section,
.single-post .qodef-blog.qodef--single,
.single-post .qodef-blog.qodef--single .qodef-e-inner,
#ctt-endless-reading {
    max-width: var(--ctt-reading) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Henrik's author portrait is asymmetrically rounded by default. Make it a true avatar. */
#qodef-author-info .qodef-m-image {
    width: 76px !important;
    height: 76px !important;
    flex: 0 0 76px !important;
    overflow: hidden !important;
    border-radius: 50% !important;
}
#qodef-author-info .qodef-m-image a {
    width: 100% !important;
    height: 100% !important;
    border-radius: 50% !important;
    overflow: hidden !important;
}
#qodef-author-info .qodef-m-image img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 50% !important;
}

/* Preserve comfortable phone sizing instead of making the already-compact mobile feed tiny. */
@media only screen and (max-width: 680px) {
    :root {
        --ctt-feed: 100%;
        --ctt-reading: 100%;
    }
    #qodef-author-info .qodef-m-image {
        width: 64px !important;
        height: 64px !important;
        flex-basis: 64px !important;
        margin-right: 20px !important;
    }
}

/* ==========================================================
   CTT v0.5.5 — River light typography refinement
   Typography-only refinement. Preserve v0.5.4 layout.
   ========================================================== */
html,
body,
body p,
body a,
body span,
body li,
body div,
body button,
body input,
body textarea,
body select,
body label,
body blockquote,
body cite,
body figcaption,
body table,
body th,
body td {
    font-family: "CTT River Mono", monospace !important;
    font-weight: 300 !important;
}

/* Keep hierarchy quiet: titles gain only a little weight. */
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body .qodef-h1,
body .qodef-h2,
body .qodef-h3,
body .qodef-h4,
body .qodef-h5,
body .qodef-h6,
body .qodef-e-title,
body .entry-title {
    font-family: "CTT River Mono", monospace !important;
    font-weight: 400 !important;
}

/* River-like compact card typography on larger screens. */
@media only screen and (min-width: 681px) {
    .qodef-blog.qodef--list .qodef-e-content,
    .qodef-blog-list .qodef-e-content {
        font-size: 14px !important;
        line-height: 1.55 !important;
    }
    .qodef-blog.qodef--list .qodef-e-title,
    .qodef-blog-list .qodef-e-title {
        font-size: 15px !important;
        line-height: 1.4 !important;
    }
    .qodef-blog.qodef--list .qodef-e-info,
    .qodef-blog-list .qodef-e-info,
    .qodef-blog.qodef--list .qodef-e-info-item,
    .qodef-blog-list .qodef-e-info-item {
        font-size: 12px !important;
        line-height: 1.45 !important;
        font-weight: 300 !important;
    }
}

/* Article copy stays readable, but loses Henrik's heavier feel. */
.single-post .qodef-e-content,
.single-post .qodef-e-content p,
.single-post .qodef-blog-item-content,
.single-post .qodef-blog-item-content p,
#ctt-endless-reading,
#ctt-endless-reading p {
    font-weight: 300 !important;
    line-height: 1.65 !important;
}

/* Author portrait: keep the circular crop, restore visual presence. */
#qodef-author-info .qodef-m-image {
    width: 120px !important;
    height: 120px !important;
    flex: 0 0 120px !important;
}
@media only screen and (max-width: 680px) {
    #qodef-author-info .qodef-m-image {
        width: 100px !important;
        height: 100px !important;
        flex-basis: 100px !important;
    }
}

/* ==========================================================
   CTT v0.5.6 — River native-weight editorial system
   RiverMono-VF supports wght 400–700. Use its true 400 floor,
   then create the lighter River feel through scale + spacing.
   ========================================================== */
html,
body {
    font-family: "CTT River Mono", monospace !important;
    font-weight: 400 !important;
    font-variation-settings: "wght" 400, "ital" 0 !important;
    font-size: 13px !important;
    line-height: 1.68 !important;
    letter-spacing: 0.005em !important;
}

/* Reset the impossible 300 request from v0.5.5 everywhere. */
body p,
body a,
body span,
body li,
body div,
body button,
body input,
body textarea,
body select,
body label,
body blockquote,
body cite,
body figcaption,
body table,
body th,
body td,
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body .qodef-h1,
body .qodef-h2,
body .qodef-h3,
body .qodef-h4,
body .qodef-h5,
body .qodef-h6,
body .qodef-e-title,
body .entry-title {
    font-family: "CTT River Mono", monospace !important;
    font-weight: 400 !important;
    font-variation-settings: "wght" 400, "ital" 0 !important;
}

/* Feed: small, quiet, and deliberately open. */
.qodef-blog.qodef--list .qodef-e-content,
.qodef-blog-list .qodef-e-content,
.qodef-blog.qodef--list .qodef-e-excerpt,
.qodef-blog-list .qodef-e-excerpt {
    font-size: 13px !important;
    line-height: 1.68 !important;
    letter-spacing: 0.005em !important;
}
.qodef-blog.qodef--list .qodef-e-title,
.qodef-blog-list .qodef-e-title,
.qodef-blog.qodef--list .qodef-e-title a,
.qodef-blog-list .qodef-e-title a {
    font-size: 14px !important;
    line-height: 1.48 !important;
    letter-spacing: 0 !important;
}
.qodef-blog.qodef--list .qodef-e-info,
.qodef-blog-list .qodef-e-info,
.qodef-blog.qodef--list .qodef-e-info-item,
.qodef-blog-list .qodef-e-info-item,
.qodef-blog.qodef--list .qodef-e-info a,
.qodef-blog-list .qodef-e-info a {
    font-size: 11px !important;
    line-height: 1.5 !important;
    letter-spacing: 0.015em !important;
}

/* Single stories: keep hierarchy without the oversized magazine feel. */
.single-post .qodef-e-title,
.single-post .entry-title,
.single-post h1.qodef-e-title,
.single-post .qodef-blog-item-title {
    font-size: 20px !important;
    line-height: 1.38 !important;
    letter-spacing: -0.005em !important;
}
.single-post .qodef-e-content,
.single-post .qodef-e-content p,
.single-post .qodef-blog-item-content,
.single-post .qodef-blog-item-content p,
#ctt-endless-reading,
#ctt-endless-reading p {
    font-size: 13px !important;
    line-height: 1.72 !important;
    letter-spacing: 0.005em !important;
    font-weight: 400 !important;
    font-variation-settings: "wght" 400, "ital" 0 !important;
}
.single-post .qodef-e-content p,
.single-post .qodef-blog-item-content p,
#ctt-endless-reading p {
    margin-bottom: 1.55em !important;
}

/* Keep the author portrait size that worked in v0.5.5. */
#qodef-author-info .qodef-m-image {
    width: 120px !important;
    height: 120px !important;
    flex: 0 0 120px !important;
}

@media only screen and (max-width: 680px) {
    html,
    body { font-size: 13px !important; }

    .qodef-blog.qodef--list .qodef-e-title,
    .qodef-blog-list .qodef-e-title,
    .qodef-blog.qodef--list .qodef-e-title a,
    .qodef-blog-list .qodef-e-title a {
        font-size: 14px !important;
    }

    .single-post .qodef-e-title,
    .single-post .entry-title,
    .single-post h1.qodef-e-title,
    .single-post .qodef-blog-item-title {
        font-size: 18px !important;
        line-height: 1.42 !important;
    }

    #qodef-author-info .qodef-m-image {
        width: 100px !important;
        height: 100px !important;
        flex-basis: 100px !important;
    }
}


/* CTT v0.5.7 — card title sizing only. */
.qodef-blog.qodef--list .qodef-e-title,
.qodef-blog-list .qodef-e-title,
.qodef-blog.qodef--list .qodef-e-title a,
.qodef-blog-list .qodef-e-title a {
    font-size: 12px !important;
    line-height: 1.4 !important;
}

@media only screen and (max-width: 680px) {
    .qodef-blog.qodef--list .qodef-e-title,
    .qodef-blog-list .qodef-e-title,
    .qodef-blog.qodef--list .qodef-e-title a,
    .qodef-blog-list .qodef-e-title a {
        font-size: 12px !important;
        line-height: 1.4 !important;
    }
}

/* CTT v0.5.8 — Henrik card-title selector fix.
   Target the heading and its actual nested link across Henrik/Qode blog-list variants. */
body:not(.single-post) .qodef-blog-item .qodef-e-title,
body:not(.single-post) .qodef-blog-item .qodef-e-title a,
body:not(.single-post) .qodef-blog-item .qodef-e-title-link,
body:not(.single-post) .qodef-blog-item h1.qodef-e-title,
body:not(.single-post) .qodef-blog-item h1.qodef-e-title a,
body:not(.single-post) .qodef-blog-item h2.qodef-e-title,
body:not(.single-post) .qodef-blog-item h2.qodef-e-title a,
body:not(.single-post) .qodef-blog-item h3.qodef-e-title,
body:not(.single-post) .qodef-blog-item h3.qodef-e-title a,
body:not(.single-post) .qodef-blog .qodef-blog-item .qodef-e-title,
body:not(.single-post) .qodef-blog .qodef-blog-item .qodef-e-title a,
body:not(.single-post) .qodef-blog-list .qodef-blog-item .qodef-e-title,
body:not(.single-post) .qodef-blog-list .qodef-blog-item .qodef-e-title a {
    font-family: "RiverMono", monospace !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    font-weight: 400 !important;
    font-variation-settings: "wght" 400, "ital" 0 !important;
    letter-spacing: 0 !important;
}

/* CTT v0.5.9 — River visual-density pass.
   River Mono's lightest real weight is 400, so the River.site feel comes from
   smaller sizing, softer ink, open leading, and restrained tracking. */
html, body,
body p,
body li,
body dd,
body dt,
body blockquote,
body figcaption,
body .qodef-page-content,
body .qodef-e-content,
body .qodef-e-excerpt,
.single-post .qodef-e-content,
.single-post .qodef-e-content p,
.single-post .qodef-blog-item-content,
.single-post .qodef-blog-item-content p,
#ctt-endless-reading,
#ctt-endless-reading p {
    font-family: "CTT River Mono", monospace !important;
    font-weight: 400 !important;
    font-variation-settings: "wght" 400, "ital" 0 !important;
    font-synthesis: none !important;
    font-size: 12.5px !important;
    line-height: 1.68 !important;
    letter-spacing: 0.012em !important;
    color: #565656 !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Keep titles crisp and dark, but use the real River face (v0.5.8 accidentally
   referenced a non-existent RiverMono family and could fall back to monospace). */
body:not(.single-post) .qodef-blog-item .qodef-e-title,
body:not(.single-post) .qodef-blog-item .qodef-e-title a,
body:not(.single-post) .qodef-blog-item .qodef-e-title-link,
body:not(.single-post) .qodef-blog-item h1.qodef-e-title,
body:not(.single-post) .qodef-blog-item h1.qodef-e-title a,
body:not(.single-post) .qodef-blog-item h2.qodef-e-title,
body:not(.single-post) .qodef-blog-item h2.qodef-e-title a,
body:not(.single-post) .qodef-blog-item h3.qodef-e-title,
body:not(.single-post) .qodef-blog-item h3.qodef-e-title a,
body:not(.single-post) .qodef-blog .qodef-blog-item .qodef-e-title,
body:not(.single-post) .qodef-blog .qodef-blog-item .qodef-e-title a,
body:not(.single-post) .qodef-blog-list .qodef-blog-item .qodef-e-title,
body:not(.single-post) .qodef-blog-list .qodef-blog-item .qodef-e-title a {
    font-family: "CTT River Mono", monospace !important;
    font-size: 12px !important;
    line-height: 1.42 !important;
    font-weight: 400 !important;
    font-variation-settings: "wght" 400, "ital" 0 !important;
    font-synthesis: none !important;
    letter-spacing: 0.005em !important;
    color: #333 !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Metadata should recede like River's small UI labels. */
body .qodef-e-info,
body .qodef-e-info *,
body .qodef-e-info a,
body .qodef-e-info-category a {
    font-family: "CTT River Mono", monospace !important;
    font-size: 10.5px !important;
    line-height: 1.5 !important;
    font-weight: 400 !important;
    font-variation-settings: "wght" 400, "ital" 0 !important;
    letter-spacing: 0.025em !important;
    color: #777 !important;
}

/* Preserve headline hierarchy without making the reading text feel heavy. */
.single-post .qodef-e-title,
.single-post .entry-title,
.single-post h1.qodef-e-title,
.single-post .qodef-blog-item-title {
    font-family: "CTT River Mono", monospace !important;
    font-weight: 400 !important;
    font-variation-settings: "wght" 400, "ital" 0 !important;
    font-synthesis: none !important;
    color: #222 !important;
}

.single-post .qodef-e-content p,
.single-post .qodef-blog-item-content p,
#ctt-endless-reading p {
    margin-bottom: 1.7em !important;
}

@media only screen and (max-width: 680px) {
    html, body,
    body p,
    body li,
    .single-post .qodef-e-content,
    .single-post .qodef-e-content p,
    .single-post .qodef-blog-item-content,
    .single-post .qodef-blog-item-content p,
    #ctt-endless-reading,
    #ctt-endless-reading p {
        font-size: 12.5px !important;
        line-height: 1.68 !important;
    }
}


/* ==========================================================
   CTT v6.0 STABLE — final consistency polish
   Cosmetic only: single-post masthead spacing, softer author
   rules, and endless-reader title typography parity.
   ========================================================== */

/* On story pages, let the 3X sit lower in the opening whitespace while
   keeping it close to the article card that follows. */
.single-post .ctt-home-mark-wrap {
    padding-top: 58px !important;
    padding-bottom: 8px !important;
}

/* Soften only the author-module rules. Do not alter card outlines. */
.single-post #qodef-author-info,
.single-post .qodef-author-info,
.single-post #qodef-author-info .qodef-m-inner,
.single-post .qodef-author-info .qodef-m-inner {
    border-top-color: rgba(86, 86, 86, .45) !important;
    border-bottom-color: rgba(86, 86, 86, .45) !important;
}
.single-post #qodef-author-info::before,
.single-post #qodef-author-info::after,
.single-post .qodef-author-info::before,
.single-post .qodef-author-info::after {
    border-color: rgba(86, 86, 86, .45) !important;
    background-color: rgba(86, 86, 86, .45) !important;
}

/* AJAX/endless stories must use the same River title treatment as the
   first single story instead of falling back to Henrik's h2 defaults. */
.single-post #ctt-endless-reading .ctt-endless-post__title,
.single-post #ctt-endless-reading .ctt-endless-post__title a {
    font-family: "CTT River Mono", monospace !important;
    font-size: 20px !important;
    line-height: 1.38 !important;
    font-weight: 400 !important;
    font-variation-settings: "wght" 400, "ital" 0 !important;
    font-synthesis: none !important;
    letter-spacing: -0.005em !important;
    color: #222 !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

@media only screen and (max-width: 680px) {
    .single-post .ctt-home-mark-wrap {
        padding-top: 34px !important;
        padding-bottom: 6px !important;
    }
    .single-post #ctt-endless-reading .ctt-endless-post__title,
    .single-post #ctt-endless-reading .ctt-endless-post__title a {
        font-size: 18px !important;
        line-height: 1.42 !important;
    }
}

/* CTT v6.0.1 FINAL STABLE — single-post logo balance only.
   Move the 3X into the visual midpoint of the opening whitespace without
   changing the article/card position or any other layout geometry. */
.single-post .ctt-home-mark-wrap {
    transform: translateY(42px) !important;
}


/* ==========================================================
   CTT v6.1 — endless-reading soft arrival
   Animation experiment only. The initial article is untouched.
   ========================================================== */
.single-post #ctt-endless-reading .ctt-story-enter {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 680ms ease, transform 680ms ease;
    will-change: opacity, transform;
}

.single-post #ctt-endless-reading .ctt-story-enter.ctt-story-enter-active {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    .single-post #ctt-endless-reading .ctt-story-enter,
    .single-post #ctt-endless-reading .ctt-story-enter.ctt-story-enter-active {
        opacity: 1;
        transform: none;
        transition: none;
    }
}


/* ==========================================================
   CTT v6.1.1 — homepage arrival + mobile back-to-top alignment
   Animation/polish only. Stable v6.0.1 geometry remains intact.
   ========================================================== */

/* Apply the same soft fade/rise to cards appended by Henrik's
   homepage infinite scroll. Existing cards are intentionally untouched. */
body:not(.single-post) .ctt-feed-enter {
    opacity: 0;
    transform: translateY(24px) !important;
    transition: opacity 680ms ease, transform 680ms ease !important;
    will-change: opacity, transform;
}

body:not(.single-post) .ctt-feed-enter.ctt-feed-enter-active {
    opacity: 1;
    transform: translateY(0) !important;
}

/* On phones, deliberately center the circular control on the right
   border of the single-post card instead of leaving it almost aligned. */
@media only screen and (max-width: 680px) {
    .single-post .ctt-back-to-top {
        right: -2px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    body:not(.single-post) .ctt-feed-enter,
    body:not(.single-post) .ctt-feed-enter.ctt-feed-enter-active {
        opacity: 1;
        transform: none !important;
        transition: none !important;
    }
}

/* ==========================================================
   CTT v6.1.2 — viewport reveals + mobile control balance
   Cosmetic/animation only. No card or article geometry changes.
   ========================================================== */

/* Homepage cards are revealed when they actually enter the viewport,
   regardless of whether Henrik inserted/preloaded them earlier. */
body:not(.single-post) .ctt-feed-enter {
    opacity: 0;
    transform: translateY(24px) !important;
    transition: opacity 680ms ease, transform 680ms ease !important;
    will-change: opacity, transform;
}
body:not(.single-post) .ctt-feed-enter.ctt-feed-enter-active {
    opacity: 1;
    transform: translateY(0) !important;
}

@media only screen and (max-width: 680px) {
    /* Keep the 3X visually centered in the opening white field on phones.
       v6.0.1's desktop translate remains untouched. */
    .single-post .ctt-home-mark-wrap {
        transform: translateY(0) !important;
        padding-top: 46px !important;
        padding-bottom: 24px !important;
    }

    /* Smaller and safely inset so the circle never clips off-screen. */
    .single-post .ctt-back-to-top {
        width: 34px !important;
        height: 34px !important;
        right: 8px !important;
        bottom: 14px !important;
        font-size: 16px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    body:not(.single-post) .ctt-feed-enter,
    body:not(.single-post) .ctt-feed-enter.ctt-feed-enter-active {
        opacity: 1;
        transform: none !important;
        transition: none !important;
    }
}


/* ==========================================================
   CTT v6.1.3 — mobile reveal paint fix + smaller top control
   Animation/control polish only.
   ========================================================== */

@media only screen and (max-width: 680px) {
    /* Mobile Safari needs a paintable transition state before reveal. */
    body:not(.single-post) .ctt-feed-enter {
        opacity: 0 !important;
        transform: translate3d(0, 24px, 0) !important;
        transition: opacity 680ms ease, transform 680ms ease !important;
        backface-visibility: hidden;
    }
    body:not(.single-post) .ctt-feed-enter.ctt-feed-enter-active {
        opacity: 1 !important;
        transform: translate3d(0, 0, 0) !important;
    }

    /* Keep the control fully inside the viewport/card edge on phones. */
    .single-post .ctt-back-to-top {
        width: 30px !important;
        height: 30px !important;
        right: 14px !important;
        bottom: 16px !important;
        font-size: 14px !important;
    }
}

/* ==========================================================
   CTT v6.1.4 — mobile wipe reveal + exact card-edge control
   Mobile-only polish. Desktop animation remains unchanged.
   ========================================================== */
@media only screen and (max-width: 680px) {
    /* Safari-friendly reveal: animate a clipping mask instead of opacity. */
    body:not(.single-post) .ctt-feed-enter {
        opacity: 1 !important;
        transform: none !important;
        -webkit-clip-path: inset(100% 0 0 0 round 10px);
        clip-path: inset(100% 0 0 0 round 10px);
        transition: -webkit-clip-path 580ms cubic-bezier(.22,.61,.36,1), clip-path 580ms cubic-bezier(.22,.61,.36,1) !important;
        will-change: clip-path;
    }
    body:not(.single-post) .ctt-feed-enter.ctt-feed-enter-active {
        opacity: 1 !important;
        transform: none !important;
        -webkit-clip-path: inset(0 0 0 0 round 10px);
        clip-path: inset(0 0 0 0 round 10px);
    }

    /* JS sets left from the real article-card border. */
    .single-post .ctt-back-to-top {
        width: 28px !important;
        height: 28px !important;
        right: auto !important;
        bottom: 16px !important;
        font-size: 13px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    body:not(.single-post) .ctt-feed-enter,
    body:not(.single-post) .ctt-feed-enter.ctt-feed-enter-active {
        -webkit-clip-path: none !important;
        clip-path: none !important;
    }
}

/* ==========================================================
   CTT v6.1.5 — FADE REDEMPTION
   Revert the mobile wipe completely. Keep exact back-to-top
   positioning from v6.1.4. Mobile and desktop use the same
   soft fade/rise language again.
   ========================================================== */
@media only screen and (max-width: 680px) {
    body:not(.single-post) .ctt-feed-enter {
        -webkit-clip-path: none !important;
        clip-path: none !important;
        opacity: 0 !important;
        transform: translate3d(0, 20px, 0) !important;
        transition: opacity 680ms ease, transform 680ms ease !important;
        will-change: opacity, transform;
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden;
    }

    body:not(.single-post) .ctt-feed-enter.ctt-feed-enter-active {
        -webkit-clip-path: none !important;
        clip-path: none !important;
        opacity: 1 !important;
        transform: translate3d(0, 0, 0) !important;
    }

    /* Preserve the v6.1.4 card-edge positioning fix. JS owns left. */
    .single-post .ctt-back-to-top {
        width: 28px !important;
        height: 28px !important;
        right: auto !important;
        bottom: 16px !important;
        font-size: 13px !important;
    }
}


/* ==========================================================
   CTT v6.1.6 — arrow glyph alignment only
   Preserve v6.1.5 animation and button position exactly.
   ========================================================== */
@media only screen and (max-width: 680px) {
    .single-post .ctt-back-to-top-glyph {
        display: inline-block;
        transform: translateX(1.5px);
    }
}

/* ==========================================================
   CTT v6.1.7 — footer icon font recovery + clean logo touch
   No layout, animation, arrow, or typography changes.
   ========================================================== */

/* River is the site typeface, but icon glyphs must stay in Font Awesome.
   Henrik/Qode may output either the legacy FA family or FA5 family names. */
.qodef-social-icons-group .fa,
.qodef-social-icons-group .fas,
.qodef-social-icons-group .far,
.qodef-social-icons-group .fab,
.qodef-social-icons-group [class^="fa-"],
.qodef-social-icons-group [class*=" fa-"],
.qodef-social-icons-group .qodef-icon-font-awesome,
.qodef-social-icons-group .qodef-icon-font-awesome span,
.qodef-social-icons-group .qodef-icon-font-awesome i,
footer .fa,
footer .fas,
footer .far,
footer .fab,
footer [class^="fa-"],
footer [class*=" fa-"] {
    font-family: "Font Awesome 5 Free", "Font Awesome 5 Brands", "FontAwesome" !important;
    font-variation-settings: normal !important;
    font-synthesis: auto !important;
}
.qodef-social-icons-group .fas,
.qodef-social-icons-group .fa,
footer .fas,
footer .fa {
    font-weight: 900 !important;
}
.qodef-social-icons-group .far,
.qodef-social-icons-group .fab,
footer .far,
footer .fab {
    font-weight: 400 !important;
}

/* Keep the transparent 3X artwork visually clean during touch/hold/selection. */
.ctt-home-mark,
.ctt-home-mark img {
    -webkit-tap-highlight-color: transparent !important;
    -webkit-touch-callout: none !important;
    -webkit-user-select: none !important;
    user-select: none !important;
}
.ctt-home-mark img {
    -webkit-user-drag: none !important;
    user-drag: none !important;
}
.ctt-home-mark:focus,
.ctt-home-mark:active,
.ctt-home-mark img:focus,
.ctt-home-mark img:active {
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* CTT v6.1.10: endless-reader mobile geometry.
   #ctt-endless-reading is inserted after #qodef-page-content, so it does not
   inherit the single-post content container's 4px mobile side padding.
   Mirror that exact inset here so appended stories share the original post's
   left and right edges. */
@media only screen and (max-width:680px) {
    #ctt-endless-reading {
        width:100% !important;
        max-width:var(--ctt-reading) !important;
        padding-left:4px !important;
        padding-right:4px !important;
        box-sizing:border-box !important;
    }
}

/* ==========================================================
   CTT v6.1.12 — remove article sharing UI globally
   Preserve v6.1.10 geometry, animation, typography and controls.
   ========================================================== */
.single-post .qodef-social-share,
.single-post .qodef-social-share-holder,
.single-post .qodef-social-share-holder-inner,
.single-post .qodef-blog-share,
.single-post .qodef-e-share,
.single-post .qodef-e-info-share,
.single-post .qodef-e-info-item.qodef--share,
.single-post .qodef-e-info-item.qodef--social-share,
.single-post [class*="qodef-social-share"],
.single-post [class*="qodef-blog-share"] {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

/* ==========================================================
   CTT v6.1.13 — remove sharing UI everywhere, including the
   homepage featured-post card. Henrik renders that card outside
   .single-post, so the v6.1.12 scope could not reach it.
   ========================================================== */
.qodef-social-share,
.qodef-social-share-holder,
.qodef-social-share-holder-inner,
.qodef-blog-share,
.qodef-e-share,
.qodef-e-info-share,
.qodef-e-info-item.qodef--share,
.qodef-e-info-item.qodef--social-share,
[class*="qodef-social-share"],
[class*="qodef-blog-share"] {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
}

/* ==========================================================
   CTT v6.1.18 — masonry featured marker
   Masonry handles featured-image geometry natively. Keep only
   the editorial featured marker, attached by ctt.js to the
   first real homepage post card.
   ========================================================== */
body.home .ctt-featured-card .qodef-e-excerpt::before {
    content: "\f005";
    display: block;
    width: 100%;
    margin: 0 auto 18px;
    text-align: center;
    font-family: "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    font-style: normal !important;
    font-size: 15px !important;
    line-height: 1;
    letter-spacing: 0;
    color: #111;
    font-variation-settings: normal !important;
}

/* ==========================================================
   CTT v6.1.20 — WordPress block text alignment compatibility
   Preserve CTT's left-aligned article default while allowing
   explicit editor alignment on individual body blocks.
   ========================================================== */
.single-post .entry-content .has-text-align-center,
.single-post .qodef-e-text .has-text-align-center,
.single-post .qodef-blog-item-content .has-text-align-center,
#ctt-endless-reading .has-text-align-center,
.ctt-endless-post__content .has-text-align-center,
.single-post .entry-content [style*="text-align: center"],
.single-post .qodef-e-text [style*="text-align: center"],
.single-post .qodef-blog-item-content [style*="text-align: center"],
#ctt-endless-reading [style*="text-align: center"],
.ctt-endless-post__content [style*="text-align: center"] {
    text-align: center !important;
}

.single-post .entry-content .has-text-align-right,
.single-post .qodef-e-text .has-text-align-right,
.single-post .qodef-blog-item-content .has-text-align-right,
#ctt-endless-reading .has-text-align-right,
.ctt-endless-post__content .has-text-align-right,
.single-post .entry-content [style*="text-align: right"],
.single-post .qodef-e-text [style*="text-align: right"],
.single-post .qodef-blog-item-content [style*="text-align: right"],
#ctt-endless-reading [style*="text-align: right"],
.ctt-endless-post__content [style*="text-align: right"] {
    text-align: right !important;
}

.single-post .entry-content .has-text-align-left,
.single-post .qodef-e-text .has-text-align-left,
.single-post .qodef-blog-item-content .has-text-align-left,
#ctt-endless-reading .has-text-align-left,
.ctt-endless-post__content .has-text-align-left,
.single-post .entry-content [style*="text-align: left"],
.single-post .qodef-e-text [style*="text-align: left"],
.single-post .qodef-blog-item-content [style*="text-align: left"],
#ctt-endless-reading [style*="text-align: left"],
.ctt-endless-post__content [style*="text-align: left"] {
    text-align: left !important;
}

/* ==========================================================
   CTT v6.1.21 — WordPress bold/strong compatibility
   River Mono supports a true 700 weight. Restore intentional
   editor bolding inside article body text without changing the
   default 400-weight reading typography.
   ========================================================== */
.single-post .entry-content strong,
.single-post .entry-content b,
.single-post .qodef-e-text strong,
.single-post .qodef-e-text b,
.single-post .qodef-blog-item-content strong,
.single-post .qodef-blog-item-content b,
#ctt-endless-reading strong,
#ctt-endless-reading b,
.ctt-endless-post__content strong,
.ctt-endless-post__content b {
    font-family: "CTT River Mono", monospace !important;
    font-weight: 700 !important;
    font-variation-settings: "wght" 700, "ital" 0 !important;
    font-synthesis: none !important;
}

/* ==========================================================
   CTT v6.1.22 — masthead parity + clean clickable touch
   Match the homepage 3X masthead geometry to single posts and
   suppress browser tap/callout shading on interactive elements.
   Article text selection, animations, typography, card geometry,
   endless reading, and back-to-top positioning remain untouched.
   ========================================================== */

/* Homepage/archive masthead: use the same balance as single posts. */
body:not(.single-post) .ctt-home-mark-wrap {
    padding-top: 58px !important;
    padding-bottom: 8px !important;
    transform: translateY(42px) !important;
}

@media only screen and (max-width: 680px) {
    body:not(.single-post) .ctt-home-mark-wrap {
        transform: translateY(0) !important;
        padding-top: 46px !important;
        padding-bottom: 24px !important;
    }
}

/* Remove Safari/iOS tap-selection shading from clickable UI only.
   Keyboard focus treatment is intentionally preserved for accessibility. */
a,
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
[role="button"],
[tabindex][onclick] {
    -webkit-tap-highlight-color: transparent !important;
    -webkit-touch-callout: none !important;
}

a,
a *,
button,
button *,
[role="button"],
[role="button"] * {
    -webkit-user-select: none !important;
    user-select: none !important;
}

a img,
button img,
[role="button"] img {
    -webkit-user-drag: none !important;
    user-drag: none !important;
}


/* ==========================================================
   CTT v6.1.23 — desktop homepage masthead rhythm
   Desktop homepage only: preserve the v6.1.22 3X position and
   add the missing flow-space beneath it so the logo-to-card gap
   matches the single-post opening. Mobile remains untouched.
   ========================================================== */
@media only screen and (min-width: 681px) {
    body.home .ctt-home-mark-wrap {
        margin-bottom: 106px !important;
    }
}


/* ==========================================================
   CTT v6.1.24 — desktop featured-card scale
   Keep the 4:5 media ratio and mobile presentation intact.
   Desktop homepage only: make the lead card slightly narrower
   and keep it centered within the existing editorial feed.
   ========================================================== */
@media only screen and (min-width: 681px) {
    body.home .ctt-featured-card {
        width: 100% !important;
        max-width: 500px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* ==========================================================
   CTT v6.1.27 — precise desktop featured centering
   Keep the v6.1.26 viewport-fit size, but do not use transform
   for centering because the feed reveal animation owns transform.
   ctt.js measures the rendered card and centers it to the viewport.
   Mobile and all subsequent cards remain untouched.
   ========================================================== */
@media only screen and (min-width: 681px) {
    body.home .ctt-featured-card {
        box-sizing: border-box !important;
        width: min(320px, calc((100vh - 300px) * 0.52)) !important;
        max-width: 320px !important;
        min-width: 280px !important;
        position: relative !important;
        left: auto !important;
        margin-right: 0 !important;
    }
}


/* ==========================================================
   CTT v6.2.2 — Reading Time Only
   ========================================================== */
.ctt-reading-time {
    display: inline !important;
    font: inherit !important;
    font-weight: 400 !important;
    letter-spacing: inherit !important;
    color: inherit !important;
    white-space: nowrap;
}


/* ==========================================================
   CTT v6.2.3 — featured marker hierarchy
   Move the existing star above the featured excerpt so the
   card reads title -> star -> excerpt. No other card changes.
   ========================================================== */

/* ==========================================================
   CTT v6.2.4 — hide post tags from the reader-facing UI
   Tags remain available in WordPress for internal organization;
   only their visual output on posts is suppressed.
   ========================================================== */
.single-post .qodef-e-info-tags,
.single-post .qodef-e-info-tag,
.single-post .qodef-e-tags,
.single-post .qodef-blog-tags,
.single-post .qodef-blog-single-tags,
.single-post .qodef-tags,
.single-post .tags-links,
.single-post .post-tags,
.single-post .entry-tags,
.single-post [class*="qodef"][class*="tag-holder"],
.single-post [class*="qodef"][class*="tags-holder"] {
    display: none !important;
}

/* Fallback for tag links emitted without a dedicated Henrik wrapper. */
.single-post a[rel="tag"] {
    display: none !important;
}


/* ==========================================================
   CTT v6.2.5 — condensed bylines
   Reader-facing metadata is author · date · reading time.
   Categories remain available internally but are hidden here.
   ========================================================== */
.qodef-e-info-category,
.qodef-e-info-categories,
.qodef-e-info .qodef-e-info-category,
.qodef-e-info [class*="category"],
.qodef-blog-item-info [class*="category"] {
    display: none !important;
}

/* Tighten the byline without changing the established typeface/scale. */
.qodef-blog .qodef-blog-item .qodef-e-info,
.single-post .qodef-e-info,
.qodef-blog-item-info,
.ctt-endless-post__meta {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    column-gap: 0 !important;
    row-gap: 2px !important;
    margin-top: 5px !important;
    margin-bottom: 5px !important;
    line-height: 1.25 !important;
}

/* Normalize Henrik's generous metadata spacing. */
.qodef-blog .qodef-blog-item .qodef-e-info > *,
.single-post .qodef-e-info > *,
.qodef-blog-item-info > *,
.ctt-endless-post__meta > * {
    margin: 0 !important;
    padding: 0 !important;
}

/* Use compact middle-dot separators instead of loose slashes. */
.qodef-e-info-author + .qodef-e-info-date::before,
.qodef-e-info-date + .qodef-e-info-author::before,
.ctt-endless-post__meta .ctt-meta-date::before,
.ctt-reading-time::before {
    content: " · " !important;
    display: inline !important;
    white-space: pre !important;
}

/* Reading-time JS previously supplied its own slash. Hide that text-level
   separator by making the generated span compact; JS now emits only the value. */
.ctt-reading-time {
    margin: 0 !important;
    padding: 0 !important;
    line-height: inherit !important;
}

/* ==========================================================
   CTT v6.2.6 — metadata consistency fix
   Desktop + mobile: article metadata is centered author · date · time.
   Homepage cards show date only. Henrik slash separators are suppressed.
   ========================================================== */

/* Kill Henrik's built-in slash/separator pseudo-elements inside metadata. */
body .qodef-e-info::before,
body .qodef-e-info::after,
body .qodef-e-info-item::before,
body .qodef-e-info-item::after,
body .qodef-e-info-date::before,
body .qodef-e-info-date::after,
body .qodef-e-info-author::before,
body .qodef-e-info-author::after,
body .qodef-blog-item-info::before,
body .qodef-blog-item-info::after,
body .qodef-blog-item-info > *::before,
body .qodef-blog-item-info > *::after {
    content: none !important;
    display: none !important;
}

/* Single post and endless-reader bylines stay centered at every width. */
.single-post .qodef-e-info,
.single-post .qodef-blog-item-info,
.single-post .ctt-endless-post__meta {
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
    align-items: center !important;
    column-gap: 0 !important;
}

.single-post .qodef-e-info > *,
.single-post .qodef-blog-item-info > *,
.single-post .ctt-endless-post__meta > * {
    float: none !important;
    text-align: center !important;
}

/* Our separators, and only our separators. */
.single-post .qodef-e-info-author + .qodef-e-info-date::before,
.single-post .qodef-e-info-date + .qodef-e-info-author::before,
.single-post .ctt-endless-post__meta .ctt-meta-date::before,
.single-post .ctt-reading-time::before {
    content: " · " !important;
    display: inline !important;
    white-space: pre !important;
}

/* Homepage/list cards: date only, centered, with no orphan slash. */
body.home .qodef-blog .qodef-e-info,
body.home .qodef-blog-list .qodef-e-info,
body.blog .qodef-blog .qodef-e-info,
body.blog .qodef-blog-list .qodef-e-info {
    justify-content: center !important;
    text-align: center !important;
}
body.home .qodef-blog .qodef-e-info > *:not(.qodef-e-info-date):not(.ctt-engagement),
body.home .qodef-blog-list .qodef-e-info > *:not(.qodef-e-info-date):not(.ctt-engagement),
body.blog .qodef-blog .qodef-e-info > *:not(.qodef-e-info-date):not(.ctt-engagement),
body.blog .qodef-blog-list .qodef-e-info > *:not(.qodef-e-info-date):not(.ctt-engagement) {
    display: none !important;
}
body.home .qodef-e-info-date,
body.blog .qodef-e-info-date {
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
}

@media only screen and (max-width: 680px) {
    .single-post .qodef-e-info,
    .single-post .qodef-blog-item-info,
    .single-post .ctt-endless-post__meta,
    body.home .qodef-e-info,
    body.blog .qodef-e-info {
        justify-content: center !important;
        text-align: center !important;
    }
}

/* ==========================================================
   CTT v6.2.7 — single + endless metadata normalization
   Homepage metadata remains untouched.
   ========================================================== */
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-normalized,
.single-post .ctt-endless-post__meta {
    display:flex !important;
    width:auto !important;
    align-items:center !important;
    justify-content:center !important;
    flex-wrap:wrap !important;
    gap:0 !important;
    text-align:center !important;
}
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-normalized {
    margin-left:auto !important;
    margin-right:auto !important;
}
.single-post .ctt-endless-post__meta {
    margin-left:34px !important;
    margin-right:34px !important;
}
.single-post .ctt-meta-normalized > span,
.single-post .ctt-endless-post__meta > span {
    display:inline !important;
    float:none !important;
    width:auto !important;
    margin:0 !important;
    padding:0 !important;
    text-align:center !important;
}
.single-post .ctt-meta-normalized > span + span::before,
.single-post .ctt-endless-post__meta > span + span::before {
    content:" · " !important;
    display:inline !important;
    white-space:pre !important;
}
@media only screen and (max-width:900px) {
    .single-post .ctt-endless-post__meta {
        margin-left:18px !important;
        margin-right:18px !important;
    }
}

/* ==========================================================
   CTT v6.2.8 — endless-story metadata breathing room
   Restore the vertical rhythm around metadata on AJAX-loaded
   stories only. Homepage and initial single-post metadata stay intact.
   ========================================================== */
.single-post .ctt-endless-post__meta {
    margin-top: 28px !important;
    margin-bottom: 14px !important;
}

@media only screen and (max-width: 900px) {
    .single-post .ctt-endless-post__meta {
        margin-top: 22px !important;
        margin-bottom: 12px !important;
    }
}

/* ==========================================================
   CTT v6.2.9 — endless metadata rhythm match
   Match the regular single-post vertical rhythm around the
   metadata row without changing its text, centering, or homepage.
   ========================================================== */
.single-post .ctt-endless-post__meta {
    margin-top: 33px !important;
    margin-bottom: 38px !important;
}
.single-post .ctt-endless-post__title {
    margin-top: 0 !important;
}

@media only screen and (max-width: 900px) {
    .single-post .ctt-endless-post__meta {
        margin-top: 27px !important;
        margin-bottom: 32px !important;
    }
}

/* ==========================================================
   CTT v6.2.10 — mobile marquee continuity + pace
   Mobile only: keep Henrik/Qode text marquees running even at
   the top of the page. Desktop marquee behavior is untouched.
   Speed adjustment is applied by ctt.js from the live duration.
   ========================================================== */
@media only screen and (max-width: 900px) {
    .qodef-text-marquee *,
    .qodef-qi-text-marquee *,
    .text-marquee *,
    [class*="text-marquee"] *,
    [class*="marquee"] * {
        animation-play-state: running !important;
        -webkit-animation-play-state: running !important;
    }
}


/* ==========================================================
   CTT v6.2.13 — mobile marquee optical centering
   Undo v6.2.12's after-marquee spacing. The visible imbalance is
   before the marquee, so pull the marquee section upward on mobile
   while preserving its animation, speed, and desktop geometry.
   ========================================================== */
@media only screen and (max-width: 900px) {
    .qodef-text-marquee,
    .qodef-qi-text-marquee,
    .text-marquee {
        margin-bottom: 0 !important;
        transform: translateY(-76px);
    }
}


/* ==========================================================
   CTT v6.2.16 — mobile marquee type + final optical balance
   Typography only: preserve the existing marquee track/animation
   so its seamless continuous loop is not disturbed.
   ========================================================== */
@media only screen and (max-width: 900px) {
    .qodef-text-marquee,
    .qodef-text-marquee *,
    .qodef-qi-text-marquee,
    .qodef-qi-text-marquee *,
    .text-marquee,
    .text-marquee *,
    [class*="text-marquee"],
    [class*="text-marquee"] * {
        font-family: "CTT River Mono", monospace !important;
        font-style: normal !important;
        font-weight: 400 !important;
        color: #555 !important;
    }
}

/* ==========================================================
   CTT v6.2.15 — mobile homepage transition marker
   Mobile only. The marker is a real DOM element positioned by JS
   at the midpoint of the existing whitespace between the marquee
   and the first continuing feed card. It adds no layout height.
   ========================================================== */
@media only screen and (max-width: 680px) {
    body.home .ctt-latest-posts-marker {
        position: absolute;
        left: 50%;
        transform: translate(-50%, -50%);
        width: max-content;
        max-width: calc(100vw - 40px);
        margin: 0;
        padding: 0;
        font-family: "CTT River Mono", monospace !important;
        font-size: 11px;
        font-weight: 400;
        line-height: 1;
        letter-spacing: .22em;
        text-transform: uppercase;
        color: #747474;
        text-align: center;
        pointer-events: none;
        z-index: 20;
    }
}
@media only screen and (min-width: 681px) {
    .ctt-latest-posts-marker { display: none !important; }
}


/* ==========================================================
   CTT v6.2.18 — marquee scale + font-load stabilization
   Mobile only. Keep the v6.2.16 position/loop intact while
   sizing marquee copy at 15px.
   ========================================================== */
@media only screen and (max-width: 900px) {
    .qodef-text-marquee,
    .qodef-text-marquee *,
    .qodef-qi-text-marquee,
    .qodef-qi-text-marquee *,
    .text-marquee,
    .text-marquee *,
    [class*="text-marquee"],
    [class*="text-marquee"] * {
        font-size: 15px !important;
        line-height: 1.2 !important;
        font-family: "CTT River Mono", monospace !important;
        font-weight: 400 !important;
        font-variation-settings: "wght" 400, "ital" 0 !important;
    }
}

/* ==========================================================
   CTT v6.2.20 — marquee micro-balance
   Mobile only. Move the marquee down a final 3px from v6.2.19's
   logged-out position. Typography, loop, pace, and marker untouched.
   ========================================================== */
@media only screen and (max-width: 900px) {
    .qodef-text-marquee,
    .qodef-qi-text-marquee,
    .text-marquee {
        transform: translateY(-67px);
    }
}


/* ==========================================================
   CTT v6.2.21 — mobile final micro-balance + latest marker drop
   Mobile only. Two surgical optical adjustments.
   ========================================================== */
@media only screen and (max-width: 900px) {
    .qodef-text-marquee,
    .qodef-qi-text-marquee,
    .text-marquee {
        transform: translateY(-65px);
    }
}

/* ==========================================================
   CTT v6.2.31 — native engagement metadata
   Self-contained likes + views. No Jetpack dependency.
   ========================================================== */
.single-post .ctt-engagement {
    display:inline-flex !important;
    align-items:center !important;
    gap:0 !important;
    white-space:nowrap !important;
    vertical-align:middle !important;
}
.single-post .ctt-engagement::before,
.single-post .ctt-view-count::before {
    content:" · " !important;
    display:inline !important;
    white-space:pre !important;
    color:var(--ctt-muted) !important;
}
.single-post .ctt-like-button {
    appearance:none !important;
    -webkit-appearance:none !important;
    display:inline-flex !important;
    align-items:center !important;
    gap:3px !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    color:inherit !important;
    font:inherit !important;
    letter-spacing:inherit !important;
    line-height:inherit !important;
    cursor:pointer !important;
    vertical-align:middle !important;
    transform:none !important;
}
.single-post .ctt-heart-icon {
    width:11px !important;
    height:11px !important;
    display:block !important;
    flex:0 0 11px !important;
    overflow:visible !important;
    fill:transparent !important;
    stroke:#d31f2b !important;
    stroke-width:1.8 !important;
    stroke-linejoin:round !important;
    transition:fill .16s ease !important;
    transform:translateY(-1px) !important;
}
.single-post .ctt-like-button.is-liked .ctt-heart-icon {
    fill:#d31f2b !important;
}
.single-post .ctt-like-button:active,
.single-post .ctt-like-button:focus,
.single-post .ctt-like-button:hover {
    transform:none !important;
    background:transparent !important;
}
.single-post .ctt-like-button:focus-visible {
    outline:1px dotted currentColor !important;
    outline-offset:3px !important;
}
.single-post .ctt-like-count,
.single-post .ctt-view-count,
.single-post .ctt-view-number {
    font:inherit !important;
    letter-spacing:inherit !important;
    color:inherit !important;
}
@media only screen and (max-width:680px) {
    .single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-normalized,
    .single-post .ctt-endless-post__meta {
        flex-wrap:nowrap !important;
        white-space:nowrap !important;
    }
}


/* ==========================================================
   CTT v6.2.33 — relational homepage engagement
   Homepage cards display the same post-owned likes/views as the article.
   Homepage impressions do not count as views.
   ========================================================== */
body.home .qodef-e-info > .ctt-engagement,
body.blog .qodef-e-info > .ctt-engagement,
body.home .qodef-blog-item-info > .ctt-engagement,
body.blog .qodef-blog-item-info > .ctt-engagement {
    display:inline-flex !important;
    align-items:center !important;
    gap:0 !important;
    white-space:nowrap !important;
    vertical-align:middle !important;
    margin:0 !important;
    padding:0 !important;
    font:inherit !important;
    letter-spacing:inherit !important;
    color:inherit !important;
}
body.home .ctt-engagement::before,
body.blog .ctt-engagement::before,
body.home .ctt-view-count::before,
body.blog .ctt-view-count::before {
    content:" · " !important;
    display:inline !important;
    white-space:pre !important;
    color:var(--ctt-muted) !important;
}
body.home .ctt-like-button,
body.blog .ctt-like-button {
    appearance:none !important;
    -webkit-appearance:none !important;
    display:inline-flex !important;
    align-items:center !important;
    gap:3px !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    color:inherit !important;
    font:inherit !important;
    letter-spacing:inherit !important;
    line-height:inherit !important;
    cursor:pointer !important;
    vertical-align:middle !important;
    transform:none !important;
}
body.home .ctt-heart-icon,
body.blog .ctt-heart-icon {
    width:11px !important;
    height:11px !important;
    display:block !important;
    flex:0 0 11px !important;
    overflow:visible !important;
    fill:transparent !important;
    stroke:#d31f2b !important;
    stroke-width:1.8 !important;
    stroke-linejoin:round !important;
    transition:fill .16s ease !important;
    transform:translateY(-1px) !important;
}
body.home .ctt-like-button.is-liked .ctt-heart-icon,
body.blog .ctt-like-button.is-liked .ctt-heart-icon { fill:#d31f2b !important; }
body.home .ctt-like-button:active,
body.home .ctt-like-button:focus,
body.home .ctt-like-button:hover,
body.blog .ctt-like-button:active,
body.blog .ctt-like-button:focus,
body.blog .ctt-like-button:hover { transform:none !important; background:transparent !important; }
body.home .ctt-like-count,
body.home .ctt-view-count,
body.home .ctt-view-number,
body.blog .ctt-like-count,
body.blog .ctt-view-count,
body.blog .ctt-view-number { font:inherit !important; letter-spacing:inherit !important; color:inherit !important; }
@media only screen and (max-width:680px) {
    body.home .qodef-e-info,
    body.blog .qodef-e-info { flex-wrap:nowrap !important; white-space:nowrap !important; }
}


/* ==========================================================
   CTT v6.2.34 — homepage engagement visibility fix
   v6.2.33 correctly attached relational engagement to homepage cards,
   but the older date-only homepage rule hid every non-date metadata child.
   Keep the date-only design while explicitly allowing CTT engagement through.
   ========================================================== */
body.home .qodef-blog .qodef-e-info > .ctt-engagement,
body.home .qodef-blog-list .qodef-e-info > .ctt-engagement,
body.blog .qodef-blog .qodef-e-info > .ctt-engagement,
body.blog .qodef-blog-list .qodef-e-info > .ctt-engagement {
    display: inline-flex !important;
}


/* ==========================================================
   CTT v6.2.35 — desktop homepage engagement rhythm + preload
   Desktop only: keep date + engagement on one centered row.
   Mobile remains untouched. Initial homepage counts are preloaded
   in PHP so normal cards do not wait on an engagement request.
   ========================================================== */
@media only screen and (min-width:681px) {
    body.home .qodef-blog .qodef-e-info,
    body.home .qodef-blog-list .qodef-e-info,
    body.blog .qodef-blog .qodef-e-info,
    body.blog .qodef-blog-list .qodef-e-info {
        display:flex !important;
        flex-direction:row !important;
        flex-wrap:nowrap !important;
        align-items:center !important;
        justify-content:center !important;
        white-space:nowrap !important;
        column-gap:0 !important;
    }
    body.home .qodef-e-info-date,
    body.blog .qodef-e-info-date {
        display:inline-flex !important;
        width:auto !important;
        flex:0 0 auto !important;
        margin:0 !important;
    }
    body.home .qodef-e-info > .ctt-engagement,
    body.blog .qodef-e-info > .ctt-engagement,
    body.home .qodef-blog-item-info > .ctt-engagement,
    body.blog .qodef-blog-item-info > .ctt-engagement {
        width:auto !important;
        flex:0 0 auto !important;
    }
}


/* ==========================================================
   CTT v6.2.41 — single-post first-paint metadata repair
   Keep Henrik's original server-rendered nodes so nothing pops in.
   Hide Henrik's literal slash text nodes, restore the established
   author · date · reading time · engagement order, and leave the
   homepage completely untouched.
   ========================================================== */
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-original {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex-wrap:wrap !important;
    gap:0 !important;
    text-align:center !important;
    font-size:0 !important; /* hides Henrik's literal / separator text nodes */
}
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-original > * {
    float:none !important;
    margin:0 !important;
    padding:0 !important;
    font-size:10px !important;
    line-height:1.3 !important;
}
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-original .qodef-e-info-author { order:1 !important; }
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-original .qodef-e-info-date { order:2 !important; }
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-original .ctt-reading-time { order:3 !important; }
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-original .ctt-engagement { order:4 !important; font-size:10px !important; }

/* Remove every legacy Henrik/CTT separator on the preserved row first. */
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-original > *::before,
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-original > *::after,
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-original .ctt-engagement::before,
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-original .ctt-view-count::before {
    content:none !important;
    display:none !important;
}

/* Then add exactly the established middle-dot rhythm. */
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-original .qodef-e-info-date::before,
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-original .ctt-reading-time::before,
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-original .ctt-engagement::before,
.single-post .qodef-blog.qodef--single .qodef-e-info.ctt-meta-original .ctt-view-count::before {
    content:" · " !important;
    display:inline !important;
    white-space:pre !important;
    color:var(--ctt-muted) !important;
}


/* ==========================================================
   CTT v6.2.43 — authoritative single-post metadata row
   One server-rendered row. Homepage and endless-reader untouched.
   ========================================================== */
.single-post .qodef-blog.qodef--single .qodef-blog-item > .qodef-e-info,
.single-post .qodef-blog.qodef--single .qodef-blog-item > .qodef-blog-item-info {
    display:none !important;
}
.single-post .qodef-blog.qodef--single .ctt-single-meta {
    display:flex !important;
    width:100% !important;
    align-items:center !important;
    justify-content:center !important;
    flex-wrap:wrap !important;
    gap:0 !important;
    margin-top:5px !important;
    margin-bottom:5px !important;
    padding:0 !important;
    text-align:center !important;
    line-height:1.25 !important;
    color:var(--ctt-muted) !important;
}
.single-post .qodef-blog.qodef--single .ctt-single-meta > * {
    float:none !important;
    width:auto !important;
    margin:0 !important;
    padding:0 !important;
    text-align:center !important;
    font-size:10px !important;
    line-height:1.3 !important;
}
.single-post .qodef-blog.qodef--single .ctt-single-meta > *::before,
.single-post .qodef-blog.qodef--single .ctt-single-meta > *::after,
.single-post .qodef-blog.qodef--single .ctt-single-meta .ctt-engagement::before,
.single-post .qodef-blog.qodef--single .ctt-single-meta .ctt-view-count::before {
    content:none !important;
    display:none !important;
}
.single-post .qodef-blog.qodef--single .ctt-single-meta .ctt-single-meta-date::before,
.single-post .qodef-blog.qodef--single .ctt-single-meta .ctt-reading-time::before,
.single-post .qodef-blog.qodef--single .ctt-single-meta .ctt-engagement::before,
.single-post .qodef-blog.qodef--single .ctt-single-meta .ctt-view-count::before {
    content:" · " !important;
    display:inline !important;
    white-space:pre !important;
    color:var(--ctt-muted) !important;
}
.single-post .qodef-blog.qodef--single .ctt-single-meta + .qodef-e-info,
.single-post .qodef-blog.qodef--single .ctt-single-meta + .qodef-blog-item-info {
    display:none !important;
}

/* ==========================================================
   CTT v6.2.44 — endless-reader author casing consistency
   Keep the author's stored display-name casing while the rest of
   the endless metadata remains uppercase.
   ========================================================== */
.single-post .ctt-endless-post__meta .ctt-meta-author {
    text-transform: none !important;
}

/* ==========================================================
   CTT v6.2.48 — mobile-only back-to-top safe-area lift
   Desktop stays at the stable 18px position. Mobile/tablet keeps
   the 6px upward safe-area lift for in-app browser chrome.
   No size, horizontal alignment, glyph, animation, or behavior changes.
   ========================================================== */
.ctt-back-to-top {
    bottom: 18px !important;
}

@media only screen and (max-width: 900px) {
    .ctt-back-to-top {
        bottom: 20px !important;
    }
}

@media only screen and (max-width: 680px) {
    .single-post .ctt-back-to-top {
        bottom: 22px !important;
    }
}

/* ==========================================================
   CTT v6.2.49 — in-app browser back-to-top clearance
   Preserve the stable mobile position in normal browsers. When a
   known in-app browser is detected, add extra bottom clearance plus
   any safe-area inset exposed by the WebView.
   ========================================================== */
@media only screen and (max-width: 680px) {
    html.ctt-in-app-browser .single-post .ctt-back-to-top {
        bottom: calc(34px + env(safe-area-inset-bottom, 0px)) !important;
    }
}

/* ==========================================================
   CTT v6.2.50 — definitive mobile back-to-top clearance
   Trace result: the v6.2.49 extra lift depended on an in-app
   browser class, while the winning mobile single-post rule remained
   22px whenever that class was absent. Use one authoritative mobile
   single-post bottom value instead. Desktop remains 18px.
   ========================================================== */
@media only screen and (max-width: 680px) {
    .single-post .ctt-back-to-top,
    html.ctt-in-app-browser .single-post .ctt-back-to-top {
        bottom: 34px !important;
    }
}
