/* Гео-хабы (/geo, /geo/{code}) — «офферы под страну». Подключается в geo.twig / geo_index.twig. */

.geo-intro { font-size: 15px; line-height: 1.6; max-width: 820px; }

/* Индекс стран — сетка карточек */
.geo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 10px;
}
.geo-grid__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 14px;
    background: #fff;
    border: 1px solid #e8eaed;
    border-radius: 12px;
    text-decoration: none;
    color: #2b2622;
    transition: box-shadow .15s ease, transform .15s ease, border-color .15s ease;
}
.geo-grid__item:hover {
    box-shadow: 0 6px 22px rgba(250, 104, 72, .12);
    transform: translateY(-2px);
    border-color: #f6c9b8;
}
.geo-grid__flag { flex: 0 0 auto; border-radius: 3px; object-fit: cover; }
.geo-grid__name { font-weight: 600; font-size: 14px; flex: 1 1 auto; }
.geo-h1-flag { vertical-align: middle; border-radius: 3px; margin-right: 10px; }
.geo-grid__code {
    font-size: 12px;
    font-weight: 700;
    color: #8C8E94;
    background: #f4f5f7;
    border-radius: 6px;
    padding: 2px 7px;
}

/* Сети под гео */
.geo-nets { display: flex; flex-wrap: wrap; gap: 10px; }
.geo-net {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: #fff;
    border: 1px solid #e8eaed;
    border-radius: 10px;
    text-decoration: none;
    color: #2b2622;
    transition: border-color .15s ease;
}
.geo-net:hover { border-color: #f6c9b8; }
.geo-net__logo { width: 22px; height: 22px; object-fit: contain; border-radius: 4px; }
.geo-net__name { font-size: 14px; font-weight: 600; }
.geo-net__cnt {
    font-size: 12px;
    color: #8C8E94;
    background: #f4f5f7;
    border-radius: 6px;
    padding: 1px 7px;
}

/* Пагинация */
.geo-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
}
.geo-pager__link {
    padding: 8px 16px;
    border: 1px solid #e8eaed;
    border-radius: 10px;
    text-decoration: none;
    color: #E8643C;
    font-weight: 600;
    background: #fff;
}
.geo-pager__link:hover { border-color: #f6c9b8; }
.geo-pager__info { color: #8C8E94; font-size: 14px; }

@media (max-width: 600px) {
    .geo-grid { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
}