:root {
   --kategory-dark-gray: rgb(87, 86, 86);
   --kategory-red: rgb(227, 6, 19);
   --kategory-green: rgb(0, 234, 0);
   --kategory-yellow: rgb(252, 228, 0);
   --kategory-orange: rgb(255, 126, 0);
   --kategory-light-blue: rgb(0, 240, 240);
   --kategory-dark-blue: rgb(25, 118, 225);
   --kategory-white: rgb(255, 255, 255);
   --kategory-black: rgb(0, 0, 0);
   --kategory-serif: "Times New Roman", Times, Baskerville, Georgia, serif;
   --kategory-mono: "Consolas", "Monaco", "Menlo", "Ubuntu Mono", "source-code-pro", monospace;
}

html,
body {
   min-height: 100%;
}

body {
   margin: 0;
   font-family: var(--kategory-serif);
   color: var(--kategory-black);
   background: var(--kategory-white);
}

code,
kbd,
pre,
samp {
   font-family: var(--kategory-mono);
}

.site-shell {
   min-height: 100vh;
}

.kategory-home {
   background:
      radial-gradient(circle at center, rgba(227, 6, 19, 0.08), transparent 34rem),
      linear-gradient(135deg, rgba(87, 86, 86, 0.08), transparent 42%);
}

.kategory-logo {
   display: block;
   width: min(72vw, 34rem);
   height: auto;
}

.logismy-logo {
   width: clamp(7rem, 18vw, 12rem);
   height: auto;
}

.logismy-home {
   overflow-x: hidden;
   background:
      radial-gradient(circle at center, rgba(227, 6, 19, 0.16), transparent 30rem),
      linear-gradient(135deg, rgba(87, 86, 86, 0.32), transparent 46%),
      var(--kategory-black);
}

.lambda-stage {
   color: var(--kategory-white);
   font-size: clamp(12rem, 44vw, 34rem);
   line-height: 1;
   text-shadow: 0 0 2rem rgba(227, 6, 19, 0.44);
}

/* --- Blog Styles --- */

.filter-pill {
   font-family: var(--kategory-serif);
   color: var(--kategory-dark-gray);
   background-color: transparent;
   border: 1px solid var(--kategory-dark-gray);
   border-radius: 0;
   padding: 0.35rem 1rem;
   transition: all 0.25s ease-in-out;
}

.filter-pill:hover,
.filter-pill.active {
   color: var(--kategory-white);
   background-color: var(--kategory-dark-gray);
   border-color: var(--kategory-dark-gray);
}

.filter-pill.active {
   box-shadow: 0 0 0.5rem rgba(87, 86, 86, 0.2);
}

.blog-post-card {
   background-color: var(--kategory-white);
   border-color: var(--kategory-dark-gray) !important;
   transition: all 0.25s ease-in-out;
}

.blog-post-card:hover {
   border-color: var(--kategory-red) !important;
   box-shadow: 0 0.5rem 1.5rem rgba(227, 6, 19, 0.04);
}

.blog-title-link {
   color: var(--kategory-black);
   font-family: var(--kategory-serif);
   text-decoration: none;
   transition: color 0.2s ease;
}

.blog-post-card:hover .blog-title-link,
.blog-title-link:hover {
   color: var(--kategory-red);
}

.badge-category {
   font-family: var(--kategory-serif);
   font-weight: normal;
   color: var(--kategory-dark-gray);
   background-color: transparent;
   border: 1px solid var(--kategory-dark-gray);
   border-radius: 0;
   padding: 0.25rem 0.6rem;
}

.back-link {
   color: var(--kategory-red);
   font-family: var(--kategory-serif);
   transition: transform 0.2s ease, opacity 0.2s ease;
}

.back-link:hover {
   color: var(--kategory-red);
   opacity: 0.8;
   transform: translateX(-0.25rem);
}

.kategory-link {
   color: var(--kategory-red);
   text-decoration: none;
   border-bottom: 1px solid transparent;
   transition: border-color 0.2s ease;
}

.kategory-link:hover {
   color: var(--kategory-red);
   border-bottom-color: var(--kategory-red);
}

.blog-content {
   font-family: var(--kategory-serif);
   font-size: 1.15rem;
   line-height: 1.75;
   color: var(--kategory-black);
}

.blog-content p {
   margin-bottom: 1.5rem;
}

.blog-content strong {
   color: var(--kategory-black);
}

.blog-content ul,
.blog-content ol {
   margin-bottom: 1.5rem;
   padding-left: 1.5rem;
}

.blog-content li {
   margin-bottom: 0.5rem;
}

.border-dark-gray {
   border-color: var(--kategory-dark-gray) !important;
}

/* --- Layout Styles --- */

.fixed-logo-container {
   position: fixed;
   top: 1.5rem;
   left: 1.5rem;
   z-index: 1000;
}

.kategory-logo-fixed {
   width: clamp(6rem, 15vw, 12rem);
   height: auto;
   display: block;
   filter: drop-shadow(0px 2px 4px rgba(255,255,255,0.5));
}

.content-wrapper {
   position: relative;
   z-index: 1;
}

.kategory-section {
   padding-top: 4rem;
   padding-bottom: 4rem;
}

.section-light {
   background-color: var(--kategory-white);
   color: var(--kategory-black);
}

.section-dark {
   background-color: var(--kategory-dark-gray);
   color: var(--kategory-white);
}

.kategory-text-link {
   color: var(--kategory-red);
   text-decoration: none;
   border-bottom: 1px solid transparent;
   transition: border-color 0.2s ease;
}

.kategory-text-link:hover {
   color: var(--kategory-red);
   border-bottom-color: var(--kategory-red);
}

.section-dark .kategory-text-link {
   color: var(--kategory-red);
}

.kategory-btn {
   background-color: transparent;
   color: var(--kategory-red);
   border: 1px solid var(--kategory-red);
   font-family: var(--kategory-serif);
   padding: 0.5rem 1.5rem;
   border-radius: 0;
   transition: all 0.2s ease;
}

.kategory-btn:hover {
   background-color: var(--kategory-red);
   color: var(--kategory-white);
}

/* --- Menu Styles --- */

.fixed-menu-container {
   position: fixed;
   top: 1.5rem;
   right: 1.5rem;
   z-index: 1000;
}

.kategory-nav-bg {
   background-color: rgba(255, 255, 255, 0.95);
   backdrop-filter: blur(8px);
   border: 1px solid var(--kategory-dark-gray);
   border-radius: 0.25rem;
   padding: 0.25rem 1rem;
   box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.kategory-nav-link {
   color: var(--kategory-black) !important;
   font-family: var(--kategory-serif);
   font-size: 1.1rem;
   margin-left: 1rem;
   transition: color 0.2s ease;
}

.kategory-nav-link:hover {
   color: var(--kategory-red) !important;
}

.navbar-toggler {
   border: 1px solid var(--kategory-dark-gray) !important;
   border-radius: 0 !important;
   padding: 0.25rem 0.5rem;
}

.navbar-toggler:focus {
   box-shadow: 0 0 0 0.25rem rgba(87, 86, 86, 0.25) !important;
}
