/* Responsive for Mobile (iPhone SE and similar) */
@media (max-width: 768px) {

     .logo {
    display: none; /* Hide on tablets and smaller (mobile) */
  }

    .custom-description {
        font-size: 14px; 
        height: auto;
        overflow: visible;
        line-height: 1.4;
    }

    .custom-actions li {
        display: block;
        margin: 10px 0;
    }

    .custom-button {
        width: 100%;
        box-sizing: border-box;
    }

    /* This is incorrect:
       .custom-description.p { ... }
       Instead, use: */
    .custom-description p {
        font-size: 12px;  /* or adjust as needed */
        line-height: 1.4;
    }

}

/* Responsive for smaller screens (e.g., iPhone SE) */
@media (max-width: 375px) {  /* iPhone SE screen width */
    .custom-description {
        font-size: 12px;  /* Reduce font size */
        line-height: 1.4; /* Adjust line-height for better readability */
    }

    .custom-button {
        font-size: 12px;  /* Adjust button font size as well */
    }

    .custom-actions li {
        font-size: 14px;  /* Adjust font size of action items */
    }
}