* {
    box-sizing: border-box;
}

html {
    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
    color: #202124;
    background: #ffffff;
}

body {
    margin: 0;
    background: #fff;
}

a {
    color: inherit;
    text-decoration: none;
}

.container {
    width: min(1200px, calc(100% - 40px));
    margin: 0 auto;
}

.site-header {
    border-bottom: 1px solid #e5e7eb;
    background: #fff;
}

.header-inner {
    min-height: 74px;
    display: flex;
    align-items: center;
    gap: 40px;
}

.logo {
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -1px;
}

.search {
    display: flex;
    width: 100%;
    max-width: 640px;
}

.search input {
    width: 100%;
    height: 46px;
    padding: 0 16px;
    border: 1px solid #cfd4dc;
    border-radius: 8px 0 0 8px;
    font-size: 16px;
    outline: none;
}

.search button {
    height: 46px;
    padding: 0 24px;
    border: 0;
    border-radius: 0 8px 8px 0;
    background: #111827;
    color: white;
    font-weight: 700;
    cursor: pointer;
}

.main-nav {
    border-bottom: 1px solid #e5e7eb;
    background: #fff;
}

.nav-inner {
    display: flex;
    gap: 28px;
    min-height: 48px;
    align-items: center;
    font-weight: 600;
}

.hero {
    background: #f5f6f8;
}

.hero-compact {
    padding: 42px 0;
}

.hero h1 {
    margin: 0 0 10px;
    font-size: 42px;
    letter-spacing: -1.5px;
}

.hero p {
    margin: 0;
    color: #5f6368;
    font-size: 18px;
    max-width: 720px;
    line-height: 1.6;
}

.section {
    padding-top: 34px;
    padding-bottom: 6px;
}

.section h2 {
    margin: 0 0 20px;
    font-size: 30px;
    letter-spacing: -0.5px;
}

.platform-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.platform-card {
    border: 1px solid #e2e5e9;
    border-radius: 12px;
    padding: 20px 22px;
    transition: 0.15s;
    background: #fff;
}

.platform-card:hover {
    border-color: #9ca3af;
    transform: translateY(-1px);
}

.platform-card-title {
    font-size: 19px;
    font-weight: 800;
    margin-bottom: 6px;
}

.platform-card-subtitle {
    color: #6b7280;
    font-size: 14px;
}

.program-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.program-card {
    display: flex;
    gap: 16px;
    padding: 18px;
    border: 1px solid #e2e5e9;
    border-radius: 12px;
    background: #fff;
    transition: 0.15s;
}

.program-card:hover {
    border-color: #9ca3af;
    transform: translateY(-1px);
}

.program-icon {
    display: flex;
    width: 56px;
    height: 56px;
    min-width: 56px;
    align-items: center;
    justify-content: center;
    background: #f0f1f3;
    border-radius: 12px;
    font-size: 24px;
    font-weight: 800;
}

.program-info {
    min-width: 0;
    width: 100%;
}

.program-info h3 {
    margin: 0 0 8px;
    font-size: 18px;
    line-height: 1.3;
}

.program-info p {
    margin: 0 0 10px;
    color: #5f6368;
    font-size: 14px;
    line-height: 1.5;
}

.program-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.program-meta span {
    padding: 5px 8px;
    border-radius: 999px;
    background: #f3f4f6;
    color: #374151;
    font-size: 12px;
    font-weight: 600;
}

.program-info small {
    color: #6b7280;
    font-size: 13px;
}

.empty {
    color: #777;
    padding: 20px 0;
}

.site-footer {
    margin-top: 70px;
    padding: 35px 0;
    border-top: 1px solid #e5e7eb;
    color: #6b7280;
    font-size: 14px;
}

.program-page {
    padding-top: 28px;
}

.breadcrumbs {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 28px;
    color: #6b7280;
    font-size: 14px;
}

.breadcrumbs a:hover {
    text-decoration: underline;
}

.program-hero {
    display: grid;
    grid-template-columns: 110px 1fr 260px;
    gap: 28px;
    align-items: start;
    padding-bottom: 32px;
}

.program-big-icon {
    width: 110px;
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 22px;
    background: #f0f1f3;
    font-size: 46px;
    font-weight: 800;
}

.program-main-info h1 {
    margin: 0 0 8px;
    font-size: 34px;
    letter-spacing: -1px;
}

.program-version,
.program-developer {
    margin-bottom: 6px;
    color: #6b7280;
}

.program-lead {
    max-width: 680px;
    margin-top: 17px;
    line-height: 1.6;
    font-size: 16px;
}

.download-box {
    padding: 20px;
    border: 1px solid #e2e5e9;
    border-radius: 14px;
}

.download-button {
    width: 100%;
    min-height: 50px;
    border: 0;
    border-radius: 9px;
    background: #111827;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
}

.download-button.disabled {
    cursor: default;
    opacity: .5;
}

.download-meta {
    margin-top: 10px;
    color: #6b7280;
    font-size: 13px;
    text-align: center;
}

.program-tabs {
    display: flex;
    gap: 28px;
    border-top: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
    min-height: 56px;
    align-items: center;
    font-weight: 600;
}

.program-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 45px;
    margin-top: 38px;
}

.program-content section {
    margin-bottom: 48px;
}

.program-content h2,
.info-card h2 {
    margin-top: 0;
}

.program-content p {
    line-height: 1.75;
}

.info-card {
    margin-bottom: 18px;
    padding: 22px;
    border: 1px solid #e2e5e9;
    border-radius: 12px;
}

.info-card dl {
    margin: 0;
}

.info-card dl > div {
    padding: 12px 0;
    border-bottom: 1px solid #eceef1;
}

.info-card dl > div:last-child {
    border-bottom: 0;
}

.info-card dt {
    margin-bottom: 4px;
    color: #6b7280;
    font-size: 13px;
}

.info-card dd {
    margin: 0;
    font-weight: 600;
}

.verified {
    font-weight: 700;
}

.release-row {
    display: flex;
    justify-content: space-between;
    padding: 15px 0;
    border-bottom: 1px solid #e5e7eb;
}

@media (max-width: 1000px) {
    .program-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 900px) {
    .program-hero {
        grid-template-columns: 90px 1fr;
    }

    .program-big-icon {
        width: 90px;
        height: 90px;
    }

    .download-box {
        grid-column: 1 / -1;
    }

    .program-layout {
        grid-template-columns: 1fr;
    }

    .platform-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 800px) {
    .header-inner {
        flex-direction: column;
        align-items: stretch;
        gap: 15px;
        padding: 18px 0;
    }

    .program-grid {
        grid-template-columns: 1fr;
    }

    .nav-inner {
        overflow-x: auto;
    }

    .hero h1 {
        font-size: 34px;
    }
}


/* =========================================
   FreeSofts action colors / ratings / badges
   ========================================= */

:root {
    --action-green: #16a34a;
    --action-green-hover: #15803d;
    --action-green-dark: #166534;
    --action-green-light: #f0fdf4;
    --action-green-border: #bbf7d0;
}


/* SEARCH */

.search button {
    background: var(--action-green);
    color: #fff;

    transition:
        background .15s ease,
        transform .15s ease;
}

.search button:hover {
    background: var(--action-green-hover);
}

.search button:active {
    transform: translateY(1px);
}


/* PROGRAM CARD */

.program-card {
    align-items: flex-start;
    position: relative;
}

.program-card-left {
    width: 64px;
    min-width: 64px;
    text-align: center;
}

.program-icon {
    width: 60px;
    height: 60px;
    min-width: 60px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    background: #f0f1f3;

    font-size: 25px;
    font-weight: 800;
}


/* RATING */

.program-rating {
    margin-top: 8px;

    display: flex;
    justify-content: center;
    align-items: center;

    gap: 3px;

    font-size: 12px;
    white-space: nowrap;
}

.rating-star {
    color: #f59e0b;
    font-size: 16px;
    line-height: 1;
}

.program-rating strong {
    color: #202124;
}

.rating-count {
    color: #9ca3af;
    font-size: 11px;
}


/* BADGES */

.program-badges,
.program-title-badges {
    display: flex;
    flex-wrap: wrap;

    gap: 6px;
}

.program-badges {
    margin: 10px 0;
}

.program-title-badges {
    margin: 9px 0 13px;
}

.badge {
    display: inline-flex;
    align-items: center;

    min-height: 24px;

    padding: 3px 8px;

    border-radius: 6px;

    background: #f3f4f6;

    color: #4b5563;

    font-size: 11px;
    font-weight: 700;
}

.badge-license {
    background: var(--action-green-light);

    border: 1px solid #dcfce7;

    color: var(--action-green-hover);
}

.badge-verified {
    background: var(--action-green-light);

    border: 1px solid var(--action-green-border);

    color: var(--action-green-dark);
}


/* DEVELOPER */

.program-developer-small {
    margin: 5px 0 13px;

    color: #6b7280;

    font-size: 12px;
}


/* DOWNLOAD BUTTON IN CARDS */

.card-download-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 38px;

    padding: 0 19px;

    border-radius: 7px;

    background: var(--action-green);

    color: #fff;

    font-size: 14px;
    font-weight: 800;

    transition:
        background .15s ease,
        transform .15s ease,
        box-shadow .15s ease;
}

.card-download-button:hover {
    background: var(--action-green-hover);

    box-shadow:
        0 3px 8px rgba(22, 163, 74, .20);
}

.card-download-button:active {
    transform: translateY(1px);
}


/* PROGRAM NAME */

.program-name-link h3,
.program-info h3 {
    transition: color .15s ease;
}

.program-name-link:hover h3 {
    color: var(--action-green-hover);
}


/* BIG PROGRAM ICON + RATING */

.program-icon-column {
    width: 110px;
}

