:root{
    --c-bg: #FCFDFA;
    --c-primary: #17A0DC;
    --c-deep: #1F5AAB;
    --c-navy: #283C8E;
    --c-steel: #48799A;
    --c-teal: #98BBC1;
    --c-gold: #868048;
  }
  
  html, body { background: var(--c-bg); }
  
  .navlink{
    display:inline-flex;
    align-items:center;
    padding: .5rem .75rem;
    border-radius: .75rem;
    color: rgb(51 65 85); /* slate-700 */
    transition: background .15s ease, color .15s ease;
  }
  .navlink:hover{
    background: rgba(152, 187, 193, .18); /* teal tint */
    color: rgb(30 41 59); /* slate-800 */
  }
  
  .btn-primary{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding: .6rem .9rem;
    border-radius: .9rem;
    background: var(--c-primary);
    color: white;
    font-weight: 600;
    box-shadow: 0 8px 18px rgba(23,160,220,.18);
    transition: transform .12s ease, filter .12s ease;
  }
  .btn-primary:hover{ filter: brightness(.97); }
  .btn-primary:active{ transform: translateY(1px); }
  
  .btn-outline{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding: .55rem .85rem;
    border-radius: .9rem;
    border: 1px solid rgba(31,90,171,.25);
    color: rgb(30 41 59);
    background: white;
    transition: background .15s ease, border-color .15s ease;
  }
  .btn-outline:hover{
    background: rgba(23,160,220,.06);
    border-color: rgba(31,90,171,.35);
  }
  
  .badge{
    display:inline-flex;
    align-items:center;
    gap:.4rem;
    padding:.35rem .6rem;
    border-radius:999px;
    font-size:.85rem;
    background: rgba(23,160,220,.10);
    color: var(--c-deep);
    border: 1px solid rgba(23,160,220,.20);
  }
  
  .card{
    background: white;
    border: 1px solid rgba(15, 23, 42, .06);
    border-radius: 1.25rem;
    box-shadow: 0 14px 32px rgba(2, 6, 23, .06);
  }
  
  .hr-soft{
    height:1px;
    background: linear-gradient(90deg, transparent, rgba(31,90,171,.25), transparent);
  }