/* KR JOURNEY: brand values and wordmark from the approved Orabel Home 2.
   Nui's split geometry, transitions, typography motion and breakpoints remain in theme.css. */
:root {
    --kr-cream: #F3EBDD;
    --kr-earth: #46352E;
    --kr-maroon: #6B1F2A;
    --kr-saffron: #C98A2E;
    --tt-main-bg-color: var(--kr-cream);
    --tt-main-color: var(--kr-maroon);
}
body { font-family: "Roboto", sans-serif; color: var(--kr-earth); }
h1, h2, h3, .pspl-item-title-link-inner, .pspl-ghost, .tt-ol-menu-list, .tt-ol-menu-ghost {
    font-family: "Libre Baskerville", serif;
}
.kr-wordmark { display: flex; align-items: center; gap: 10px; width: 125px; height: 19px; white-space: nowrap; color: var(--kr-maroon); }
.kr-initials { font-family: "Libre Baskerville", serif; font-size: 22px; font-weight: 400; line-height: 19px; }
.kr-name { font-family: "Roboto", sans-serif; font-size: 10px; font-weight: 500; letter-spacing: .16em; }
body.tt-transition .ptr-overlay { background-color: var(--kr-maroon); }
.ptr-prel-content .kr-wordmark { color: var(--kr-cream); }
.pspl-images-inner { background-color: var(--kr-earth); }
.pspl-image img { filter: saturate(.85); }
.pspl-image:nth-child(4) img { object-position: 40% center; }
.pspl-item-title { color: var(--kr-earth); }
.pspl-item-hover-title { color: var(--kr-maroon); }
.pspl-item-category { color: var(--kr-earth); }
.pspl-item-category-wrap { opacity: .85; }
.pspl-item-title-link::before { color: var(--kr-maroon); opacity: 1; font-family: "Roboto", sans-serif; }
.pspl-ghost, .tt-ol-menu-ghost { color: var(--kr-maroon); }
/* Long chapter names wrap inside the original title area. Both animated copies have identical metrics. */
.pspl-inner { width: 100%; min-width: 0; }
.pspl-item-title-link { max-width: 100%; }
.pspl-item-title, .pspl-item-hover-title { white-space: normal; font-weight: 700; }
.pspl-item-hover-title { width: 100%; }
.portfolio-split.hovered .pspl-item-title { opacity: .65; }
.portfolio-split.hovered .pspl-item-category-wrap { opacity: .7; }
.portfolio-split.hovered .pspl-item-title-link::before { opacity: .8; }
.pspl-item-title-link:focus-visible .pspl-item-title,
.pspl-item-title-link:focus-visible .pspl-item-hover-title { transform: translate3d(0, -100%, 0); }
a:focus-visible { outline: 1px solid var(--kr-saffron); outline-offset: 6px; }
.tt-ol-menu-toggle-btn-text { font-family: "Roboto", sans-serif; color: var(--kr-cream); }
.tt-ol-menu-toggle-btn span::before, .tt-ol-menu-toggle-btn span::after { background-color: var(--kr-cream); }
.tt-ol-menu-list > li > a { color: var(--kr-earth); }
.tt-ol-menu-list > li.active > a,
body:not(.is-mobile) .tt-ol-menu-list > li > a:hover,
.tt-ol-menu-list > li > a:focus-visible { color: var(--kr-maroon); }
.tt-overlay-menu.tt-ol-menu-count .tt-ol-menu-list > li::before { color: var(--kr-maroon); opacity: .8; }
body.tt-ol-menu-active .tt-ol-menu-toggle-btn-text { color: var(--kr-earth); }
body.tt-ol-menu-active .tt-ol-menu-toggle-btn span::before,
body.tt-ol-menu-active .tt-ol-menu-toggle-btn span::after { background-color: var(--kr-earth); }
#ball { border-color: var(--kr-saffron); color: var(--kr-maroon); }
.scrollbar-thumb { background: var(--kr-maroon); }
.kr-explorer-label, .kr-chapter-count { font-family: "Roboto", sans-serif; font-size: 11px; font-weight: 500; letter-spacing: .16em; }
.kr-explorer-label { color: var(--kr-maroon); }
.kr-chapter-count { color: var(--kr-cream); }
@media (max-width: 1024px) {
    /* Nui's existing full-width image overlay, recolored to match Home 2. */
    .portfolio-split-images::before { background-color: var(--kr-earth); opacity: .65; }
    .kr-wordmark, .pspl-item-title, .pspl-item-category, .pspl-item-title-link::before { color: var(--kr-cream); }
    .pspl-item-hover-title { color: var(--kr-cream); }
    .pspl-item-hover .pspl-item-title-link::before { color: var(--kr-saffron); }
    .pspl-item-hover .pspl-item-title, .pspl-item-hover .pspl-item-hover-title { transform: translate3d(0, -100%, 0); }
    .pspl-item-category-wrap { opacity: 1; }
    .pspl-item-title-link { padding-right: 24px; }
    .pspl-item-hover-title { max-width: 100%; }
    .kr-explorer-label { color: var(--kr-cream); }
    body.tt-ol-menu-active .kr-wordmark { color: var(--kr-maroon); }
}
@media (max-width: 767px) {
    /* Four longer chapter labels need room beneath the existing header on phones. */
    .portfolio-split-list { padding-top: 150px; padding-bottom: 60px; }
    .pspl-item-title, .pspl-item-hover-title { font-size: clamp(28px, 6.8vw, 32px); }
    .tt-ol-menu-list > li > a { font-size: clamp(28px, 7.5vw, 34px); }
}
