/* ==========================================================================
   Ana səhifə hostinq paketləri: /kategori/hosting səhifəsindəki hs- kart dizaynı.
   24 Sen 2026, istifadəçi istəyi.
   .hs-scope = .hs-in tokenləri, AMMA onun qlobal yan təsirləri OLMADAN
   (.hs width:100vw və body:has(.hs){background:mint} ana səhifəni pozardı).
   ========================================================================== */
.hs-scope{
    --hs-ink:#0a1616; --hs-ink2:#132828; --hs-muted:#6d7779; --hs-muted2:#5d706d;
    --hs-link:#067547; --hs-mint:#f1fbf0; --hs-line:#e6ebe7; --hs-soft:#f8f8f4;
    --hs-dark:#082615; --hs-dark2:#133827; --hs-lime:#c6fb4b; --hs-mintb:#46fdae;
    --hs-accent:#16a45f;
    font-family:'DM Sans',-apple-system,system-ui,'Segoe UI',Roboto,sans-serif;
    color:var(--hs-ink); line-height:1.5; -webkit-font-smoothing:antialiased;
}
.hs-scope *,.hs-scope *::before,.hs-scope *::after{ box-sizing:border-box; }
:where(.hs-scope) h1,:where(.hs-scope) h2,:where(.hs-scope) h3,:where(.hs-scope) p,:where(.hs-scope) ul{ margin:0; padding:0; }
:where(.hs-scope) ul{ list-style:none; }
:where(.hs-scope) a{ text-decoration:none; color:inherit; }
:where(.hs-scope) button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
.hs-scope svg{ display:block; }

/* Dövr seçici */
.hs-scope .hh-per{ margin:0 auto 6px; }
.hs-scope .hh-per-note{ margin-bottom:26px; }

/* Kart şəbəkəsi: hostinq səhifəsindəki karusel yerinə sabit şəbəkə.
   Sütun sayı --hp-cols ilə bölməyə görə dəyişir (hostinq 5, VPS 6). */
/* DİQQƏT: repeat() içində var() İŞLƏMİR (CSS qrameri tam ədəd tələb edir),
   ona görə sütun sayı sabit yazılır. */
.hp-grid{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; align-items:stretch; }
.hp-vps .hp-grid{ grid-template-columns:repeat(6,minmax(0,1fr)); gap:11px; }
@media (max-width:1240px){
    .hp-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
    .hp-vps .hp-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
}
@media (max-width:860px){
    .hp-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
    .hp-vps .hp-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
}
/* Telefonda tək sütun: kartın içindəki "Daxildir" siyahısı tam oxunsun */
@media (max-width:560px){
    .hp-grid{ grid-template-columns:minmax(0,1fr); gap:12px; }
    .hp-vps .hp-grid{ grid-template-columns:minmax(0,1fr); gap:12px; }
}

/* VPS kartları 6 sütunda daha dardır, yazıları bir az kiçildirik */
@media (min-width:1241px){
    .hp-vps .hs-card.hh-card{ padding:18px 13px; }
    .hp-vps .hs-card.hh-card>h3{ font-size:16px; line-height:22px; }
    .hp-vps .hs-card.hh-card .hh-amt{ font-size:26px; }
    .hp-vps .hs-card.hh-card .hs-card-inc li{ font-size:12px; line-height:16px; }
    .hp-vps .hs-card.hh-card .hs-card-btn.hh-buy{ font-size:12.5px; padding:10px 8px; }
}

/* Ana səhifədə kartlar bir az daha sıxdır (5 kart bir sırada) */
.hp-grid .hs-card.hh-card{ padding:20px 16px; }
.hp-grid .hs-card.hh-card>h3{ font-size:18px; line-height:24px; }
.hp-grid .hs-card.hh-card .hs-card-tags{ margin-top:14px; }
.hp-grid .hs-card.hh-card .hh-amt{ font-size:30px; line-height:1.1; }
.hp-grid .hs-card.hh-card .hs-card-note.hh-note{ font-size:12px; line-height:1.35; min-height:34px; }
.hp-grid .hs-card.hh-card .hs-card-btn.hh-buy{ min-height:42px; margin-top:16px; font-size:13.5px; padding:10px 12px; }
.hp-grid .hs-card.hh-card .hs-card-inc{ margin-top:16px; }
.hp-grid .hs-card.hh-card .hs-card-inc>p{ margin-bottom:8px; font-size:10px; }
.hp-grid .hs-card.hh-card .hs-card-inc li{ font-size:12.5px; line-height:17px; gap:6px; }
.hp-grid .hs-card.hh-card .hs-card-inc li+li{ margin-top:4px; }
.hp-grid .hs-card.hh-card .hs-card-inc li svg{ width:13px; height:13px; flex:0 0 13px; margin-top:2px; }

/* 2 sütunlu aralıq (kiçik planşet / böyük telefon) */
@media (max-width:860px) and (min-width:561px){
    .hp-grid .hs-card.hh-card{ padding:16px 13px; }
    .hp-grid .hs-card.hh-card>h3{ font-size:16px; line-height:22px; }
    .hp-grid .hs-card.hh-card .hh-amt{ font-size:26px; }
    .hp-grid .hs-card.hh-card .hs-card-inc li{ font-size:12px; line-height:16px; }
}
/* Telefon: tam enli kart, bütün içərik görünür */
@media (max-width:560px){
    .hp-grid .hs-card.hh-card{ padding:18px 16px; text-align:left; }
    .hp-grid .hs-card.hh-card>h3{ font-size:19px; line-height:25px; }
    .hp-grid .hs-card.hh-card .hs-card-tags{ margin-top:10px; justify-content:flex-start; gap:10px; }
    .hp-grid .hs-card.hh-card .hs-card-tags span{ margin-left:0; }
    .hp-grid .hs-card.hh-card .hs-card-price{ justify-content:flex-start; margin-top:2px; }
    .hp-grid .hs-card.hh-card .hh-amt{ font-size:30px; }
    .hp-grid .hs-card.hh-card .hh-plab{ font-size:14px; }
    .hp-grid .hs-card.hh-card .hs-card-note.hh-note{ font-size:12.5px; min-height:0; margin-bottom:2px; }
    .hp-grid .hs-card.hh-card .hs-card-btn.hh-buy{ min-height:46px; font-size:14.5px; margin-top:14px; }
    .hp-grid .hs-card.hh-card .hs-card-inc{ display:block; margin-top:16px; }
    .hp-grid .hs-card.hh-card .hs-card-inc>p{ font-size:10px; margin-bottom:8px; }
    .hp-grid .hs-card.hh-card .hs-card-inc li{ font-size:13.5px; line-height:19px; gap:8px; }
    .hp-grid .hs-card.hh-card .hs-card-inc li+li{ margin-top:6px; }
    .hp-grid .hs-card.hh-card .hs-card-inc li svg{ width:15px; height:15px; flex:0 0 15px; margin-top:2px; }
}

/* Bölmə fonunda kartlar ağ qalsın */
.h26-packages.hp-plans{ background:#f8f9fa; }
.h26-packages.hp-plans .h26-container{ max-width:1280px; }


/* VPS xüsusiyyət çipləri (6 bənd) sarınsın */
.hp-trust-wide{ flex-wrap:wrap; }
