.elementor-267 .elementor-element.elementor-element-718f6de{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for html, class: .elementor-element-1c7b1bf9 *//* GRID / CARD STYLING */
.services-wrap {
  --gap: 28px;
  position: relative;
  box-sizing: border-box;
}

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gap);
  align-items: start;
}

/* base card */
.service-card {
    cursor: pointer;
  position: relative;
  border-radius: 20px;
  padding: 30px 30px 40px 30px;
  background: #fff;
  transition: transform .28s ease, box-shadow .28s ease;
  min-height: 220px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  font-family: inter;
}

/* small top icon */
.service-icon {
  width: 72px;
  height: 72px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom: 12px;
  background: rgba(255,255,255,0.05);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
}

/* title & excerpt */
.service-title {
    font-size: 24px;
    font-weight: 700;
    color: #111827;
	margin: 10px 0;
}
.service-excerpt {
 color: #374151;
font-weight: 500;
  line-height: 1.5;
  flex: 1;
  min-height: 3.6em; /* keep layout steady when text short */
}

/* small round toggle on collapsed state */
.card-toggle {
  position: absolute;
  bottom: 18px;
  right: 18px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow: 0 6px 18px rgba(12,20,40,0.25);
  cursor: pointer;
}

/* Expanded floating panel (created dynamically) */
.expanded-panel {
  position: absolute;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 20px 50px rgba(6,10,20,0.45);
  overflow: hidden;
  transform-origin: top left;
  z-index: 999;
  transition: all .42s cubic-bezier(.2,.9,.2,1);
height: 360px !important;
  display: flex;
  flex-direction: column;
  padding: 2px 30px 10px 30px;
  box-sizing: border-box;
  font-family: inter;
 width: 700px !important;
}

/* inside expanded content */
.expanded-top {
  display:flex;
  gap:18px;
  align-items:center;
 
}
.expanded-title {
   font-size: 24px;
    font-weight: 700;
    color: #111827;
}

.expanded-desc {
    color: #374151;
    margin-top: 6px;
    line-height: 1.6;
    font-size: 16px;
    font-weight: 500;
}

/* features + buttons */
.expanded-features strong {
    font-size: 18px;
    color: #1f2937;
}
.expanded-features ul { color: #374151;
    font-size: 16px;
    font-weight: 500;
    padding: 8px 24px;
    margin: 0;
}
.expanded-actions { display:flex; gap:12px; margin-top: 18px; }
.btn {
  padding: 10px 18px;
  border-radius: 10px;
  border: none;
  cursor: pointer;
  display: flex;
align-items: center;
    gap: 10px;
font-weight: 600;
}
.btn-primary,.btn-secondary {
    color: #0f2b29;
    border: 1px solid #0f2b29;
    background:#fff;
}

.btn-secondary:hover,.btn-primary:hover { 
    background:#daeabc; 
     color: #0f2b29;
     border-color: #daeabc;
}

.btn-secondary:focus,.btn-primary:focus { 
    background:#daeabc; 
     color: #0f2b29;
     border-color: #daeabc;
}

/* close round button bottom-right */
.expanded-close {
  position: absolute;
  right: 22px;
  bottom: 22px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow: 0 8px 20px rgba(10,20,40,0.25);
  cursor: pointer;
  z-index: 1001;
  transition: transform .18s ease;
}

/* small responsive rules */
@media (max-width: 1100px) {
  .services-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
  .services-grid { grid-template-columns: 1fr; }
  .expanded-title { font-size: 18px; }
   .expanded-panel {
  width: 100% !important;
  left:0 !important;
  height: auto !important;
 padding: 18px 18px 72px 18px;
}
.service-icon {
    margin-bottom: 22px;
}
.expanded-desc,.expanded-features strong, .expanded-features ul{
    font-size:14px;
    margin-top: 6px;
}
.expanded-top {
    gap: 10px;
    margin-bottom: 0px;
    align-items: top;
}
.expanded-features{
    padding-top: 10px;
}
.expanded-top .service-icon{
    width:150px !important;
   margin-top: -26px;
}
.btn{
    font-size:15px;
    padding: 8px 12px;
}
.btn svg{
    width:18px;
}
}/* End custom CSS */