/* RevelationFX v1.1 – additions. Loaded after main.css and extra.css. */

/* Skip link */
.rfx-skip { position: absolute; left: -9999px; top: 8px; z-index: 10002; background: var(--rfx-gold); color: #080a0f; padding: 10px 16px; border-radius: 8px; font-weight: 600; }
.rfx-skip:focus { left: 12px; }

/* Ticker: scrolls away with the page so it never covers the sticky header */
.rfx-ticker { position: relative; top: auto; z-index: 2; }
.rfx-ticker__group { display: contents; }
.rfx-ticker:hover .rfx-ticker__inner { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
    .rfx-ticker__inner { animation: none; overflow-x: auto; }
    .rfx-ticker__group[aria-hidden="true"] { display: none; }
}

/* Risk / information notice */
.rfx-risk { margin: 28px 0 0; padding: 14px 18px; border: 1px solid var(--rfx-border-light); border-left: 3px solid var(--rfx-gold); border-radius: var(--rfx-radius-sm); background: var(--rfx-dark-2); }
.rfx-risk__title { display: block; font-size: .8rem; color: var(--rfx-gold); margin-bottom: 4px; }
.rfx-risk__text { margin: 0; font-size: .85rem; line-height: 1.6; color: var(--rfx-text-soft); max-width: 80ch; }

/* Homepage naira teaser */
.rfx-naira-teaser { background: var(--rfx-dark); border-top: 1px solid var(--rfx-border); border-bottom: 1px solid var(--rfx-border); }
.rfx-naira-teaser__inner { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(24px, 5vw, 64px); align-items: center; }
.rfx-naira-teaser__copy p { color: var(--rfx-text-soft); line-height: 1.7; margin: 10px 0 22px; max-width: 52ch; }
.rfx-naira-teaser__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 0; }
.rfx-naira-teaser__stats div { background: var(--rfx-dark-2); border: 1px solid var(--rfx-border); border-radius: var(--rfx-radius); padding: 16px; }
.rfx-naira-teaser__stats dt { font-size: .75rem; color: var(--rfx-text-muted); margin-bottom: 6px; }
.rfx-naira-teaser__stats dd { margin: 0; font-family: var(--rfx-font-display); font-weight: 800; font-size: clamp(1.05rem, 2vw, 1.4rem); color: var(--rfx-gold); font-variant-numeric: tabular-nums; }
@media (max-width: 860px) { .rfx-naira-teaser__inner { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .rfx-naira-teaser__stats { grid-template-columns: 1fr; } }

/* Visible keyboard focus everywhere */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible { outline: 2px solid var(--rfx-gold); outline-offset: 2px; }

/* ── Mobile fixes (v1.1.1) ─────────────────────────────────── */

/* Stop any stray element from creating sideways scroll. `clip` (unlike `hidden`)
   does not turn the page into a scroll container, so the sticky header keeps working. */
html { overflow-x: clip; }
/* main.css sets overflow-x:hidden on body; with html clipped that would make body a scroll
   container and break the sticky header, so release it. */
body { overflow-x: visible; }

@media (max-width: 768px) {
    /* One bar on phones: the header. The rates live in the hero and on /naira. */
    .rfx-ticker { display: none; }
}

@media (max-width: 640px) {
    /* The closed mobile menu used to sit off-screen to the right (translateX(100%)),
       which made the whole page scroll sideways into empty space. Fade it instead. */
    .rfx-nav {
        transform: none;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity .2s ease, visibility 0s linear .2s;
    }
    .rfx-nav.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transition: opacity .2s ease, visibility 0s;
    }
}

@media (max-width: 640px) {
    /* Stats bar: an even 2 x 2 grid instead of a ragged wrap */
    .rfx-stats-bar__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 12px; justify-items: center; }
    .rfx-stat { min-width: 0; width: 100%; }
    .rfx-stat__value { font-size: 1.3rem; }
    .rfx-stat__label { font-size: .68rem; letter-spacing: .05em; }
}