/* Guides (/guides and /guides/<slug>): an index of cards and a single reading column. Built on products.css and landing.css. */
.guide{max-width:760px;margin-inline:auto;padding-block:56px 30px}
.guide-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:12.5px;line-height:1.4;color:#8b9ca8}.guide-crumbs a{color:#e5b48f;text-decoration:none;border-bottom:1px solid #e5b48f55;padding-bottom:1px}.guide-crumbs a:hover,.guide-crumbs a:focus-visible{border-bottom-color:#e5b48f}.guide-crumbs span[aria-hidden]{color:#5b6b77}
.guide h1{font:500 clamp(34px,4.4vw,50px)/1.12 var(--nw-font);letter-spacing:-.045em;margin:16px 0 22px;color:#eef1f4}
.guide-lede{font-size:16px;line-height:1.85;color:#a9b6c0;margin:0}
.guide-meta{font-size:11px;color:#7c929e;margin:20px 0 34px;padding-bottom:26px;border-bottom:1px solid #ffffff10}
.guide h2{font:500 26px/1.25 var(--nw-font);letter-spacing:-.03em;margin:44px 0 14px;color:#eef1f4}
.guide h3{font:550 17px/1.35 var(--nw-font);letter-spacing:-.015em;margin:28px 0 8px;color:#e6eaee}
.guide p,.guide li{font-size:14.5px;line-height:1.9;color:#9fb0bc}
.guide p{margin:0 0 14px}
.guide ul,.guide ol{padding-left:22px;margin:10px 0 18px}.guide li{margin:8px 0}.guide li::marker{color:#d6a079}
.guide strong{color:#e3e8ec;font-weight:550}
.guide a{color:#efae86;text-decoration:underline;text-underline-offset:4px}
.guide code{font-family:"JetBrains Mono",ui-monospace,Consolas,monospace;font-size:12.5px;color:#efd2b8;background:#0f151b;border:1px solid #ffffff12;border-radius:6px;padding:1px 6px;overflow-wrap:anywhere}
.guide pre{margin:14px 0 20px;padding:16px 18px;background:#0f151b;border:1px solid #ffffff12;border-radius:12px;overflow:auto;font:12.5px/1.75 "JetBrains Mono",ui-monospace,Consolas,monospace;color:#efd2b8;white-space:pre}
.guide .landing-table{margin:16px 0 8px}.guide .landing-note{margin-top:10px}
.guide-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:44px 0 10px;padding:26px 28px;border-radius:18px;background:#1e272f;border:1px solid #d7ad8425}
.guide .guide-cta h2{font-size:21px;margin:0 0 8px}.guide .guide-cta p{font-size:13px;line-height:1.8;margin:0}
.guide .guide-cta .button{flex:none;font-size:12px;border-radius:10px;color:inherit;text-decoration:none}
.guide-related{margin-top:40px;padding-top:26px;border-top:1px solid #ffffff10}
.guide-related h2{font-size:18px;margin:0 0 10px}.guide-related ul{list-style:none;padding:0;margin:0}.guide-related li{margin:6px 0;font-size:13.5px}
.guides-index{padding-block:60px 80px}
.guides-index h1{font:500 clamp(38px,4.8vw,60px)/1.1 var(--nw-font);letter-spacing:-.05em;margin:14px 0 20px;color:#eef1f4}
.guides-index>p{font-size:15px;line-height:1.85;color:#94a4b0;max-width:600px;margin:0 0 36px}
.guides-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;list-style:none;margin:0;padding:0}
.guides-grid li{display:flex}
.guides-grid a{display:flex;flex-direction:column;gap:12px;width:100%;padding:26px;border-radius:18px;background:#19232c;border:1px solid #ffffff0d;color:inherit;text-decoration:none;transition:border-color .2s}
.guides-grid a:hover,.guides-grid a:focus-visible{border-color:#d7ad8455}
.guides-grid small{font-size:10px;letter-spacing:.04em;color:#d6a079}
.guides-grid strong{font-size:19px;line-height:1.35;font-weight:550;letter-spacing:-.02em;color:#eef1f4}
.guides-grid span{font-size:12.5px;line-height:1.85;color:#8fa2ae}
@media(max-width:700px){.guide{padding-block:40px 20px}.guide h2{font-size:22px;margin-top:36px}.guide-cta{flex-direction:column;align-items:flex-start;padding:22px}.guides-index{padding-block:44px 56px}.guides-grid{grid-template-columns:1fr}}
/* Hub sections: one per game, with column counts the cards fill (8 = 4 x 2, 6 = 3 x 2). */
.guides-group{font:500 24px/1.2 var(--nw-font);letter-spacing:-.03em;color:#eef1f4;margin:44px 0 18px}
.guides-grid.guides-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.guides-grid.guides-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1100px){.guides-grid.guides-grid-4,.guides-grid.guides-grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.guides-group{font-size:21px;margin-top:36px}.guides-grid.guides-grid-4,.guides-grid.guides-grid-3{grid-template-columns:1fr}}

/* Guide tables hold sentences: let the last column wrap (landing.css keeps it on one line for short price cells) and let long identifiers break. */
.guide .landing-table td:last-child{white-space:normal;color:#8fa5b4}
.guide .landing-table th,.guide .landing-table td{overflow-wrap:anywhere}
.guide .landing-table tbody th{width:30%}
