/* Hotspot limits: the /hotspot-limits hub and each /hotspot-limits/<slug> page, on top of marketing.css and
   guides/guides.css. Written by hand; site/src/pages/hotspot-limits uses it. */

/* The date checked, prominent on both: plans change. */
.site .hotspot-checked { display: inline-block; margin-top: 14px; padding: 6px 14px; border: 1px solid #9fd3ff40; border-radius: 16px; background: #9fd3ff0d; font-size: 14px; line-height: 1.45; color: var(--text-2); }
.hotspot-checked strong { font-weight: 600; color: #9fd3ff; }
.site .hotspot-hub-checked { margin-top: 20px; }

/* Hub */
.site .hotspot-jump { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 10px; margin-top: 18px; font-size: 15px; color: var(--text-3); }
.hotspot-jump a { color: var(--text-2); }
.hotspot-jump a:hover { color: var(--text) !important; }
.hotspot-grid { grid-template-columns: repeat(3, 1fr); }
.hotspot-card { gap: 8px; padding: 16px 16px 18px; }
.site .hotspot-card strong { font-size: 17px; }
.hotspot-card > .hotspot-network { font-size: 13px !important; color: var(--text-3) !important; }
.site .hotspot-card dl { display: grid; gap: 8px; margin: 4px 0 0; }
.site .hotspot-card dt { font: 600 11px var(--mono); letter-spacing: .04em; text-transform: uppercase; color: var(--text-3); }
.site .hotspot-card dd { margin: 2px 0 0; font-size: 14px; line-height: 1.45; color: var(--text-2); }
.hotspot-group { scroll-margin-top: 200px; }
.site .hotspot-how { max-width: 780px; margin-inline-start: auto; margin-inline-end: auto; }
.site .hotspot-how p + p { margin-top: 14px; }

/* Page */
.site .hotspot-facts { display: grid; gap: 12px; margin: 24px 0 0; padding: 18px 20px; border: 1px solid var(--border); border-radius: var(--radius); background: linear-gradient(180deg, #ffffff07, #ffffff02); }
.site .hotspot-facts > div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 12px; }
.site .hotspot-facts dt { font: 600 12px var(--mono); letter-spacing: .04em; text-transform: uppercase; color: var(--text-3); padding-top: 3px; }
.site .hotspot-facts dd { margin: 0; font-size: 15px; line-height: 1.5; color: var(--text-2); overflow-wrap: anywhere; }
.site .hotspot-guide section ul { margin-top: 12px; }
.site .hotspot-guide .hotspot-missing { margin-top: 14px; padding-inline-start: 14px; border-inline-start: 2px solid var(--border-strong); color: var(--text-2); }
.site .hotspot-guide .hotspot-note { margin-top: 14px; font-size: 15px; color: var(--text-3); }
.site .hotspot-kilobat { margin-top: 40px; padding: 4px 20px 18px; border: 1px solid #b096fa38; border-radius: var(--radius); background: #b096fa0d; }
.site .hotspot-kilobat h2 { margin-top: 18px; }
.site .hotspot-kilobat p { font-size: 16px; color: var(--text-2); }
.hotspot-kilobat a { color: #c9b8ff; text-decoration: underline; text-decoration-color: #c9b8ff55; text-underline-offset: 4px; }
.site .hotspot-cta { margin-top: 56px; padding: 28px; border: 1px solid #b096fa45; border-radius: var(--radius); background: linear-gradient(180deg, #b096fa14, #b096fa05); }
.site .hotspot-cta h2 { margin-top: 0; }
.site .hotspot-cta .hero-actions { justify-content: flex-start; margin-top: 20px; }
@media (max-width: 1000px) { .hotspot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .hotspot-grid { grid-template-columns: minmax(0, 1fr); }
  .site .hotspot-facts { padding: 14px 16px; }
  .site .hotspot-facts > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .site .hotspot-cta { padding: 20px; }
  .site .hotspot-checked { border-radius: 12px; }
}