/* =========================
   HARD FIX: Force Donate button visible on mobile
   ========================= */

@media (max-width: 768px) {

    /* Force ALL standalone buttons visible */
    a.btn {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    /* Specifically target Donate button */
    a[href="donate/index.php"] {
        display: flex !important;
        width: 100% !important;
        margin-top: 2rem !important;
        justify-content: center;
        align-items: center;
        z-index: 9999 !important;
        position: relative !important;
    }

    /* Kill parent clipping */
    .hero,
    .hero-section,
    .give-back,
    .container,
    .center {
        overflow: visible !important;
        height: auto !important;
        max-height: none !important;
    }
}

.hero-adventure{
    background:linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.6)),
    url('../../../images/stock/unsplash-1464822759023-fed622ff2c3b.jpg');
    background-size:cover;
    background-position:center;
    padding:12rem 0;
    color:#fff;
    text-align:center;
}

h1 {
    color: #ffffff;
    font-weight: 800;
    letter-spacing: -0.5px;
}

h3 {
    color: var(--color-primary);
    font-weight: 600;
}


/* Destination Cards */
.destination-card{
    position:relative;
    height:400px;
    border-radius:12px;
    overflow:hidden;
    color:#fff;
    box-shadow:var(--shadow-card);
    transition:.3s ease;
}
.destination-card:hover{transform:translateY(-5px);}
.destination-bg{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center;
    transition:.5s ease;
}
.destination-card:hover .destination-bg{transform:scale(1.05);}
.destination-content{
    position:relative;
    height:100%;
    background:linear-gradient(to top,rgba(0,0,0,.9),transparent);
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    padding:2rem;
}

/* Gear */
.gear-list li{
    margin-bottom:.8rem;
    display:flex;
    gap:10px;
}
.gear-list i{color:var(--color-primary);}

/* Modal */
.modal{
    display:none;
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.85);
    backdrop-filter:blur(8px);
    z-index:9999;
}
.modal-content{
    background:#fff;
    width:90%;
    max-width:850px;
    margin:3% auto;
    border-radius:16px;
    overflow:hidden;
    position:relative;
    animation:slideUp .4s ease;
}
@keyframes  slideUp{
    from{opacity:0;transform:translateY(40px)}
    to{opacity:1;transform:translateY(0)}
}
.close-modal{
    position:absolute;
    top:18px;
    right:18px;
    width:44px;
    height:44px;
    border-radius:50%;
    background:rgba(0,0,0,.45);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:26px;
    font-weight:700;
    cursor:pointer;
    z-index:20; /* 🔴 critical */
    transition:all .25s ease;
}

.close-modal:hover{
    background:var(--color-primary);
    transform:rotate(90deg);
}


.modal-header{
    height:350px;
    background-size:cover;
    background-position:center;
    position:relative;
}
.modal-header::after{
    content:'';
    position:absolute;
    bottom:0;
    inset-inline:0;
    height:50%;
    background:linear-gradient(transparent,rgba(0,0,0,.8));
}
.modal-header-title{
    position:absolute;
    bottom:30px;
    left:40px;
    color:#48a92d;
}
.modal-body{padding:3rem 40px;}
.guide-section{margin-bottom:2.5rem;}
.guide-section h4{
    color:var(--color-primary);
    font-size:.85rem;
    text-transform:uppercase;
    letter-spacing:1px;
    display:flex;
    gap:10px;
}
.hero-adventure .lead {
    color: #ffffff;
}

.guide-section h4::after{
    content:'';
    flex:1;
    height:1px;
    background:#eee;
}
.modal-header-title h2,
#modalTitle {
    color: #ffffff !important;
}


/* Checklist */
.checklist-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
    gap:2rem;
    background:#f9fafb;
    padding:2.5rem;
    border-radius:12px;
    border:1px solid #e5e7eb;
}
.checklist-item{
    display:flex;
    gap:10px;
    margin-bottom:8px;
    font-size:.9rem;
}
.guide-btn{
    margin-top:1rem;
    background:var(--color-primary);
    color:#fff;
    border:none;
    padding:0.75rem 1.4rem;
    border-radius:10px;
    font-weight:600;
    font-size:0.95rem;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:8px;
    transition:all .3s ease;
    box-shadow:0 10px 25px rgba(0,0,0,.25);
}

.guide-btn:hover{
    background:#000;
    transform:translateX(4px);
}
.hero-adventure{
    background:
        linear-gradient(rgba(0,0,0,.45), rgba(0,0,0,.75)),
        url('../../../images/photos/adventure-hero.jpg')
        center / cover no-repeat;
    padding: 12rem 0 9rem;
    color: #fff;
    text-align: center;
}


.checklist-item i{color:var(--color-primary);}