/*
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.1.15
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::after {
    content: "\f005";
    display: block;
    width: 100%;
    margin: 24px auto 0;
    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;
}