/* SzűrőCentrum – kiegészítő réteg a Tailwind CDN fölé */

:root { --ink:#0F172A; --brand:#2563EB; --cta:#22C55E; }

html { -webkit-text-size-adjust: 100%; }
body { text-rendering: optimizeLegibility; }

/* Vízszintes görgetők elrejtése (kategória menü, márkafal) */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Keresőmező – natív "x" eltüntetése a tisztább megjelenésért */
input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

/* Folyamatos, finom márkafal-animáció (logówall) */
@keyframes sc-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.sc-marquee { animation: sc-marquee 38s linear infinite; }
.sc-marquee:hover { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .sc-marquee { animation: none; } }

/* Kártya hover-emelés – GPU-barát */
.card-lift { transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s; }
.card-lift:hover { transform: translateY(-4px); }

/* Hero finom rácsminta */
.hero-grid {
  background-image:
    linear-gradient(to right, rgba(15,23,42,.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(15,23,42,.04) 1px, transparent 1px);
  background-size: 56px 56px;
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 0%, #000 50%, transparent 100%);
          mask-image: radial-gradient(ellipse 80% 70% at 50% 0%, #000 50%, transparent 100%);
}

/* SEO prózablokk olvashatóság */
.prose-sc p { margin-bottom: 1rem; line-height: 1.75; color: #475569; }
.prose-sc h3 { color: var(--ink); font-weight: 700; margin: 1.75rem 0 .5rem; }
.prose-sc strong { color: var(--ink); font-weight: 600; }

/* Alpine x-cloak (rejtsd, amíg az Alpine inicializál) */
[x-cloak] { display: none !important; }

/* Blog cikk tipográfia (.article-body) */
.article-body { color: #475569; font-size: 1.0625rem; line-height: 1.8; }
.article-body > * + * { margin-top: 1.1rem; }
.article-body h2 { color: var(--ink); font-weight: 800; font-size: 1.3rem; line-height: 1.3; margin-top: 2rem; }
.article-body h3 { color: var(--ink); font-weight: 700; font-size: 1.1rem; margin-top: 1.5rem; }
.article-body p { margin-top: 1.1rem; }
.article-body strong { color: var(--ink); font-weight: 700; }
.article-body a { color: var(--brand); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.article-body ul, .article-body ol { margin-top: 1.1rem; padding-left: 1.25rem; }
.article-body ul { list-style: none; padding-left: 0; }
.article-body ul li { position: relative; padding-left: 1.5rem; margin-top: .55rem; }
.article-body ul li::before { content: ''; position: absolute; left: .25rem; top: .65rem; width: .45rem; height: .45rem; border-radius: 9999px; background: var(--brand); }
.article-body ol { list-style: decimal; }
.article-body ol li { margin-top: .55rem; padding-left: .25rem; }
.article-body em { font-style: normal; background: #eff6ff; color: var(--brand); padding: 0 .35em; border-radius: .35rem; font-weight: 600; }

/* Fókusz-láthatóság (WCAG AA) */
a:focus-visible, button:focus-visible, input:focus-visible {
  outline: 2px solid var(--brand); outline-offset: 2px;
}