/* Blog post body layout (PROG-10124). Everything here is scoped to the single post content column — the global p/img base styles stay untouched. */ /* Typography: justify only where lines are long enough to avoid whitespace rivers (never on phones); hyphenation relies on the per-domain lang attribute that Polylang sets on . */ @media (min-width: 768px) { .single-post .single-blog .content p, .single-post .single-blog .content li { text-align: justify; -webkit-hyphens: auto; hyphens: auto; } } /* Post-body images: display cap + horizontal centering. Files are untouched — the lightbox opens the same URL full-size, so no content rewrite needed. */ .single-post .single-blog .content img { display: block; max-width: min(660px, 100%); height: auto; margin: 1.5rem auto; border-radius: 6px; cursor: zoom-in; } /* Classic [caption] figures: WP writes a fixed inline width — neutralize it, center the figure, and move the caption from the absolute overlay (the old theme styling) to a static line under the image. */ .single-post .single-blog .content .wp-caption { width: auto !important; max-width: min(660px, 100%); margin: 1.5rem auto; } .single-post .single-blog .content .wp-caption img { margin: 0 auto; } .single-post .single-blog .content .wp-caption-text { position: static; max-width: none; padding: 8px 4px 0; font-size: 14px; line-height: 1.4; font-weight: 600; color: #2a3541; background: none; text-align: center; } /* Lightbox overlay (theme-owned, no external lib — see js/blog-lightbox.js). */ .oki-lightbox { position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(15, 21, 28, 0.92); opacity: 0; transition: opacity 0.15s ease; cursor: zoom-out; } .oki-lightbox.is-open { opacity: 1; } .oki-lightbox__box { position: relative; max-width: 96vw; max-height: 92vh; } .oki-lightbox img { max-width: 100%; max-height: 92vh; width: auto; height: auto; border: 10px solid #fff; background: #fff; border-radius: 6px; box-shadow: 0 8px 40px rgba(0, 0, 0, 0.5); } /* Close control: same language as the .scroll-to-top fab (white circle, soft shadow, teal hover), smaller, overlapping the image's top-right corner. */ .oki-lightbox__close { position: absolute; top: -14px; right: -14px; width: 36px; height: 36px; padding: 0; display: flex; align-items: center; justify-content: center; background: #fff; color: #141414; border: 1px solid #e6e8eb; border-radius: 50%; box-shadow: 0 8px 22px -8px rgba(20, 20, 20, 0.35); font-size: 22px; line-height: 1; cursor: pointer; transition: color 0.15s ease, border-color 0.15s ease, transform 0.2s ease; } .oki-lightbox__close:hover { color: #00838f; border-color: rgba(24, 208, 205, 0.45); transform: translateY(-1px); } body.oki-lightbox-open { overflow: hidden; }