/* Card container style */
.card {
  border: 1px solid #e0e0e0;   /* light grey border */
  border-radius: 8px;          /* optional: rounded corners */
  padding: 20px;               /* spacing inside */
  background: #fff;            /* keep background white */
  box-shadow: 0 2px 6px rgba(0,0,0,0.05); /* subtle shadow */
}

/* Optional: add hover effect */
.card:hover {
  border-color: #29667d;       /* match your green theme */
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
/* Replace .my-icon with your icon’s class name */
.zpdivider-container .zpdivider-common:before, .zpdivider-container .zpdivider-common:after {
    content: '';
    position: absolute;
    width: 1500px;
    inset-block-start: 50%;
    height: 1px;
    border-block-start-width: 4px;
    border-block-end-width: 0;
    border-inline-start-width: 0;
    border-inline-end-width: 0;
    border-style: solid;
    border-color: #333;
}
.cname {
  outline: 1px solid rgba(158, 158, 158, 0.4); /* very light grey outline */
  outline-offset: 2px;                           /* minimal spacing from element */
  border-radius: 6px;                            /* gentle rounded corners */
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);    /* very subtle soft shadow */
}
/* Class name for the element */
.pop-hover {
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), 
                box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
}

/* Hover effect: subtle pop */
.pop-hover:hover {
    transform: scale(1.03); /* element grows slightly */
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12); /* soft shadow for depth */
}