.program-page-rating {
    margin-top: 10px;

    display: flex;
    justify-content: center;
    align-items: center;

    flex-wrap: wrap;

    gap: 5px;

    color: #6b7280;

    font-size: 12px;

    text-align: center;
}

.program-page-rating strong {
    color: #202124;
}


/* MAIN DOWNLOAD BUTTON */

.download-button {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;

    min-height: 54px;

    border: 0;
    border-radius: 9px;

    background: var(--action-green);

    color: #fff;

    font-size: 16px;
    font-weight: 800;

    cursor: pointer;

    box-shadow:
        0 2px 5px rgba(22, 163, 74, .18);

    transition:
        background .15s ease,
        transform .15s ease,
        box-shadow .15s ease;
}

.download-button:hover {
    background: var(--action-green-hover);

    box-shadow:
        0 4px 10px rgba(22, 163, 74, .24);
}

.download-button:active {
    transform: translateY(1px);
}

.download-button.disabled {
    background: #9ca3af;
    box-shadow: none;
    cursor: default;
}


@media (max-width: 900px) {

    .program-icon-column {
        width: 90px;
    }

}


/* =========================================
   Compact program cards
   ========================================= */

.program-grid {
    gap: 12px;
}

.program-card {
    gap: 12px;
    padding: 13px 14px;

    border-radius: 10px;

    min-height: 0;

    align-items: flex-start;
}


/* LEFT COLUMN */

.program-card-left {
    width: 52px;
    min-width: 52px;
}

.program-icon {
    width: 48px;
    height: 48px;
    min-width: 48px;

    border-radius: 10px;

    font-size: 21px;
}


/* RATING */

.program-rating {
    margin-top: 6px;

    gap: 2px;

    font-size: 11px;
}

.rating-star {
    font-size: 13px;
}

.rating-count {
    color: #9ca3af;
    font-size: 10px;
}


/* TITLE */

.program-info h3 {
    margin: 0 0 5px;

    font-size: 16px;
    line-height: 1.25;
}


/* DESCRIPTION */

.program-description {
    margin: 0 0 7px !important;

    color: #5f6368;

    font-size: 12.5px !important;
    line-height: 1.4 !important;

    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;

    overflow: hidden;
}


/* BADGES */

.program-badges {
    margin: 6px 0 7px;

    gap: 4px;
}

.badge {
    min-height: 20px;

    padding: 2px 6px;

    border-radius: 5px;

    font-size: 10px;
}


/* FOOTER */

.program-card-footer {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 10px;

    margin-top: 4px;
}

.program-developer-small {
    margin: 0;

    overflow: hidden;

    color: #6b7280;

    font-size: 11px;

    white-space: nowrap;
    text-overflow: ellipsis;
}


/* DOWNLOAD */

.card-download-button {
    min-height: 31px;

    padding: 0 13px;

    border-radius: 6px;

    font-size: 12px;

    flex-shrink: 0;
}


/* PLATFORM CARDS */

.platform-card {
    padding: 14px 18px;
}

.platform-card-title {
    font-size: 17px;
}

.platform-card-subtitle {
    margin-top: 3px;

    font-size: 12px;
}


/* SECTIONS */

.section {
    padding-top: 27px;
}

.section h2 {
    margin-bottom: 16px;

    font-size: 27px;
}


/* HERO */

.hero-compact {
    padding: 30px 0;
}

.hero h1 {
    font-size: 36px;
}

.hero p {
    font-size: 16px;
}


/* =========================================
   404
   ========================================= */

.error-page {
    padding: 90px 0 130px;
}

.error-code {
    margin-bottom: 5px;

    color: #16a34a;

    font-size: 72px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -4px;
}

.error-page h1 {
    margin: 0 0 14px;

    font-size: 34px;
    letter-spacing: -1px;
}

.error-page p {
    margin: 0 0 28px;

    color: #6b7280;

    font-size: 16px;
}

.error-home-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 42px;
    padding: 0 18px;

    border-radius: 7px;

    background: #16a34a;
    color: #ffffff;

    font-size: 14px;
    font-weight: 800;
}

.error-home-button:hover {
    background: #15803d;
}


/* =========================================
   SEO landing pages: versions / x64
   ========================================= */

.seo-landing {
    padding-top: 24px;
    padding-bottom: 60px;
}

.seo-landing h1 {
    margin: 18px 0 12px;
    font-size: 32px;
    line-height: 1.2;
}

.seo-landing-lead {
    max-width: 760px;
    margin-bottom: 24px;
    color: #4b5563;
    font-size: 16px;
    line-height: 1.6;
}

.seo-download-box {
    max-width: 820px;
    margin: 24px 0;
    padding: 20px;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #ffffff;
}

.seo-file-row {
    padding: 12px 0;
    border-top: 1px solid #e5e7eb;
}

.seo-file-row:first-of-type {
    border-top: 0;
}

.seo-version-list {
    max-width: 820px;
    margin-top: 24px;
}

.seo-version-row {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 14px 16px;
    margin-bottom: 8px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #ffffff;
    text-decoration: none;
}

.seo-version-row:hover {
    border-color: #16a34a;
}


/* === FREESOFTS SEARCH PAGE === */

.search-page {
    padding-top: 28px;
    padding-bottom: 48px;
}

.search-page-header {
    margin-bottom: 22px;
}

.search-page-header h1 {
    margin: 0 0 8px;
}

.search-summary {
    margin: 0;
    color: #667085;
}

.search-program-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.search-program-card {
    display: flex;
    gap: 13px;
    min-width: 0;
    padding: 14px;
    border: 1px solid #e6e8eb;
    border-radius: 12px;
    background: #fff;
    color: inherit;
    text-decoration: none;
    transition:
        border-color .15s ease,
        box-shadow .15s ease,
        transform .15s ease;
}

.search-program-card:hover {
    border-color: var(--action-green, #16a34a);
    box-shadow: 0 5px 18px rgba(0, 0, 0, .06);
    transform: translateY(-1px);
}

.search-program-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 11px;
    background: #f1f5f3;
    color: var(--action-green, #16a34a);
    font-size: 21px;
    font-weight: 700;
}

.search-program-content {
    min-width: 0;
    flex: 1;
}

.search-program-name {
    margin-bottom: 5px;
    overflow: hidden;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.search-program-description {
    display: -webkit-box;
    min-height: 36px;
    overflow: hidden;
    color: #667085;
    font-size: 13px;
    line-height: 18px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.search-program-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    margin-top: 8px;
    color: #667085;
    font-size: 12px;
}

.search-verified {
    color: var(--action-green, #16a34a);
}

.search-empty {
    padding: 32px;
    border: 1px solid #e6e8eb;
    border-radius: 12px;
    background: #fff;
    text-align: center;
}

.search-empty h2 {
    margin-top: 0;
}

.search-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin-top: 28px;
}

.search-pagination a {
    color: var(--action-green, #16a34a);
    font-weight: 600;
    text-decoration: none;
}

@media (max-width: 900px) {
    .search-program-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .search-program-grid {
        grid-template-columns: 1fr;
    }
}


/* === DOWNLOAD ALTERNATIVES === */

.download-alternatives {
    margin-top: 14px;
}

.download-alternatives summary {
    cursor: pointer;
    color: #475467;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    user-select: none;
}

.download-alternatives summary:hover {
    color: var(--action-green, #16a34a);
}

.download-alternative-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 10px;
}

.download-alternative-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 9px 11px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fff;
    color: #344054;
    font-size: 13px;
    text-decoration: none;
}

.download-alternative-row:hover {
    border-color: var(--action-green, #16a34a);
    color: #111827;
}

.download-alternative-main {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
}

.download-alternative-main strong {
    color: #111827;
}

.download-alternative-size {
    flex: 0 0 auto;
    color: #667085;
    white-space: nowrap;
}

@media (max-width: 600px) {
    .download-alternative-row {
        align-items: flex-start;
    }
}

/* FreeSofts catalog media */
.catalog-program-icon-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: inherit;
}


/* freesofts-program-gallery:start */

.program-screenshots {
    scroll-margin-top: 24px;
}

.program-screenshots h2 {
    margin-bottom: 18px;
}

.program-gallery {
    width: 100%;
}

.program-gallery-stage {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 300px;
    max-height: 560px;
    padding: 0;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid #e2e5e9;
    border-radius: 14px;
    background: #f5f6f7;
    cursor: zoom-in;
}

.program-gallery-main {
    display: block;
    width: 100%;
    height: auto;
    max-height: 560px;
    object-fit: contain;
}

.program-gallery-zoom {
    position: absolute;
    right: 14px;
    bottom: 14px;
    padding: 7px 11px;
    border-radius: 8px;
    background: rgba(17, 24, 39, 0.78);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    opacity: 0;
    transition: opacity .15s ease;
    pointer-events: none;
}

.program-gallery-stage:hover .program-gallery-zoom,
.program-gallery-stage:focus-visible .program-gallery-zoom {
    opacity: 1;
}

.program-gallery-thumbnails {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 9px;
    margin-top: 12px;
}

.program-gallery-thumb {
    display: flex;
    min-width: 0;
    aspect-ratio: 16 / 10;
    padding: 3px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 2px solid transparent;
    border-radius: 9px;
    background: #f3f4f6;
    cursor: pointer;
}

.program-gallery-thumb:hover {
    border-color: #9ca3af;
}

.program-gallery-thumb.is-active {
    border-color: #16a34a;
    box-shadow: 0 0 0 1px #16a34a;
}

.program-gallery-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    object-fit: cover;
}

.program-gallery-lightbox[hidden] {
    display: none !important;
}

.program-gallery-lightbox {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) 72px;
    align-items: center;
    padding: 40px 20px 28px;
    background: rgba(0, 0, 0, .92);
}

.program-gallery-lightbox-stage {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 0;
    align-items: center;
    justify-content: center;
}

