<div class="w-100 vission__card text-center position-relative">
    <img src="assets/images/icons/visin-frame-1.svg" alt="frame" class="img-fluid w-100 position-relative z-1">
    <img src="assets/images/icons/visin-frame-2.svg" alt="frame" class="img-fluid w-100 position-absolute z-0 dark__frame transition">
    <div class="num fs-1 text-white bg-dark rounded-circle d-inline-flex align-items-center justify-content-center position-absolute z-1"><?= $num ?></div>
    <div class="position-absolute top-0 start-0 w-100 h-100 p-4 text-center d-flex align-items-center pb-5 px-4 px-lg-5 z-3"> 
        <p class="lead-sm fw-medium lh-sm text-dark w-100 text-center px-3"><?= $title ?></p>
    </div>
</div>