/* ── Collection / sibling cards — vibrant gradient tiles.
   Used on: HomePage, BeachCollectionPage, BeachDistrictPage.
   The home page uses the full set; collection/district pages use a subset.
   ──────────────────────────────────────────────────────────────────────── */
.coll-card {
    position: relative;
    border-radius: var(--bd-radius-lg);
    overflow: hidden;
    display: flex;
    align-items: stretch;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.14);
    text-decoration: none !important;
    transition: transform .22s ease, box-shadow .22s ease;
    height: 100%;
}
.coll-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.2);
}
.coll-card .cc-text {
    padding: 1.5rem 1.5rem 1.5rem 1.75rem;
    color: #fff;
    flex: 1;
    position: relative;
    z-index: 1;
}
.coll-card .cc-icon {
    font-size: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 1.5rem;
    opacity: 0.45;
    flex-shrink: 0;
    color: #fff;
    position: relative;
    z-index: 1;
}
/* Image background for collection cards when a media picker image is set */
.coll-card .cc-bg-img {
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    opacity: 0.5;
    transition: transform .3s ease, opacity .3s ease;
    z-index: 0;
}
.coll-card:hover .cc-bg-img {
    transform: scale(1.05);
    opacity: 0.6;
}

/* ── Gradient variants (superset — all views share this file) ── */
.coll-card--river     { background: linear-gradient(135deg, #184e3a 0%, #0d6efd 100%); }
.coll-card--blueflag  { background: linear-gradient(135deg, #0077b6 0%, #023e8a 100%); }
.coll-card--naturist  { background: linear-gradient(135deg, #b5451b 0%, #e9c46a 100%); }
.coll-card--surf      { background: linear-gradient(135deg, #0096c7 0%, #48cae4 100%); }
.coll-card--acores    { background: linear-gradient(135deg, #1a6b3a 0%, #2d9e6b 60%, #38c172 100%); }
.coll-card--madeira   { background: linear-gradient(135deg, #7b3f00 0%, #c47c2b 60%, #e8a44a 100%); }
.coll-card--algarve   { background: linear-gradient(135deg, #b5341a 0%, #e8720c 60%, #f5a623 100%); }
.coll-card--vicentina { background: linear-gradient(135deg, #2d5016 0%, #4a7c2f 60%, #6aaa3e 100%); }
.coll-card--district  { background: linear-gradient(135deg, #1a3a5c 0%, #2c6ba0 100%); }
.coll-card--default   { background: linear-gradient(135deg, #2d3748 0%, #4a5568 100%); }
.coll-card--lisbon    { background: linear-gradient(135deg, #0d1318 0%, #1b222c 60%, #2d3f52 100%); }
.coll-card--porto     { background: linear-gradient(135deg, #07204f 0%, #0f307f 60%, #1845a8 100%); }