.savora-archive-main {
    box-sizing: border-box;
    width: min(1220px, calc(100% - 32px));
    margin: 36px auto 65px;
    color: #172a30;
}

.savora-archive-main * { box-sizing: border-box; }
.savora-archive-main a { text-decoration: none; }

.savora-archive-header {
    margin-bottom: 24px;
    padding: 30px;
    border-radius: 22px;
    background: linear-gradient(135deg, #edf9f6, #fff8e8);
    text-align: center;
}

.savora-archive-header > span {
    color: #167481;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

.savora-archive-header h1 {
    margin: 6px 0 8px;
    color: #172a30;
    font-size: clamp(32px, 4.5vw, 50px);
    line-height: 1.05;
}

.savora-archive-header p,
.savora-archive-description {
    max-width: 690px;
    margin: 0 auto;
    color: #62737a;
    font-size: 15px;
    line-height: 1.55;
}

.savora-archive-search {
    display: flex;
    max-width: 590px;
    margin: 20px auto 0;
    overflow: hidden;
    border: 1px solid #cbdedb;
    border-radius: 11px;
    background: #fff;
}

.savora-archive-search input {
    min-width: 0;
    height: 46px;
    flex: 1;
    padding: 0 14px;
    border: 0;
    background: transparent;
    color: #172a30;
    font-size: 15px;
    outline: none;
}

.savora-archive-search button {
    min-width: 105px;
    padding: 0 17px;
    border: 0;
    background: #167481;
    color: #fff;
    font-weight: 800;
    cursor: pointer;
}

.savora-archive-categories {
    display: flex;
    gap: 8px;
    margin: 0 0 27px;
    padding: 4px 1px 9px;
    overflow-x: auto;
    scrollbar-width: thin;
}

.savora-archive-categories a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 40px;
    padding: 8px 13px;
    border: 1px solid #d7e5e2;
    border-radius: 99px;
    background: #fff;
    color: #31474d !important;
    font-size: 13px;
    font-weight: 750;
    white-space: nowrap;
}

/* Keep every category emoji visible even when the active theme resets <b>. */
.savora-archive-categories > a > b {
    display: inline-block !important;
    flex: 0 0 auto;
    margin: 0 !important;
    color: inherit !important;
    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.savora-archive-categories a.is-active,
.savora-archive-categories a:hover { border-color: #167481; background: #167481; color: #fff !important; }

.savora-archive-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: 19px;
    width: 100%;
}


.savora-archive-card {
    flex: 0 1 calc((100% - 57px) / 4);
    min-width: 0;
    overflow: hidden;
    border: 1px solid #deebe8;
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 8px 21px rgba(24, 68, 72, .08);
    transition: transform .2s ease, box-shadow .2s ease;
}

.savora-archive-card:hover { transform: translateY(-4px); box-shadow: 0 14px 29px rgba(24, 68, 72, .14); }
.savora-archive-card > a { display: block; height: 100%; color: inherit !important; }

.savora-archive-card-image {
    position: relative;
    display: grid;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    place-items: center;
    background: linear-gradient(145deg, #e4f2ee, #fff0c9);
}

.savora-archive-card-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .35s ease;
}

.savora-archive-card:hover .savora-archive-card-image img { transform: scale(1.035); }
.savora-archive-card-image > span { font-size: 58px; }

.savora-archive-card-image small {
    position: absolute;
    bottom: 10px;
    left: 10px;
    padding: 5px 9px;
    border-radius: 99px;
    background: rgba(22, 116, 129, .94);
    color: #fff;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .55px;
    text-transform: uppercase;
}

.savora-archive-card-copy { padding: 15px; }
.savora-archive-card-copy h2 { margin: 0 0 7px; color: #172a30; font-size: 18px; line-height: 1.25; }
.savora-archive-card-copy p { margin: 0 0 11px; color: #68797f; font-size: 13px; line-height: 1.45; }
.savora-archive-card-copy strong { color: #167481; font-size: 12px; }

.savora-archive-ad {
    flex: 0 0 100%;
    min-height: 105px;
    padding: 12px;
    border: 1px dashed #d1dedb;
    border-radius: 14px;
    background: #fafcfc;
    color: #89979a;
    text-align: center;
}

.savora-archive-ad small { display: block; margin-bottom: 9px; font-size: 9px; letter-spacing: 1.2px; }
.savora-archive-ad div { display: grid; min-height: 57px; place-items: center; font-size: 12px; }

.savora-archive-pagination { margin: 34px 0; text-align: center; }
.savora-archive-pagination .nav-links { display: flex; align-items: center; justify-content: center; gap: 7px; flex-wrap: wrap; }
.savora-archive-pagination ul.page-numbers { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 0; padding: 0; list-style: none; flex-wrap: wrap; }
.savora-archive-pagination ul.page-numbers li { margin: 0; padding: 0; }
.savora-archive-pagination .page-numbers { display: inline-grid; min-width: 40px; min-height: 40px; padding: 7px; border: 1px solid #d7e5e2; border-radius: 9px; background: #fff; color: #1f5058; place-items: center; }
.savora-archive-pagination .current { border-color: #167481; background: #167481; color: #fff; }

.savora-archive-affiliate {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: 40px;
    padding: 24px 28px;
    border: 1px solid #dce9e6;
    border-radius: 18px;
    background: linear-gradient(135deg, #f1faf7, #fff8e7);
}

.savora-archive-affiliate small { color: #167481; font-size: 10px; font-weight: 800; letter-spacing: 1.2px; }
.savora-archive-affiliate h2 { margin: 4px 0 5px; color: #172a30; font-size: 23px; }
.savora-archive-affiliate p { margin: 0; color: #62737a; font-size: 14px; }
.savora-archive-affiliate a { flex: 0 0 auto; padding: 12px 18px; border-radius: 10px; background: #167481; color: #fff !important; font-size: 13px; font-weight: 800; }

.savora-archive-empty { padding: 42px; border-radius: 18px; background: #f5faf9; text-align: center; }

@media (max-width: 720px) {
    .savora-archive-main { width: calc(100% - 24px); margin-top: 22px; }
    .savora-archive-header { padding: 24px 17px; border-radius: 18px; }
    .savora-archive-card-copy { padding: 12px; }
    .savora-archive-card-copy h2 { font-size: 15px; }
    .savora-archive-card-copy p { display: none; }
    .savora-archive-affiliate { align-items: flex-start; flex-direction: column; padding: 21px; }
}

@media (prefers-reduced-motion: reduce) {
    .savora-archive-card,
    .savora-archive-card-image img { transition: none; }
}


/* Savora 2.2 centered incomplete recipe rows */
.savora-archive-main { max-width: 1220px; }
.savora-archive-grid { width: 100%; max-width: none; }
.savora-archive-card { width: auto; max-width: none; }

/* Desktop: four equal-width cards. Incomplete final rows stay centered. */
@media screen and (min-width: 900px) {
    .savora-archive-card {
        flex-basis: calc((100% - 57px) / 4);
    }
}

/* Tablet: two equal-width cards. */
@media screen and (max-width: 899px) and (min-width: 600px) {
    .savora-archive-grid { gap: 14px !important; }
    .savora-archive-card {
        flex-basis: calc((100% - 14px) / 2);
    }
}

/* Phones: one card per row. */
@media screen and (max-width: 599px) {
    .savora-archive-grid { gap: 12px !important; }
    .savora-archive-card {
        flex-basis: 100%;
    }
}