/* ---- Theme tokens ---- */
:root {
  --bg: #000000;
  --accent: #0b8c84;            /* deep blueish/greenish */
  --accent-blue: #147d92;       /* deep blue */
  --accent-dark: #043f4a;       /* darker accent for mobile nav & menu btn */
  --link: #82e6de;              /* light blue-green for links */
  --grad-start: #0ea5a6;        /* teal */
  --grad-end: #0b5f89;          /* deep blue-green */
}

html { scroll-behavior: smooth; font-size: 120%; } /* +50% global font size */

/* Base overrides */
body { background: var(--bg); }

/* Utility helpers */
.link {
  color: var(--link);
  text-underline-offset: 2px;
}
.link:hover { text-decoration: underline; }

.link-accent {
  color: var(--accent-blue);
  font-weight: 500;
  text-decoration: none;
  transition: color 0.2s ease, text-decoration 0.2s ease;
}

.link-accent:hover {
  text-decoration: underline;
  color: var(--accent); /* on hover shift to your main accent (#0b8c84) */
}

.link-icon {
  margin-right: 0.4rem;
}

/* Button base */
.btn {
  padding: 1rem 2.5rem;      /* ~2× original */
  font-size: 1.25rem;        /* bigger text inside buttons */
  line-height: 1;
}

.btn-outline {
  border: 1px solid currentColor;
  background: transparent;
  padding: 1rem 2.5rem;
  font-size: 1.25rem;
  color: #ffffff;
}

.btn-gradient {
  background-image: linear-gradient(90deg, var(--grad-start), var(--grad-end));
  color: #ffffff;
  transition: filter 0.2s ease, box-shadow 0.2s ease;
  padding: 1rem 2.5rem;
  font-size: 1.25rem;
}
.btn-gradient:hover { filter: brightness(1.06); }

.accent { color: var(--accent); }
.accent2 { color: var(--accent-blue);}

/* Smaller button size for header CTA only */
.btn-sm {
  padding: 0.5rem 1.25rem;   /* smaller than .btn */
  font-size: 1rem;           /* down from 1.25rem */
  line-height: 1.2;
}


/* Make focus states visible on keyboard nav */
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* Header link style */
.nav-link {
  font-size: 0.95rem;
  color: rgba(229, 229, 229, 0.85);
}
.nav-link:hover { color: #ffffff; }

h1.custom-heading {
  line-height: 1.1;
}

/* Mobile nav + menu btn accent background */
#mobileNav { background: var(--accent-dark); }
#menuBtn { background: var(--accent-dark); }

/* Images should never overflow cards */
img { display: block; max-width: 100%; height: auto; }

/* Logo name tighter tracking */
.logo-name { letter-spacing: 1px; }

/* --- Projects: transparent previews, no rounded wrappers --- */
#projects .bg-neutral-900 { background: transparent !important; }
#projects .rounded-2xl { border-radius: 0 !important; }
#projects .overflow-hidden { overflow: visible !important; }
#projects .border { border: 0 !important; }
#projects img { border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }

/* Tighter vertical spacing utility */
.tight-section {
  padding-top: 2rem !important;
  padding-bottom: 2rem !important;
}
@media (min-width: 768px) {
  .tight-section {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }
}

/* Optional: shared table border helper */
table thead th, table tbody td { border-bottom: 1px solid rgba(255,255,255,.1); }