/* OSINT Radar */
:root {
  --radar-blue: #0066ff;
  --radar-dark: #1d1d1f;
  --radar-light: #f5f5f7;
  --radar-gray: #86868b;
  --radar-white: #ffffff;
  --font-system: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --max-width: 1200px;
}

body {
  font-family: var(--font-system);
  color: var(--radar-dark);
  background: var(--radar-white);
  line-height: 1.6;
}
.py-10 {
  padding-top: 5rem !important;
  padding-bottom: 5rem !important;
}
/* Navbar Styles */
.navbar-toggler {width: 20px;height: 20px;position: relative;transition: .5s ease-in-out;border: 0;display: flex;flex-direction: column;justify-content: center;align-items: center;background: transparent;cursor: pointer;}
.navbar-toggler,
.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {outline: none;box-shadow: none;border: 0;position: relative;}
.navbar-toggler span {margin: 0;padding: 0;}
.toggler-icon {display: block;position: absolute;height: 3px;width: 100%;background: #1a1dd3;border-radius: 1px;opacity: 1;left: 0;transform: rotate(0deg);transition: .25s ease-in-out;}
.middle-bar {margin-top: 0px;}

.navbar .nav-link:hover {color: var(--radar-blue);transition: color .2s ease-in-out;}

/* State when the navbar is collapsed */

.navbar-toggler.collapsed .top-bar {position: absolute;top: 0px;transform: rotate(0deg);}
.navbar-toggler.collapsed .middle-bar {opacity: 1;position: absolute;top: 10px;}
.navbar-toggler.collapsed .bottom-bar {position: absolute;top: 20px;transform: rotate(0deg);}

/* when navigation is clicked */
.navbar-toggler .top-bar {top: inherit;transform: rotate(135deg);}
.navbar-toggler .middle-bar {opacity: 0;top: inherit;}
.navbar-toggler .bottom-bar {top: inherit;transform: rotate(-135deg);}

/* Color of 3 lines */
.navbar-toggler.collapsed .toggler-icon {background: linear-gradient( 263deg, #1a1dd3 0%, rgba(0,212,255,1) 100% );}
        
/* Hero Section */
.hero-section h1 {position: relative;background: linear-gradient(145deg, #9157a7, #67297e ,#1a1dd3);-webkit-background-clip: text;background-clip: text;color: transparent;font-family: var(--font-system);}

/* --- Circle Animation --- */
.circle-container{position:relative;height:1140px;}
.circle{position:absolute;border-radius:50%;border:1px solid #dddddd;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);opacity:0;transition:transform .5s ease-out,opacity .5s ease-out;background:none;}
.circle.loaded{transform:translate(-50%,-50%) scale(1);opacity:1}
.circle-a{width:360px;height:360px;transition-delay:0s}
.circle-b{width:720px;height:720px;transition-delay:.2s}
.circle-c{width:1080px;height:1080px;transition-delay:.4s}

/* --- Pills --- */
.radar-nav .link-pill{position:absolute;white-space: nowrap;opacity: 0;transition: opacity .5s ease-in-out;background: linear-gradient(145deg, #ae61ca ,#5456c4);}
.radar-nav .link-pill.loaded{opacity: 1;}
.link-pill:hover{transform:scale(1.05);transition:transform .2s ease-in-out;}

/* Articles section */
.w-10 {width: 10%;}
.articles-section {position: relative;overflow: hidden;}
.articles-section::before {content: "";position: absolute;bottom: -300px;left: -300px;width: 600px;height: 600px;background: radial-gradient(circle, rgba(255, 230, 0, 0.35), transparent 80%);filter: blur(10px);z-index: 0;pointer-events: none;}

.sponsors-section {position: relative;overflow: hidden;}
.sponsors-section::before {content: "";position: absolute;top: -300px;left: -300px;width: 600px;height: 600px;background: radial-gradient(circle, rgba(255, 230, 0, 0.35), transparent 80%);filter: blur(10px);z-index: 0;pointer-events: none;}

/* Categories Page */
.categories-page h1 {position: relative;}
.categories-page h1::after {content: '';position: absolute;left: 0;bottom: 0.15em; /* Adjust as needed */
    width: 25%; /* Full width minus some padding */
    height: .3em; /* Half the line height */
    background-color: yellow; /* You can change the color */
    z-index: -1; /* Ensures the line is behind the text */
}
.articles-page h1 {position: relative;}
.articles-page h1::after {content: '';position: absolute;left: 0;bottom: 0.15em; /* Adjust as needed */
    width: 15%; /* Full width minus some padding */
    height: .3em; /* Half the line height */
    background-color: yellow; /* You can change the color */
    z-index: -1; /* Ensures the line is behind the text */
}

/* Trix Content */
.trix-content pre {
  background-color: #f8f9fa;
  padding: 1rem;
  border-radius: 0.375rem;
  overflow-x: auto;
}

/* Media query for medium screens */
  @media (max-width: 1200px) {
      .circle-container{height:900px;overflow:hidden;}
      #circle-a {width: 360px;height: 360px;}
      #circle-b {width: 600px;height: 600px;}
      #circle-c {width: 840px;height: 840px;}
  }

  /* Media query for small screens */
  @media (max-width: 768px) {
    .circle-container{height:750px;}
    #circle-a {width: 260px;height:260px;}
    #circle-b {width: 480px;height: 480px;}
    #circle-c {width: 700px;height: 700px;}
  }

  /* Media query for extra small screens */
  @media (max-width: 480px) {
    .circle-container{height:600px;}
    #circle-a {width: 160px;height: 160px;}
    #circle-b {width: 360px;height: 360px;}
    #circle-c {width: 560px;height: 560px;}
  }