/* Support guides on the support domain (15 Oct 2026). The guide body brings its own styles
   (the same section CSS the storefront renders); this file only sets the page around it.
   Light only, like the rest of the portal. */
body.guide-page { background: #fff; color: rgba(0,0,0,.85);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif; margin: 0; }
.guide-main { display: block; min-height: 50vh; }

/* /guides index and the 404 page */
.gi { max-width: 1200px; margin: 0 auto; padding: 40px clamp(16px, 3vw, 40px) 24px; }
.gi-h1 { font-size: 40px; line-height: 1.15; font-weight: 600; letter-spacing: -.02em; margin: 0 0 12px; }
.gi-lead { font-size: 17px; line-height: 1.5; color: rgba(0,0,0,.55); margin: 0 0 32px; max-width: 640px; }
.gi-lead a, .gi-grp a { color: #0070D5; text-decoration: none; }
.gi-lead a:hover, .gi-grp a:hover { text-decoration: underline; }
.gi-grp { margin: 0 0 28px; }
.gi-grp h2 { font-size: 20px; font-weight: 600; letter-spacing: -.01em; margin: 0 0 10px; }
.gi-grp ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 8px 24px; }
.gi-grp li { margin: 0; }
.gi-grp li a { display: block; padding: 10px 0; border-bottom: 1px solid #e8e8e8; font-size: 16px; line-height: 1.35; }

@media (max-width: 760px) {
  .gi { padding-top: 24px; }
  .gi-h1 { font-size: 32px; }
  .gi-grp ul { grid-template-columns: 1fr; }
  .gi-grp li a { min-height: 44px; display: flex; align-items: center; }
}