.program-gallery-lightbox-stage img {
    display: block;
    max-width: 100%;
    max-height: calc(100vh - 90px);
    border-radius: 8px;
    object-fit: contain;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .45);
}

.program-gallery-close,
.program-gallery-arrow {
    border: 0;
    color: #fff;
    background: transparent;
    cursor: pointer;
}

.program-gallery-close {
    position: absolute;
    top: 12px;
    right: 18px;
    z-index: 2;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    font-size: 38px;
    line-height: 42px;
}

.program-gallery-arrow {
    width: 54px;
    height: 72px;
    justify-self: center;
    border-radius: 12px;
    font-size: 54px;
    line-height: 1;
}

.program-gallery-close:hover,
.program-gallery-arrow:hover {
    background: rgba(255, 255, 255, .12);
}

.program-gallery-counter {
    position: absolute;
    left: 50%;
    bottom: 12px;
    transform: translateX(-50%);
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .72);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
}

html.program-gallery-is-open,
html.program-gallery-is-open body {
    overflow: hidden;
}

@media (max-width: 800px) {
    .program-gallery-stage {
        min-height: 220px;
    }

    .program-gallery-thumbnails {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .program-gallery-lightbox {
        grid-template-columns:
            46px minmax(0, 1fr) 46px;
        padding-left: 6px;
        padding-right: 6px;
    }

    .program-gallery-arrow {
        width: 42px;
        height: 60px;
        font-size: 44px;
    }
}

@media (max-width: 520px) {
    .program-gallery-stage {
        min-height: 180px;
    }

    .program-gallery-zoom {
        display: none;
    }

    .program-gallery-thumbnails {
        gap: 6px;
    }
}

/* freesofts-program-gallery:end */
/* freesofts-ui-v2:start */

/* =========================================
   FREESOFTS UI V2
   ========================================= */

:root {
    --fs-green: #16a34a;
    --fs-green-dark: #15803d;
    --fs-green-soft: #ecfdf3;

    --fs-text: #171a21;
    --fs-text-soft: #5f6876;
    --fs-muted: #8a94a3;

    --fs-border: #e3e7ed;
    --fs-border-strong: #d2d8e1;

    --fs-page: #f7f8fa;
    --fs-card: #ffffff;

    --fs-radius: 12px;
    --fs-radius-small: 8px;

    --fs-shadow:
        0 1px 2px rgba(15, 23, 42, .04),
        0 6px 20px rgba(15, 23, 42, .04);
}


html {
    scroll-behavior: smooth;
}


body {
    background: var(--fs-page);
    color: var(--fs-text);
}


a:focus-visible,
button:focus-visible,
input:focus-visible {
    outline: 3px solid rgba(22, 163, 74, .22);
    outline-offset: 2px;
}


/* HEADER */

.fs-top-shell {
    position: sticky;
    top: 0;
    z-index: 1000;

    background: #fff;

    box-shadow:
        0 1px 0 rgba(15, 23, 42, .07);
}


.site-header {
    border-bottom: 0;
}


.header-inner {
    min-height: 70px;

    display: grid;
    grid-template-columns: auto minmax(280px, 640px) auto;

    align-items: center;

    gap: 32px;
}


.logo {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    white-space: nowrap;

    color: #111827;

    text-decoration: none;
}


.fs-logo-mark {
    width: 38px;
    height: 38px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 10px;

    background: var(--fs-green);
    color: #fff;

    font-size: 23px;
    font-weight: 900;
    line-height: 1;

    box-shadow:
        0 5px 14px rgba(22, 163, 74, .20);
}


.fs-logo-text {
    font-size: 25px;
    font-weight: 850;

    letter-spacing: -.8px;
}


.fs-logo-text span {
    color: var(--fs-green);
}


/* SEARCH */

.search {
    width: 100%;
    max-width: none;

    display: flex;
}


.fs-search-field {
    min-width: 0;

    position: relative;

    flex: 1;
}


.fs-search-icon {
    position: absolute;

    left: 15px;
    top: 50%;

    transform: translateY(-53%);

    color: #85909d;

    font-size: 22px;

    pointer-events: none;
}


.search input {
    width: 100%;
    height: 44px;

    padding:
        0
        16px
        0
        43px;

    border:
        1px solid
        var(--fs-border-strong);

    border-right: 0;

    border-radius:
        9px 0 0 9px;

    background: #fafbfc;

    color: var(--fs-text);

    font-size: 15px;

    outline: none;

    transition:
        border-color .15s ease,
        background .15s ease,
        box-shadow .15s ease;
}


.search input:focus {
    border-color: var(--fs-green);
    background: #fff;

    box-shadow:
        inset 0 0 0 1px
        var(--fs-green);
}


.search button {
    height: 44px;

    padding: 0 22px;

    border: 0;

    border-radius:
        0 9px 9px 0;

    background: var(--fs-green);

    color: #fff;

    font-weight: 750;

    cursor: pointer;
}


.search button:hover {
    background: var(--fs-green-dark);
}


/* NAV */

.main-nav {
    border-top: 1px solid #f1f3f5;
    border-bottom: 0;

    background: #fff;
}


.nav-inner {
    min-height: 44px;

    display: flex;
    align-items: stretch;

    gap: 4px;

    font-size: 14px;
    font-weight: 650;
}


.nav-inner > a {
    min-height: 44px;

    display: flex;
    align-items: center;

    padding: 0 14px;

    border-radius: 7px;

    color: #3f4651;

    text-decoration: none;

    transition:
        color .15s ease,
        background .15s ease;
}


.nav-inner > a:hover {
    color: var(--fs-green-dark);
    background: var(--fs-green-soft);
}


.nav-inner > .fs-nav-main {
    color: #111827;
    font-weight: 800;
}


.fs-nav-search {
    margin-left: auto;
}


.fs-menu-toggle {
    display: none;

    border: 0;

    background: transparent;

    padding: 8px;

    cursor: pointer;
}


.fs-menu-toggle > span:not(.fs-menu-label) {
    display: block;

    width: 22px;
    height: 2px;

    margin: 4px 0;

    border-radius: 3px;

    background: #303640;
}


.fs-menu-label {
    display: none;
}


/* HERO */

.hero {
    background:
        linear-gradient(
            135deg,
            #f3fbf5 0%,
            #f8fafc 58%,
            #f1f5f9 100%
        );

    border-bottom:
        1px solid
        #e9edf1;
}


.hero-compact {
    padding: 48px 0;
}


.fs-hero-inner {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        330px;

    gap: 70px;

    align-items: center;
}


.fs-eyebrow,
.fs-section-kicker {
    margin-bottom: 8px;

    color: var(--fs-green-dark);

    font-size: 12px;
    font-weight: 850;

    letter-spacing: 1.2px;
}


.hero h1 {
    max-width: 680px;

    margin: 0 0 14px;

    color: #111827;

    font-size: clamp(
        38px,
        5vw,
        54px
    );

    line-height: 1.02;

    letter-spacing: -2px;
}


.hero h1 span {
    color: var(--fs-green);
}


.hero p {
    max-width: 670px;

    margin: 0;

    color: var(--fs-text-soft);

    font-size: 17px;
    line-height: 1.65;
}


.fs-hero-actions {
    display: flex;

    gap: 10px;

    margin-top: 25px;
}


.fs-primary-button,
.fs-secondary-button {
    min-height: 44px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0 18px;

    border-radius: 9px;

    font-size: 14px;
    font-weight: 750;

    text-decoration: none;
}


.fs-primary-button {
    background: var(--fs-green);
    color: #fff;

    box-shadow:
        0 5px 15px rgba(22, 163, 74, .17);
}


.fs-primary-button:hover {
    background: var(--fs-green-dark);
    color: #fff;
}


.fs-secondary-button {
    border: 1px solid var(--fs-border-strong);

    background: #fff;
    color: #303641;
}


.fs-secondary-button:hover {
    border-color: #aeb7c3;

    color: #111827;
}


.fs-hero-trust {
    display: flex;

    flex-wrap: wrap;

    gap: 16px;

    margin-top: 20px;

    color: #68717d;

    font-size: 12px;
}


.fs-hero-visual {
    position: relative;

    height: 230px;
}


.fs-hero-app {
    position: absolute;

    width: 102px;
    height: 102px;

    display: flex;
    align-items: center;
    justify-content: center;

    border:
        1px solid
        rgba(210, 216, 225, .8);

    border-radius: 25px;

    background: rgba(255, 255, 255, .9);

    box-shadow:
        0 18px 50px
        rgba(15, 23, 42, .09);

    backdrop-filter: blur(8px);
}


.fs-hero-app span {
    font-size: 38px;
    font-weight: 900;

    color: var(--fs-green);
}


.fs-app-1 {
    left: 15px;
    top: 25px;

    transform: rotate(-7deg);
}


.fs-app-2 {
    right: 15px;
    top: 4px;

    transform: rotate(8deg);
}


.fs-app-3 {
    left: 119px;
    bottom: 3px;

    transform: rotate(3deg);
}


/* SECTIONS */

.section {
    padding-top: 34px;
    padding-bottom: 18px;
}


.fs-section-heading {
    display: flex;

    align-items: flex-end;
    justify-content: space-between;

    gap: 20px;

    margin-bottom: 18px;
}


.fs-section-heading h2 {
    margin: 0;

    color: #161b22;

    font-size: 27px;

    letter-spacing: -.6px;
}


.fs-section-more {
    margin-bottom: 3px;

    color: var(--fs-green-dark);

    font-size: 13px;
    font-weight: 750;

    text-decoration: none;
}


/* PLATFORM CARDS */

.platform-grid {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 12px;
}


.platform-card {
    min-height: 86px;

    display: flex;

    align-items: center;

    gap: 14px;

    padding: 15px;

    border:
        1px solid
        var(--fs-border);

    border-radius: 11px;

    background: #fff;

    color: var(--fs-text);

    text-decoration: none;

    box-shadow:
        0 1px 2px
        rgba(15, 23, 42, .02);

    transition:
        transform .15s ease,
        border-color .15s ease,
        box-shadow .15s ease;
}


.platform-card:hover {
    transform: translateY(-2px);

    border-color:
        #bfc7d1;

    box-shadow:
        var(--fs-shadow);
}


.platform-card-symbol {
    width: 48px;
    height: 48px;

    min-width: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 12px;

    background: #f2f4f7;

    color: #343b45;

    font-size: 25px;
    font-weight: 800;
}


.platform-windows .platform-card-symbol {
    background: #eef6ff;
}


.platform-android .platform-card-symbol {
    background: #effbf3;
}


.platform-mac .platform-card-symbol {
    background: #f4f4f5;
}


.platform-linux .platform-card-symbol {
    background: #fff8eb;
}


.platform-card-content {
    min-width: 0;

    display: flex;
    flex-direction: column;

    gap: 3px;
}


.platform-card-title {
    margin: 0;

    font-size: 16px;
    font-weight: 800;
}


.platform-card-subtitle {
    color: var(--fs-muted);

    font-size: 12px;
}


.platform-card-arrow {
    margin-left: auto;

    color: #9aa3af;

    font-size: 20px;
}


/* PROGRAM CARDS */

.program-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 12px;
}


