/* Countries list page */

.countries-page__head {
    max-width: 40rem;
    margin: 0 auto 2.5rem;
}

.countries-page__title {
    font-size: clamp(1.75rem, 4vw, 2.25rem);
    font-weight: 800;
    letter-spacing: -0.03em;
    margin-bottom: 0.75rem;
    color: hsl(var(--heading-color));
}

.countries-page__lead {
    font-size: 0.95rem;
    line-height: 1.6;
    color: hsl(var(--body-color) / 0.75);
    margin-bottom: 1.5rem;
}

.dark .countries-page__lead {
    color: hsl(var(--white) / 0.65);
}

.countries-page__search {
    position: relative;
    max-width: 28rem;
}

.countries-page__search-icon {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.15rem;
    color: hsl(var(--base));
    pointer-events: none;
    z-index: 1;
}

.countries-page__search-input {
    width: 100%;
    padding: 0.85rem 1rem 0.85rem 2.75rem !important;
    border-radius: 999px !important;
    border: 1px solid hsl(var(--dark) / 0.1) !important;
    background: hsl(var(--white) / 0.9) !important;
    margin-bottom: 0 !important;
    box-shadow: 0 4px 24px hsl(var(--dark) / 0.06);
}

.dark .countries-page__search-input {
    background: hsl(var(--white) / 0.06) !important;
    border-color: hsl(var(--white) / 0.12) !important;
    color: hsl(var(--white) / 0.92) !important;
}

.dark .countries-page__search-input::placeholder {
    color: hsl(var(--white) / 0.5);
}

.countries-page__search-input:focus {
    border-color: hsl(var(--base) / 0.45) !important;
    box-shadow: 0 0 0 3px hsl(var(--base) / 0.12);
}

.countries-page__no-results {
    margin-top: 1rem;
    font-size: 0.9rem;
    color: hsl(var(--body-color) / 0.7);
}

@media (max-width: 576px) {
    .countries-page__search-input {
        border-radius: 14px !important;
    }
}

/* Refined country directory, scoped away from product cards. */
.countries-page{padding:48px 0 70px!important;font-family:Arial,"Segoe UI",sans-serif;--country-card:#fff;--country-line:#e3e9e7;--country-ink:#192c25;--country-muted:#697a72}
.dark .countries-page{--country-card:hsl(var(--white)/.035);--country-line:hsl(var(--white)/.10);--country-ink:#f0f4fa;--country-muted:#aab5c9}
.countries-page__head{max-width:640px;margin-bottom:32px}.countries-page__eyebrow{display:inline-flex;align-items:center;gap:7px;color:hsl(var(--base));font-size:11px;font-weight:700;letter-spacing:1.3px;text-transform:uppercase;margin-bottom:15px}.countries-page__eyebrow i{font-size:20px}
.countries-page .countries-page__title{font-family:inherit!important;font-size:36px;letter-spacing:-1.2px;color:var(--country-ink)!important;margin-bottom:12px}
.countries-page .countries-page__lead{font-family:inherit!important;font-size:13px;line-height:1.8;color:var(--country-muted)!important;max-width:470px;margin:0 auto 23px}
.countries-page__search{max-width:460px}.countries-page .countries-page__search-input{height:52px!important;font-size:13px!important;border-radius:13px!important;box-shadow:0 5px 20px #00000004!important}
.countries-page__toolbar{display:flex;align-items:center;justify-content:space-between;padding:0 0 16px;margin-bottom:4px;border-bottom:1px solid var(--country-line);color:var(--country-muted);font-size:11px}.countries-page__toolbar>span:first-child{font-size:14px;font-weight:700;color:var(--country-ink)}
.countries-page #countryGrid{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px!important;margin:0!important;padding-top:18px!important}
.countries-page #countryGrid>.country-card-col{width:auto!important;max-width:100%;min-width:0;padding:0!important;margin:0!important}
.countries-page #countryGrid .card_body{display:flex;flex-direction:column;height:100%;min-height:175px;padding:22px 14px 18px!important;border:1px solid var(--country-line)!important;border-radius:15px!important;background:var(--country-card)!important;box-shadow:none!important;overflow:hidden;transition:transform .18s,border-color .18s,box-shadow .18s}
.countries-page #countryGrid .card_body:hover{transform:translateY(-3px);border-color:hsl(var(--base)/.5)!important;box-shadow:0 7px 22px #00000008!important}
.countries-page #countryGrid .card_body>div:first-child{display:flex;align-items:center;justify-content:center;height:66px;margin-bottom:14px}
.countries-page #countryGrid .card_body img{display:block;width:76px!important;height:48px!important;object-fit:contain;border-radius:4px;filter:drop-shadow(0 3px 3px #00000012)}
.countries-page #countryGrid .content{padding:0!important;margin:0!important;background:transparent!important;display:block!important;text-align:center}
.countries-page #countryGrid h5{font-family:inherit!important;font-size:13px!important;line-height:1.5;font-weight:600!important;margin:0 0 5px!important}.countries-page #countryGrid h5 a{color:var(--country-ink)!important}.countries-page #countryGrid p{font-family:inherit!important;font-size:11px!important;color:var(--country-muted)!important;line-height:1.5}
@media(max-width:1199px){.countries-page #countryGrid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:991px){.countries-page #countryGrid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:767px){.countries-page{padding:28px 0 35px!important}.countries-page .countries-page__title{font-size:28px}.countries-page__head{margin-bottom:26px}.countries-page #countryGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px!important}.countries-page #countryGrid .card_body{padding:15px 9px!important;min-height:153px}.countries-page #countryGrid h5{font-size:12px!important}}
@media(max-width:479px){.countries-page #countryGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.countries-page .countries-page__lead{font-size:12px}.countries-page #countryGrid .card_body{min-height:155px}}
@media(prefers-reduced-motion:reduce){.countries-page #countryGrid .card_body{transition:none}.countries-page #countryGrid .card_body:hover{transform:none}}

/* Larger country flags on desktop; retain compact mobile cards. */
@media(min-width:992px){
 .countries-page #countryGrid{grid-template-columns:repeat(5,minmax(0,1fr))}
 .countries-page #countryGrid .card_body{min-height:206px;padding:22px 16px!important}
 .countries-page #countryGrid .card_body>div:first-child{height:100px;margin-bottom:16px}
 .countries-page #countryGrid .card_body img{width:132px!important;height:84px!important}
 .countries-page #countryGrid h5{font-size:14px!important}
 .countries-page #countryGrid p{font-size:12px!important}
}
@media(min-width:992px) and (max-width:1199px){.countries-page #countryGrid{grid-template-columns:repeat(4,minmax(0,1fr))}}