/* Vars & base */
:root{
  --color-primary:#0EA5E9; /* Primary */
  --color-accent:#F59E0B;  /* Accent */
  --color-neutral:#0F172A; /* Neutral */
  --slate-50:#F8FAFC;
  --slate-100:#F1F5F9;
  --slate-200:#E2E8F0;
  --slate-300:#CBD5E1;
  --slate-600:#475569;
  --slate-700:#334155;
  --slate-900:#0F172A;
}

html{scroll-behavior:smooth;}
body{
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  background:var(--slate-50);
  color:var(--slate-900);
}

/* Headings use Poppins */
h1,h2,h3,h4,h5,h6,.font-poppins{
  font-family:"Poppins",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans";
}

/* Skip link */
.skip-link{
  position:absolute;left:-9999px;top:0;
  padding:.5rem .75rem;background:var(--color-neutral);color:#fff;border-radius:.5rem
}
.skip-link:focus{left:.5rem;top:.5rem;z-index:50}

/* --------- Links (nav/footer) ---------- */
.nav-link{
  color:var(--slate-700);
  font-size:.875rem;
  font-weight:500;
  padding:.25rem .25rem;
  border-radius:.375rem;
  text-decoration:none;
}
.nav-link:hover{color:var(--slate-900)}
.nav-link:focus-visible{
  outline:2px solid var(--color-primary);
  outline-offset:2px;
}

.mobile-nav-link{
  display:block;
  padding:.5rem .75rem;
  color:var(--slate-700);
  border-radius:.5rem;
  text-decoration:none;
}
.mobile-nav-link:hover{background:var(--slate-100)}
.mobile-nav-link:focus-visible{
  outline:2px solid var(--color-primary);
  outline-offset:2px;
}

.footer-link{
  color:#e5eaf1;
  font-size:.875rem;
  text-decoration:none;
  padding:.25rem;
  border-radius:.375rem;
}
.footer-link:hover{color:#fff}
.footer-link:focus-visible{
  outline:2px solid var(--color-primary);
  outline-offset:2px;
}

/* --------- Buttons ---------- */
.btn-primary{
  display:inline-flex;align-items:center;justify-content:center;
  padding:.75rem 1.25rem;border-radius:.75rem;background:var(--color-primary);color:#fff;font-weight:500;
  border:1px solid rgba(14,165,233,.2);
  box-shadow:0 1px 2px rgba(0,0,0,.05);
  text-decoration:none;
}
.btn-primary:hover{background:#0b8fc7}
.btn-primary:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}

.btn-secondary{
  display:inline-flex;align-items:center;justify-content:center;
  padding:.75rem 1.25rem;border-radius:.75rem;color:#fff;font-weight:500;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.3);
  box-shadow:0 1px 2px rgba(0,0,0,.05);
  text-decoration:none;
}
.btn-secondary:hover{background:rgba(255,255,255,.2)}
.btn-secondary:focus-visible{outline:2px solid #fff;outline-offset:2px}

.btn-accent{
  display:inline-flex;align-items:center;justify-content:center;
  padding:.75rem 1.25rem;border-radius:.75rem;font-weight:600;
  background:var(--color-accent);color:var(--slate-900);
  box-shadow:0 1px 2px rgba(0,0,0,.05);
  text-decoration:none;
}
.btn-accent:hover{background:#FBBF24}
.btn-accent:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}

/* --------- Section titles ---------- */
.section-title{
  font-family:"Poppins",ui-sans-serif,system-ui;
  font-weight:600;
  font-size:clamp(1.5rem,1.2rem + 1vw,1.875rem);
  color:var(--slate-900);
  margin:0 0 .5rem 0;
}

/* --------- Cards ---------- */
.card{
  background:#fff;border:1px solid var(--slate-200);
  border-radius:1rem;
  padding:1.5rem;
  box-shadow:0 1px 2px rgba(0,0,0,.05);
}
.card-title{font-weight:600;font-size:1.125rem;color:var(--slate-900);margin:0 0 .25rem}
.card-text{color:#64748b}
.card-link{
  display:inline-block;margin-top:1rem;
  color:#0284C7;text-decoration:none;font-weight:500;
}
.card-link:hover{color:#0369A1}

/* icon badge */
.icon-badge{
  display:inline-flex;align-items:center;justify-content:center;
  width:2.25rem;height:2.25rem;margin-bottom:1rem;
  border-radius:.75rem;
  background:linear-gradient(135deg,var(--color-primary),var(--color-accent));
  color:#fff;font-weight:600;
}

/* --------- Team ---------- */
.team-card{
  background:#fff;border:1px solid var(--slate-200);
  border-radius:1rem;padding:1rem;box-shadow:0 1px 2px rgba(0,0,0,.05);
}
.team-photo{
  width:100%;height:10rem;object-fit:cover;border-radius:.75rem;margin-bottom:.75rem;background:#f1f5f9;
}

/* --------- Forms ---------- */
.form-label{display:block;font-size:.875rem;font-weight:500;color:var(--slate-700);margin-bottom:.25rem}
.form-input{
  width:100%;padding:.5rem .75rem;border-radius:.75rem;
  background:#fff;border:1px solid var(--slate-300);
  box-shadow:inset 0 1px 0 rgba(0,0,0,.02);
}
.form-input:focus{outline:2px solid var(--color-primary);outline-offset:2px}
.form-error{margin-top:.25rem;min-height:1.25rem;font-size:.875rem;color:#E11D48}

/* Helper for red ring on invalid (added by JS) */
.ring-rose-400{outline:2px solid #fb7185 !important;outline-offset:2px !important}
.border-rose-400{border-color:#fb7185 !important}

/* Tiny utility */
.check-dot{
  display:inline-block;width:.75rem;height:.75rem;border-radius:9999px;
  background:linear-gradient(135deg,var(--color-primary),var(--color-accent));
  margin-top:.4rem;
}