.program-card {
    min-width: 0;
    min-height: 164px;

    display: flex;

    gap: 12px;

    padding: 14px;

    border:
        1px solid
        var(--fs-border);

    border-radius: 11px;

    background: #fff;

    box-shadow:
        0 1px 2px
        rgba(15, 23, 42, .025);

    transition:
        transform .15s ease,
        border-color .15s ease,
        box-shadow .15s ease;
}


.program-card:hover {
    transform: translateY(-2px);

    border-color: #c4cbd5;

    box-shadow: var(--fs-shadow);
}


.program-card-left {
    width: 52px;
    min-width: 52px;

    display: flex;
    flex-direction: column;
    align-items: center;

    text-align: center;
}


.program-icon {
    width: 50px;
    height: 50px;

    min-width: 50px;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;

    border:
        1px solid
        #edf0f3;

    border-radius: 11px;

    background: #f3f5f7;
}


.fs-icon-letter {
    font-size: 23px;
    font-weight: 850;

    color: var(--fs-green-dark);
}


.program-rating {
    margin-top: 7px;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 2px;

    white-space: nowrap;

    font-size: 11px;
}


.rating-star {
    color: #f59e0b;
}


.program-rating strong {
    font-size: 11px;
}


.rating-count {
    color: #9aa1aa;

    font-size: 10px;
}


.program-info {
    min-width: 0;

    display: flex;
    flex: 1;
    flex-direction: column;
}


.program-name-link {
    text-decoration: none;
}


.program-name-link h3 {
    margin: 0;

    overflow: hidden;

    color: #171b22;

    font-size: 16px;
    font-weight: 800;

    line-height: 1.25;

    text-overflow: ellipsis;
}


.program-name-link:hover h3 {
    color: var(--fs-green-dark);
}


.program-description {
    display: -webkit-box;

    min-height: 34px;

    margin: 7px 0 8px;

    overflow: hidden;

    color: #69717c;

    font-size: 12px;
    line-height: 1.42;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}


.program-badges {
    display: flex;

    flex-wrap: wrap;

    gap: 4px;
}


.badge {
    padding: 3px 6px;

    border:
        1px solid
        #e6e9ee;

    border-radius: 5px;

    background: #f7f8fa;

    color: #68717c;

    font-size: 9px;
    font-weight: 650;

    line-height: 1.2;
}


.badge-verified {
    border-color: #d2efdc;

    background: #effbf3;

    color: #16763a;
}


.program-card-footer {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 8px;

    margin-top: auto;

    padding-top: 9px;
}


.program-developer-small {
    min-width: 0;

    overflow: hidden;

    color: #9aa1aa;

    font-size: 10px;

    text-overflow: ellipsis;
    white-space: nowrap;
}


.card-download-button {
    min-height: 30px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    padding: 0 11px;

    border-radius: 7px;

    background: var(--fs-green);

    color: #fff;

    font-size: 11px;
    font-weight: 750;

    text-decoration: none;
}


.card-download-button:hover {
    background: var(--fs-green-dark);

    color: #fff;
}


/* PAGINATION */

.fs-pagination {
    display: grid;

    grid-template-columns:
        120px 1fr 120px;

    align-items: center;

    gap: 12px;

    margin-top: 30px;
    margin-bottom: 15px;
}


.fs-pagination-pages {
    display: flex;

    align-items: center;
    justify-content: center;

    flex-wrap: wrap;

    gap: 5px;
}


.fs-page-number,
.fs-page-button {
    min-width: 38px;
    height: 38px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0 10px;

    border:
        1px solid
        var(--fs-border);

    border-radius: 8px;

    background: #fff;

    color: #4b5563;

    font-size: 13px;
    font-weight: 700;

    text-decoration: none;

    transition:
        border-color .15s ease,
        background .15s ease,
        color .15s ease;
}


.fs-page-number:hover,
.fs-page-button:hover {
    border-color:
        #aeb8c4;

    background: #fafbfc;

    color: #111827;
}


.fs-page-number.is-current {
    border-color:
        var(--fs-green);

    background:
        var(--fs-green);

    color: #fff;
}


.fs-page-disabled {
    opacity: .38;

    cursor: default;
}


.fs-page-ellipsis {
    width: 28px;

    text-align: center;

    color: #9199a4;
}


.fs-pagination-side-right {
    text-align: right;
}


/* FOOTER */

.site-footer {
    margin-top: 55px;

    padding: 28px 0;

    border-top:
        1px solid
        var(--fs-border);

    background: #fff;

    color: #7b8490;
}


.fs-footer-inner {
    display: flex;

    justify-content: space-between;
    align-items: center;

    gap: 30px;

    font-size: 12px;
}


.fs-footer-inner > div:first-child {
    display: flex;
    flex-direction: column;

    gap: 4px;
}


.fs-footer-inner strong {
    color: #303640;

    font-size: 14px;
}


/* TABLET */

