/* =====================================================================
   STORE — Products catalogue + Pricing/checkout pages
   Loaded on the "Hut 8 — Products & Licenses" and "Hut 8 — Pricing"
   templates. Uses the same design tokens as main.css (--blue, --line,
   --radius, --shadow-*, etc.)
   ===================================================================== */

/* ---------- Products catalogue (app cards) ---------- */
.h8-apps-grid{display:grid;grid-template-columns:1fr;gap:26px;max-width:860px;margin:0 auto}
.h8-app-card{display:flex;gap:30px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:30px 34px;transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease)}
.h8-app-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:#cfe0ee}
.h8-app-card__icon{flex:0 0 96px}
.h8-app-card__icon img{width:96px;height:96px;border-radius:22px;box-shadow:var(--shadow-sm);background:var(--bg-tint)}
.h8-app-card__meta{font-family:'IBM Plex Mono',monospace;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-bottom:8px}
.h8-app-card__meta .h8-slash{font-weight:700;opacity:.6;margin:0 4px}
.h8-app-card__body h3{font-size:23px;margin-bottom:8px}
.h8-app-card__body p{color:var(--muted);font-size:15.5px;margin:0 0 20px}
.h8-app-card__actions{display:flex;gap:12px;flex-wrap:wrap}
p.h8-products__note{text-align:center;color:var(--muted);font-size:15px;margin:40px auto 0;max-width:56ch}
a.h8-back-link{display:inline-flex;align-items:center;gap:8px;font-family:'Sora',sans-serif;font-weight:600;font-size:14px;color:var(--ink);background:var(--bg-soft);border:1px solid var(--line);padding:9px 18px 9px 15px;border-radius:999px;margin-bottom:28px;text-decoration:none;transition:transform .18s var(--ease), box-shadow .18s var(--ease), border-color .18s var(--ease), background .18s var(--ease), color .18s var(--ease)}
a.h8-back-link:hover{color:var(--blue);border-color:#cfe0ee;background:var(--bg-tint);transform:translateY(-2px);box-shadow:var(--shadow-sm)}
@media(max-width:640px){.h8-app-card{flex-direction:column;align-items:flex-start;gap:20px}}

/* ---------- Pricing page ---------- */

.h8-price-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:stretch;max-width:920px;margin:0 auto}
.h8-price-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:32px 30px;display:flex;flex-direction:column}
.h8-price-card--pro{border-color:var(--blue);box-shadow:var(--shadow-md);position:relative}
.h8-price-badge{position:absolute;top:-13px;right:24px;background:var(--blue);color:#fff;font-family:'Sora',sans-serif;font-size:12.5px;font-weight:600;padding:5px 14px;border-radius:999px;letter-spacing:.03em}
.h8-price-tier{font-family:'IBM Plex Mono',monospace;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-bottom:10px}
.h8-price-card h3{font-size:24px;margin-bottom:6px}
.h8-price-value{font-family:'Sora',sans-serif;font-weight:700;font-size:32px;margin:10px 0 20px;color:var(--ink)}
.h8-price-value small{font-family:'Inter',sans-serif;font-weight:500;font-size:14px;color:var(--muted)}
.h8-price-feats{list-style:none;margin:0 0 26px;padding:0;flex:1}
.h8-price-feats li{padding:9px 0;border-bottom:1px solid var(--line);font-size:15px;color:var(--ink);display:flex;gap:10px}
.h8-price-feats li:last-child{border-bottom:0}
.h8-price-feats li::before{content:"\2713";color:var(--blue);font-weight:700;flex:0 0 auto}
p.h8-price-note{font-size:13px;color:var(--muted);margin-top:10px;text-align:center}
.h8-buy-confirm{max-width:640px;margin:34px auto 0;background:var(--bg-tint);border:1px solid #cfe0ee;border-radius:var(--radius);padding:20px 24px;text-align:center;color:var(--ink)}
.h8-faq{max-width:760px;margin:0 auto}
.h8-faq-item{padding:20px 0;border-bottom:1px solid var(--line)}
.h8-faq-item:last-child{border-bottom:0}
.h8-faq-item h4{font-size:17px;margin-bottom:6px}
.h8-faq-item p{color:var(--muted);font-size:15px;margin:0}
@media(max-width:760px){.h8-price-grid{grid-template-columns:1fr}}