/* Palworld page-specific styles.
   The plan-card grid LAYOUT lives in game-config.css / hytale.css (which this page
   does not load); minecraft.css only sets scroll-margin. So we re-declare the flex
   layout here (same approach as fivem.css) to lay the plan cards out in a row. */
#mc-plans .plans-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
}
#mc-plans .plans-grid > .plan-card {
    flex: 0 1 270px;
}
@media (max-width: 640px) {
    #mc-plans .plans-grid > .plan-card { flex-basis: 100%; max-width: 100%; }
}

/* Palworld plans ARE RAM tiers (the plan key = GB RAM), so the "N GB RAM" sublabel
   mc-paths.js writes into the Step 2 header is correct here — keep it visible
   (unlike fivem.css, where the key is a slot count and the label is hidden). */

/* Clean URL anchor for the plans section (mc-paths.js still keys off #mc-plans). */
.palworld-anchor { display: block; height: 0; scroll-margin-top: 120px; }

/* Trustpilot rating strip inside the hero card (social proof, like the MC/Hytale hero). */
.gpm-hero-card-rating {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    margin-top: 14px; padding: 10px 14px; border-radius: 12px;
    background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .08);
    text-decoration: none; color: #e9ecf5; font-size: .88rem;
    transition: border-color .2s ease, background .2s ease;
}
.gpm-hero-card-rating:hover { border-color: rgba(0, 182, 122, .5); background: rgba(0, 182, 122, .07); }
.gpm-hero-card-stars { color: #00b67a; letter-spacing: 1px; white-space: nowrap; }
.gpm-hero-card-rating-text strong { color: #fff; }

/* Hero card refinements: 3 KPIs in a row + Minecraft-style review quote. */
.palworld-page .gpm-hero-card-kpis { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 560px) { .palworld-page .gpm-hero-card-kpis { grid-template-columns: repeat(2, 1fr); } }
.gpm-hero-card-quote {
    margin: 14px 0 0; padding: 2px 0 2px 14px;
    border-left: 3px solid rgba(124, 92, 255, .6);
    font-style: italic; color: #c9cede; font-size: .92rem; line-height: 1.5;
}
.gpm-hero-card-quote cite {
    display: block; margin-top: 6px; font-style: normal;
    font-size: .82rem; color: #8b90a3;
}