:root {
    --club-green:  #2d4a22;
    --club-orange: #c8601a;
    --club-light:  #f7f4f0;
}

html { font-size: 14px; }
@media (min-width: 768px) { html { font-size: 16px; } }
body { margin-bottom: 0; }

/* Navbar */
.bg-club-dark { background-color: var(--club-green) !important; }
.navbar-tagline { font-size: 0.7rem; font-weight: 400; opacity: 0.7; margin-left: 0.5rem; }

/* Accent buttons */
.btn-club { background-color: var(--club-orange); border-color: var(--club-orange); color: #fff; }
.btn-club:hover { background-color: #a84f15; border-color: #a84f15; color: #fff; }

/* Hero collage */
.hero-collage {
    position: relative;
    height: 420px;
    display: flex;
    overflow: hidden;
    background-color: var(--club-green);
}
.collage-photo {
    flex: 1;
    min-width: 0;
    object-fit: cover;
    object-position: center;
}
.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.15) 60%, transparent 100%);
    display: flex;
    align-items: flex-end;
    padding-bottom: 2rem;
}
@media (max-width: 576px) {
    .collage-photo:nth-child(n+4) { display: none; }
}

/* Trip cards */
.trip-card { transition: transform 0.15s, box-shadow 0.15s; }
.trip-card:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,0.15); }
.trip-card .card-img-top { height: 200px; object-fit: cover; }
.trip-card .no-photo { height: 200px; background-color: var(--club-light); display: flex; align-items: center; justify-content: center; color: #bbb; font-size: 2.5rem; }
.badge-location { background-color: var(--club-green); }

/* Year filter */
.year-filter .btn { border-radius: 20px; font-size: 0.85rem; }
.year-filter .btn.active { background-color: var(--club-green); border-color: var(--club-green); color: #fff; }

/* Photo grid */
.photo-grid .photo-thumb {
    cursor: pointer;
    overflow: hidden;
    border-radius: 4px;
    aspect-ratio: 4/3;
}
.photo-grid .photo-thumb img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 0.2s;
}
.photo-grid .photo-thumb:hover img { transform: scale(1.05); }

/* Admin */
.admin-bar { background-color: #333; color: #aaa; font-size: 0.8rem; padding: 0.3rem 0; }

/* Footer */
.footer-club { background-color: var(--club-light); border-top: 1px solid #ddd; }

/* Photo upload zone */
.upload-zone {
    border: 2px dashed #ccc;
    border-radius: 8px;
    padding: 2rem;
    text-align: center;
    color: #999;
    transition: border-color 0.2s, background-color 0.2s;
}
.upload-zone.dragover { border-color: var(--club-orange); background-color: #fff8f3; color: #333; }