/* Subtle polish over the Cayman theme */
:root {
    --accent: #4f46e5; /* indigo for links */
    --dark-bg-start: #111827; /* start of header gradient */
    --dark-bg-end: #1f2937;   /* end of header gradient */
    --navy-text: #1f2937;     /* navy blue for light backgrounds */
    --light-text: #f9fafb;    /* near white for dark backgrounds */
  }
  
  /* Default link styles */
  a {
    color: var(--accent);
    text-decoration: none;
  }
  a:hover {
    color: #4338ca; /* darker indigo */
  }
  
  /* Header / page header (dark background) */
  .header, .page-header {
    background-image: linear-gradient(135deg, var(--dark-bg-start), var(--dark-bg-end));
    color: var(--light-text); /* white text on dark background */
  }
  
  /* Force all text inside header to be light */
  .header *, .page-header * {
    color: var(--light-text) !important;
  }
  .header a, .page-header a {
    color: var(--accent) !important; /* links in dark bg still indigo */
  }
  .header a:hover, .page-header a:hover {
    color: #a5b4fc !important; /* lighter indigo hover */
  }
  
  /* Light background headings and text */
  body, main, .project-card, .grid {
    color: var(--navy-text);
  }
  body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
    line-height: 1.6;
  }
  h1, h2, h3, h4, h5, h6 {
    color: var(--navy-text);
  }

.markdown-body {
  font-size: 1.08rem;
}

.markdown-body > *:first-child {
  margin-top: 0;
}

.markdown-body h1 {
  font-size: 2.2rem;
  margin: 0 0 0.75rem 0;
  line-height: 1.15;
}

.markdown-body h2 {
  font-size: 2rem;
  margin: 3rem 0 0.75rem 0;
  line-height: 1.2;
}

.markdown-body h3 {
  font-size: 1.3rem;
  margin: 1.1rem 0 0.55rem 0;
  line-height: 1.3;
}

.markdown-body p,
.markdown-body ul,
.markdown-body ol {
  margin: 0.8rem 0 1rem 0;
}

.markdown-body li + li {
  margin-top: 0.3rem;
}

.markdown-body ul,
.markdown-body ol {
  padding-left: 1.4rem;
}

/* Cayman theme resets list-style — force markers back */
main ul, .main-content ul, .markdown-body ul {
  list-style: disc;
}
main ol, .main-content ol, .markdown-body ol {
  list-style: decimal;
}
  
  /* Project cards */
.project-card {
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 16px;
  transition: transform .15s ease, box-shadow .15s ease;
}
  .project-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(0,0,0,.08);
  }
  
  /* Badges */
  .badge {
    background: #eef2ff;
    color: #3730a3;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: .8rem;
  }
  
  /* Layout helpers */
.grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  }

.card-grid {
  margin-top: 1rem;
}

.featured-card {
  display: flex;
  flex-direction: column;
}

.media-frame {
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 12px;
  margin-bottom: 12px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
}

.project-card h3 {
  margin: 0 0 8px 0;
  line-height: 1.25;
  font-weight: 700;
}

.card-description {
  margin: 0 0 12px 0;
  line-height: 1.5;
}

.section-note {
  margin: 0 0 1rem 0;
  max-width: 58rem;
  line-height: 1.55;
}

.tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.tag {
  display: inline-flex;
  align-items: center;
  background: #eef2ff;
  color: #3730a3;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: .78rem;
  line-height: 1.2;
  white-space: nowrap;
}

.card-media,
.media-placeholder {
  width: 100%;
  height: 100%;
}

.card-media {
  object-fit: cover;
  object-position: center top;
  display: block;
}

.card-media--arcade-cabinet {
  object-position: center 65%;
}

.media-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  text-align: center;
  color: #475569;
  background:
    linear-gradient(135deg, rgba(238, 242, 255, 0.95), rgba(224, 231, 255, 0.8)),
    repeating-linear-gradient(
      -45deg,
      rgba(79, 70, 229, 0.08),
      rgba(79, 70, 229, 0.08) 12px,
      rgba(79, 70, 229, 0.02) 12px,
      rgba(79, 70, 229, 0.02) 24px
    );
  border: 1px dashed #a5b4fc;
}

.section-note,
.card-note,
.card-date {
  color: #475569;
}

.card-date {
  font-size: 0.9rem;
  margin-bottom: 0.35rem;
}

.card-note {
  font-size: 0.9rem;
}

.card-links {
  margin: 0.2rem 0 0 0;
  font-size: 0.95rem;
}

.card-links a {
  margin-right: 12px;
}

.post-content a {
  color: #4338ca !important;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1.5px;
  font-weight: 500;
}

.post-content a:hover {
  color: #312e81 !important;
}
  
  /* Avatar image */
.avatar {
    width: 160px;   /* was 96px */
    height: 160px;
    min-width: 160px;
    min-height: 160px;
    aspect-ratio: 1 / 1;
    display: block;
    flex-shrink: 0;
    border-radius: 50%;
    object-fit: cover;
    object-position: center 22%;
    border: 3px solid #e5e7eb;
  }
  
  /* Kill Cayman green on headings everywhere */
.markdown-body h1, .markdown-body h2, .markdown-body h3,
.markdown-body h4, .markdown-body h5, .markdown-body h6,
h1, h2, h3, h4, h5, h6 {
  color: #1f2937 !important; /* navy on light backgrounds */
}

.markdown-body img {
  max-width: 100%;
  height: auto;
}

/* Headings/links specifically inside project cards */
.project-card h3, .project-card h3 a {
  color: #1f2937 !important;
}

/* If your name/title ever sits on a dark header area */
.page-header h1, .header h1,
.page-header h1 a, .header h1 a {
  color: #f9fafb !important; /* white on dark */
}

body .page-header h1, body .header h1,
body .page-header h1 a, body .header h1 a,
header.bg-\[\#111827\] h1, header.bg-\[\#111827\] p,
header.bg-\[\#111827\] a {
  color: #f9fafb !important;
}

header.bg-\[\#111827\] a:hover {
  color: #c7d2fe !important;
}

footer a,
footer a:visited,
footer a:hover {
  color: #f9fafb !important;
}

/* Links default to indigo (but headings above stay navy) */
.markdown-body a, .page-header a, a {
  color: #4f46e5 !important;
}
.markdown-body a:hover, .page-header a:hover, a:hover {
  color: #4338ca !important;
}