/* Small additions for behaviors that used to come from WordPress plugins (see public/js/site.js). */
.krm-more-hidden { display: none !important; }
.elementor-popup-modal { position: fixed; inset: 0; z-index: 9999; background-color: rgba(0, 0, 0, 0.5); justify-content: center; align-items: center; }
.krm-lightbox { position: fixed; inset: 0; z-index: 10000; display: none; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.9); }
.krm-lightbox.open { display: flex; }
.krm-lightbox figure { margin: 0; max-width: 90vw; max-height: 88vh; text-align: center; }
.krm-lightbox img { max-width: 90vw; max-height: 80vh; object-fit: contain; }
.krm-lightbox figcaption { color: #fff; font-size: 14px; padding-top: 10px; }
.krm-lightbox button { position: absolute; background: none; border: 0; color: #fff; font-size: 44px; line-height: 1; cursor: pointer; padding: 10px 16px; }
.krm-lightbox button:hover, .krm-lightbox button:focus { background: none; color: #c6ab7c; }
.krm-lb-close { top: 10px; right: 10px; }
.krm-lb-prev { left: 10px; top: 50%; transform: translateY(-50%); }
.krm-lb-next { right: 10px; top: 50%; transform: translateY(-50%); }
.krm-lightbox.single .krm-lb-prev, .krm-lightbox.single .krm-lb-next { display: none; }
.twentytwenty-container img { position: absolute; top: 0; left: 0; display: block; }
/* background slideshow (Elementor container setting): stacked slides, fade */
.elementor-background-slideshow { position: absolute; inset: 0; z-index: 0; overflow: hidden; border-radius: inherit; }
.elementor-background-slideshow .swiper-wrapper { position: relative; width: 100%; height: 100%; }
.elementor-background-slideshow__slide { position: absolute; inset: 0; opacity: 0; }
.elementor-background-slideshow__slide.krm-show { opacity: 1; }
.elementor-background-slideshow__slide__image { width: 100%; height: 100%; }
/* Blog images that were hot-linked from NeuronWriter (never loaded on WordPress): show them as blocks */
img[src^="/wp-content/uploads/neuron/"] { display: block; height: auto; max-width: 100%; margin: 10px 0 20px; }
/* Background video: cover the section with CSS (Elementor sized it with JS); the poster shows at once */
.elementor .elementor-background-video-hosted { width: 100%; height: 100%; }
/* New Markdown pages (layouts/InnerLayout.astro) */
.krm-article h2 { margin: 28px 0 10px; }
.krm-article h3 { margin: 22px 0 8px; }
.krm-article p, .krm-article li { line-height: 1.7; }
.krm-article ul, .krm-article ol { margin: 0 0 18px 22px; }
.krm-article table { border-collapse: collapse; width: 100%; margin: 12px 0 20px; }
.krm-article th, .krm-article td { border: 1px solid #ddd; padding: 8px 10px; text-align: left; vertical-align: top; }
.krm-article th { background: #f6f6f7; }
.krm-article img { max-width: 100%; height: auto; margin: 10px 0 18px; }
.krm-article .krm-step { display: grid; grid-template-columns: 56px 1fr; gap: 16px; align-items: start; margin: 18px 0; }
.krm-article .krm-step b.n { display: inline-flex; width: 48px; height: 48px; border-radius: 50%; background: #c6ab7c; color: #fff; align-items: center; justify-content: center; font-size: 20px; }
.krm-article .krm-step h3 { margin-top: 4px; }
ul.krm-related { columns: 2; gap: 24px; margin-left: 20px; }
@media (max-width: 767px) { ul.krm-related { columns: 1; } }
/* Containers of the new pages: the per-element variables Elementor would have generated */
.elementor-element-krmbody, .elementor-element-krmrelated { --display: flex; --flex-direction: column; --container-widget-width: 100%; --container-widget-height: initial; --container-widget-flex-grow: 0; --container-widget-align-self: initial; --flex-wrap-mobile: wrap; --padding-left: 0px; --padding-right: 0px; overflow: visible; }
.elementor-element-krmbody > .e-con-inner, .elementor-element-krmrelated > .e-con-inner { width: 100%; max-width: var(--content-width); margin-inline: auto; display: flex; flex-direction: column; }
.elementor-element-krmtext { width: 100%; }
/* Google reviews as text on /all-reviews/ */
.elementor-element-krmreviews { --display: flex; --flex-direction: column; --container-widget-width: 100%; --flex-wrap-mobile: wrap; overflow: visible; }
.elementor-element-krmreviews > .e-con-inner { width: 100%; max-width: var(--content-width); margin-inline: auto; display: flex; flex-direction: column; }
.krm-reviews { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 20px; margin-top: 10px; }
.krm-review { background: #f6f6f7; border-left: 4px solid #c6ab7c; padding: 18px 20px; }
.krm-review-stars { color: #e7b008; letter-spacing: 2px; margin-bottom: 6px; }
.krm-review p { margin: 0 0 10px; }
.krm-review-meta { font-size: 13px; color: #666; margin: 0; }
