/* ==========================================================================
   RelyView — Home landing ("banco de reputación")
   Scoped under .rvh. Builds on the --rv-* tokens from relyview-landing.css
   so light/dark themes follow [data-rv-theme].
   ========================================================================== */

.rvh {
    --h-font: "Inter Tight", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --h-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --h-bg: var(--rv-bg, #f4f5f8);
    --h-surface: var(--rv-surface, #fff);
    --h-soft: var(--rv-surface-soft, #f9fafb);
    --h-strong: var(--rv-surface-strong, #e9edf2);
    --h-ink: var(--rv-ink, #1a1a1c);
    --h-muted: var(--rv-muted, #68717d);
    --h-line: var(--rv-line, #dfe4eb);
    --h-line-soft: var(--rv-line-soft, #eceff4);
    --h-accent: var(--rv-primary, #14d9d4);
    --h-accent-ink: #067e7a;
    --h-accent-wash: rgba(20, 217, 212, .12);
    --h-lime: var(--rv-lime, #c6f56f);
    --h-danger: #c2410c;
    --h-dark: #0d1218;
    --h-dark-2: #151c24;
    --h-dark-line: #26303b;
    --h-shadow: 0 1px 2px rgba(16, 22, 29, .04), 0 24px 60px -12px rgba(16, 22, 29, .14);
    --h-shadow-sm: 0 1px 2px rgba(16, 22, 29, .04), 0 10px 24px -8px rgba(16, 22, 29, .10);
    --h-radius: 24px;
    --h-ease: cubic-bezier(.22, 1, .36, 1);

    background: var(--h-bg);
    color: var(--h-ink);
    font-family: var(--h-font);
    font-feature-settings: "ss01", "cv11";
    overflow-x: clip;
    -webkit-font-smoothing: antialiased;
}

[data-rv-theme="dark"] .rvh {
    --h-accent-ink: #3ee9e3;
    --h-accent-wash: rgba(40, 229, 223, .10);
    --h-danger: #fb923c;
    --h-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 24px 60px -12px rgba(0, 0, 0, .55);
    --h-shadow-sm: 0 1px 2px rgba(0, 0, 0, .3), 0 10px 24px -8px rgba(0, 0, 0, .45);
}

.rvh *, .rvh *::before, .rvh *::after { box-sizing: border-box; }
/* Element-level resets: beat Bootstrap's reboot (same specificity, later file) while
   any .rvh-* component class below still wins. */
:where(.rvh) h1, :where(.rvh) h2, :where(.rvh) h3, :where(.rvh) p, :where(.rvh) ul, :where(.rvh) ol,
:where(.rvh) dl, :where(.rvh) dd, :where(.rvh) blockquote, :where(.rvh) pre { margin: 0; }
:where(.rvh) ul, :where(.rvh) ol { list-style: none; padding: 0; }
:where(.rvh) h1, :where(.rvh) h2, :where(.rvh) h3 { color: inherit; font-family: var(--h-font); }
.rvh a:not(.rvh-btn) { color: var(--h-accent-ink); text-decoration: underline; text-underline-offset: 3px; }
.rvh :focus-visible { outline: 2px solid var(--h-accent-ink); outline-offset: 3px; border-radius: 8px; }

.rvh-shell { margin-inline: auto; max-width: 1200px; padding-inline: 24px; width: 100%; }
.rvh-mono { font-family: var(--h-mono); font-size: .92em; letter-spacing: 0; }
.rvh-sr { clip: rect(0 0 0 0); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }

/* ---------- Shared type ---------- */
.rvh-section { padding-block: clamp(72px, 10vw, 128px); position: relative; }
.rvh-head { margin-bottom: clamp(36px, 5vw, 56px); max-width: 720px; }
.rvh-head--center { margin-inline: auto; text-align: center; }
.rvh-kicker {
    align-items: center; color: var(--h-accent-ink); display: inline-flex; font-size: .78rem; font-weight: 700;
    gap: 8px; letter-spacing: .12em; margin-bottom: 14px; text-transform: uppercase;
}
.rvh-kicker::before { background: currentColor; border-radius: 2px; content: ""; height: 2px; width: 18px; }
.rvh-head--center .rvh-kicker::after { background: currentColor; border-radius: 2px; content: ""; height: 2px; width: 18px; }
.rvh-title { font-size: clamp(2rem, 4.2vw, 3.25rem); font-weight: 700; letter-spacing: -.035em; line-height: 1.04; text-wrap: balance; }
.rvh-lead { color: var(--h-muted); font-size: clamp(1rem, 1.35vw, 1.15rem); line-height: 1.6; margin-top: 18px; text-wrap: pretty; }

/* ---------- Buttons ---------- */
.rvh-btn {
    align-items: center; border: 1px solid transparent; border-radius: 999px; cursor: pointer; display: inline-flex;
    font-family: var(--h-font); font-size: .95rem; font-weight: 600; gap: 10px; justify-content: center;
    letter-spacing: -.005em; line-height: 1; min-height: 46px; padding: 0 22px; text-decoration: none !important;
    transition: transform .25s var(--h-ease), box-shadow .25s var(--h-ease), background-color .2s ease, border-color .2s ease, color .2s ease;
    white-space: nowrap;
}
.rvh-btn--lg { font-size: 1rem; min-height: 54px; padding: 0 28px; }
.rvh-btn i { font-size: .85em; transition: transform .25s var(--h-ease); }
.rvh-btn:hover i.fa-arrow-right { transform: translateX(3px); }
.rvh-btn--primary { background: var(--h-ink); color: var(--h-surface) !important; box-shadow: 0 10px 24px -10px rgba(16, 22, 29, .5); }
.rvh-btn--primary:hover { box-shadow: 0 16px 32px -12px rgba(16, 22, 29, .55); transform: translateY(-1px); }
[data-rv-theme="dark"] .rvh-btn--primary { background: var(--h-accent); color: #061214 !important; box-shadow: 0 10px 30px -12px rgba(40, 229, 223, .55); }
.rvh-btn--ghost { background: var(--h-surface); border-color: var(--h-line); color: var(--h-ink) !important; }
.rvh-btn--ghost:hover { border-color: var(--h-ink); transform: translateY(-1px); }
.rvh-btn--light { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .22); color: #fff !important; }
.rvh-btn--light:hover { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .4); }

/* ---------- Small atoms ---------- */
.rvh-stars { color: #f5b301; font-size: .9rem; letter-spacing: 1px; white-space: nowrap; }
.rvh-avatar {
    align-items: center; background: linear-gradient(135deg, #d6f8f6, #e8fcc6); border-radius: 50%; color: #0d3b3a;
    display: inline-flex; flex: 0 0 auto; font-size: .72rem; font-weight: 700; height: 32px; justify-content: center; width: 32px;
}
.rvh-avatar--ghost { background: var(--h-strong); color: var(--h-muted); }
.rvh-avatar--lg { font-size: 1.15rem; height: 64px; width: 64px; }
.rvh-pill {
    align-items: center; background: var(--h-soft); border: 1px solid var(--h-line); border-radius: 999px; color: var(--h-muted);
    display: inline-flex; font-size: .72rem; font-weight: 600; gap: 6px; padding: 5px 10px; white-space: nowrap;
}
.rvh-pill--ok { background: var(--h-accent-wash); border-color: transparent; color: var(--h-accent-ink); }
.rvh-live { animation: rvh-pulse 2s infinite; background: #22c55e; border-radius: 50%; display: inline-block; height: 7px; width: 7px; }
.rvh-c-k { color: #c084fc; } .rvh-c-p { color: #67e8f9; } .rvh-c-s { color: #bef264; } .rvh-c-n { color: #fda4af; }

/* ==========================================================================
   HERO
   ========================================================================== */
.rvh-hero { padding: clamp(128px, 14vw, 168px) 0 clamp(72px, 9vw, 112px); position: relative; }
.rvh-hero__bg { inset: 0; overflow: hidden; pointer-events: none; position: absolute; }
.rvh-hero__grid {
    background-image: linear-gradient(var(--h-line-soft) 1px, transparent 1px), linear-gradient(90deg, var(--h-line-soft) 1px, transparent 1px);
    background-size: 56px 56px; inset: 0; position: absolute;
    -webkit-mask-image: radial-gradient(ellipse 70% 60% at 65% 40%, #000 20%, transparent 75%);
    mask-image: radial-gradient(ellipse 70% 60% at 65% 40%, #000 20%, transparent 75%);
}
.rvh-hero__glow {
    background: radial-gradient(closest-side, rgba(20, 217, 212, .22), transparent), radial-gradient(closest-side, rgba(198, 245, 111, .28), transparent);
    background-position: 0 0, 220px 140px; background-repeat: no-repeat; background-size: 520px 520px, 420px 420px;
    filter: blur(20px); height: 700px; position: absolute; right: -120px; top: 0; width: 760px;
}
[data-rv-theme="dark"] .rvh-hero__glow { opacity: .55; }
.rvh-hero__inner { align-items: center; display: grid; gap: clamp(40px, 6vw, 80px); grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); position: relative; }

.rvh-eyebrow {
    align-items: center; background: var(--h-surface); border: 1px solid var(--h-line); border-radius: 999px; box-shadow: var(--h-shadow-sm);
    color: var(--h-ink); display: inline-flex; font-size: .8rem; font-weight: 600; gap: 10px; margin-bottom: 26px; padding: 7px 14px 7px 10px;
}
.rvh-eyebrow__dot { background: var(--h-accent); border-radius: 50%; box-shadow: 0 0 0 4px var(--h-accent-wash); height: 8px; width: 8px; }
.rvh-hero__title { font-size: clamp(2.7rem, 6vw, 5rem); font-weight: 800; letter-spacing: -.05em; line-height: .96; text-wrap: balance; }
.rvh-hero__title span { display: block; }
.rvh-hero__title-b {
    background: linear-gradient(100deg, var(--h-accent-ink) 10%, #0fb8b3 55%, #6bbf1d 100%);
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
    font-size: .62em; letter-spacing: -.04em; line-height: 1.04; margin-top: .3em; padding-bottom: .06em;
}
[data-rv-theme="dark"] .rvh-hero__title-b { background-image: linear-gradient(100deg, #3ee9e3 10%, #8ff0c0 55%, #c6f56f 100%); }
.rvh-hero__lead { color: var(--h-muted); font-size: clamp(1.05rem, 1.45vw, 1.22rem); line-height: 1.6; margin-top: 26px; max-width: 560px; text-wrap: pretty; }
.rvh-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.rvh-hero__assurance { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 30px; }
.rvh-hero__assurance li { align-items: center; color: var(--h-muted); display: inline-flex; font-size: .86rem; font-weight: 500; gap: 8px; }
.rvh-hero__assurance i { color: var(--h-accent-ink); font-size: .85rem; }

/* Stage */
.rvh-hero__stage { margin-inline: auto; max-width: 460px; padding: 36px 0 44px; position: relative; width: 100%; }

.rvh-receipt {
    background: var(--h-surface); border: 1px solid var(--h-line); border-radius: var(--h-radius); box-shadow: var(--h-shadow);
    padding: 22px 22px 18px; position: relative; z-index: 1;
}
.rvh-receipt__head { align-items: center; display: flex; gap: 12px; justify-content: space-between; margin-bottom: 18px; padding-right: 56px; }
.rvh-receipt__tag {
    align-items: center; background: var(--h-ink); border-radius: 999px; color: var(--h-surface); display: inline-flex;
    font-size: .7rem; font-weight: 700; gap: 7px; letter-spacing: .08em; padding: 6px 11px; text-transform: uppercase;
}
.rvh-receipt__tag i { color: var(--h-lime); font-size: .7rem; }
[data-rv-theme="dark"] .rvh-receipt__tag i { color: #6bbf1d; }
.rvh-receipt__order { color: var(--h-muted); font-size: .8rem; }
.rvh-receipt__order b { color: var(--h-ink); font-family: var(--h-mono); font-weight: 500; }
.rvh-receipt__merchant { align-items: center; display: flex; gap: 12px; }
.rvh-receipt__merchant > div { display: flex; flex: 1; flex-direction: column; line-height: 1.25; min-width: 0; }
.rvh-receipt__merchant strong { font-size: .98rem; }
.rvh-receipt__merchant span:not(.rvh-stars) { color: var(--h-muted); font-size: .78rem; }
.rvh-receipt__logo {
    align-items: center; background: linear-gradient(140deg, #10161d, #2c3a48); border-radius: 12px; color: var(--h-lime);
    display: inline-flex; flex: 0 0 auto; font-size: 1.05rem; font-weight: 800; height: 40px; justify-content: center; width: 40px;
}
.rvh-receipt__quote { font-size: 1.06rem; font-weight: 500; letter-spacing: -.01em; line-height: 1.5; margin: 18px 0 14px; text-wrap: pretty; }
.rvh-receipt__author { align-items: center; color: var(--h-muted); display: flex; font-size: .82rem; gap: 10px; }
.rvh-receipt__author strong { color: var(--h-ink); }
.rvh-receipt__checks { display: grid; gap: 6px; margin-top: 18px; }
.rvh-receipt__checks li {
    align-items: center; background: var(--h-soft); border: 1px solid var(--h-line-soft); border-radius: 12px;
    display: flex; font-size: .85rem; font-weight: 500; gap: 10px; padding: 9px 12px; transition: background-color .35s ease, border-color .35s ease;
}
.rvh-receipt__checks li > i:first-child { color: var(--h-muted); text-align: center; width: 16px; }
.rvh-ok {
    align-items: center; background: var(--h-accent); border-radius: 50%; color: #052322; display: inline-flex; font-size: .6rem;
    height: 20px; justify-content: center; margin-left: auto; transition: transform .35s var(--h-ease), opacity .35s ease; width: 20px;
}
.rvh-receipt__checks li.is-pending .rvh-ok { opacity: 0; transform: scale(.4); }
.rvh-receipt__checks li.is-pending { background: transparent; }
.rvh-receipt__checks li.is-active { border-color: var(--h-accent); }

.rvh-receipt__perf {
    border-top: 2px dashed var(--h-line); margin: 18px -22px 14px; position: relative;
}
.rvh-receipt__perf::before, .rvh-receipt__perf::after {
    background: var(--h-bg); border: 1px solid var(--h-line); border-radius: 50%; content: ""; height: 22px; position: absolute; top: -12px; width: 22px;
}
.rvh-receipt__perf::before { border-left-color: transparent; border-bottom-color: transparent; left: -12px; transform: rotate(45deg); }
.rvh-receipt__perf::after { border-right-color: transparent; border-top-color: transparent; right: -12px; transform: rotate(45deg); }
.rvh-receipt__proof { display: grid; gap: 10px; grid-template-columns: 1fr 1fr; }
.rvh-receipt__proof dt { color: var(--h-muted); font-size: .68rem; font-weight: 600; letter-spacing: .08em; margin-bottom: 3px; text-transform: uppercase; }
.rvh-receipt__proof dd { font-size: .8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.rvh-verify {
    align-items: center; background: transparent; border: 1px solid var(--h-line); border-radius: 12px; color: var(--h-ink); cursor: pointer;
    display: flex; font: 600 .86rem/1 var(--h-font); gap: 9px; justify-content: center; margin-top: 16px; min-height: 42px; width: 100%;
    transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}
.rvh-verify:hover { border-color: var(--h-ink); }
.rvh-verify.is-busy i { animation: rvh-spin 1s linear infinite; }
.rvh-verify.is-done { background: var(--h-accent-wash); border-color: var(--h-accent); color: var(--h-accent-ink); }

/* Seal stamp */
.rvh-seal { height: 116px; position: absolute; right: -46px; top: -14px; width: 116px; z-index: 2; filter: drop-shadow(0 10px 20px rgba(16, 22, 29, .18)); }
.rvh-seal__ring { fill: var(--h-lime); }
.rvh-seal__text { fill: #10161d; font: 700 10.4px/1 var(--h-font); letter-spacing: 2.6px; text-transform: uppercase; }
.rvh-seal__text { animation: rvh-rotate 22s linear infinite; transform-box: view-box; transform-origin: 60px 60px; }
.rvh-seal__core circle { fill: #10161d; }
.rvh-seal__core path { stroke: var(--h-lime); }

/* Floating chips */
.rvh-chip {
    background: color-mix(in srgb, var(--h-surface) 88%, transparent); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--h-line); border-radius: 16px; box-shadow: var(--h-shadow-sm); position: absolute; z-index: 3;
}
.rvh-chip--source { align-items: center; animation: rvh-float 7s ease-in-out infinite; display: flex; gap: 10px; left: -72px; padding: 10px 14px 10px 10px; top: -10px; }
.rvh-chip--source strong { display: block; font-size: .8rem; }
.rvh-chip--source small { color: var(--h-muted); display: block; font-size: .72rem; }
.rvh-chip__icon { align-items: center; background: #95bf47; border-radius: 10px; color: #fff; display: inline-flex; font-size: 1.05rem; height: 34px; justify-content: center; width: 34px; }
.rvh-chip--api {
    animation: rvh-float 8s ease-in-out -3s infinite; background: rgba(13, 18, 24, .94); border-color: #26303b;
    color: #e6edf3; display: grid; gap: 4px; padding: 12px 14px; right: -60px; bottom: -26px;
}
.rvh-chip--api code { color: #e6edf3; font-size: .74rem; white-space: nowrap; }
.rvh-chip__label { align-items: center; color: #9aa7b4; display: inline-flex; font-size: .66rem; font-weight: 700; gap: 7px; letter-spacing: .1em; margin-bottom: 2px; text-transform: uppercase; }

/* ==========================================================================
   PROBLEM
   ========================================================================== */
.rvh-problem { background: var(--h-surface); border-block: 1px solid var(--h-line-soft); }
.rvh-versus { align-items: stretch; display: grid; gap: 20px; grid-template-columns: 1fr auto 1fr; margin-inline: auto; max-width: 1000px; }
.rvh-versus__card { border-radius: var(--h-radius); display: flex; flex-direction: column; gap: 20px; padding: clamp(22px, 3vw, 32px); }
.rvh-versus__card--open { background: var(--h-soft); border: 1px dashed var(--h-line); }
.rvh-versus__card--backed { background: var(--h-surface); border: 1px solid var(--h-accent); box-shadow: 0 0 0 6px var(--h-accent-wash), var(--h-shadow); }
.rvh-versus__label { align-items: center; display: flex; font-size: .78rem; font-weight: 700; gap: 9px; letter-spacing: .08em; text-transform: uppercase; }
.rvh-versus__card--open .rvh-versus__label { color: var(--h-muted); }
.rvh-versus__card--backed .rvh-versus__label { color: var(--h-accent-ink); }
.rvh-versus__vs {
    align-items: center; align-self: center; background: var(--h-ink); border-radius: 50%; color: var(--h-surface); display: flex;
    font-size: .8rem; font-weight: 700; height: 44px; justify-content: center; letter-spacing: .04em; width: 44px;
}
.rvh-mini-review { background: var(--h-surface); border: 1px solid var(--h-line-soft); border-radius: 16px; padding: 16px; }
.rvh-versus__card--backed .rvh-mini-review { background: var(--h-soft); }
.rvh-mini-review__top { align-items: center; color: var(--h-muted); display: flex; font-size: .82rem; gap: 10px; margin-bottom: 10px; }
.rvh-mini-review__top strong { color: var(--h-ink); }
.rvh-mini-review__top .rvh-stars { margin-left: auto; }
.rvh-mini-review p { font-size: .98rem; font-weight: 500; line-height: 1.5; }
.rvh-mini-review--blur p { color: var(--h-muted); }
.rvh-qlist, .rvh-alist { display: grid; gap: 12px; }
.rvh-qlist li, .rvh-alist li { align-items: flex-start; display: flex; font-size: .95rem; gap: 12px; line-height: 1.45; }
.rvh-qlist i, .rvh-alist i {
    align-items: center; border-radius: 50%; display: inline-flex; flex: 0 0 auto; font-size: .62rem; height: 22px; justify-content: center; margin-top: 1px; width: 22px;
}
.rvh-qlist li { color: var(--h-muted); }
.rvh-qlist i { background: color-mix(in srgb, var(--h-danger) 12%, transparent); color: var(--h-danger); }
.rvh-alist i { background: var(--h-accent); color: #052322; }

/* ==========================================================================
   PILLARS
   ========================================================================== */
.rvh-pillars__list { counter-reset: none; display: grid; gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.rvh-pillar {
    background: var(--h-surface); border: 1px solid var(--h-line); border-radius: var(--h-radius); display: flex; flex-direction: column;
    padding: 14px 14px 26px; transition: transform .35s var(--h-ease), box-shadow .35s var(--h-ease), border-color .35s ease;
}
.rvh-pillar:hover { border-color: color-mix(in srgb, var(--h-accent) 60%, var(--h-line)); box-shadow: var(--h-shadow); transform: translateY(-4px); }
.rvh-pillar__visual {
    align-items: center; background: var(--h-soft); border: 1px solid var(--h-line-soft); border-radius: 16px; display: flex; flex-direction: column;
    gap: 12px; height: 168px; justify-content: center; margin-bottom: 22px; overflow: hidden; padding: 16px; position: relative;
}
.rvh-pillar__visual::before {
    background-image: radial-gradient(var(--h-line) 1px, transparent 1px); background-size: 14px 14px; content: ""; inset: 0; opacity: .7; position: absolute;
}
.rvh-pillar__visual > * { position: relative; }
.rvh-pillar__num { color: var(--h-accent-ink); font-family: var(--h-mono); font-size: .78rem; font-weight: 500; margin: 0 10px 8px; }
.rvh-pillar h3 { font-size: 1.28rem; font-weight: 700; letter-spacing: -.025em; margin: 0 10px 10px; }
.rvh-pillar p { color: var(--h-muted); font-size: .94rem; line-height: 1.6; margin: 0 10px; }

/* Pillar visuals */
.rvh-vis-link { align-items: center; display: flex; flex-direction: column; gap: 10px; width: 100%; }
.rvh-vis-link__sources { display: flex; gap: 8px; }
.rvh-vis-link__sources span {
    align-items: center; background: var(--h-surface); border: 1px solid var(--h-line); border-radius: 10px; color: var(--h-ink);
    display: inline-flex; font-size: .95rem; height: 34px; justify-content: center; width: 34px;
}
.rvh-vis-link__beam { background: linear-gradient(var(--h-line), var(--h-accent)); height: 22px; width: 2px; }
.rvh-vis-link__url {
    align-items: center; background: var(--h-ink); border-radius: 999px; color: var(--h-surface); display: inline-flex; font-size: .72rem; gap: 7px; padding: 8px 12px;
}
.rvh-vis-link__url i { color: var(--h-accent); }
.rvh-vis-link__url b { color: var(--h-lime); font-weight: 500; }
[data-rv-theme="dark"] .rvh-vis-link__url { background: #000; color: #e6edf3; }

.rvh-vis-id { align-items: center; display: flex; gap: 14px; }
.rvh-vis-id__ring {
    align-items: center; background: var(--h-surface); border: 2px solid var(--h-accent); border-radius: 50%; box-shadow: 0 0 0 7px var(--h-accent-wash);
    color: var(--h-accent-ink); display: flex; flex: 0 0 auto; font-size: 1.5rem; height: 60px; justify-content: center; width: 60px;
}
.rvh-vis-id__rows { display: grid; gap: 6px; }
.rvh-vis-id__rows span {
    align-items: center; background: var(--h-surface); border: 1px solid var(--h-line); border-radius: 8px; display: inline-flex;
    font-size: .72rem; font-weight: 600; gap: 7px; padding: 5px 9px; white-space: nowrap;
}
.rvh-vis-id__rows i { color: var(--h-muted); width: 12px; }
.rvh-vis-id__public { background: var(--h-accent-wash) !important; border-color: transparent !important; color: var(--h-accent-ink); }
.rvh-vis-id__public i { color: inherit !important; }

.rvh-vis-chain { align-items: center; display: flex; gap: 6px; }
.rvh-vis-chain > span {
    background: var(--h-surface); border: 1px solid var(--h-line); border-radius: 8px; color: var(--h-muted); font-size: .7rem; padding: 7px 8px;
}
.rvh-vis-chain > i { background: var(--h-line); height: 2px; width: 12px; }
.rvh-vis-chain__current {
    align-items: center; background: var(--h-ink) !important; border-color: var(--h-ink) !important; color: var(--h-surface) !important;
    display: inline-flex; gap: 6px; padding: 9px 10px !important; transform: scale(1.08);
}
.rvh-vis-chain__current i { color: var(--h-lime); font-size: .65rem; }
.rvh-vis-chain__note { align-items: center; color: var(--h-muted); display: inline-flex; font-size: .72rem; font-weight: 600; gap: 7px; }

.rvh-vis-port { align-items: center; display: flex; flex-direction: column; gap: 12px; }
.rvh-vis-port__badge {
    align-items: center; background: var(--h-surface); border: 1px solid var(--h-line); border-radius: 999px; box-shadow: var(--h-shadow-sm);
    display: inline-flex; font-size: .8rem; font-weight: 700; gap: 8px; padding: 8px 14px;
}
.rvh-vis-port__badge i { color: var(--h-accent-ink); }
.rvh-vis-port__dest { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; }
.rvh-vis-port__dest span {
    align-items: center; border: 1px dashed var(--h-line); border-radius: 8px; color: var(--h-muted); display: inline-flex;
    font-size: .7rem; font-weight: 600; gap: 6px; padding: 5px 8px;
}

/* ==========================================================================
   AUDIENCES
   ========================================================================== */
.rvh-audiences { background: var(--h-surface); border-block: 1px solid var(--h-line-soft); }
.rvh-tabs__list {
    background: var(--h-soft); border: 1px solid var(--h-line); border-radius: 999px; display: flex; gap: 4px;
    margin: 0 auto 36px; padding: 5px; width: fit-content;
}
.rvh-tabs__tab {
    align-items: center; background: transparent; border: 0; border-radius: 999px; color: var(--h-muted); cursor: pointer; display: inline-flex;
    font: 600 .92rem/1 var(--h-font); gap: 9px; min-height: 44px; padding: 0 20px; transition: background-color .25s ease, color .25s ease, box-shadow .25s ease;
}
.rvh-tabs__tab:hover { color: var(--h-ink); }
.rvh-tabs__tab[aria-selected="true"] { background: var(--h-surface); box-shadow: var(--h-shadow-sm); color: var(--h-ink); }
[data-rv-theme="dark"] .rvh-tabs__tab[aria-selected="true"] { background: var(--h-strong); }
.rvh-tabs__panel:focus-visible { outline-offset: 8px; }
.rvh-tabs__panel:not([hidden]) { animation: rvh-fade-up .45s var(--h-ease); }
.rvh-aud {
    align-items: center; background: var(--h-soft); border: 1px solid var(--h-line); border-radius: 28px; display: grid; gap: clamp(28px, 5vw, 64px);
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); padding: clamp(24px, 4.5vw, 56px);
}
.rvh-aud__copy h3 { font-size: clamp(1.6rem, 2.8vw, 2.2rem); font-weight: 700; letter-spacing: -.03em; line-height: 1.1; text-wrap: balance; }
.rvh-aud__copy > p { color: var(--h-muted); font-size: 1.02rem; line-height: 1.6; margin: 14px 0 22px; }
.rvh-aud__copy .rvh-alist { margin-bottom: 28px; }
.rvh-aud__visual { display: flex; justify-content: center; }

.rvh-dash, .rvh-profile, .rvh-code { border-radius: 22px; box-shadow: var(--h-shadow); max-width: 420px; width: 100%; }
.rvh-dash { background: var(--h-surface); border: 1px solid var(--h-line); display: grid; gap: 16px; padding: 20px; }
.rvh-dash__head { align-items: center; display: flex; gap: 10px; }
.rvh-dash__head strong { flex: 1; }
.rvh-dash__stats { display: grid; gap: 8px; grid-template-columns: repeat(3, 1fr); }
.rvh-dash__stats div { background: var(--h-soft); border-radius: 12px; display: flex; flex-direction: column; gap: 3px; padding: 12px; }
.rvh-dash__stats b { font-size: 1.35rem; letter-spacing: -.03em; }
.rvh-dash__stats span { color: var(--h-muted); font-size: .7rem; line-height: 1.3; }
.rvh-dash__spark svg { display: block; height: 70px; width: 100%; }
.rvh-dash__spark path { fill: none; stroke: var(--h-accent); stroke-width: 2.5; vector-effect: non-scaling-stroke; }
.rvh-dash__spark .rvh-dash__area { fill: var(--h-accent-wash); stroke: none; }
.rvh-dash__row { align-items: center; border-top: 1px solid var(--h-line-soft); color: var(--h-muted); display: flex; font-size: .82rem; gap: 9px; padding-top: 14px; }
.rvh-dash__row .rvh-pill { margin-left: auto; }

.rvh-profile { align-items: center; background: var(--h-surface); border: 1px solid var(--h-line); display: flex; flex-direction: column; gap: 10px; padding: 28px 24px; text-align: center; }
.rvh-profile > strong { font-size: 1.15rem; }
.rvh-profile__stats { display: grid; gap: 8px; grid-template-columns: 1fr 1fr; margin-top: 8px; width: 100%; }
.rvh-profile__stats div { background: var(--h-soft); border-radius: 12px; display: flex; flex-direction: column; padding: 12px; }
.rvh-profile__stats b { font-size: 1.5rem; letter-spacing: -.03em; }
.rvh-profile__stats span { color: var(--h-muted); font-size: .74rem; }
.rvh-profile__note { align-items: center; color: var(--h-muted); display: inline-flex; font-size: .78rem; gap: 7px; margin-top: 6px; }

.rvh-code { background: var(--h-dark); border: 1px solid var(--h-dark-line); color: #e6edf3; overflow: hidden; }
.rvh-code__bar { align-items: center; border-bottom: 1px solid var(--h-dark-line); display: flex; gap: 6px; padding: 12px 16px; }
.rvh-code__bar span { background: #2c3743; border-radius: 50%; height: 10px; width: 10px; }
.rvh-code__bar em { color: #8b98a5; font-size: .72rem; font-style: normal; margin-left: auto; }
.rvh-code pre { color: #e6edf3; font-size: .8rem; line-height: 1.7; margin: 0; overflow-x: auto; padding: 18px 20px 22px; }

/* ==========================================================================
   COMPARE (always dark)
   ========================================================================== */
.rvh-compare { background: var(--h-dark); color: #f5f7fa; overflow: hidden; }
.rvh-compare::before {
    background: radial-gradient(closest-side, rgba(20, 217, 212, .16), transparent); content: ""; height: 600px; left: 50%;
    pointer-events: none; position: absolute; top: -260px; transform: translateX(-50%); width: 900px;
}
.rvh-compare .rvh-kicker { color: var(--h-accent); }
.rvh-compare__table { border: 1px solid var(--h-dark-line); border-radius: var(--h-radius); margin-inline: auto; max-width: 960px; overflow: hidden; position: relative; }
.rvh-compare__row { display: grid; grid-template-columns: 1fr 1.1fr 1.1fr; }
.rvh-compare__row + .rvh-compare__row { border-top: 1px solid var(--h-dark-line); }
.rvh-compare__row > span { align-items: center; display: flex; font-size: .98rem; gap: 12px; padding: 20px 24px; }
.rvh-compare__row > span:first-child { color: #9aa7b4; font-size: .82rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.rvh-compare__row--head > span { color: #9aa7b4; font-size: .82rem !important; font-weight: 700; letter-spacing: .08em; padding-bottom: 16px; padding-top: 16px; text-transform: uppercase; }
.rvh-compare__row--head .rvh-compare__us { color: var(--h-dark) !important; letter-spacing: -.01em; text-transform: none; font-size: 1.05rem !important; }
.rvh-compare__them { color: #8b98a5; }
.rvh-compare__them i { color: #64707d; font-size: .8rem; }
.rvh-compare__us { background: rgba(20, 217, 212, .08); color: #fff; font-weight: 600; }
.rvh-compare__row--head .rvh-compare__us { background: var(--h-accent); }
.rvh-compare__us i {
    align-items: center; background: var(--h-accent); border-radius: 50%; color: #052322; display: inline-flex; flex: 0 0 auto;
    font-size: .6rem; height: 20px; justify-content: center; width: 20px;
}

/* ==========================================================================
   WHY NOW
   ========================================================================== */
.rvh-why__grid { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rvh-why__card {
    background: var(--h-surface); border: 1px solid var(--h-line); border-radius: var(--h-radius); padding: clamp(24px, 3vw, 34px);
    position: relative; transition: transform .35s var(--h-ease), box-shadow .35s var(--h-ease);
}
.rvh-why__card:hover { box-shadow: var(--h-shadow); transform: translateY(-4px); }
.rvh-why__icon {
    align-items: center; background: var(--h-ink); border-radius: 14px; color: var(--h-lime); display: inline-flex; font-size: 1.1rem;
    height: 48px; justify-content: center; margin-bottom: 26px; width: 48px;
}
[data-rv-theme="dark"] .rvh-why__icon { background: var(--h-strong); }
.rvh-why__card h3 { font-size: 1.3rem; font-weight: 700; letter-spacing: -.025em; margin-bottom: 10px; }
.rvh-why__card p { color: var(--h-muted); font-size: .96rem; line-height: 1.6; }

/* ==========================================================================
   FAQ
   ========================================================================== */
.rvh-faq { padding-top: 0; }
.rvh-faq__inner { align-items: start; display: grid; gap: clamp(32px, 6vw, 80px); grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.rvh-faq__inner .rvh-head { position: sticky; top: 110px; }
.rvh-faq__list { border-top: 1px solid var(--h-line); }
.rvh-faq__item { border-bottom: 1px solid var(--h-line); }
.rvh-faq__item summary {
    align-items: center; cursor: pointer; display: flex; font-size: 1.1rem; font-weight: 600; gap: 20px; justify-content: space-between;
    letter-spacing: -.015em; list-style: none; padding: 24px 0;
}
.rvh-faq__item summary::-webkit-details-marker { display: none; }
.rvh-faq__item summary i {
    align-items: center; border: 1px solid var(--h-line); border-radius: 50%; color: var(--h-muted); display: inline-flex; flex: 0 0 auto;
    font-size: .75rem; height: 32px; justify-content: center; transition: transform .3s var(--h-ease), background-color .2s ease, color .2s ease; width: 32px;
}
.rvh-faq__item[open] summary i { background: var(--h-ink); border-color: var(--h-ink); color: var(--h-surface); transform: rotate(45deg); }
.rvh-faq__item p { color: var(--h-muted); font-size: 1rem; line-height: 1.65; max-width: 640px; padding: 0 52px 26px 0; }

/* ==========================================================================
   FINAL CTA
   ========================================================================== */
.rvh-cta { padding-bottom: clamp(64px, 8vw, 96px); }
.rvh-cta__box {
    background: var(--h-dark); border: 1px solid var(--h-dark-line); border-radius: 32px; color: #fff; overflow: hidden;
    padding: clamp(48px, 8vw, 96px) clamp(24px, 6vw, 80px); position: relative; text-align: center;
}
.rvh-cta__glow {
    background:
        radial-gradient(50% 70% at 50% 100%, rgba(20, 217, 212, .30), transparent 72%),
        radial-gradient(35% 45% at 78% 100%, rgba(198, 245, 111, .16), transparent 70%),
        radial-gradient(30% 40% at 22% 100%, rgba(131, 231, 238, .14), transparent 70%);
    inset: 0; pointer-events: none; position: absolute;
}
.rvh-cta__box h2 { font-size: clamp(2.1rem, 5vw, 3.9rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.02; margin-inline: auto; max-width: 820px; position: relative; text-wrap: balance; }
.rvh-cta__box h2 span { color: var(--h-accent); display: block; }
.rvh-cta__box p { color: #a9b4bf; font-size: clamp(1rem, 1.4vw, 1.15rem); line-height: 1.6; margin: 22px auto 0; max-width: 600px; position: relative; }
.rvh-cta__actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 36px; position: relative; }
.rvh-cta .rvh-btn--primary { background: var(--h-accent); box-shadow: 0 14px 36px -12px rgba(20, 217, 212, .6); color: #061214 !important; }

/* Hero entrance runs on CSS alone so the headline never waits for JS. */
.rvh-hero .rvh-in { animation: rvh-fade-up .9s var(--h-ease) both; animation-delay: var(--d, 0ms); }

/* ==========================================================================
   Motion
   ========================================================================== */
.rvh-js .rvh-reveal { opacity: 0; transform: translateY(18px); transition: opacity .65s var(--h-ease) var(--d, 0ms), transform .65s var(--h-ease) var(--d, 0ms); }
.rvh-js .rvh-reveal.is-in { opacity: 1; transform: none; }

@keyframes rvh-rotate { to { transform: rotate(360deg); } }
@keyframes rvh-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes rvh-pulse { 0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .55); } 70%, 100% { box-shadow: 0 0 0 7px rgba(34, 197, 94, 0); } }
@keyframes rvh-spin { to { transform: rotate(360deg); } }
@keyframes rvh-fade-up { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
    .rvh *, .rvh *::before, .rvh *::after { animation: none !important; transition: none !important; }
    .rvh-js .rvh-reveal { opacity: 1; transform: none; }
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1100px) {
    .rvh-pillars__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rvh-chip--source { left: -28px; }
    .rvh-chip--api { right: -20px; }
    .rvh-seal { right: -24px; }
}

@media (max-width: 991.98px) {
    .rvh-hero__inner { grid-template-columns: 1fr; }
    .rvh-hero__copy { margin-inline: auto; max-width: 680px; text-align: center; }
    .rvh-hero__lead { margin-inline: auto; }
    .rvh-hero__actions, .rvh-hero__assurance { justify-content: center; }
    .rvh-versus { grid-template-columns: 1fr; max-width: 560px; }
    .rvh-versus__vs { justify-self: center; margin-block: -8px; }
    .rvh-aud { grid-template-columns: 1fr; }
    .rvh-why__grid { grid-template-columns: 1fr; max-width: 640px; margin-inline: auto; }
    .rvh-faq__inner { grid-template-columns: 1fr; }
    .rvh-faq__inner .rvh-head { position: static; }
}

@media (max-width: 640px) {
    .rvh-shell { padding-inline: 16px; }
    .rvh-hero { padding-top: 96px; }
    .rvh-hero__title-b { font-size: .7em; }
    .rvh-hero__actions .rvh-btn { width: 100%; }
    .rvh-hero__assurance { align-items: center; flex-direction: column; gap: 10px; }
    .rvh-hero__stage { padding: 30px 0 0; }
    .rvh-seal { height: 74px; right: -8px; top: 4px; width: 74px; }
    .rvh-receipt__head { padding-right: 52px; }
    .rvh-receipt__order { font-size: .74rem; }
    .rvh-chip--source { left: auto; margin: -14px 0 0 12px; position: relative; top: auto; width: fit-content; }
    .rvh-chip--api { display: none; }
    .rvh-receipt { padding: 18px 16px 16px; }
    .rvh-receipt__perf { margin-inline: -16px; }
    .rvh-receipt__proof { grid-template-columns: 1fr; }
    .rvh-pillars__list { grid-template-columns: 1fr; }
    .rvh-tabs__list { border-radius: 18px; display: grid; grid-template-columns: repeat(3, 1fr); width: 100%; }
    .rvh-tabs__tab { flex-direction: column; font-size: .78rem; gap: 6px; min-height: 58px; padding: 6px; border-radius: 14px; }
    .rvh-aud { border-radius: 22px; }
    .rvh-aud__copy .rvh-btn { width: 100%; }
    .rvh-compare__row { grid-template-columns: 1fr 1fr; }
    .rvh-compare__row > span:first-child { grid-column: 1 / -1; padding-bottom: 0; }
    .rvh-compare__row--head > span:first-child { display: none; }
    .rvh-compare__row > span { font-size: .88rem; padding: 14px 14px; }
    .rvh-compare__row:not(.rvh-compare__row--head) > span:first-child { padding-top: 16px; }
    .rvh-faq__item summary { font-size: 1rem; padding: 20px 0; }
    .rvh-faq__item p { padding-right: 0; }
    .rvh-cta__actions .rvh-btn { width: 100%; }
    .rvh-cta__box { border-radius: 24px; }
}
