/**
 * Krannon Archaeology — partner logos (v1.3.8).
 *
 * Layout-driven stylesheet for the partner_logos section. Every visual
 * decision (container width, column count, logo frame dimensions, gap,
 * card style, alignment) is set as a CSS variable on the section
 * element by the template, and read here. The stylesheet contains no
 * hardcoded grid widths, so the section can never collapse to a third
 * of the page just because of a stale parent rule.
 *
 * The previous v1.3.7 selectors are kept as aliases through the legacy
 * compatibility classes so already-styled markup keeps rendering.
 */

/* -------------------------------------------------------------------------
 * Section shell
 * --------------------------------------------------------------------- */

.krannon-section-partner-logos-v2 {
    --pl-text-color:    var(--krannon-text, #1d1a16);
    --pl-muted:         var(--krannon-muted, #756D63);
    --pl-card-radius:   var(--krannon-radius, 8px);
    --pl-card-border:   var(--krannon-border, #D8CCBA);
    --pl-card-shadow:   0 6px 22px rgba(20, 16, 12, 0.08);

    padding: var(--pl-pad-y, 64px) 0;
    color: var(--pl-text-color);
    width: 100%;
}

.krannon-section-partner-logos-v2.pl-bg-light  { background: var(--krannon-bg-soft, #F4EFE6); }
.krannon-section-partner-logos-v2.pl-bg-dark   { background: var(--krannon-dark-surface, #1E1A16); color: var(--krannon-light-accent, #E8D8BE); }
.krannon-section-partner-logos-v2.pl-bg-dark .krannon-sec-title,
.krannon-section-partner-logos-v2.pl-bg-dark .krannon-sec-intro,
.krannon-section-partner-logos-v2.pl-bg-dark .pl-name { color: var(--krannon-light-accent, #E8D8BE); }

/* -------------------------------------------------------------------------
 * Container width — overrides the global .krannon-container so the
 * partner_logos section is never trapped at the default 1180px when
 * the editor asks for wide / full / narrow.
 * --------------------------------------------------------------------- */

.krannon-section-partner-logos-v2 > .pl-container {
    width: min(var(--pl-container, 1320px), calc(100% - 40px));
    margin-left: auto;
    margin-right: auto;
}

.krannon-section-partner-logos-v2.pl-container-full_width > .pl-container {
    width: 100%;
    max-width: none;
    padding-left: clamp(16px, 4vw, 64px);
    padding-right: clamp(16px, 4vw, 64px);
}

.krannon-section-partner-logos-v2.pl-container-default > .pl-container {
    width: min(1180px, calc(100% - 40px));
}

.krannon-section-partner-logos-v2.pl-container-narrow > .pl-container {
    width: min(720px, calc(100% - 32px));
}

.krannon-section-partner-logos-v2.pl-container-normal > .pl-container {
    width: min(1180px, calc(100% - 40px));
}

.krannon-section-partner-logos-v2.pl-container-wide > .pl-container {
    width: min(1320px, calc(100% - 40px));
}

/* -------------------------------------------------------------------------
 * Section min-height + vertical alignment
 * --------------------------------------------------------------------- */

.krannon-section-partner-logos-v2:not(.pl-section-min-none) > .pl-container {
    min-height: var(--pl-min-h, 320px);
    display: flex;
    flex-direction: column;
}

.krannon-section-partner-logos-v2.pl-vertical-top    > .pl-container { justify-content: flex-start; }
.krannon-section-partner-logos-v2.pl-vertical-center > .pl-container { justify-content: center; }
.krannon-section-partner-logos-v2.pl-vertical-bottom > .pl-container { justify-content: flex-end; }

/* -------------------------------------------------------------------------
 * Section head (title + intro). The template never emits an empty
 * head, but we still neutralise any stray `::before` divider rules
 * other modules might attach.
 * --------------------------------------------------------------------- */

.krannon-section-partner-logos-v2 .pl-head {
    margin: 0 0 1.6rem;
}
.krannon-section-partner-logos-v2 .pl-head::before,
.krannon-section-partner-logos-v2 .pl-head::after { content: none !important; }
.krannon-section-partner-logos-v2 .pl-head .krannon-sec-title { margin-top: 0; }
.krannon-section-partner-logos-v2 .pl-head .krannon-sec-intro p:last-child { margin-bottom: 0; }
.krannon-section-partner-logos-v2 .pl-head:empty { display: none; }

.krannon-section-partner-logos-v2.pl-content-align-left   .pl-head { text-align: left; }
.krannon-section-partner-logos-v2.pl-content-align-center .pl-head { text-align: center; }
.krannon-section-partner-logos-v2.pl-content-align-right  .pl-head { text-align: right; }

.krannon-section-partner-logos-v2.pl-section-layout-centered_stack .pl-head { text-align: center; margin-left: auto; margin-right: auto; max-width: 720px; }

/* -------------------------------------------------------------------------
 * Two-column split (text + logos)
 * --------------------------------------------------------------------- */

.krannon-section-partner-logos-v2 .pl-split {
    display: grid;
    gap: clamp(24px, 4vw, 56px);
    align-items: center;
    width: 100%;
}

.krannon-section-partner-logos-v2.pl-vertical-top    .pl-split { align-items: flex-start; }
.krannon-section-partner-logos-v2.pl-vertical-bottom .pl-split { align-items: flex-end; }

.krannon-section-partner-logos-v2 .pl-split-text-left  { grid-template-columns: var(--pl-text-col) var(--pl-logo-col); }
.krannon-section-partner-logos-v2 .pl-split-logos-left { grid-template-columns: var(--pl-logo-col) var(--pl-text-col); }

.krannon-section-partner-logos-v2 .pl-col-text .pl-head { margin-bottom: 0; }
.krannon-section-partner-logos-v2 .pl-col-logos { min-width: 0; }

@media (max-width: 860px) {
    .krannon-section-partner-logos-v2 .pl-split-text-left,
    .krannon-section-partner-logos-v2 .pl-split-logos-left {
        grid-template-columns: 1fr;
    }
    .krannon-section-partner-logos-v2 .pl-col-text .pl-head { margin-bottom: 1.4rem; }
}

/* -------------------------------------------------------------------------
 * Logos grid / row
 * --------------------------------------------------------------------- */

.krannon-section-partner-logos-v2 .pl-grid {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    gap: var(--pl-gap, 24px);
}

/* Row layout — flex with editor-controlled justify-content. */
.krannon-section-partner-logos-v2 .pl-grid.pl-layout-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.krannon-section-partner-logos-v2 .pl-grid.pl-layout-row.pl-align-left          { justify-content: flex-start; }
.krannon-section-partner-logos-v2 .pl-grid.pl-layout-row.pl-align-center        { justify-content: center; }
.krannon-section-partner-logos-v2 .pl-grid.pl-layout-row.pl-align-right         { justify-content: flex-end; }
.krannon-section-partner-logos-v2 .pl-grid.pl-layout-row.pl-align-space_between { justify-content: space-between; }
.krannon-section-partner-logos-v2 .pl-grid.pl-layout-row.pl-align-space_around  { justify-content: space-around; }
.krannon-section-partner-logos-v2 .pl-grid.pl-layout-row.pl-align-space_evenly  { justify-content: space-evenly; }

/* Grid layout — CSS grid driven by --pl-cols-* variables. */
.krannon-section-partner-logos-v2 .pl-grid.pl-layout-grid {
    display: grid;
    grid-template-columns: var(--pl-cols-desktop);
    align-items: center;
    justify-items: stretch;
}

@media (max-width: 1024px) {
    .krannon-section-partner-logos-v2 .pl-grid.pl-layout-grid {
        grid-template-columns: var(--pl-cols-tablet);
    }
}

@media (max-width: 640px) {
    .krannon-section-partner-logos-v2 .pl-grid.pl-layout-grid {
        grid-template-columns: var(--pl-cols-mobile);
    }
}

/* -------------------------------------------------------------------------
 * Logo item — frame, image, optional label
 * --------------------------------------------------------------------- */

.krannon-section-partner-logos-v2 .pl-item {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.krannon-section-partner-logos-v2 .pl-link,
.krannon-section-partner-logos-v2 .pl-static {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    width: 100%;
    max-width: var(--pl-frame-w, 260px);
    text-decoration: none;
    color: inherit;
    padding: 14px 18px;
    border-radius: var(--pl-card-radius);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease, opacity .25s ease;
}

.krannon-section-partner-logos-v2.pl-section-layout-centered_stack .pl-link,
.krannon-section-partner-logos-v2.pl-section-layout-centered_stack .pl-static { margin-left: auto; margin-right: auto; }

/* Card styles */
.krannon-section-partner-logos-v2 .pl-card-soft_card     .pl-link,
.krannon-section-partner-logos-v2 .pl-card-soft_card     .pl-static     { background: var(--krannon-bg-soft, #F4EFE6); }
.krannon-section-partner-logos-v2 .pl-card-bordered_card .pl-link,
.krannon-section-partner-logos-v2 .pl-card-bordered_card .pl-static     { background: transparent; border: 1px solid var(--pl-card-border); }
.krannon-section-partner-logos-v2 .pl-card-elevated_card .pl-link,
.krannon-section-partner-logos-v2 .pl-card-elevated_card .pl-static     { background: var(--krannon-surface, #FFFDF8); box-shadow: var(--pl-card-shadow); }
.krannon-section-partner-logos-v2 .pl-card-none          .pl-link,
.krannon-section-partner-logos-v2 .pl-card-none          .pl-static     { padding: 0; background: transparent; }

/* Logo background overrides (apply to the inner frame so the card
   chrome remains independent from the logo background). */
.krannon-section-partner-logos-v2 .pl-logo-bg-transparent .pl-frame { background: transparent; }
.krannon-section-partner-logos-v2 .pl-logo-bg-white       .pl-frame { background: #ffffff; }
.krannon-section-partner-logos-v2 .pl-logo-bg-surface     .pl-frame { background: var(--krannon-surface, #FFFDF8); }
.krannon-section-partner-logos-v2 .pl-logo-bg-light       .pl-frame { background: var(--krannon-bg-soft, #F4EFE6); }

/* Equal-height cards stretch to the tallest sibling within a grid row. */
.krannon-section-partner-logos-v2.pl-equal-height .pl-link,
.krannon-section-partner-logos-v2.pl-equal-height .pl-static { height: 100%; }

/* Hover and focus */
.krannon-section-partner-logos-v2 .pl-link:hover,
.krannon-section-partner-logos-v2 .pl-link:focus-visible {
    transform: translateY(-2px);
    opacity: .92;
    outline: none;
}
.krannon-section-partner-logos-v2 .pl-link:focus-visible {
    box-shadow: 0 0 0 2px var(--krannon-accent, #2E6E68);
}
.krannon-section-partner-logos-v2 .pl-card-elevated_card .pl-link:hover {
    box-shadow: 0 14px 32px rgba(20, 16, 12, 0.14);
}

/* Frame + image */
.krannon-section-partner-logos-v2 .pl-frame {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: var(--pl-frame-h, 120px);
    border-radius: calc(var(--pl-card-radius) - 2px);
    padding: 6px 10px;
    overflow: hidden;
}

.krannon-section-partner-logos-v2 .pl-frame img,
.krannon-section-partner-logos-v2 .pl-img {
    max-width: var(--pl-logo-max-w, 210px);
    max-height: var(--pl-logo-max-h, 82px);
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
    border: 0;
    box-shadow: none;
    background: transparent;
}

/* Grayscale */
.krannon-section-partner-logos-v2.pl-grayscale .pl-img {
    filter: grayscale(1);
    transition: filter .35s ease;
}
.krannon-section-partner-logos-v2.pl-grayscale .pl-link:hover .pl-img {
    filter: grayscale(0);
}

/* Dark background tone — soften monochrome dark logos. */
.krannon-section-partner-logos-v2.pl-bg-dark .pl-logo-bg-transparent .pl-img {
    filter: brightness(0) invert(1);
    opacity: .92;
}

/* Optional name label */
.krannon-section-partner-logos-v2 .pl-name {
    font-family: var(--krannon-font-ui, var(--krannon-sans));
    font-size: .82rem;
    letter-spacing: .04em;
    color: var(--pl-muted);
    text-align: center;
    line-height: 1.3;
}

/* -------------------------------------------------------------------------
 * Padding presets — applied to the section, not the container, so the
 * background fills edge-to-edge in full_width mode.
 * --------------------------------------------------------------------- */

.krannon-section-partner-logos-v2.pl-pad-compact { padding-top: 32px; padding-bottom: 32px; }
.krannon-section-partner-logos-v2.pl-pad-normal  { padding-top: 64px; padding-bottom: 64px; }
.krannon-section-partner-logos-v2.pl-pad-large   { padding-top: 96px; padding-bottom: 96px; }

/* -------------------------------------------------------------------------
 * Footer merge — when the Customizer "Merge partner logos visual style
 * with footer" toggle is on, the body class krannon-footer-merged is
 * added. We then trim the bottom padding of any partner_logos section
 * that immediately precedes the footer so they read as one zone.
 * --------------------------------------------------------------------- */

body.krannon-footer-merged .krannon-section-partner-logos-v2:has(+ .krannon-footer),
body.krannon-footer-merged .krannon-section-partner-logos-v2.pl-merge-footer {
    padding-bottom: 12px;
    background: var(--krannon-footer-bg, var(--krannon-primary-dark, #1E1A16));
    color: rgba(255, 255, 255, 0.86);
}

body.krannon-footer-merged .krannon-section-partner-logos-v2:has(+ .krannon-footer) .krannon-sec-title,
body.krannon-footer-merged .krannon-section-partner-logos-v2:has(+ .krannon-footer) .krannon-sec-intro,
body.krannon-footer-merged .krannon-section-partner-logos-v2:has(+ .krannon-footer) .pl-name {
    color: rgba(255, 255, 255, 0.86);
}

body.krannon-footer-merged .krannon-section-partner-logos-v2:has(+ .krannon-footer) .pl-card-soft_card .pl-link,
body.krannon-footer-merged .krannon-section-partner-logos-v2:has(+ .krannon-footer) .pl-card-soft_card .pl-static {
    background: rgba(255, 255, 255, 0.04);
}

body.krannon-footer-merged .krannon-footer {
    padding-top: 28px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* -------------------------------------------------------------------------
 * Mobile clean-ups
 * --------------------------------------------------------------------- */

@media (max-width: 720px) {
    .krannon-section-partner-logos-v2 .pl-grid.pl-layout-row {
        gap: max(12px, calc(var(--pl-gap, 24px) * 0.7));
    }
    .krannon-section-partner-logos-v2 .pl-frame {
        height: clamp(72px, calc(var(--pl-frame-h, 120px) * 0.8), 120px);
    }
}

/* -------------------------------------------------------------------------
 * Defensive: kill any stale lightbox-style hooks that other modules
 * might have attached to images inside the section.
 * --------------------------------------------------------------------- */

.krannon-section-partner-logos-v2 .pl-img {
    cursor: inherit !important;
    pointer-events: auto;
}
.krannon-section-partner-logos-v2 .pl-link {
    cursor: pointer;
}
.krannon-section-partner-logos-v2 .pl-static .pl-img {
    cursor: default !important;
}
