/* ── Hero ─────────────────────────────────────────────── */
.vr-hero {
    background: #030d1d;
    padding: 100px 0 72px;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.vr-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 60% 50% at 50% 0%, rgba(30,136,229,.12) 0%, transparent 70%);
    pointer-events: none;
}
.ct-kicker { font-size:.68rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:#1E88E5; display:block; margin-bottom:.75rem; }
.ct-h1 { font-size:clamp(2.2rem,4.5vw,3.4rem); font-weight:800; letter-spacing:-.03em; line-height:1.05; color:#fff; margin-bottom:1rem; }
.ct-h1 span { color:#1E88E5; }
.ct-lead { font-size:1rem; color:rgba(255,255,255,.6); max-width:560px; margin:0 auto; line-height:1.7; }

/* ── Main ─────────────────────────────────────────────── */
.vr-main { background:#021327; padding:64px 0 96px; min-height:420px; }
.vr-inner { max-width:640px; margin:0 auto; padding:0 1.5rem; }

/* ── Search form ──────────────────────────────────────── */
.vr-form-card {
    background:rgba(255,255,255,.025);
    border:1px solid rgba(255,255,255,.06);
    border-radius:16px;
    padding:2.5rem;
}
.vr-form-label {
    display:block; font-size:.75rem; font-weight:700;
    letter-spacing:.08em; text-transform:uppercase;
    color:rgba(255,255,255,.4); margin-bottom:.6rem;
}
.vr-form-row { display:flex; gap:.75rem; }
.vr-input {
    flex:1; background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.1);
    border-radius:10px; padding:.75rem 1rem;
    color:#fff; font-size:1rem; font-family:monospace;
    letter-spacing:.05em; outline:none;
    transition:border-color .2s;
}
.vr-input::placeholder { color:rgba(255,255,255,.2); font-family:sans-serif; letter-spacing:0; }
.vr-input:focus { border-color:#1E88E5; }
.vr-btn {
    background:#1E88E5; color:#fff; border:none;
    border-radius:10px; padding:.75rem 1.5rem;
    font-size:.9rem; font-weight:700; cursor:pointer;
    white-space:nowrap; transition:background .2s;
}
.vr-btn:hover { background:#1565C0; }

/* ── Valid result card ────────────────────────────────── */
.vr-result-card {
    background:rgba(255,255,255,.025);
    border:1px solid rgba(255,255,255,.06);
    border-radius:16px;
    overflow:hidden;
    margin-bottom:1.5rem;
}
.vr-result-header {
    background:linear-gradient(135deg, rgba(16,185,129,.12), rgba(16,185,129,.05));
    border-bottom:1px solid rgba(16,185,129,.15);
    padding:1.75rem 2rem;
    display:flex; align-items:flex-start; gap:1.25rem;
}
.vr-check-icon {
    width:44px; height:44px; flex-shrink:0;
    background:rgba(16,185,129,.15);
    border:1.5px solid rgba(16,185,129,.4);
    border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    margin-top:.1rem;
}
.vr-check-icon svg { width:22px; height:22px; }
.vr-result-badge {
    display:inline-block; font-size:.65rem; font-weight:700;
    letter-spacing:.1em; text-transform:uppercase;
    color:#10b981; background:rgba(16,185,129,.12);
    border:1px solid rgba(16,185,129,.25);
    border-radius:20px; padding:.25rem .75rem;
    margin-bottom:.5rem;
}
.vr-result-title { font-size:1.2rem; font-weight:700; color:#fff; margin-bottom:.2rem; }
.vr-result-sub { font-size:.85rem; color:rgba(255,255,255,.45); line-height:1.5; }

/* ── Detail rows ──────────────────────────────────────── */
.vr-details { padding:1.5rem 2rem; }
.vr-detail-row {
    display:flex; align-items:baseline; gap:1rem;
    border-bottom:1px solid rgba(255,255,255,.04);
    padding:.8rem 0;
}
.vr-detail-row:first-child { padding-top:0; }
.vr-detail-row:last-child  { border-bottom:none; padding-bottom:0; }
.vr-detail-label {
    width:140px; flex-shrink:0;
    font-size:.7rem; font-weight:700; letter-spacing:.08em;
    text-transform:uppercase; color:rgba(255,255,255,.3);
}
.vr-detail-value { flex:1; font-size:.92rem; color:rgba(255,255,255,.75); line-height:1.4; }
.vr-detail-value.company { font-size:1.05rem; font-weight:600; color:#fff; }
.vr-detail-value.code-val { font-family:monospace; font-size:.85rem; color:#c9a84c; letter-spacing:.05em; }

/* ── Disclaimer inside result ─────────────────────────── */
.vr-result-disclaimer {
    margin:0 2rem 1.5rem;
    padding:.75rem 1rem;
    background:rgba(184,147,90,.05);
    border-left:2px solid rgba(184,147,90,.25);
    border-radius:0 6px 6px 0;
    font-size:.75rem; line-height:1.65;
    color:rgba(255,255,255,.3);
}

/* ── Invalid / error card ─────────────────────────────── */
.vr-error-card {
    background:rgba(239,68,68,.05);
    border:1px solid rgba(239,68,68,.2);
    border-radius:16px;
    padding:1.75rem 2rem;
    display:flex; align-items:flex-start; gap:1.25rem;
    margin-bottom:1.5rem;
}
.vr-error-icon {
    width:40px; height:40px; flex-shrink:0;
    background:rgba(239,68,68,.1);
    border:1.5px solid rgba(239,68,68,.3);
    border-radius:50%;
    display:flex; align-items:center; justify-content:center;
}
.vr-error-icon svg { width:20px; height:20px; }
.vr-error-title { font-size:1rem; font-weight:700; color:#f87171; margin-bottom:.35rem; }
.vr-error-text  { font-size:.87rem; color:rgba(255,255,255,.45); line-height:1.6; }

/* ── Check another link ───────────────────────────────── */
.vr-another { text-align:center; margin-top:1rem; }
.vr-another a { font-size:.87rem; color:rgba(255,255,255,.35); text-decoration:none; transition:color .2s; }
.vr-another a:hover { color:#1E88E5; }

/* ── Issued-by footer strip ───────────────────────────── */
.vr-issued-by {
    display:flex; align-items:center; justify-content:center;
    gap:.5rem; margin-top:2rem;
    font-size:.75rem; color:rgba(255,255,255,.2);
    letter-spacing:.04em;
}
.vr-issued-by span { color:rgba(255,255,255,.35); font-weight:600; }

@media(max-width:600px) {
    .vr-form-row { flex-direction:column; }
    .vr-result-header, .vr-details { padding:1.25rem; }
    .vr-result-disclaimer { margin:0 1.25rem 1.25rem; }
    .vr-error-card { padding:1.25rem; }
    .vr-detail-label { width:110px; }
}