.szablon-gry-seo { font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; color: #d4d4d8; max-width: 1000px; /* Maksymalna szerokość dla wpisu */ margin: 0 auto; }.szablon-gry-seo *, .szablon-gry-seo *::before, .szablon-gry-seo *::after { box-sizing: border-box !important; }/* 1. GŁÓWNY KONTENER (HERO) */ .szablon-gry-seo .game-hero-container { display: flex !important; align-items: flex-start !important; gap: 40px !important; background: #161618 !important; padding: 35px 40px !important; border-radius: 16px !important; margin: 20px 0 40px 0 !important; border: 1px solid #27272a !important; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4) !important; }.szablon-gry-seo .game-hero-left { flex: 0 0 260px !important; display: flex !important; flex-direction: column !important; gap: 15px !important; }.szablon-gry-seo .game-cover-wrapper img { width: 100% !important; height: auto !important; aspect-ratio: 3/4 !important; object-fit: cover !important; border-radius: 12px !important; display: block !important; margin: 0 !important; box-shadow: 0 10px 25px rgba(0,0,0,0.5) !important; border: 1px solid rgba(255,255,255,0.05) !important; }.szablon-gry-seo .watch-trailer-btn { display: flex !important; align-items: center !important; justify-content: center !important; background: #222225 !important; color: #ffffff !important; text-decoration: none !important; padding: 12px 20px !important; border-radius: 8px !important; font-size: 14px !important; transition: 0.3s !important; border: 1px solid #3f3f46 !important; font-weight: 600 !important; } .szablon-gry-seo .watch-trailer-btn:hover { background: #3f3f46 !important; }.szablon-gry-seo .game-hero-right { flex: 1 !important; width: 100% !important; }.szablon-gry-seo .game-description { margin: 0 0 25px 0 !important; line-height: 1.7 !important; color: #d4d4d8 !important; font-size: 15px !important; padding: 0 !important; }/* SIATKA SPECYFIKACJI */ .szablon-gry-seo .specs-grid { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)) !important; gap: 12px !important; margin: 0 0 25px 0 !important; padding: 0 0 25px 0 !important; border-bottom: 1px solid #27272a !important; }.szablon-gry-seo .spec-box { background: rgba(255, 255, 255, 0.03) !important; border: 1px solid rgba(255, 255, 255, 0.05) !important; border-radius: 8px !important; padding: 12px 15px !important; display: flex !important; flex-direction: column !important; justify-content: center !important; }.szablon-gry-seo .spec-label { font-size: 11px !important; text-transform: uppercase !important; color: #a1a1aa !important; margin: 0 0 4px 0 !important; font-weight: 600 !important; display: block !important; }.szablon-gry-seo .spec-value { font-size: 14px !important; color: #ffffff !important; font-weight: 700 !important; display: block !important; }.szablon-gry-seo .update-box { background: rgba(0, 255, 136, 0.05) !important; border-color: rgba(0, 255, 136, 0.15) !important; } .szablon-gry-seo .update-box .spec-value { color: #00ff88 !important; }.szablon-gry-seo .full-width { grid-column: 1 / -1 !important; flex-direction: row !important; align-items: center !important; gap: 15px !important; background: transparent !important; border: none !important; padding: 10px 0 0 0 !important; }.szablon-gry-seo .genre-badges { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; } .szablon-gry-seo .genre-badge { background: #222225 !important; color: #a1a1aa !important; text-decoration: none !important; padding: 5px 14px !important; border-radius: 6px !important; font-size: 12px !important; font-weight: 600 !important; border: 1px solid transparent !important; }/* STEAM BAR */ .szablon-gry-seo .steam-bar { display: flex !important; align-items: center !important; background: #1c1c1f !important; border: 1px solid #27272a !important; border-radius: 10px !important; text-decoration: none !important; margin-bottom: 25px !important; padding: 15px 20px !important; gap: 15px !important; } .szablon-gry-seo .steam-icon-svg { width: 24px !important; height: 24px !important; flex-shrink: 0 !important; } .szablon-gry-seo .steam-bar span { color: #a1a1aa !important; font-size: 14px !important; } .szablon-gry-seo .steam-bar strong { color: #fff !important; font-weight: 700 !important; margin-left: 5px !important; }/* BUTTON */ .szablon-gry-seo .download-btn { display: flex !important; justify-content: center !important; align-items: center !important; width: 100% !important; background: rgba(37, 99, 235, 0.1) !important; color: #3b82f6 !important; text-decoration: none !important; padding: 16px 30px !important; border-radius: 10px !important; font-weight: 700 !important; font-size: 16px !important; border: 2px solid #2563eb !important; text-transform: uppercase !important; }/* 2. OPIS GRY (BOX 2) */ .szablon-gry-seo .game-content-box { background: #161618 !important; padding: 40px !important; border-radius: 16px !important; margin: 0 0 40px 0 !important; border: 1px solid #27272a !important; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4) !important; } .szablon-gry-seo .game-content-box h2 { color: #ffffff !important; font-size: 26px !important; font-weight: 700 !important; margin: 0 0 25px 0 !important; padding: 0 0 15px 0 !important; border-bottom: 1px solid #27272a !important; } .szablon-gry-seo .game-article-text p { line-height: 1.8 !important; font-size: 16px !important; margin: 0 0 20px 0 !important; color: #a1a1aa !important; } .szablon-gry-seo .game-article-text strong { color: #ffffff !important; }/* MIEJSCE NA GALERIĘ KADENCE (tylko poglądowe dla edytora) */ .szablon-gry-seo .kadence-placeholder { margin: 40px 0 !important; text-align: center !important; }/* 3. INSTALACJA I WYMAGANIA (Podział na 2) */ .szablon-gry-seo .game-info-split-container { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 30px !important; margin: 0 0 40px 0 !important; }.szablon-gry-seo .info-column { background: #161618 !important; padding: 35px !important; border-radius: 16px !important; border: 1px solid #27272a !important; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4) !important; }.szablon-gry-seo .info-column h3 { color: #ffffff !important; font-size: 22px !important; font-weight: 700 !important; margin: 0 0 20px 0 !important; padding-bottom: 15px !important; border-bottom: 1px solid #27272a !important; }.szablon-gry-seo .install-steps { margin: 0 0 25px 0 !important; padding-left: 20px !important; color: #d4d4d8 !important; } .szablon-gry-seo .install-steps li { margin-bottom: 12px !important; line-height: 1.6 !important; font-size: 15px !important; } .szablon-gry-seo .install-steps strong { color: #ffffff !important; }.szablon-gry-seo .important-notes { background: rgba(234, 179, 8, 0.05) !important; border-left: 4px solid #eab308 !important; padding: 20px !important; border-radius: 0 8px 8px 0 !important; } .szablon-gry-seo .important-notes h4 { color: #eab308 !important; margin: 0 0 10px 0 !important; font-size: 16px !important; font-weight: 700 !important;} .szablon-gry-seo .important-notes p { color: #a1a1aa !important; font-size: 14px !important; margin: 0 !important; line-height: 1.6 !important;}/* WYMAGANIA - ROZWIĄZANIE PROBLEMU SKLEJONEGO TEKSTU */ .szablon-gry-seo .req-grid { display: block !important; width: 100% !important; } .szablon-gry-seo .req-row { display: grid !important; grid-template-columns: 140px 1fr !important; /* Sztywny podział */ gap: 15px !important; padding: 12px 0 !important; border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; align-items: start !important; } .szablon-gry-seo .req-row:last-child { border-bottom: none !important; }.szablon-gry-seo .req-label { color: #a1a1aa !important; font-size: 14px !important; font-weight: 600 !important; } .szablon-gry-seo .req-value { color: #ffffff !important; font-size: 14px !important; font-weight: 700 !important; text-align: right !important;} .szablon-gry-seo .req-value span { color: #eab308 !important; font-size: 12px !important; display: block !important; margin-top: 4px !important;}/* ========================================= RESPONSYWNOŚĆ (TELEFONY I TABLETY) ========================================= */ @media (max-width: 900px) { .szablon-gry-seo .game-hero-container { flex-direction: column !important; align-items: center !important; } .szablon-gry-seo .game-hero-left { width: 100% !important; max-width: 300px !important; } .szablon-gry-seo .game-info-split-container { grid-template-columns: 1fr !important; } /* Pudełka jedno pod drugim */ .szablon-gry-seo .spec-box.full-width { flex-direction: column !important; text-align: center !important; } .szablon-gry-seo .steam-bar { flex-direction: column !important; text-align: center !important; } }@media (max-width: 600px) { .szablon-gry-seo .game-hero-container, .szablon-gry-seo .game-content-box, .szablon-gry-seo .info-column { padding: 20px !important; /* Mniejsze marginesy na tel */ } /* Naprawa złączonego tekstu wymagań na małych ekranach */ .szablon-gry-seo .req-row { grid-template-columns: 1fr !important; /* Etykieta nad wartością */ gap: 4px !important; } .szablon-gry-seo .req-value { text-align: left !important; } }
Page suivante
Bouton retour en haut de la page