.partners-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.partners-header .section-title {
    margin-bottom: 0;
}

.partners-header-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.partners-disclaimer {
    margin: 12px 0 24px;
    font-size: 0.72rem;
    line-height: 1.5;
    color: #a0a0a0;
}

.partners-disclaimer a {
    color: #d4a017;
}

/* Grid and cards */

.partners-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 25px;
}

.partners-card {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.03));
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 16px;
    padding: 30px 22px 22px;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
    overflow: hidden;
    scroll-margin-top: 80px;
}

.partners-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #c41e3a, #d4a017);
    opacity: 0;
    transition: opacity 0.4s ease;
}

.partners-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 15px 40px rgba(196, 30, 58, 0.25);
    border-color: rgba(196, 30, 58, 0.5);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.05));
}

.partners-card:hover::before,
.partners-card-highlight::before {
    opacity: 1;
}

.partners-card-highlight {
    border-color: rgba(212, 160, 23, 0.6);
}

.partners-card-hidden {
    opacity: 0.6;
    border-style: dashed;
}

.partners-card-editing,
.partners-card-editing:hover {
    transform: none;
    text-align: left;
    align-items: stretch;
    opacity: 1;
}

.partners-logo-wrap {
    width: 140px;
    height: 140px;
    margin-bottom: 18px;
    border-radius: 16px;
    padding: 3px;
    background: linear-gradient(135deg, #c41e3a, #d4a017);
    flex-shrink: 0;
}

/* Logo border turned off for this partner. Two classes, so it also beats
   the phone-size .partners-logo-wrap rule. */
.partners-logo-wrap.partners-logo-wrap-plain {
    padding: 0;
    background: none;
}

/* Rounded corners turned off for this partner: square frame and logo.
   Specific enough to beat .partners-logo / .partners-initials below and
   the phone-size .partners-logo-wrap rule. */
.partners-logo-wrap.partners-logo-wrap-square,
.partners-logo-wrap.partners-logo-wrap-square .partners-logo,
.partners-logo-wrap.partners-logo-wrap-square .partners-initials {
    border-radius: 0;
}

/* White background turned off for this partner: transparent parts of the
   logo show the card behind. With the border still on, the inside of the
   frame is the site's dark background, so the frame's gradient doesn't
   show through. */
.partners-logo-wrap.partners-logo-wrap-clear .partners-logo {
    background: transparent;
}

.partners-logo-wrap.partners-logo-wrap-clear:not(.partners-logo-wrap-plain) .partners-logo {
    background: #1f1f24;
}

.partners-logo,
.partners-initials {
    width: 100%;
    height: 100%;
    border-radius: 13px;
    display: block;
}

.partners-logo {
    object-fit: contain;
    background: #ffffff;
}

.partners-initials {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #1f1f24;
    color: #e0d6c8;
    font-size: 2.4rem;
    font-weight: 700;
    letter-spacing: 1px;
}

/* The card's headline: the partner's services, or their name if no
   services are given. */
.partners-title {
    font-size: 1.3rem;
    max-width: 100%;
    overflow-wrap: anywhere;
    margin-bottom: 6px;
    color: #ffffff;
    font-weight: 600;
    letter-spacing: 0.3px;
}

/* The small red label: the business name above the headline. In Reorder
   Partners, where admins look for the name, it's the services below it. */
.partners-label {
    font-size: 0.85rem;
    max-width: 100%;
    overflow-wrap: anywhere;
    font-weight: 700;
    margin-bottom: 6px;
    color: #c41e3a;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.partners-location {
    font-size: 0.9rem;
    color: #a0a0a0;
    margin-bottom: 10px;
}

.partners-location + .partners-contact {
    margin-top: -6px;
}

.partners-contact {
    font-size: 0.9rem;
    color: #a0a0a0;
    margin-bottom: 10px;
    overflow-wrap: anywhere;
}

.partners-contact-name {
    color: #e0d6c8;
    font-weight: 600;
}

.partners-description {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #d0d0d0;
    white-space: pre-line;
    overflow-wrap: anywhere;
    margin-bottom: 14px;
}

/* The card's buttons, at its foot: the website bar, then the row. */
.partners-actions {
    margin-top: auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.partners-website-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 8px;
    border: 1px solid #d4a017;
    background: rgba(212, 160, 23, 0.14);
    color: #f0c040;
    font-size: 0.95rem;
    font-weight: 700;
    text-decoration: none;
    transition: background 0.2s ease;
}

.partners-website-bar:hover,
.partners-website-bar:focus-visible {
    background: rgba(212, 160, 23, 0.24);
    color: #ffd25e;
}

.partners-website-bar-label {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.partners-website-bar-arrow {
    font-size: 1.4rem;
    line-height: 1;
}

/* Call and Email stay together on one line. */
.partners-contact-row {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 8px;
}

.partners-contact-row .partners-link {
    white-space: nowrap;
}

.partners-icon {
    flex-shrink: 0;
    vertical-align: -3px;
}

.partners-link .partners-icon {
    margin-right: 6px;
}

.partners-links {
    width: 100%;
    padding-top: 14px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}

.partners-link {
    display: inline-block;
    padding: 7px 14px;
    border-radius: 6px;
    border: 1px solid rgba(212, 160, 23, 0.45);
    color: #d4a017;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    overflow-wrap: anywhere;
}

/* Two classes, so it beats button.partners-link's background: none. */
.partners-link.partners-link-primary {
    border-color: transparent;
    background: linear-gradient(90deg, #c41e3a, #d4a017);
    /* Fill under the transparent border too, or the gradient repeats into
       it and leaves a red sliver at the right edge. */
    background-origin: border-box;
    color: #ffffff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}

.partners-link:hover,
.partners-link:focus-visible {
    color: #f0c040;
    border-color: #f0c040;
}

.partners-link.partners-link-primary:hover,
.partners-link.partners-link-primary:focus-visible {
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(196, 30, 58, 0.35);
}

button.partners-link {
    font-family: inherit;
    background: none;
    cursor: pointer;
}

/* Brochure lightbox (mirrors the gallery's) */

.brochure-lightbox[hidden] {
    display: none;
}

.brochure-lightbox {
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    inset: 0;
    z-index: 1000;
    padding: 24px;
    box-sizing: border-box;
}

.brochure-lightbox-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(10, 10, 12, 0.92);
}

.brochure-lightbox-dialog {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    width: min(900px, 100%);
    max-height: 100%;
}

.brochure-lightbox-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
}

.brochure-lightbox-title {
    font-size: 1rem;
    color: #d4a017;
    overflow-wrap: anywhere;
}

.brochure-lightbox-close {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.25);
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
}

.brochure-lightbox-close:hover,
.brochure-lightbox-close:focus-visible {
    border-color: #d4a017;
}

/* Brochures are often tall (A4 portrait): fit the whole thing on screen,
   and offer "Open full size" for zooming in. */
.brochure-lightbox-stage {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 0;
    flex: 1 1 auto;
}

.brochure-lightbox-image {
    display: block;
    max-width: 100%;
    max-height: calc(100vh - 150px);
    max-height: calc(100dvh - 150px);
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
}

.brochure-lightbox-missing {
    padding: 40px 20px;
    color: #a0a0a0;
    font-style: italic;
    text-align: center;
}

.brochure-lightbox-full {
    color: #d4a017;
    font-size: 0.9rem;
    font-weight: 600;
}

.brochure-lightbox-full[hidden] {
    display: none;
}

/* Admin-only status badges (Hidden, expiry) along the top of a card,
   leaving room for the Edit button on the right. */
.partners-badges {
    align-self: stretch;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: -16px 56px 14px 0;
}

.partners-badge {
    padding: 3px 9px;
    border-radius: 6px;
    background: rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.25);
    color: #e0d6c8;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.partners-badge-none,
.partners-badge-until {
    color: #a0a0a0;
    border-color: rgba(255, 255, 255, 0.15);
    font-weight: 600;
}

.partners-badge-banner {
    color: #b5d8ff;
    border-color: rgba(120, 170, 230, 0.5);
    background: rgba(120, 170, 230, 0.12);
}

.partners-badge-soon {
    color: #f0c040;
    border-color: rgba(212, 160, 23, 0.6);
    background: rgba(212, 160, 23, 0.12);
}

.partners-badge-expired {
    color: #ffb3c0;
    border-color: rgba(196, 30, 58, 0.6);
    background: rgba(196, 30, 58, 0.18);
}

/* Expiry control in the add/edit form */
.partners-expiry {
    margin: 14px 0 0;
    padding: 12px 14px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    min-width: 0;
}

.partners-expiry legend {
    padding: 0 6px;
    font-size: 0.85rem;
    color: #e0d6c8;
}

.partners-expiry-options,
.partners-expiry-extend-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 16px;
}

