
.info-cards{
  padding: 100px 24px; 
}

.info-grid{
  max-width: 1200px;              
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;                     
}


.info-card{
  background: #ffffff;
  border: 1px solid #e5ebf2;
  border-left: 6px solid #2f74b8;
  border-radius: 18px;
  padding: 34px 36px 30px;        
  text-decoration: none;
  color: #0b2440;
  box-shadow: 0 16px 36px rgba(15, 30, 50, .08);
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-left-color .25s ease;
  position: relative;
  overflow: hidden;
}


.info-card::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    90deg,
    rgba(47,116,184,.08),
    transparent 40%
  );
  pointer-events:none;
}


.info-card h3{
  margin: 0 0 14px;
  font-size: 24px;               
  font-weight: 700;
  color: #0d1e3c;
}


.info-card p{
  margin: 0 0 18px;
  font-size: 16px;
  line-height: 1.6;
  color: #4a5a70;
  max-width: 48ch;
}


.info-cta{
  font-size: 15px;
  font-weight: 600;
  color: #2f74b8;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}


.info-cta::after{
  content: "→";
  transition: transform .2s ease;
}


.info-card:hover,
.info-card:focus-visible{
  transform: translateY(-6px);
  box-shadow: 0 30px 64px rgba(15, 30, 50, .14);
  border-left-color: #1e8acb;
}

.info-card:hover .info-cta::after,
.info-card:focus-visible .info-cta::after{
  transform: translateX(4px);
}


@media (min-width: 800px) and (max-width: 1920px){
  .info-cards{
    padding: 110px 24px;
  
  }

  
}


@media(max-width:700px){
  .info-grid{
    grid-template-columns: 1fr;

  }

  .info-card{
    padding: 28px;
  }

  .info-card h3{
    font-size: 21px;
  }
}
