/* Global Reset */
  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }

  /* Body Styling */
  body {
    font-family: sans-serif;
    color: #fff;

    background: linear-gradient(to bottom, #2D2D2D, #C33F2A ,#E98144);
    background-attachment: fixed;
    background-size: 200% 200%; /* Make the gradient larger */
    animation: gradientMove 5s ease infinite; /* Add animation */
}

/* Define the animation */
@keyframes gradientMove {
    0% {
        background-position: 0% 0%;
    }
    50% {
        background-position: 100% 100%;
    }
    100% {
        background-position: 0% 0%;
    }
}



  h1 {
    color: white !important;
  }

  /* General Styling for Layout */
  .main-head-first-blog {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .grid-container {
    display: grid;
    max-width: 1200px;
    grid-template-columns: 1fr 1fr;
    /* Two columns by default */
    gap: 20px;
  }

  .grid-item {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    max-width: 804px;
  }

  .recent-uploads {
    font-size: 24px;
    margin-bottom: 20px;
  }

  /* For the mobile view (screens below 768px) */
  @media (max-width: 768px) {
    .grid-container {
      grid-template-columns: 1fr;
      /* Stack the grid items vertically on mobile */
    }

    img {
      width: 100%;
      height: 100%;
    }

    .main-head-first-blog {
      display: block;
      flex-direction: column;
      justify-content: center;
      align-items: center;
    }

    .grid-container {
      display: block;
      grid-template-columns: 1fr 1fr;
      /* Two columns by default */
      gap: 20px;
    }




    .social-icons {
      margin-left: 0;
      text-align: center;
    }

    .social-icon {
      margin: 0 10px;
      /* Space out the social icons */
    }

    .frame-parent {
      padding: 10px;
    }

    .th-january-2024 {
      font-size: 14px;
      /* Adjust text size for smaller screens */
    }

    .th-january-2024 img {
      width: 60%;
      /* Adjust image width for smaller screens */
    }

    /* Content styling for the recent uploads section */
    .frame-parent {
      padding-top: 15px;
    }

    .global-spread-of-covid-19-and-parent {
      margin-bottom: 15px;
    }
  }

  /* For very small screens (below 480px) */
  @media (max-width: 480px) {
    .th-january-2024 {
      font-size: 12px;
      /* Even smaller text size for tiny screens */
    }

    .recent-uploads {
      font-size: 20px;
      margin-top: 52px;
      margin-left: 12px;
      font-weight: bold;
    }
  }

  p span {
    line-height: 22.2px !important;
    text-align: left;
    font-size: 14px !important;
    font-family: sans-serif !important;
    color: #dcdcdc !important;
  }


  p strong span {
    line-height: 22.2px !important;
    text-align: left;
    font-size: 14px !important;
    font-family: sans-serif !important;
    color: #ffffff !important;
  }

  p {
    line-height: 22.2px !important;
    text-align: left;
    font-size: 14px !important;
    font-family: sans-serif !important;
    color: #dcdcdc !important;

  }

  li {
    line-height: 22.2px !important;
    text-align: left;
    font-size: 14px !important;
    font-family: sans-serif !important;
    color: #dcdcdc !important;

  }

  h2 span {
    font-family: sans-serif !important;
    line-height: 55.2px !important;
    color: white !important;
    font-size: 20px !important;
  }

  h2 {
    font-family: sans-serif !important;
    line-height: 55.2px !important;
    color: white !important;
    font-size: 20px !important;
  }

  h3 span {
    font-family: sans-serif !important;
    line-height: 55.2px !important;
    color: white !important;
    font-size: 14px !important;
  }

  h3 {
    font-family: sans-serif !important;
    line-height: 55.2px !important;
    color: white !important;
    font-size: 14px !important;
  }

  .logo {
    font-size: 20px;
    max-width: 80%;
    display: flex;
    align-items: center;
    /* Centers the text and logo vertically */
    margin-left: 0;
    margin-right: 0;
  }

  .has-submenu:hover .submenu {
    display: block;
    /* Show submenu on hover */
  }

  .logo-image {
    width: 70%;
    /* Adjust size of logo */
    height: auto;
    /* Keeps aspect ratio */
    margin-right: 10px;
    /* Space between logo and text */
  }

  .submenu {
    display: none;
    list-style-type: none;
    padding: 0;
    background-color: #333;
    /* Submenu background color */
  }

  .call-container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    /* Three columns layout */
    gap: 50px;
  }

  /* Styling for the submenu */
  .submenu li {
    padding: 10px;
    text-align: center;
  }

  .submenu li a {
    color: white;
    text-decoration: none;
  }

  .container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
  }

  a {
    text-decoration: none;
    color: #fff;
  }

  header {
    padding: 20px 0;
  }

  .header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .logo {
    font-size: 24px;
    font-weight: 500;
    color: #fff;
  }

  nav ul {
    list-style: none;
    display: flex;
  }

  nav ul li {
    margin-left: 25px;
  }

  nav ul li a {
    font-size: 16px;
    opacity: 0.8;
    transition: opacity 0.3s ease;
  }

  nav ul li a:hover {
    opacity: 1;
  }

  .get-started-btn {
    background-color: #C53E29;
    /* Orange button color */
    color: #fff;
    padding: 12px 25px;
    border-radius: 30px;
    font-weight: 500;
    display: inline-block;
    transition: background-color 0.3s ease;
  }

  .get-started-btn:hover {
    background-color: #e66a4d;
  }

  .company-logo-large {
    color: #fff;
    font-size: 6rem;
    /* Large logo text size */
    font-weight: 500;
    text-align: center;
    /* Center the logo */
    opacity: 0.7;
    /* Slightly faded logo */
  }

  .hamburger {
    display: flex;
    /* Show hamburger icon on mobile */
    flex-direction: column;
    cursor: pointer;
    margin-left: 20px;
  }



  .buller-points {
    list-style-type: none;
  }

  .hamburger .bar {
    width: 25px;
    height: 3px;
    background-color: white;
    margin: 4px 0;
  }


  .hamburger.active .hamburger-menu {
    display: block;
    background-color: #2b2b2b;
    position: absolute;
    top: 50px;
    /* Adjust based on your layout */
    right: 0;
    width: 100%;
    padding: 10px 0;
    transition: background-color 0.3s ease;
    /* Add transition for smooth background change */
  }



  .hamburger-menu:hover {
    background-color: #ff5722;
  }

  .hamburger-menu ul {
    list-style-type: none;
    padding: 0;
    text-align: center;
  }

  .hamburger-menu ul li {
    margin: 10px 0;
  }

  .hamburger-menu ul {
    list-style-type: none;
    padding: 0;
    text-align: center;
  }

  .hamburger-menu ul li {
    margin: 10px 0;
  }


  /* Hide submenu by default */
  .submenu {
    display: none;
    background-color: #cb552a;
  }

  /* Show submenu when parent list item is clicked on mobile */
  .has-submenu.active .submenu {
    display: block;
  }



  /* Head Section */
  .head {
    background: radial-gradient(1036px 749px at 162px -104px, #C53E29, #C53E29, #db9452, #403C3C);
    padding: 20px;
  }

  /* Main Heading */
  .main-heading {
    font-size: 45px;
    text-align: center;
    max-width: 100%;
    padding: 20px;
    margin: 0 auto;
  }



  /* Blog Content */
  .ai-is-revolutionising-container {
    font-size: 18px;
    line-height: 1.6;
    color: white;
  }

  .fast-paced-data-processing {
    font-size: 22px;
    font-weight: bold;
  }

  /* Blog Post Metadata */
  .by-de-risc {
    font-weight: bold;
    color: white;
    font-size: 12px;
  }

  .by-de-risc-recent {
    color: #B0A69E;
    font-size: 12px;
  }

  .th-january-2024 {
    color: #B0A69E;
    font-size: 18px;
  }

  /* Recent Uploads Section */
  .recent-uploads {
    color: white;
    font-size: 14px;
  }

  /* Global Spread Section */

  /* Images */
  .frame-child-main-blog {
    width: 100%;
    max-width: 900px;
    height: auto;
  }

  /* Horizontal Lines */
  .frame-child-line {
    height: 1px;
    width: 100%;
    background-color: white;
    margin: 10px 0;
  }

  /* Vector Parent Layout */
  .vector-parent {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  /* Arrow Icon Styling */
  .arrow-right-wrapper {
    text-align: right;
  }

  .arrow-right {
    width: 20px;
    height: auto;
  }


  /* Responsive Design */
  @media (max-width: 1024px) {


    .main-heading {
      font-size: 32px;
      padding: 15px;
    }


    .ai-is-revolutionising-container {
      font-size: 16px;
    }

    .frame-child-main-blog {
      max-width: 100%;
    }
  }

  @media (max-width: 768px) {


    .frame-child-img {
      width: 50%;
    }

    .get-started-btn {
      display: none;
    }

    .submenu {
      display: none;
      background-color: #cb552a;
    }

    .has-submenu.active .submenu {
      display: block;
    }

    .has-submenu>a:after {
      content: " ▼";
      /* Add an arrow to indicate a dropdown */
    }

    .has-submenu.active>a:after {
      content: " ▲";
      /* Change arrow direction when the submenu is visible */
    }


    .main-heading {
      font-size: 28px;
    }


    .ai-is-revolutionising-container {
      font-size: 14px;
    }

    .frame-child-main-blog {
      max-width: 100%;
    }

    .global-spread-of {
      font-size: 18px;
    }

    .by-de-risc-recent {
      font-size: 20px;
    }
  }

  @media (max-width: 480px) {
    .grid-container {
      padding: 5px;
    }

    .global-spread-of {
      font-size: 18px;

    }

    .main-heading {
      font-size: 24px;
      padding-left: 10px;
      padding-right: 10px;
    }



    .ai-is-revolutionising-container {
      font-size: 13px;
    }

    .fast-paced-data-processing {
      font-size: 18px;
    }

    .arrow-right {
      width: 15px;
    }

    .global-spread-of {
      font-size: 18px;
    }

    .by-de-risc-recent {
      font-size: 20px;
    }
  }


  .hamburger-menu {
    display: none;
    /* Menu is hidden by default */
  }

  @media (max-width: 960px) {
    .header-container {
      justify-content: space-around;
      /* Distribute space more evenly */
    }

    nav ul {
      display: none;
      /* Hide navigation on smaller screens, consider hamburger menu */
    }

  }

  @media (min-width: 769px) {

    .hamburger {
      display: none;
    }

    .has-submenu:hover .submenu {
      display: block;
      /* Show submenu on hover */
    }

    .global-spread-of {
      font-size: 18px;
    }

    .frame-child-img {
      width: 80%;
    }

    .navbar {
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .nav-links {
      display: flex;
    }

    .nav-links li {
      margin: 0 20px;
    }

    .has-submenu {
      position: relative;
    }

    /* Styling for submenu */
    .submenu {
             display: none;
        position: absolute;
        left: -53px;
        top: 100%;
        background-color: #c53e29;
        width: 200px;
        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
    }

  .submenu li {
        padding: 10px;
        margin-left: 0px;
    }

    .submenu li a {
      color: white;
      text-decoration: none;
    }


  }