.partners-expiry-option {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.9rem;
    color: #e0d6c8;
    cursor: pointer;
}

.partners-expiry-date {
    width: auto;
    min-width: 0;
    color-scheme: dark;
}

.partners-expiry-extend-row {
    gap: 8px;
    margin-top: 10px;
}

.partners-expiry-extend-row .partners-button-secondary {
    padding: 5px 10px;
    font-size: 0.8rem;
}

.partners-empty {
    grid-column: 1 / -1;
    text-align: center;
    color: #a0a0a0;
    font-style: italic;
    padding: 40px 0;
}

/* "Advertise with us" panel */

.partners-cta-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
    margin: 32px 0 0;
    padding: 22px 26px;
    border-radius: 14px;
    border: 1px solid rgba(212, 160, 23, 0.35);
    background: linear-gradient(135deg, rgba(196, 30, 58, 0.14), rgba(212, 160, 23, 0.08));
}

.partners-cta-text {
    flex: 1;
    min-width: 220px;
}

.partners-cta-title {
    font-size: 1.15rem;
    color: #d4a017;
    margin-bottom: 6px;
}

.partners-cta-text p {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #e0d6c8;
}

.partners-cta-button {
    display: inline-block;
    padding: 12px 24px;
    border-radius: 8px;
    background: linear-gradient(90deg, #c41e3a, #d4a017);
    color: #ffffff;
    font-weight: 700;
    font-size: 0.95rem;
    text-decoration: none;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
    white-space: nowrap;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.partners-cta-button:hover,
.partners-cta-button:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(196, 30, 58, 0.35);
}

/* Admin controls */

.partners-button,
.partners-button-secondary,
.partners-button-danger {
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.partners-button {
    border: none;
    background: linear-gradient(90deg, #c41e3a, #d4a017);
    color: #ffffff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}

.partners-button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.partners-button-secondary {
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.08);
    color: #e0d6c8;
}

.partners-button-danger {
    background: rgba(196, 30, 58, 0.15);
    border: 1px solid rgba(196, 30, 58, 0.5);
    color: #ff8a8a;
    margin-left: auto;
}

.partners-edit-button {
    position: absolute;
    top: 12px;
    right: 12px;
    padding: 4px 10px;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.08);
    color: #e0d6c8;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
}

.partners-message {
    margin: 0 0 16px;
    padding: 12px 14px;
    border-radius: 8px;
    font-size: 0.9rem;
}

.partners-message-error {
    background: rgba(196, 30, 58, 0.15);
    border: 1px solid rgba(196, 30, 58, 0.5);
    color: #ffb3c0;
}

.partners-message-success {
    background: rgba(40, 167, 69, 0.15);
    border: 1px solid rgba(40, 167, 69, 0.5);
    color: #b5e8bd;
}

.partners-reorder-toolbar[hidden] {
    display: none;
}

.partners-reorder-toolbar,
.partners-wizard {
    margin-bottom: 20px;
    padding: 14px 18px;
    border-radius: 10px;
    border: 1px solid rgba(212, 160, 23, 0.3);
    background: rgba(0, 0, 0, 0.2);
}

.partners-reorder-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.partners-reorder-hint {
    font-size: 0.9rem;
    color: #e0d6c8;
}

.partners-reorder-toolbar-actions {
    display: flex;
    gap: 10px;
}

.partners-reorder-controls {
    display: flex;
    justify-content: center;
    gap: 10px;
    width: 100%;
    margin-top: 8px;
    padding-top: 14px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.partners-move-button {
    flex: 1;
    max-width: 90px;
    padding: 6px 0;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.08);
    color: #e0d6c8;
    font-size: 0.9rem;
    cursor: pointer;
}

.partners-move-button:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

.partners-wizard-title {
    font-size: 1rem;
    color: #d4a017;
    margin-bottom: 12px;
}

.partners-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 12px;
}

.partners-card-editing .partners-form-grid {
    grid-template-columns: 1fr;
}

.partners-form-field-wide {
    grid-column: 1 / -1;
}

.partners-form-field label {
    display: block;
    font-size: 0.85rem;
    color: #e0d6c8;
    margin-bottom: 6px;
}

.partners-label-note {
    color: #a0a0a0;
    font-weight: 400;
}

.partners-input {
    padding: 8px 10px;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    background: rgba(0, 0, 0, 0.3);
    color: #ffffff;
    font-size: 0.9rem;
    width: 100%;
    box-sizing: border-box;
    font-family: inherit;
}

textarea.partners-input {
    resize: vertical;
}

.partners-input:focus {
    outline: none;
    border-color: #c41e3a;
}

.partners-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    font-size: 0.9rem;
    color: #e0d6c8;
    cursor: pointer;
}

.partners-hint {
    font-size: 0.8rem;
    color: #a0a0a0;
    margin: 8px 0 0;
}

.partners-hint code {
    color: #d4a017;
}

.partners-wizard-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 16px;
}

.partners-edit-form {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.partners-edit-menu {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

@media (max-width: 480px) {
    .brochure-lightbox {
        padding: 14px;
    }

    .partners-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .partners-card {
        padding: 24px 18px 18px;
    }

    /* Smaller Call and Email on phones, so the pair keeps clear of the
       card's edges on the narrowest screens. */
    .partners-contact-row {
        gap: 6px;
    }

    .partners-contact-row .partners-link {
        padding: 6px 10px;
        font-size: 0.78rem;
    }

    .partners-logo-wrap {
        width: 110px;
        height: 110px;
    }

    .partners-title {
        font-size: 1.15rem;
    }

    .partners-cta-panel {
        padding: 18px;
    }

    .partners-cta-button {
        width: 100%;
        text-align: center;
    }
}
