/* ==========================================================================
   Content element "Aktuelle Angebote (Download-Boxen)" – CType pxsr_offers
   Integrates with the Schwälbchen brand palette and Bootstrap 3 grid.
   Brand colors: green #00963e, blue #0056a1, text #555, light fill #f3f3ec
   ========================================================================== */

.offers {
    margin-bottom: 30px;
}

.offers h2 a,
.offers h2 {
    color: #00963e;
}

/* Override schwaelbchen.min.css "h2 + div { margin-top: 30px; }" – the gap
   between the headline (any level h1-h5) and the description should be 15px. */
.offers h1 + div,
.offers h2 + div,
.offers h3 + div,
.offers h4 + div,
.offers h5 + div {
    margin-top: 15px;
}

.offers-intro {
    color: #555;
    margin-bottom: 15px;
}

/* Divider between the intro text and the cards */
.offers-divider {
    border: 0;
    border-top: 1px solid #e2e2e2;
    margin: 0 0 25px;
}

/* --- Cards --------------------------------------------------------------- */
.offers-row {
    margin-left: -10px;
    margin-right: -10px;
}

.offer-card {
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 25px;
}

/* The visual card: light grey rounded border around the whole column */
.offer-inner {
    border: 1px solid #e2e2e2;
    border-radius: 6px;
    background-color: #fff;
    overflow: hidden;
}

/* Image/PDF area: full-bleed, only bottom spacing before the texts */
.offer-thumb {
    position: relative;
    padding: 0 0 15px;
}

.offer-thumb .offer-img {
    width: 100%;
    height: auto;
    display: block;
}

/* Badge in the upper left corner (text = file alternative/alt). */
.offer-badge {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 6;
    background-color: #0056a1;
    color: #fff;
    font-weight: bold;
    font-size: 13px;
    line-height: 1;
    padding: 6px 11px;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Per-card badge colour (selectable per file reference) */
.offer-badge--blue {
    background-color: #0056a1;
}

.offer-badge--green {
    background-color: #00963e;
}

.offer-badge--red {
    background-color: #c8102e;
}

/* --- Texts beneath the image -------------------------------------------- */
/* Small grey uppercase label (text = file title) */
.offer-title {
    color: #8a8a8a;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 3px;
    padding: 0 15px;
}

/* Card meta: description on its own line, download below it (right aligned) */
.offer-meta {
    padding: 0 15px 15px;
}

/* Description text (text = file description) */
.offer-text {
    display: block;
    color: #333;
    font-size: 15px;
    font-weight: bold;
    line-height: 20px;
    margin-bottom: 8px;
}

/* Download link (green text link, not a filled button) – below the text, right aligned */
.offer-download {
    display: block;
    text-align: right;
    color: #00963e;
    font-size: 14px;
    font-weight: bold;
    white-space: nowrap;
}

.offer-download:hover,
.offer-download:focus {
    color: #007a32;
    text-decoration: none;
}

.offer-download .fa {
    margin-right: 4px;
}

/* --- Call-to-action below the cards ------------------------------------- */
.offers-cta {
    text-align: center;
    margin-top: 10px;
}

.offer-cta-btn {
    display: inline-block;
    background-color: #00963e;
    color: #fff;
    border: 0;
    border-radius: 4px;
    font-size: 16px;
    font-weight: bold;
    padding: 11px 28px;
}

.offer-cta-btn:hover,
.offer-cta-btn:focus {
    background-color: #007a32;
    color: #fff;
    text-decoration: none;
}

.offer-cta-btn .fa {
    margin-left: 8px;
}

/* --- Responsive --------------------------------------------------------- */
/* Bootstrap col-sm-4 already gives 3-up >=768px and stacks on mobile.      */
@media (max-width: 767px) {
    .offer-card {
        max-width: 420px;
        margin-left: auto;
        margin-right: auto;
        float: none;
    }
}