@media (max-width: 1000px) {

    .header-inner {
        gap: 20px;
    }


    .fs-hero-inner {
        grid-template-columns:
            minmax(0, 1fr)
            250px;

        gap: 40px;
    }


    .platform-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    .program-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


/* MOBILE */

@media (max-width: 800px) {

    .fs-top-shell {
        position: relative;
    }


    .header-inner {
        min-height: 64px;

        display: grid;

        grid-template-columns:
            minmax(0, 1fr)
            auto;

        gap: 12px;

        padding: 10px 0;
    }


    .logo {
        grid-column: 1;
        grid-row: 1;
    }


    .fs-logo-mark {
        width: 34px;
        height: 34px;

        border-radius: 9px;

        font-size: 20px;
    }


    .fs-logo-text {
        font-size: 22px;
    }


    .fs-menu-toggle {
        grid-column: 2;
        grid-row: 1;

        display: block;
    }


    .search {
        grid-column: 1 / -1;
        grid-row: 2;

        order: initial;
    }


    .search input,
    .search button {
        height: 42px;
    }


    .main-nav {
        display: none;

        border-top:
            1px solid
            var(--fs-border);
    }


    .main-nav.is-open {
        display: block;
    }


    .nav-inner {
        min-height: 0;

        display: grid;

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 4px;

        padding-top: 8px;
        padding-bottom: 10px;

        overflow: visible;
    }


    .nav-inner > a {
        min-height: 42px;

        padding: 0 12px;
    }


    .fs-nav-search {
        margin-left: 0;
    }


    .hero-compact {
        padding: 34px 0;
    }


    .fs-hero-inner {
        display: block;
    }


    .fs-hero-visual {
        display: none;
    }


    .hero h1 {
        font-size: 38px;

        letter-spacing: -1.4px;
    }


    .hero p {
        font-size: 15px;
    }


    .fs-hero-actions {
        align-items: stretch;

        flex-direction: column;
    }


    .fs-primary-button,
    .fs-secondary-button {
        width: 100%;
    }


    .fs-hero-trust {
        display: grid;

        gap: 6px;
    }


    .section {
        padding-top: 27px;
    }


    .fs-section-heading {
        align-items: center;
    }


    .fs-section-heading h2 {
        font-size: 23px;
    }


    .platform-grid {
        grid-template-columns: 1fr;
    }


    .program-grid {
        grid-template-columns: 1fr;
    }


    .program-card {
        min-height: 0;
    }


    .fs-pagination {
        display: flex;

        flex-wrap: wrap;

        justify-content: center;

        gap: 10px;
    }


    .fs-pagination-pages {
        width: 100%;

        order: -1;
    }


    .fs-pagination-side,
    .fs-pagination-side-right {
        flex: 1;

        text-align: initial;
    }


    .fs-page-button {
        width: 100%;
    }


    .fs-footer-inner {
        align-items: flex-start;

        flex-direction: column;

        gap: 14px;
    }
}


@media (max-width: 460px) {

    .container {
        width:
            min(
                100% - 24px,
                1200px
            );
    }


    .search button {
        padding: 0 15px;
    }


    .nav-inner {
        grid-template-columns: 1fr;
    }


    .hero h1 {
        font-size: 34px;
    }


    .fs-section-more {
        display: none;
    }


    .program-card {
        padding: 12px;
    }


    .program-card-left {
        width: 48px;
        min-width: 48px;
    }


    .program-icon {
        width: 46px;
        height: 46px;

        min-width: 46px;
    }


    .badge {
        font-size: 8px;
    }
}

/* freesofts-ui-v2:end */

/* freesofts-platform-header-v1:start */

/* =========================================
   PLATFORM LINKS INSIDE HEADER
   ========================================= */

.fs-top-shell {
    border-bottom:
        1px solid
        #e7eaee;
}


.site-header {
    background: #fff;
}


.header-inner {
    min-height: 72px;

    display: grid;

    grid-template-columns:
        auto
        minmax(270px, 1fr)
        auto;

    align-items: center;

    gap: 24px;
}


/* SEARCH */

.search {
    min-width: 260px;
    max-width: 610px;

    justify-self: stretch;
}


/* PLATFORM HEADER NAV */

.header-platforms {
    display: flex;
    align-items: center;

    gap: 3px;

    white-space: nowrap;
}


.header-platform-link {
    min-height: 40px;

    display: inline-flex;
    align-items: center;

    gap: 7px;

    padding: 0 9px;

    border-radius: 8px;

    color: #262d36;

    font-size: 13px;
    font-weight: 700;

    text-decoration: none;

    transition:
        color .15s ease,
        background .15s ease;
}


.header-platform-link:hover {
    background: #f3f8f5;

    color: var(--fs-green-dark);
}


.header-platform-logo {
    display: block;

    width: 18px;
    height: 18px;

    object-fit: contain;

    flex: 0 0 18px;
}


/*
Old secondary navigation is no longer used.
This also protects us if old cached markup
is rendered temporarily.
*/

.main-nav {
    display: none !important;
}


/* PLATFORM CARDS */

.platform-card-symbol {
    width: 50px;
    height: 50px;

    min-width: 50px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 11px;

    border-radius: 13px;
}


.platform-brand-logo {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: contain;
}


.platform-windows .platform-card-symbol {
    background: #edf7ff;
}


.platform-android .platform-card-symbol {
    background: #effcf4;
}


.platform-mac .platform-card-symbol {
    background: #f3f4f6;
}


.platform-linux .platform-card-symbol {
    background: #fff8e8;
}


/* =========================================
   MEDIUM DESKTOP
   ========================================= */

@media (max-width: 1180px) {

    .header-inner {
        gap: 16px;
    }


    .header-platform-link {
        gap: 5px;

        padding-left: 7px;
        padding-right: 7px;

        font-size: 12px;
    }


    .header-platform-logo {
        width: 17px;
        height: 17px;

        flex-basis: 17px;
    }


    .search {
        max-width: none;
    }
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 960px) {

    .header-inner {
        grid-template-columns:
            auto
            minmax(230px, 1fr)
            auto;
    }


    .header-platform-link span {
        display: none;
    }


    .header-platform-link {
        width: 39px;

        justify-content: center;

        padding: 0;
    }


    .header-platform-logo {
        width: 20px;
        height: 20px;

        flex-basis: 20px;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 800px) {

    .header-inner {
        min-height: 64px;

        grid-template-columns:
            minmax(0, 1fr)
            auto;

        gap: 10px;

        padding-top: 10px;
        padding-bottom: 10px;
    }


    .logo {
        grid-column: 1;
        grid-row: 1;
    }


    .fs-menu-toggle {
        display: block;

        grid-column: 2;
        grid-row: 1;

        width: 42px;
        height: 42px;

        padding: 7px 9px;

        border:
            1px solid
            var(--fs-border);

        border-radius: 9px;

        background: #fff;
    }


    .search {
        grid-column: 1 / -1;
        grid-row: 2;

        width: 100%;
        max-width: none;

        min-width: 0;
    }


    .header-platforms {
        display: none;

        grid-column: 1 / -1;
        grid-row: 3;

        width: 100%;

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 6px;

        padding-top: 4px;
    }


    .header-platforms.is-open {
        display: grid;
    }


    .header-platform-link {
        width: auto;
        min-height: 44px;

        justify-content: flex-start;

        gap: 9px;

        padding: 0 12px;

        border:
            1px solid
            #e7eaee;

        background: #fafbfc;

        font-size: 13px;
    }


    .header-platform-link span {
        display: inline;
    }


    .header-platform-logo {
        width: 20px;
        height: 20px;

        flex-basis: 20px;
    }
}


@media (max-width: 460px) {

    .header-platforms {
        grid-template-columns: 1fr;
    }


    .platform-card-symbol {
        width: 46px;
        height: 46px;

        min-width: 46px;

        padding: 10px;
    }
}

/* freesofts-platform-header-v1:end */

/* freesofts-program-content-v2:start */

/* =========================================
   PROGRAM PAGE META
   ========================================= */

.fs-program-meta-controls {
    display: flex;
    flex-direction: column;

    gap: 9px;

    margin-top: 12px;
    margin-bottom: 14px;
}


.fs-program-meta-row {
    display: flex;
    align-items: center;

    flex-wrap: wrap;

    gap: 8px;
}


.fs-program-meta-label {
    color: #7c8795;

    font-size: 12px;
    font-weight: 600;
}


.fs-program-platform-switch,
.fs-program-category-list {
    display: flex;
    align-items: center;

    flex-wrap: wrap;

    gap: 6px;
}


.fs-program-platform-pill {
    min-height: 30px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0 11px;

    border:
        1px solid
        #dce2e8;

    border-radius: 7px;

    background: #fff;

    color: #343c47;

    font-size: 11px;
    font-weight: 700;

    text-decoration: none;

    transition:
        color .15s ease,
        border-color .15s ease,
        background .15s ease;
}


.fs-program-platform-pill:hover {
    border-color: #aeb8c3;

    color: #111827;

    background: #f8fafb;
}


.fs-program-platform-pill.is-current {
    border-color: var(--fs-green);

    background: var(--fs-green);

    color: #fff;
}


.fs-program-category {
    display: inline-flex;
    align-items: center;

    min-height: 27px;

    padding: 0 9px;

    border:
        1px solid
        #e2e7ec;

    border-radius: 999px;

    background: #f7f8fa;

    color: #596473;

    font-size: 10px;
    font-weight: 650;
}


/* DOWNLOAD */

.download-button {
    display: flex;

    align-items: center;
    justify-content: center;

    text-align: center;

    white-space: nowrap;
}


/* =========================================
   SIMILAR PROGRAMS
   ========================================= */

.fs-similar-section {
    padding-top: 5px;
}


.fs-similar-heading {
    display: flex;

    align-items: flex-end;
    justify-content: space-between;

    gap: 16px;

    margin-bottom: 17px;
}


.fs-similar-heading h2 {
    margin: 0;
}


.fs-similar-kicker {
    margin-bottom: 5px;

    color: var(--fs-green-dark);

    font-size: 10px;
    font-weight: 850;

    letter-spacing: 1px;
}


.fs-similar-category-note {
    margin-bottom: 4px;

    color: #929aa5;

    font-size: 11px;
}


.fs-similar-grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 10px;
}


.fs-similar-card {
    min-width: 0;
    min-height: 112px;

    display: flex;

    gap: 12px;

    padding: 13px;

    border:
        1px solid
        #e2e7ec;

    border-radius: 10px;

    background: #fff;

    color: inherit;

    text-decoration: none;

    transition:
        transform .15s ease,
        border-color .15s ease,
        box-shadow .15s ease;
}


.fs-similar-card:hover {
    transform: translateY(-1px);

    border-color: #bdc6d0;

    box-shadow:
        0 7px 20px
        rgba(15, 23, 42, .05);
}


.fs-similar-icon {
    width: 50px;
    height: 50px;

    min-width: 50px;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;

    border:
        1px solid
        #edf0f3;

    border-radius: 10px;

    background: #f4f6f8;
}


.fs-similar-letter {
    color: var(--fs-green-dark);

    font-size: 22px;
    font-weight: 850;
}


.fs-similar-content {
    min-width: 0;

    display: flex;
    flex: 1;
    flex-direction: column;
}


.fs-similar-name {
    overflow: hidden;

    color: #1b2028;

    font-size: 14px;
    line-height: 1.25;

    text-overflow: ellipsis;
    white-space: nowrap;
}


.fs-similar-card:hover
.fs-similar-name {
    color: var(--fs-green-dark);
}


.fs-similar-description {
    display: -webkit-box;

    margin-top: 5px;

    overflow: hidden;

    color: #747d89;

    font-size: 10px;
    line-height: 1.35;

    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}


.fs-similar-bottom {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 8px;

    margin-top: auto;
    padding-top: 7px;
}


.fs-similar-rating {
    color: #69727e;

    font-size: 10px;
    font-weight: 700;
}


.fs-similar-rating span {
    color: #f59e0b;
}


.fs-similar-open {
    margin-left: auto;

    color: var(--fs-green-dark);

    font-size: 10px;
    font-weight: 700;
}


/* Old detached switch is gone. */

.program-platform-switch,
.platform-switch {
    margin-top: 0;
}


@media (max-width: 760px) {

    .fs-program-meta-row {
        align-items: flex-start;

        flex-direction: column;
    }


    .fs-similar-grid {
        grid-template-columns: 1fr;
    }


    .fs-similar-category-note {
        display: none;
    }
}

/* freesofts-program-content-v2:end */

/* freesofts-category-catalog-v1:start */


/* =========================================
   CATALOG PAGE
   ========================================= */

.fs-catalog-page {
    padding-top: 30px;
    padding-bottom: 30px;
}


.fs-catalog-breadcrumbs {
    display: flex;
    align-items: center;

    flex-wrap: wrap;

    gap: 8px;

    margin-bottom: 24px;

    color: #8a94a3;

    font-size: 12px;
}


.fs-catalog-breadcrumbs a {
    color: #657082;

    text-decoration: none;
}


.fs-catalog-breadcrumbs a:hover {
    color: var(--fs-green-dark);
}


.fs-catalog-header {
    display: flex;

    align-items: flex-end;
    justify-content: space-between;

    gap: 20px;

    margin-bottom: 25px;
}


.fs-catalog-header h1 {
    margin: 0;

    font-size: 34px;
    line-height: 1.12;

    letter-spacing: -1px;
}


.fs-catalog-header p {
    margin: 8px 0 0;

    color: #8a94a3;

    font-size: 13px;
}


/* =========================================
   CATEGORY FILTER
   ========================================= */

.fs-category-filter {
    padding: 17px;

    border:
        1px solid
        var(--fs-border);

    border-radius: 12px;

    background: #fff;
}


.fs-category-filter-title {
    margin-bottom: 11px;

    color: #353c46;

    font-size: 12px;
    font-weight: 800;
}


.fs-category-pills {
    display: flex;

    flex-wrap: wrap;

    gap: 7px;
}


.fs-category-pill {
    min-height: 34px;

    display: inline-flex;
    align-items: center;

    gap: 7px;

    padding: 0 11px;

    border:
        1px solid
        #e1e5ea;

    border-radius: 8px;

    background: #fafbfc;

    color: #4b5563;

    font-size: 11px;
    font-weight: 700;

    text-decoration: none;

    transition:
        border-color .15s ease,
        background .15s ease,
        color .15s ease;
}


.fs-category-pill span {
    min-width: 20px;

    padding: 2px 5px;

    border-radius: 5px;

    background: #eef1f4;

    color: #8b94a0;

    text-align: center;

    font-size: 9px;
}


.fs-category-pill:hover {
    border-color: #bfc7d1;

    color: #111827;

    background: #fff;
}


.fs-category-pill.is-current {
    border-color: var(--fs-green);

    background: var(--fs-green);

    color: #fff;
}


.fs-category-pill.is-current span {
    background:
        rgba(
            255,
            255,
            255,
            .18
        );

    color: #fff;
}


.fs-category-description {
    margin-top: 14px;

    padding: 15px 17px;

    border-radius: 10px;

    background: #f5f7f9;

    color: #68717e;

    font-size: 13px;
    line-height: 1.6;
}


/* =========================================
   TOOLBAR
   ========================================= */

.fs-catalog-toolbar {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 20px;

    margin-top: 20px;
    margin-bottom: 18px;
}


.fs-sort-control,
.fs-view-control {
    display: flex;

    align-items: center;

    gap: 9px;
}


.fs-toolbar-label {
    color: #8a94a3;

    font-size: 11px;
    font-weight: 650;
}


.fs-sort-buttons {
    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 4px;
}


.fs-sort-button {
    min-height: 34px;

    display: inline-flex;
    align-items: center;

    padding: 0 10px;

    border-radius: 7px;

    color: #5d6774;

    font-size: 11px;
    font-weight: 700;

    text-decoration: none;
}


.fs-sort-button:hover {
    background: #eef1f4;

    color: #20262e;
}


.fs-sort-button.is-current {
    background: #eaf8ef;

    color: var(--fs-green-dark);
}


/* =========================================
   VIEW BUTTONS
   ========================================= */

.fs-view-control {
    flex-shrink: 0;
}


.fs-view-button {
    width: 38px;
    height: 36px;

    display: flex;
    align-items: center;
    justify-content: center;

    border:
        1px solid
        #dce1e7;

    border-radius: 7px;

    background: #fff;

    color: #7b8592;

    text-decoration: none;
}


.fs-view-button:hover {
    border-color: #abb5c0;

    color: #404853;
}


.fs-view-button.is-current {
    border-color: var(--fs-green);

    background: var(--fs-green);

    color: #fff;
}


.fs-view-icon {
    width: 20px;
    height: 16px;

    display: grid;

    gap: 2px;
}


.fs-view-icon i {
    display: block;

    border-radius: 1px;

    background: currentColor;
}


.fs-view-icon-5 {
    grid-template-columns:
        repeat(5, 1fr);
}


.fs-view-icon-3 {
    grid-template-columns:
        repeat(3, 1fr);
}


.fs-view-icon-1 {
    grid-template-columns: 1fr;
}


/* =========================================
   COMMON CATALOG CARD
   ========================================= */

.fs-catalog-grid {
    display: grid;

    gap: 12px;
}


.fs-catalog-card {
    min-width: 0;

    position: relative;

    border:
        1px solid
        var(--fs-border);

    border-radius: 11px;

    background: #fff;

    box-shadow:
        0 1px 2px
        rgba(15, 23, 42, .025);

    transition:
        transform .15s ease,
        border-color .15s ease,
        box-shadow .15s ease;
}


.fs-catalog-card:hover {
    transform: translateY(-2px);

    border-color: #bdc6d0;

    box-shadow:
        0 8px 24px
        rgba(15, 23, 42, .055);
}


.fs-catalog-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;

    border:
        1px solid
        #edf0f3;

    border-radius: 11px;

    background: #f4f6f8;

    text-decoration: none;
}


