/* Veriscia Cyber — shared design system
   Fonts: Cormorant Garamond (display serif) + Public Sans (UI sans)
   Palette: navy #0a1830 base, blue accents #3f6ea6/#5c7fa8, gold monogram #EBCF7B */

* { box-sizing: border-box; }
html, body { margin: 0; }

body {
  font-family: 'Public Sans', system-ui, -apple-system, sans-serif;
  background: #0a1830;
  color: #16283f;
  -webkit-font-smoothing: antialiased;
}

a { text-decoration: none; }

/* ---------- hero animations ---------- */
@keyframes vcpulse { 0%,100%{opacity:.45} 50%{opacity:1} }
@keyframes vcfloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
@keyframes vcbeam  { 0%,100%{opacity:.4}  50%{opacity:.95} }

/* ---------- header nav ---------- */
.vc-nav a { color: #a9bcd6; transition: color .2s ease; }
.vc-nav a:hover { color: #fff; }
.vc-nav a[data-active="true"] { color: #dbe6f5; border-bottom: 2px solid #5c7fa8; padding-bottom: 2px; }

.vc-burger { display: none; }

/* ---------- buttons ---------- */
.vc-btn-primary { transition: background .2s ease; }
.vc-btn-primary:hover { background: #6b8db5; }
.vc-btn-ghost { transition: border-color .2s ease; }
.vc-btn-ghost:hover { border-color: rgba(255,255,255,.55); }

/* ---------- misc hover/focus (ported from design style-hover) ---------- */
.vc-social { transition: border-color .2s ease; }
.vc-social:hover { border-color: #5c7fa8; }
.vc-crumb { transition: color .2s ease; }
.vc-crumb:hover { color: #bcd0ea; }
.vc-download { transition: background .2s ease; }
.vc-download:hover { background: #e3c05f; }
.vc-unlock-input { transition: border-color .2s ease; }
.vc-unlock-input:focus { border-color: #5c7fa8; }
.vc-unlock-btn { transition: background .2s ease; }
.vc-unlock-btn:hover { background: #e3c05f; }
.vc-card-link { transition: transform .2s ease, box-shadow .2s ease; }
.vc-card-link:hover { transform: translateY(-3px); box-shadow: 0 16px 34px rgba(8,20,40,.16); }

/* ---------- responsive ---------- */
@media (max-width: 1000px) {
  .vc-hero { grid-template-columns: 1fr !important; gap: 22px !important; }
  .vc-h1 { font-size: 52px !important; }
  .vc-herographic { height: 400px !important; max-width: 540px !important; width: 100% !important; margin: 0 auto !important; }
  .vc-grid4 { grid-template-columns: repeat(2,1fr) !important; row-gap: 42px !important; }
  .vc-pad { padding-left: 28px !important; padding-right: 28px !important; }
}
@media (max-width: 900px) {
  .vc-ph1 { font-size: 44px !important; }
  .vc-book { grid-template-columns: 1fr !important; }
  .vc-cover { height: 200px !important; }
}
@media (max-width: 820px) {
  .vc-burger { display: flex !important; }
  .vc-nav {
    display: none !important; position: absolute !important; top: 100% !important;
    left: 0 !important; right: 0 !important; flex-direction: column !important;
    align-items: stretch !important; gap: 0 !important; background: #0a1830 !important;
    border-top: 1px solid rgba(255,255,255,.08) !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    padding: 6px 0 !important; z-index: 30 !important;
  }
  .vc-nav[data-open="true"] { display: flex !important; }
  .vc-nav a { padding: 14px 30px !important; border-bottom: 1px solid rgba(255,255,255,.05) !important; }
  .vc-nav a[data-active="true"] { border-bottom: 1px solid rgba(255,255,255,.05) !important; }
}
@media (max-width: 600px) {
  .vc-h1 { font-size: 40px !important; }
  .vc-ph1 { font-size: 34px !important; }
  .vc-lead, .vc-plead { font-size: 17px !important; }
  .vc-grid3 { grid-template-columns: 1fr !important; }
  .vc-hero { padding-top: 44px !important; padding-bottom: 54px !important; }
  .vc-herographic { height: 330px !important; }
  .vc-ctah { font-size: 26px !important; }
  .vc-cta { flex-direction: column !important; align-items: flex-start !important; }
  .vc-brandsub { display: none !important; }
  .vc-pad, .vc-headpad, .vc-footpad, .vc-ctapad { padding-left: 20px !important; padding-right: 20px !important; }
  .vc-unlockrow { flex-direction: column !important; align-items: stretch !important; }
  .vc-suprow { flex-wrap: wrap !important; }
}
@media (max-width: 440px) {
  .vc-grid4 { grid-template-columns: 1fr !important; }
}