.elementor-1297 .elementor-element.elementor-element-dc5544a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1297 .elementor-element.elementor-element-13276e2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1297 .elementor-element.elementor-element-13276e2:not(.elementor-motion-effects-element-type-background), .elementor-1297 .elementor-element.elementor-element-13276e2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-1297 .elementor-element.elementor-element-8c6be92{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1297 .elementor-element.elementor-element-ae7d5ba{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}:root{--page-title-display:none;}/* Start custom CSS for shortcode, class: .elementor-element-7e99412 */.ultra-blog-grid {
      --primary: #2c4258;
      --secondary: #91c874;
      --navy: #0f172a;
      --slate: #64748b;
      --card-bg: #ffffff;
      padding: 100px 5%;
      background-color: #fcfdfe;
      display: flex;
      justify-content: center;
    }

    .grid-container {
      max-width: 1300px;
      width: 100%;
      display: grid;
      grid-template-columns: repeat(3, 1fr); 
      gap: 40px;
    }

    .blog-perspective-card {
      position: relative;
      background: var(--card-bg);
      border-radius: 30px 10px 30px 30px;
      padding: 15px;
      transition: all 0.5s cubic-bezier(0.2, 1, 0.3, 1);
      border: 1px solid #f1f5f9;
      display: flex;
      flex-direction: column;
    }

    .blog-perspective-card:hover {
      transform: translateY(-12px);
      box-shadow: 0 30px 60px -15px rgba(15, 23, 42, 0.1);
    }

    .card-visual {
      position: relative;
      width: 100%;
      aspect-ratio: 16/10;
      border-radius: 20px 5px 20px 20px;
      overflow: hidden;
      margin-bottom: 25px;
    }

    .card-visual img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.8s ease;
    }

    .category-pill {
      position: absolute;
      top: 15px;
      left: 15px;
      background: rgba(255, 255, 255, 0.9);
      backdrop-filter: blur(8px);
      padding: 6px 16px;
      border-radius: 100px;
      font-size: 11px;
      font-weight: 800;
      color: var(--primary);
      text-transform: uppercase;
      letter-spacing: 1px;
      z-index: 2;
    }

    .card-content { padding: 10px 15px 25px; flex-grow: 1; }

    .meta-line {
      display: flex;
      align-items: center;
      gap: 15px;
      margin-bottom: 15px;
    }

    .meta-item {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 13px;
      color: var(--slate);
    }

    .meta-item svg { width: 16px; height: 16px; stroke: var(--secondary); }

    .blog-perspective-card h3 {
      font-size: 20px;
      font-weight: 800;
      color: var(--navy);
      line-height: 1.4;
      margin-bottom: 12px;
    }

    .card-excerpt {
      font-size: 14px;
      color: var(--slate);
      line-height: 1.6;
      margin-bottom: 20px;
    }

    .card-footer {
      padding: 0 15px 15px;
    }

    .read-more-link {
      display: flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      font-weight: 700;
      font-size: 14px;
      color: var(--navy);
      transition: color 0.3s ease;
    }

    .arrow-circle {
      width: 28px;
      height: 28px;
      border: 1px solid #e2e8f0;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.3s ease;
    }

    .read-more-link:hover .arrow-circle {
      background: var(--primary);
      color: white;
      border-color: var(--primary);
    }
    
    .blog-perspective-card h3 a{
  text-decoration:none;
  color:inherit;
}

.card-visual img{
  display:block;
}

.card-visual:hover img{
  transform:scale(1.08);
}

    /* --- RESPONSIVE UPDATES --- */

    @media (max-width: 1100px) { 
      .grid-container { 
        grid-template-columns: repeat(2, 1fr); 
        gap: 30px;
      } 
      .ultra-blog-grid { padding: 80px 4%; }
    }

    @media (max-width: 768px) {
      .ultra-blog-grid { padding: 60px 20px; }
      .grid-container { 
        grid-template-columns: 1fr; 
        gap: 25px;
        max-width: 450px; /* Keeps cards from looking too wide on mobile */
      }
      .blog-perspective-card h3 { font-size: 19px; }
      .card-visual { margin-bottom: 15px; }
    }

    @media (max-width: 480px) {
      .ultra-blog-grid { padding: 40px 15px; }
      .blog-perspective-card { border-radius: 20px 8px 20px 20px; padding: 10px; }
      .card-content { padding: 10px 10px 15px; }
      .card-excerpt { font-size: 13px; margin-bottom: 15px; }
    }/* End custom CSS */