.fs-catalog-letter {
    color: var(--fs-green-dark);

    font-size: 25px;
    font-weight: 850;
}


.fs-catalog-card-body {
    min-width: 0;
}


.fs-catalog-card-head {
    display: flex;

    align-items: flex-start;
    justify-content: space-between;

    gap: 7px;
}


.fs-catalog-name {
    min-width: 0;

    color: #171b22;

    text-decoration: none;
}


.fs-catalog-name h2 {
    margin: 0;

    overflow: hidden;

    font-size: 15px;
    font-weight: 800;

    line-height: 1.25;

    text-overflow: ellipsis;
}


.fs-catalog-name:hover {
    color: var(--fs-green-dark);
}


.fs-catalog-rating {
    display: inline-flex;
    align-items: center;

    flex-shrink: 0;

    gap: 2px;

    font-size: 10px;
}


.fs-catalog-rating > span {
    color: #f59e0b;
}


.fs-catalog-rating small {
    color: #9aa1aa;

    font-size: 9px;
}


.fs-catalog-description {
    display: -webkit-box;

    margin: 7px 0 8px;

    overflow: hidden;

    color: #69727e;

    font-size: 11px;
    line-height: 1.45;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}


.fs-catalog-badges {
    display: flex;

    align-items: center;
    flex-wrap: wrap;

    gap: 4px;
}


.fs-catalog-badges > span,
.fs-catalog-badges > a {
    min-height: 21px;

    display: inline-flex;
    align-items: center;

    padding: 0 6px;

    border:
        1px solid
        #e6e9ed;

    border-radius: 5px;

    background: #f7f8fa;

    color: #747d89;

    font-size: 8px;
    font-weight: 650;

    text-decoration: none;
}


.fs-catalog-badges > a:hover {
    border-color: #bfc7d1;

    color: #303741;
}


.fs-catalog-badges .is-verified {
    border-color: #d3efdc;

    background: #effbf3;

    color: #17763b;
}


.fs-catalog-card-meta {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 8px;

    margin-top: 9px;

    color: #9aa2ad;

    font-size: 9px;
}


.fs-catalog-developer {
    min-width: 0;

    overflow: hidden;

    text-overflow: ellipsis;
    white-space: nowrap;
}


.fs-catalog-downloads {
    flex-shrink: 0;
}


.fs-catalog-action {
    min-height: 32px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 7px;

    background: var(--fs-green);

    color: #fff;

    font-size: 10px;
    font-weight: 750;

    text-decoration: none;
}


.fs-catalog-action:hover {
    background: var(--fs-green-dark);

    color: #fff;
}


/* =========================================
   VIEW 5 — COMPACT TILES
   ========================================= */

.fs-catalog-grid.view-5 {
    grid-template-columns:
        repeat(5, minmax(0, 1fr));
}


.view-5 .fs-catalog-card {
    display: flex;
    flex-direction: column;

    min-height: 225px;

    padding: 13px;

    text-align: center;
}


.view-5 .fs-catalog-icon {
    width: 58px;
    height: 58px;

    margin: 0 auto 10px;
}


.view-5 .fs-catalog-card-head {
    display: block;
}


.view-5 .fs-catalog-name h2 {
    font-size: 14px;

    white-space: nowrap;
}


.view-5 .fs-catalog-rating {
    justify-content: center;

    margin-top: 5px;
}


.view-5 .fs-catalog-description {
    min-height: 31px;

    font-size: 10px;

    -webkit-line-clamp: 2;
}


.view-5 .fs-catalog-badges {
    justify-content: center;
}


.view-5 .fs-catalog-badges > a {
    display: none;
}


.view-5 .fs-catalog-card-meta {
    justify-content: center;
}


.view-5 .fs-catalog-developer {
    display: none;
}


.view-5 .fs-catalog-downloads {
    margin: auto;
}


.view-5 .fs-catalog-action {
    width: 100%;

    margin-top: auto;
}


/* =========================================
   VIEW 3 — STANDARD CARDS
   ========================================= */

.fs-catalog-grid.view-3 {
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}


.view-3 .fs-catalog-card {
    min-height: 168px;

    display: grid;

    grid-template-columns:
        52px minmax(0, 1fr);

    gap: 12px;

    padding: 14px;
}


.view-3 .fs-catalog-icon {
    width: 52px;
    height: 52px;
}


.view-3 .fs-catalog-card-body {
    display: flex;
    flex-direction: column;
}


.view-3 .fs-catalog-action {
    grid-column: 2;

    justify-self: end;

    padding: 0 12px;
}


/* =========================================
   VIEW 1 — FULL WIDTH
   ========================================= */

.fs-catalog-grid.view-1 {
    grid-template-columns: 1fr;
}


.view-1 .fs-catalog-card {
    min-height: 126px;

    display: grid;

    grid-template-columns:
        76px
        minmax(0, 1fr)
        110px;

    align-items: center;

    gap: 18px;

    padding: 16px 18px;
}


.view-1 .fs-catalog-icon {
    width: 72px;
    height: 72px;
}


.view-1 .fs-catalog-name h2 {
    font-size: 18px;
}


