/* Base variables and reset */
:root{
  --bg:#ffffff;
  --text:#0f172a;
  --muted:#6b7280;
  --primary:#3b82f6;
  --card:#fbfdff;
  --radius:12px;
}

/* Larger base font for "big" pages */
html{font-size:18px;line-height:1.6}
@media (min-width:1280px){html{font-size:20px}}

/* Body */
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}

/* Headings */
h1{font-size:2.25rem;line-height:1.05;margin:.2rem 0}
h2{font-size:1.75rem;margin:.35rem 0}
h3{font-size:1.25rem;margin:.4rem 0}

/* Navigation polish */
nav{font-weight:500}
nav a{color:var(--muted);transition:color .15s,background .15s}
nav a:hover{color:var(--primary)}

/* Buttons */
.btn-primary{background:var(--primary);color:#fff;padding:.6rem 1rem;border-radius:10px}
.btn-outline{border:1px solid rgba(15,23,42,0.06);padding:.5rem .9rem;border-radius:10px}

/* Cards */
.card{background:var(--card);border-radius:var(--radius);box-shadow:0 6px 18px rgba(12,20,30,0.06);overflow:hidden}
.card-body{padding:1.25rem}

/* Skill bars */
.skill-bar{height:.5rem;border-radius:999px;background:linear-gradient(90deg,var(--primary),#1e40af);width:0;transition:width .9s ease}

/* Images */
img{max-width:100%;height:auto;display:block}
.rounded-full{border-radius:9999px}

/* Forms */
input,textarea,select{font-size:1rem;padding:.6rem .8rem;border-radius:8px;border:1px solid rgba(15,23,42,0.06)}
input:focus,textarea:focus{outline:none;box-shadow:0 0 0 6px rgba(59,130,246,0.08)}

/* Footer */
footer{color:var(--muted);font-size:0.95rem}

/* Ensure images in circles always fit perfectly */
.rounded-full img,
img.rounded-full,
.profile-circle img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 9999px;
  display: block;
}

/* Accessibility: focus states for links and buttons */
a:focus, button:focus {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}