/* Thoughts from the Cave: hover, motion and text rules for the Elementor build.
   Colors use Elementor Global Color variables, so a rebrand in Site Settings flows through.
   Containers are targeted by their CSS ID (Elementor containers ignore the CSS Classes field). */

.elementor-heading-title em { color: var(--e-global-color-accent); font-style: italic; }
.elementor-widget-text-editor p { margin: 0 0 1.1em; }
.elementor-widget-text-editor p:last-child { margin-bottom: 0; }

/* Buttons: colors and timing are native Elementor hover settings; this adds the 2px lift and arrow nudge */
.elementor-widget-button .elementor-button { transition: background-color .3s ease, color .3s ease, border-color .3s ease, transform .3s ease, box-shadow .3s ease; }
.elementor-widget-button .elementor-button:hover { transform: translateY(-2px); }
.elementor-widget-button .elementor-button-icon { transition: transform .3s ease; }
.elementor-widget-button .elementor-button:hover .elementor-button-icon { transform: translateX(4px); }
.elementor-widget-button .elementor-button-content-wrapper:has(.fa-arrow-left, .fa-instagram) .elementor-button-icon { transform: none; }

/* Cards: lift on hover (shadow change is the native container hover shadow) */
[id^="cave-ibox-"], [id^="cave-card-"] { transition: transform .3s ease, box-shadow .3s ease; }
[id^="cave-ibox-"]:hover, [id^="cave-card-"]:hover { transform: translateY(-6px); }
[id^="cave-ibox-"] .elementor-icon { transition: transform .3s ease; }
[id^="cave-ibox-"]:hover .elementor-icon { transform: scale(1.08); }

/* Image zoom on hover inside its frame */
[id^="cave-card-"] .elementor-widget-image, [id^="cave-media-"] { overflow: hidden; }
[id^="cave-card-"] .elementor-widget-image img { transition: transform .6s ease; }
[id^="cave-card-"]:hover .elementor-widget-image img { transform: scale(1.06); }
[id^="cave-media-"] img { transition: transform .8s ease; }
[id^="cave-media-"]:hover img { transform: scale(1.04); }

/* Footer logo lift */
#cave-footer-logo { transition: transform .3s ease; }
#cave-footer-logo:hover { transform: translateY(-3px); }


/* Post body: scripture blockquote and list markers */
.elementor-widget-text-editor blockquote { margin: 40px 0; padding: 8px 0 8px 32px; border-left: 4px solid var(--e-global-color-accent); font-family: var(--e-global-typography-tquote-font-family), serif; font-size: var(--e-global-typography-tquote-font-size); font-style: italic; line-height: 1.5; }
.elementor-widget-text-editor blockquote cite { display: block; margin-top: 14px; font-family: var(--e-global-typography-tmetax-font-family), sans-serif; font-style: normal; font-size: 13.6px; font-weight: 700; letter-spacing: 1.8px; text-transform: uppercase; color: var(--e-global-color-secondary); }
.elementor-widget-text-editor ul { padding-left: 1.2em; margin: 0 0 1.2em; }
.elementor-widget-text-editor li { margin-bottom: .5em; }
.elementor-widget-text-editor li::marker { color: var(--e-global-color-accent); }
#cave-post-meta a { color: inherit; text-decoration: none; }
#cave-post-meta a:hover { color: var(--e-global-color-primary); }

/* Visually hidden heading (keeps the heading order for screen readers) */
#cave-sr-posts { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* WPForms: tidy list markup and add the ochre focus ring */
#cave-wpform ul { list-style: none; margin: 0; padding: 0; }
#cave-wpform .wpforms-field { padding: 0 0 22px; }
#cave-wpform input:focus, #cave-wpform textarea:focus { outline: none; box-shadow: 0 0 0 4px color-mix(in srgb, var(--e-global-color-accent) 20%, transparent); }
#cave-wpform input[type="checkbox"] { accent-color: var(--e-global-color-accent); width: 20px; height: 20px; }
#cave-wpform textarea { min-height: 160px; }
#cave-wpform button[type="submit"] { transition: background-color .3s ease, border-color .3s ease, transform .3s ease; }
#cave-wpform button[type="submit"]:hover { transform: translateY(-2px); }

/* FAQ accordion: soft card shadow that deepens on hover */
#cave-faq .e-n-accordion-item { border-radius: 12px; box-shadow: 0 6px 20px rgba(28,25,23,.08); transition: box-shadow .3s ease; }
#cave-faq .e-n-accordion-item:hover { box-shadow: 0 18px 40px rgba(28,25,23,.18); }
#cave-faq .e-n-accordion-item-title-icon { transition: transform .3s ease; }

/* Xpro Post Grid cards: lift, image zoom and read-more arrow, matching the HTML cards */
[id$="-grid"] .xpro-post-grid-item { overflow: hidden; transition: transform .3s ease, box-shadow .3s ease; }
[id$="-grid"] .xpro-post-grid-item:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(28,25,23,.18) !important; }
[id$="-grid"] .xpro-post-grid-image { overflow: hidden; }
[id$="-grid"] .xpro-post-grid-image img { width: 100%; object-fit: cover; transition: transform .6s ease; }
[id$="-grid"] .xpro-post-grid-item:hover .xpro-post-grid-image img { transform: scale(1.06); }
[id$="-grid"] .xpro-post-grid-meta-list { list-style: none; padding: 0; }
[id$="-grid"] .xpro-post-grid-meta-list a { color: inherit; text-decoration: none; }
[id$="-grid"] .xpro-post-grid-content > a { text-decoration: none; }
[id$="-grid"] .xpro-post-grid-btn::after { content: "\2192"; display: inline-block; margin-left: 8px; transition: transform .3s ease; }
[id$="-grid"] .xpro-post-grid-item:hover .xpro-post-grid-btn::after { transform: translateX(5px); }

/* Xpro menu: size and color the SVG hamburger/close icons (Elementor renders icons as inline SVG) */
#cave-nav .xpro-elementor-horizontal-menu-toggler svg, #cave-nav .xpro-elementor-horizontal-menu-close svg { width: 24px; height: 24px; fill: currentColor; }
#cave-nav .xpro-elementor-horizontal-menu-toggler, #cave-nav .xpro-elementor-horizontal-menu-close { color: var(--e-global-color-cparch); cursor: pointer; padding: 8px; width: auto; min-width: 40px; background: transparent; border: 0; }
#cave-nav .xpro-elementor-horizontal-menu-toggler svg, #cave-nav .xpro-elementor-horizontal-menu-close svg { flex-shrink: 0; }
#cave-nav .xpro-elementor-horizontal-menu-toggler:hover, #cave-nav .xpro-elementor-horizontal-menu-close:hover { color: var(--e-global-color-accent); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; }
}