.view-1 .fs-catalog-description {
    max-width: 780px;

    margin-top: 8px;

    font-size: 12px;

    -webkit-line-clamp: 2;
}


.view-1 .fs-catalog-card-meta {
    justify-content: flex-start;

    gap: 18px;
}


.view-1 .fs-catalog-action {
    width: 110px;
    height: 38px;
}


/* PROGRAM PAGE CATEGORY LINKS */

a.fs-program-category {
    text-decoration: none;
}


a.fs-program-category:hover {
    border-color: #b8c2cd;

    background: #fff;

    color: var(--fs-green-dark);
}


/* EMPTY */

.fs-catalog-empty {
    padding: 50px 20px;

    border:
        1px dashed
        #d7dde4;

    border-radius: 12px;

    text-align: center;

    background: #fff;
}


.fs-catalog-empty strong {
    display: block;

    margin-bottom: 10px;
}


.fs-catalog-empty a {
    color: var(--fs-green-dark);
}


/* =========================================
   RESPONSIVE
   ========================================= */

@media (max-width: 1160px) {

    .fs-catalog-grid.view-5 {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }


    .fs-catalog-grid.view-3 {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .fs-catalog-toolbar {
        align-items: flex-start;

        flex-direction: column;
    }


    .fs-catalog-grid.view-5 {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }


    .view-1 .fs-catalog-card {
        grid-template-columns:
            65px
            minmax(0, 1fr)
            100px;
    }


    .view-1 .fs-catalog-icon {
        width: 62px;
        height: 62px;
    }
}


@media (max-width: 680px) {

    .fs-catalog-page {
        padding-top: 20px;
    }


    .fs-catalog-header h1 {
        font-size: 28px;
    }


    .fs-category-filter {
        padding: 13px;
    }


    .fs-sort-control {
        align-items: flex-start;

        flex-direction: column;
    }


    .fs-sort-buttons {
        width: 100%;
    }


    .fs-sort-button {
        border:
            1px solid
            #e2e6eb;
    }


    .fs-catalog-grid.view-5,
    .fs-catalog-grid.view-3 {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    .view-1 .fs-catalog-card {
        grid-template-columns:
            56px
            minmax(0, 1fr);

        gap: 12px;

        padding: 13px;
    }


    .view-1 .fs-catalog-icon {
        width: 54px;
        height: 54px;
    }


    .view-1 .fs-catalog-action {
        grid-column: 2;

        width: auto;

        justify-self: start;

        padding: 0 14px;
    }
}


@media (max-width: 430px) {

    .fs-catalog-grid.view-5,
    .fs-catalog-grid.view-3 {
        grid-template-columns: 1fr;
    }


    .fs-view-control {
        display: none;
    }


    .view-5 .fs-catalog-card {
        min-height: 0;

        text-align: left;
    }


    .view-5 .fs-catalog-icon {
        margin-left: 0;
    }


    .view-5 .fs-catalog-rating,
    .view-5 .fs-catalog-badges {
        justify-content: flex-start;
    }
}

/* freesofts-category-catalog-v1:end */

/* freesofts-card-system-reference-v1:start */


/* =========================================
   RESTORE ORIGINAL CATALOG WIDTH
   ========================================= */

.fs-catalog-page {
    width:
        min(
            calc(100% - 40px),
            1200px
        ) !important;

    max-width:
        1200px !important;

    margin-left:
        auto !important;

    margin-right:
        auto !important;
}


/* =========================================
   VIEW TOGGLES
   ========================================= */

.fs-view-icon-grid5,
.fs-view-icon-grid3 {
    width: 20px;
    height: 16px;

    display: grid;

    gap: 2px;
}


.fs-view-icon-grid5 {
    grid-template-columns:
        repeat(5, 1fr);
}


.fs-view-icon-grid3 {
    grid-template-columns:
        repeat(3, 1fr);
}


.fs-view-icon-grid5 i,
.fs-view-icon-grid3 i {
    display: block;

    border-radius: 1px;

    background: currentColor;
}


.fs-view-list-lines {
    width: 20px;
    height: 16px;

    display: flex;

    flex-direction: column;
    justify-content: space-between;
}


.fs-view-list-lines i {
    width: 100%;
    height: 3px;

    display: block;

    border-radius: 2px;

    background: currentColor;
}


/* =========================================
   GRID
   ========================================= */

.fs-ref-grid {
    display: grid;

    gap: 14px;
}


.fs-ref-grid-5 {
    grid-template-columns:
        repeat(5, minmax(0, 1fr));
}


.fs-ref-grid-3 {
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}


.fs-ref-grid-1 {
    grid-template-columns: 1fr;
}


/* =========================================
   BASE CARD
   ========================================= */

.fs-ref-card {
    position: relative;

    min-width: 0;

    border:
        1px solid
        #dfe5eb;

    border-radius:
        12px;

    background:
        #fff;

    box-shadow:
        0 2px 6px
        rgba(15, 23, 42, .035);

    transition:
        transform .16s ease,
        box-shadow .16s ease,
        border-color .16s ease;
}


.fs-ref-card:hover {
    transform:
        translateY(-2px);

    border-color:
        #c3ccd5;

    box-shadow:
        0 10px 26px
        rgba(15, 23, 42, .07);
}


/* =========================================
   STATUS
   ========================================= */

.fs-ref-status {
    position: absolute;

    z-index: 5;

    top: 12px;
    right: 12px;

    width: 31px;
    height: 31px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius:
        50%;

    cursor: help;
}


.fs-ref-status svg {
    width: 15px;
    height: 15px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.8;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


.fs-ref-status-top {
    border:
        1px solid
        #fed7aa;

    background:
        #fff4e7;

    color:
        #ea580c;
}


.fs-ref-status-new {
    border:
        1px solid
        #bbf7d0;

    background:
        #ecfdf3;

    color:
        #15803d;
}


.fs-ref-status-update {
    border:
        1px solid
        #bfdbfe;

    background:
        #eff6ff;

    color:
        #2563eb;
}


.fs-ref-status-tip {
    position: absolute;

    top: 50%;
    right: 39px;

    transform:
        translate(
            5px,
            -50%
        );

    visibility: hidden;

    opacity: 0;

    padding:
        5px 8px;

    border-radius: 6px;

    background:
        #18222e;

    color: #fff;

    font-size: 9px;
    font-weight: 750;

    white-space: nowrap;

    pointer-events: none;

    transition:
        opacity .14s ease,
        transform .14s ease;
}


.fs-ref-status:hover
.fs-ref-status-tip,
.fs-ref-status:focus
.fs-ref-status-tip {
    visibility: visible;

    opacity: 1;

    transform:
        translate(
            0,
            -50%
        );
}


/* =========================================
   CENTERED ICON
   ========================================= */

.fs-ref-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    overflow: hidden;

    margin-left: auto;
    margin-right: auto;

    border:
        1px solid
        #e4e9ee;

    border-radius:
        12px;

    background:
        #f4f6f8;

    text-decoration: none;
}


.fs-ref-letter {
    color:
        #078348;

    font-size:
        30px;

    font-weight:
        850;
}


/* =========================================
   TITLE
   ========================================= */

.fs-ref-title {
    display: block;

    margin-left: auto;
    margin-right: auto;

    color:
        #121821;

    font-weight:
        830;

    line-height:
        1.22;

    text-align:
        center;

    text-decoration:
        none;
}


.fs-ref-title:hover {
    color:
        var(--fs-green-dark);
}


/* =========================================
   RATING
   ========================================= */

.fs-ref-rating {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 4px;

    color:
        #778291;

    font-size:
        11px;
}


.fs-ref-rating > span {
    color:
        #f59e0b;

    font-size:
        15px;
}


.fs-ref-rating strong {
    color:
        #20262f;

    font-size:
        12px;
}


.fs-ref-rating small {
    color:
        #75839a;

    font-size:
        10px;
}


/* =========================================
   TAGS
   ========================================= */

.fs-ref-tags {
    display: flex;

    align-items: center;
    justify-content: center;

    flex-wrap: wrap;

    gap: 7px;
}


.fs-ref-version,
.fs-ref-category {
    min-height:
        27px;

    display:
        inline-flex;

    align-items: center;
    justify-content: center;

    padding:
        0 10px;

    border-radius:
        8px;

    font-size:
        9px;

    font-weight:
        700;

    text-decoration:
        none;
}


.fs-ref-version {
    border:
        1px solid
        #e0e6ec;

    background:
        #f2f6fa;

    color:
        #51637b;
}


.fs-ref-category {
    border:
        1px solid
        #caedda;

    background:
        #edfbf4;

    color:
        #168246;
}


.fs-ref-category:hover {
    border-color:
        #9bd7b4;
}


/* =========================================
   PLATFORMS
   ========================================= */

.fs-ref-platforms {
    min-height: 25px;

    display: flex;

    align-items: center;
    justify-content: center;

    gap: 17px;
}


.fs-ref-platforms img {
    width: 17px;
    height: 17px;

    display: block;

    object-fit:
        contain;

    opacity: .78;
}


/* =========================================
   DIVIDER
   ========================================= */

.fs-ref-divider {
    height: 1px;

    background:
        #e7ebef;
}


/* =========================================
   LICENSE + DOWNLOADS ONE LINE
   ========================================= */

.fs-ref-meta {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 10px;
}


.fs-ref-license,
.fs-ref-downloads {
    min-width: 0;

    display: flex;

    align-items: center;

    gap: 8px;

    color:
        #53647c;

    font-size:
        11px;

    font-weight:
        650;
}


.fs-ref-license svg,
.fs-ref-downloads svg {
    width: 17px;
    height: 17px;

    flex:
        0 0 17px;

    fill: none;

    stroke:
        currentColor;

    stroke-width:
        1.9;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


.fs-ref-license span {
    overflow: hidden;

    white-space: nowrap;

    text-overflow:
        ellipsis;
}


.fs-license-free {
    color:
        #4d6079;
}


.fs-license-paid {
    color:
        #b45309;
}


.fs-ref-downloads {
    flex-shrink: 0;

    color:
        #34465e;

    font-size:
        12px;
}


.fs-ref-meta-separator {
    width: 1px;
    height: 19px;

    margin-left: auto;

    background:
        #e2e7ec;
}


/* =========================================
   DOWNLOAD BUTTON
   ========================================= */

.fs-ref-download-button {
    min-height: 40px;

    display: flex;

    align-items: center;
    justify-content: center;

    gap: 8px;

    width: 100%;

    border:
        1.5px solid
        var(--fs-green);

    border-radius:
        8px;

    background:
        #fff;

    color:
        var(--fs-green);

    font-size:
        11px;

    font-weight:
        800;

    text-decoration:
        none;

    transition:
        background .15s ease,
        color .15s ease,
        box-shadow .15s ease;
}


.fs-ref-download-button svg {
    width: 18px;
    height: 18px;

    fill: none;

    stroke:
        currentColor;

    stroke-width:
        2;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


.fs-ref-download-button:hover,
.fs-ref-download-button:focus-visible {
    background:
        var(--fs-green);

    color:
        #fff;

    box-shadow:
        0 5px 14px
        rgba(22, 163, 74, .18);
}


/* =========================================
   VIEW 5 — REFERENCE
   ========================================= */

.fs-ref-card-5 {
    min-height: 340px;

    display: flex;

    flex-direction:
        column;

    padding:
        16px;
}


.fs-ref-card-5
.fs-ref-icon {
    width: 74px;
    height: 74px;

    margin-top:
        0;
}


.fs-ref-card-5
.fs-ref-title {
    margin-top:
        12px;

    font-size:
        15px;
}


.fs-ref-card-5
.fs-ref-rating {
    margin-top:
        7px;
}


.fs-ref-card-5
.fs-ref-tags {
    margin-top:
        14px;
}


.fs-ref-card-5
.fs-ref-platforms {
    margin-top:
        13px;
}


.fs-ref-card-5
.fs-ref-divider {
    margin-top:
        13px;
}


.fs-ref-card-5
.fs-ref-meta {
    margin-top:
        10px;
}


.fs-ref-card-5
.fs-ref-download-button {
    margin-top:
        auto;
}


/* =========================================
   VIEW 3
   ========================================= */

.fs-ref-card-3 {
    min-height:
        220px;

    display: grid;

    grid-template-columns:
        86px
        minmax(0, 1fr);

    grid-template-rows:
        auto auto auto auto auto;

    column-gap:
        15px;

    padding:
        16px;
}


.fs-ref-card-3
.fs-ref-icon {
    grid-column: 1;
    grid-row: 1 / 4;

    width: 82px;
    height: 82px;
}


.fs-ref-card-3
.fs-ref-title,
.fs-ref-card-3
.fs-ref-rating,
.fs-ref-card-3
.fs-ref-tags {
    grid-column: 2;

    justify-content:
        flex-start;

    text-align: left;

    margin-left: 0;
    margin-right: 0;
}


.fs-ref-card-3
.fs-ref-title {
    font-size: 16px;
}


.fs-ref-card-3
.fs-ref-platforms,
.fs-ref-card-3
.fs-ref-divider,
.fs-ref-card-3
.fs-ref-meta,
.fs-ref-card-3
.fs-ref-download-button {
    grid-column:
        1 / -1;
}


.fs-ref-card-3
.fs-ref-platforms {
    margin-top:
        13px;
}


.fs-ref-card-3
.fs-ref-divider {
    margin-top:
        10px;
}


.fs-ref-card-3
.fs-ref-meta {
    margin-top:
        9px;
}


.fs-ref-card-3
.fs-ref-download-button {
    margin-top:
        11px;
}


/* =========================================
   VIEW 1
   ========================================= */

.fs-ref-card-1 {
    min-height:
        112px;

    display: grid;

    grid-template-columns:
        78px
        minmax(230px, 1.8fr)
        minmax(120px, .8fr)
        minmax(180px, 1fr)
        150px;

    grid-template-rows:
        auto auto;

    align-items:
        center;

    gap:
        7px 18px;

    padding:
        14px 16px;
}


.fs-ref-card-1
.fs-ref-icon {
    grid-column: 1;
    grid-row: 1 / 3;

    width: 72px;
    height: 72px;
}


.fs-ref-card-1
.fs-ref-title {
    grid-column: 2;
    grid-row: 1;

    margin: 0;

    text-align: left;

    font-size: 16px;
}


.fs-ref-card-1
.fs-ref-rating {
    grid-column: 2;
    grid-row: 2;

    justify-content:
        flex-start;
}


.fs-ref-card-1
.fs-ref-tags {
    grid-column: 3;
    grid-row: 1 / 3;

    justify-content:
        flex-start;
}


.fs-ref-card-1
.fs-ref-platforms {
    display: none;
}


.fs-ref-card-1
.fs-ref-divider {
    display: none;
}


.fs-ref-card-1
.fs-ref-meta {
    grid-column: 4;
    grid-row: 1 / 3;
}


.fs-ref-card-1
.fs-ref-download-button {
    grid-column: 5;
    grid-row: 1 / 3;

    width: 150px;
}


/* =========================================
   RESPONSIVE
   ========================================= */

@media (max-width: 1100px) {

    .fs-ref-grid-5 {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }


    .fs-ref-grid-3 {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 760px) {

    .fs-catalog-page {
        width:
            calc(100% - 24px)
            !important;
    }


    .fs-ref-grid-5,
    .fs-ref-grid-3 {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    .fs-ref-card-1 {
        grid-template-columns:
            64px
            minmax(0, 1fr);

        grid-template-rows:
            auto auto auto auto;
    }


    .fs-ref-card-1
    .fs-ref-icon {
        width: 60px;
        height: 60px;
    }


    .fs-ref-card-1
    .fs-ref-title,
    .fs-ref-card-1
    .fs-ref-rating,
    .fs-ref-card-1
    .fs-ref-tags,
    .fs-ref-card-1
    .fs-ref-meta,
    .fs-ref-card-1
    .fs-ref-download-button {
        grid-column: 2;
    }


    .fs-ref-card-1
    .fs-ref-download-button {
        width: 100%;
    }
}


@media (max-width: 470px) {

    .fs-ref-grid-5,
    .fs-ref-grid-3 {
        grid-template-columns:
            1fr;
    }
}


/* freesofts-card-system-reference-v1:end */

/* freesofts-similar-grid5-v1:start */

.fs-similar-section {
    margin-top: 28px;
    padding-top: 4px;
}


.fs-similar-grid {
    display: grid !important;

    grid-template-columns:
        repeat(
            5,
            minmax(0, 1fr)
        ) !important;

    gap: 10px !important;
}


.fs-similar-card {
    min-width: 0 !important;
    min-height: 158px !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: center !important;

    gap: 0 !important;

    padding: 13px 9px !important;

    border:
        1px solid
        #e1e6eb !important;

    border-radius:
        11px !important;

    background:
        #fff !important;

    text-align:
        center !important;

    text-decoration:
        none !important;

    box-shadow:
        0 2px 6px
        rgba(15, 23, 42, .025);

    transition:
        transform .15s ease,
        border-color .15s ease,
        box-shadow .15s ease;
}


.fs-similar-card:hover {
    transform:
        translateY(-2px) !important;

    border-color:
        #bac6d0 !important;

    box-shadow:
        0 8px 22px
        rgba(15, 23, 42, .07)
        !important;
}


.fs-similar-icon {
    width: 58px !important;
    height: 58px !important;

    min-width: 58px !important;

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    margin: 0 auto !important;

    overflow: hidden;

    border:
        1px solid
        #e8edf1 !important;

    border-radius:
        11px !important;

    background:
        #f5f7f9 !important;
}


.fs-similar-icon
.catalog-program-icon-image {
    width: 100% !important;
    height: 100% !important;

    object-fit: contain !important;
}


.fs-similar-letter {
    font-size:
        25px !important;

    font-weight:
        850 !important;

    color:
        var(--fs-green-dark) !important;
}


.fs-similar-name {
    width: 100%;

    display: -webkit-box !important;

    margin-top:
        10px !important;

    overflow: hidden !important;

    color:
        #18202a !important;

    font-size:
        12px !important;

    font-weight:
        800 !important;

    line-height:
        1.25 !important;

    white-space:
        normal !important;

    text-overflow:
        initial !important;

    -webkit-line-clamp: 2;

    -webkit-box-orient:
        vertical;
}


.fs-similar-card:hover
.fs-similar-name {
    color:
        var(--fs-green-dark)
        !important;
}


.fs-similar-rating {
    display: flex !important;

    align-items: center;
    justify-content: center;

    gap: 3px;

    margin-top:
        7px !important;

    color:
        #6d7885 !important;

    font-size:
        10px !important;

    font-weight:
        700 !important;
}


.fs-similar-rating > span {
    color:
        #f59e0b !important;

    font-size:
        13px !important;
}


.fs-similar-rating small {
    color:
        #87919c;

    font-size:
        9px;
}


.fs-similar-description,
.fs-similar-bottom {
    display:
        none !important;
}


.fs-similar-open {
    margin:
        auto 0 0 !important;

    padding-top:
        10px !important;

    color:
        var(--fs-green-dark)
        !important;

    font-size:
        10px !important;

    font-weight:
        750 !important;
}


@media (max-width: 1050px) {

    .fs-similar-grid {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            ) !important;
    }
}


@media (max-width: 680px) {

    .fs-similar-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            ) !important;
    }
}


@media (max-width: 420px) {

    .fs-similar-grid {
        grid-template-columns:
            1fr !important;
    }
}

/* freesofts-similar-grid5-v1:end */