/* Guides page specific styles. Keep minimal and extend base.css without duplication. */
.guides-page .hero { padding: 4rem 0 2rem; }
.guides-page .hero__content { max-width: 720px; }
.guides-page .hero__media { margin-top: 1rem; }
.guides-page .hero__media img { width: 100%; height: auto; border-radius: 12px; box-shadow: 0 0 0 2px rgba(0,255,255,0.15), 0 12px 32px rgba(0,0,0,0.5); }

.section { padding: 3rem 0; }
.section--contrast { background: linear-gradient(180deg, rgba(8,10,20,0.8), rgba(8,10,20,0.6)); }
.section__header { margin-bottom: 1.5rem; }
.section__header .lead { opacity: .9; }

.section-nav { position: sticky; top: 0; z-index: 10; background: rgba(10,12,24,0.8); backdrop-filter: blur(6px); border-bottom: 1px solid rgba(0,255,255,0.1); }
.section-nav ul { display: flex; flex-wrap: wrap; gap: .5rem 1rem; padding: .75rem 1rem; list-style: none; margin: 0; }
.section-nav a { color: var(--accent, #4ef3ff); text-decoration: none; font-size: .95rem; }
.section-nav a:hover { text-decoration: underline; }

.overview__grid, .features__grid, .guides__grid, .community__grid { display: grid; gap: 1rem; }
.overview__grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.features__grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.guides__grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); align-items: start; }
.community__grid { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); align-items: start; }

.card { background: rgba(20,24,40,0.6); border: 1px solid rgba(78,243,255,0.15); border-radius: 12px; padding: 1rem; box-shadow: 0 8px 24px rgba(0,0,0,0.35); }
.card h3 { margin-top: 0; }

.guide-card__media img, .tips__media img, .community__media img, .lore__media img { width: 100%; height: auto; display: block; border-radius: 10px; }
.guide-card__body { display: grid; gap: .75rem; }

.search { margin-top: 1rem; display: grid; gap: .5rem; }
.search input[type="search"] { background: rgba(20,24,40,0.7); border: 1px solid rgba(78,243,255,0.25); border-radius: 10px; padding: .75rem 1rem; color: #e6f7ff; }
.search__help { font-size: .875rem; opacity: .8; }

.lore__layout { display: grid; grid-template-columns: 1.2fr 1fr; gap: 1rem; }
@media (max-width: 960px) { .lore__layout { grid-template-columns: 1fr; } }

.tips__layout { display: grid; grid-template-columns: 1fr 1.2fr; gap: 1rem; }
.tips__list { display: grid; gap: .5rem; }
@media (max-width: 960px) { .tips__layout { grid-template-columns: 1fr; } .tips__media { order: -1; } }

.link-list, .resource-list { display: grid; gap: .5rem; }
.link-list a { color: #a6f7ff; }

.btn { display: inline-block; border: 1px solid rgba(78,243,255,0.35); background: linear-gradient(180deg, rgba(78,243,255,0.15), rgba(78,243,255,0.05)); color: #eaffff; padding: .6rem 1rem; border-radius: 10px; cursor: pointer; transition: transform .12s ease, box-shadow .12s ease; }
.btn:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(78,243,255,0.15); }

.accordion__panel[hidden] { display: none; }
.accordion__panel { margin-top: .5rem; border-top: 1px dashed rgba(78,243,255,0.25); padding-top: .5rem; }
.accordion__trigger { width: 100%; text-align: left; padding: .6rem .8rem; border-radius: 8px; border: 1px solid rgba(78,243,255,0.25); background: rgba(20,24,40,0.5); color: #eaffff; }

.section__cta { margin-top: 1rem; }