:root {
    --ct-navy:  #0a1628;
    --ct-gold:  #c9a84c;
    --ct-gold2: #e8c96e;
}

body { font-family: 'Inter', sans-serif; background: #f0f2f5; }

/* ── Public Navbar ─────────────────────────────────────── */
.ct-pub-nav { background: var(--ct-navy); border-bottom: 2px solid var(--ct-gold); }
.ct-brand { font-family: 'Cinzel', serif; color: var(--ct-gold) !important; letter-spacing: .05em; font-size: 1.3rem; }

/* ── Hero / Lookup ─────────────────────────────────────── */
.ct-hero { background: linear-gradient(135deg, var(--ct-navy) 0%, #1a2a4a 100%); color: #fff; padding: 5rem 0 4rem; text-align: center; }
.ct-hero h1 { font-family: 'Cinzel', serif; font-size: 2.4rem; margin-bottom: .5rem; }
.ct-hero .subtitle { color: rgba(255,255,255,.7); font-size: 1.05rem; }
.ct-lookup-card { background: #fff; border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,.25); padding: 2.5rem; max-width: 560px; margin: -2.5rem auto 0; }
.ct-lookup-card .form-control { font-size: 1.05rem; border: 2px solid #e5e7eb; border-radius: 10px; padding: .75rem 1rem; }
.ct-lookup-card .form-control:focus { border-color: var(--ct-gold); box-shadow: 0 0 0 3px rgba(201,168,76,.15); }

/* ── Certificate Display ─────────────────────────────────────── */
.ct-cert-wrapper { background: #fff; max-width: 820px; margin: 2rem auto; border-radius: 12px; box-shadow: 0 4px 24px rgba(0,0,0,.1); overflow: hidden; }
.ct-certificate {
    background: #fff;
    border: 12px solid var(--ct-navy);
    outline: 3px solid var(--ct-gold);
    outline-offset: -18px;
    padding: 3rem 3.5rem;
    position: relative;
    min-height: 580px;
}
.ct-cert-header { text-align: center; margin-bottom: 1.5rem; }
.ct-cert-title { font-family: 'Cinzel', serif; color: var(--ct-navy); font-size: 1.05rem; letter-spacing: .15em; text-transform: uppercase; }
.ct-cert-org { font-family: 'Cinzel', serif; color: var(--ct-navy); font-size: 1.9rem; font-weight: 700; letter-spacing: .05em; }
.ct-cert-divider { width: 80px; height: 3px; background: linear-gradient(90deg, var(--ct-navy), var(--ct-gold), var(--ct-navy)); margin: .75rem auto; }
.ct-cert-body { text-align: center; }
.ct-cert-presents { color: #555; font-size: .9rem; letter-spacing: .1em; text-transform: uppercase; margin-bottom: .5rem; }
.ct-recipient-name { font-family: 'Great Vibes', cursive; font-size: 3.5rem; color: var(--ct-navy); line-height: 1.1; margin: .25rem 0 .75rem; }
.ct-cert-desc { color: #333; font-size: .95rem; line-height: 1.6; max-width: 520px; margin: 0 auto 1.5rem; }
.ct-cert-domain { font-family: 'Cinzel', serif; color: var(--ct-gold); font-size: 1.15rem; font-weight: 600; }
.ct-cert-meta { display: flex; justify-content: space-between; align-items: flex-end; margin-top: 2rem; }
.ct-cert-meta-left, .ct-cert-meta-right { font-size: .8rem; color: #555; }
.ct-cert-number { font-family: 'Courier New', monospace; font-size: .78rem; color: var(--ct-navy); font-weight: 600; }
.ct-cert-qr { text-align: center; }
.ct-cert-qr small { display: block; color: #888; font-size: .68rem; margin-top: .25rem; word-break: break-all; }
.ct-cert-footer { display: flex; justify-content: space-between; align-items: center; padding: 1.25rem 3.5rem; background: #f8f9fa; border-top: 1px solid #eee; }
.ct-corner-ornament { position: absolute; width: 40px; height: 40px; border-color: var(--ct-gold); }
.ct-corner-tl { top: 24px; left: 24px; border-top: 3px solid var(--ct-gold); border-left: 3px solid var(--ct-gold); }
.ct-corner-tr { top: 24px; right: 24px; border-top: 3px solid var(--ct-gold); border-right: 3px solid var(--ct-gold); }
.ct-corner-bl { bottom: 24px; left: 24px; border-bottom: 3px solid var(--ct-gold); border-left: 3px solid var(--ct-gold); }
.ct-corner-br { bottom: 24px; right: 24px; border-bottom: 3px solid var(--ct-gold); border-right: 3px solid var(--ct-gold); }

/* ── Verify Page ─────────────────────────────────────── */
.ct-verify-banner { border-radius: 12px; padding: 1.5rem 2rem; text-align: center; margin-bottom: 1.5rem; }
.ct-verify-valid   { background: #d1fae5; border: 2px solid #10b981; }
.ct-verify-revoked { background: #fee2e2; border: 2px solid #ef4444; }
.ct-verify-invalid { background: #fef3c7; border: 2px solid #f59e0b; }

/* ── Select Certificate ─────────────────────────────────────── */
.ct-select-card { cursor: pointer; border: 2px solid #e5e7eb; border-radius: 12px; padding: 1.25rem; transition: all .2s; }
.ct-select-card:hover { border-color: var(--ct-gold); background: #fffbf0; }

/* ── Footer ─────────────────────────────────────── */
.ct-footer { background: var(--ct-navy); color: rgba(255,255,255,.6); text-align: center; padding: 1.5rem; font-size: .85rem; margin-top: 3rem; }

/* ── Download Button ─────────────────────────────────────── */
.btn-ct-gold { background: var(--ct-gold); color: var(--ct-navy); border: none; font-weight: 600; }
.btn-ct-gold:hover { background: var(--ct-gold2); color: var(--ct-navy); }
.btn-ct-navy { background: var(--ct-navy); color: #fff; border: none; font-weight: 600; }
.btn-ct-navy:hover { background: #1a2a4a; color: #fff; }

@media (max-width: 768px) {
    .ct-certificate { padding: 1.75rem 1.25rem; border: 8px solid var(--ct-navy); outline-offset: -12px; }
    .ct-recipient-name { font-size: 2.6rem; }
    .ct-cert-meta { flex-direction: column; gap: 1rem; text-align: center; }
    .ct-cert-footer { flex-direction: column; gap: 1rem; padding: 1rem; text-align: center; }
}

@media print {
    .no-print { display: none !important; }
    body { background: #fff; }
    .ct-cert-wrapper { box-shadow: none; max-width: 100%; }
}
