/* ----------------------------
   Catppuccin Mocha Palette
----------------------------- */
:root {
  --ctp-base: #1e1e2e;
  --ctp-mantle: #181825;
  --ctp-crust: #11111b;

  --ctp-text: #cdd6f4;
  --ctp-subtext1: #bac2de;
  --ctp-subtext0: #a6adc8;

  --ctp-surface0: #313244;
  --ctp-surface1: #45475a;
  --ctp-surface2: #585b70;

  --ctp-overlay0: #6c7086;
  --ctp-overlay1: #7f849c;
  --ctp-overlay2: #9399b2;

  --ctp-blue: #89b4fa;
  --ctp-green: #a6e3a1;
  --ctp-yellow: #f9e2af;
  --ctp-peach: #fab387;
  --ctp-red: #f38ba8;
  --ctp-mauve: #cba6f7;
  --ctp-pink: #f5c2e7;
  --ctp-teal: #94e2d5;
  --ctp-sky: #89dceb;
  --ctp-lavender: #b4befe;
}

/* ----------------------------
   Base Page Styles
----------------------------- */
body {
  background-color: var(--ctp-base);
  color: var(--ctp-text);
  font-family: 'JetBrainsMono Nerd Font', 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  margin: 40px;
  line-height: 1.7;
}

/* Layout container */
.container {
  max-width: 720px;
  margin: auto;
  padding: 0 1em;
}

/* Headings */
h1 {
  font-size: 2em;
  font-weight: bold;
  color: var(--ctp-lavender);
  margin-bottom: 1em;
}

h2 {
  font-size: 1.2em;
  margin-top: 2em;
  margin-bottom: 0.5em;
  text-transform: uppercase;
  color: var(--ctp-subtext1);
}

h3 {
  font-size: 1em;
  font-weight: bold;
  color: var(--ctp-subtext0);
  margin-top: 1.5em;
  margin-bottom: 0.5em;
}

/* Lists */
ul {
  list-style-type: disc;
  padding-left: 1.5em;
  margin-top: 0.5em;
  margin-bottom: 1em;
}

li {
  margin: 0.3em 0;
}

/* Personal name highlight */
li.name {
  color: var(--ctp-pink);
  font-weight: bold;
}

/* Links */
a {
  color: var(--ctp-green);
  text-decoration: underline;
  transition: color 0.2s ease-in-out;
}

a:hover {
  color: var(--ctp-blue);
}

/* Optional highlighted posts (keep or remove) */
a[href*="clair-obscur"],
a[href*="neovim"],
a[href*="new-system"], 
a[href*="tal-privacy"]{
  color: var(--ctp-yellow);
}

/* Inline code and blocks */
pre,
code {
  background-color: var(--ctp-surface0);
  color: var(--ctp-green);
  padding: 0.2em 0.4em;
  border-radius: 4px;
  font-family: inherit;
  font-size: 0.95em;
}

code.prompt {
  color: var(--ctp-peach);
}

/* Blockquotes */
blockquote {
  border-left: 3px solid var(--ctp-surface2);
  padding-left: 1em;
  color: var(--ctp-subtext0);
  font-style: italic;
  margin: 1.5em 0;
}

/* Horizontal rule */
hr {
  border: none;
  height: 1px;
  background-color: var(--ctp-surface1);
  margin: 2em 0;
}

/* Images */
img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 1.5em auto;
  border-radius: 6px;
}

/* Sections and articles */
section,
article {
  margin-bottom: 2em;
}
/* Highlighted Block */
.highlighted-block {
  background-color: #4d918b; /* A softer, neutral color */
  color: var(--ctp-text);
  border-left: 4px solid var(--ctp-yellow); /* Keep the brighter color for the border */
  padding: 1em;
  border-radius: 4px;
  margin: 1.5em 0;
  font-weight: bold; /* Make the text bold for emphasis */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Add a subtle shadow for depth */
}