/* =========================================================
   WORD SPIRIT FIRE — VISUAL CONSISTENCY PASS
   Phase 9
   Loaded after page-specific styles so these rules only polish
   shared interaction, navigation and responsive rhythm.
   ========================================================= */

/* Better text wrapping on major display headings without changing scale. */
.wsf-hero__title,
.wsf-ministry-intro__title,
.wsf-teaching-intro h1,
.wsf-prayer-hero h1,
.wsf-healing-hero h1,
.pop-intro h1,
.wsf-doers-hero h1,
.ais-intro h1,
.about-hero h1,
.support-hero h1 {
    text-wrap: balance;
}

/* A consistent keyboard focus treatment across every visual language. */
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 4px;
}

/* Primary site controls share the same physical touch target. */
.wsf-button,
.wsf-spotlight__cta,
.support-button,
.wsf-doers-feature__button,
.pop-today__button,
.wsf-prayer-teaching__link,
.wsf-healing-teaching__enter {
    min-height: 44px;
}

/* Keep interaction behaviour consistent without flattening series colours. */
.wsf-button,
.wsf-spotlight__cta,
.support-button,
.wsf-doers-feature__button,
.pop-today__button,
.wsf-prayer-teaching__link,
.wsf-healing-teaching__enter,
.wsf-nav a {
    transition-property: background-color, border-color, color, opacity, transform;
    transition-duration: 180ms;
    transition-timing-function: ease;
}

/* Cards should reveal keyboard focus just as clearly as hover. */
.wsf-latest-card:focus-within,
.wsf-series-volume:focus-within,
.wsf-prayer-teaching:focus-within,
.wsf-healing-teaching:focus-within,
.wsf-doers-entry:focus-within,
.ais-work:focus-within,
.about-portal:focus-within {
    outline: 1px solid currentColor;
    outline-offset: 4px;
}

/* The active top-level section remains readable on every page. */
.wsf-nav a[aria-current="page"] {
    color: var(--wsf-gold-light);
}

/* Give horizontally scrolling shelves a cleaner, deliberate feel. */
.wsf-prayer-carousel,
.wsf-healing-carousel,
.wsf-series-shelf {
    scroll-padding-inline: 18px;
    scrollbar-width: none;
}

.wsf-prayer-carousel::-webkit-scrollbar,
.wsf-healing-carousel::-webkit-scrollbar,
.wsf-series-shelf::-webkit-scrollbar {
    display: none;
}

.wsf-prayer-small-card,
.wsf-healing-small-card,
.wsf-series-volume {
    scroll-snap-stop: always;
}

/* Prevent accidental image drag/select on carousel artwork. */
.wsf-prayer-carousel img,
.wsf-healing-carousel img,
.wsf-series-shelf img {
    -webkit-user-drag: none;
    user-select: none;
}

/* Phone navigation: clearer hierarchy and reliable touch targets. */
@media (max-width: 900px) {
    .wsf-nav a {
        min-height: 44px;
        display: flex;
        align-items: center;
        padding: 12px 10px;
    }

    .wsf-nav a[aria-current="page"] {
        position: relative;
        padding-left: 17px;
        background: rgba(181, 138, 67, 0.06);
    }

    .wsf-nav a[aria-current="page"]::before {
        content: "";
        position: absolute;
        left: 0;
        top: 10px;
        bottom: 10px;
        width: 2px;
        background: var(--wsf-gold-light);
    }

    .wsf-nav a[aria-current="page"]::after {
        display: none;
    }

    /* Consistent side breathing room at the smallest viewport sizes. */
    .wsf-ministry-existing-nav,
    .wsf-hero__copy {
        max-width: calc(100% - 28px);
    }
}

@media (hover: none) {
    /* Avoid sticky hover movement on touch devices. */
    .wsf-button:hover,
    .wsf-spotlight__cta:hover,
    .support-button:hover,
    .wsf-doers-feature__button:hover {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}