/* Strona główna – nowy układ (ładowany tylko przez front-page.php) */

/* Ścieżki względem tego pliku, więc działają niezależnie od katalogu instalacji WP */
@font-face { font-family:'ECU Transducer'; src:url(../fonts/Transducer-ExtendedRegular.woff) format('woff'); font-weight:400; font-display:swap }
@font-face { font-family:'ECU Transducer'; src:url(../fonts/Transducer-ExtendedMedium.woff) format('woff'); font-weight:500; font-display:swap }
@font-face { font-family:'ECU Transducer'; src:url(../fonts/Transducer-ExtendedBold.woff) format('woff'); font-weight:700; font-display:swap }
@font-face { font-family:'ECU Transducer'; src:url(../fonts/Transducer-ExtendedBlack.woff) format('woff'); font-weight:900; font-display:swap }

.fp {
	--fp-bg:#191b22;
	--fp-bg-alt:#11131a;
	--fp-surface:#20232c;
	--fp-line:#2f3138;
	--fp-text:#f1f2f4;
	--fp-muted:#9aa0ad;
	--fp-accent:#ffce09;
	--fp-radius:10px;
	--fp-display:'ECU Transducer', 'Open Sans', sans-serif;
	background:var(--fp-bg);
	color:var(--fp-text);
}
.fp *, .fp *::before, .fp *::after { box-sizing:border-box }
.fp a { text-decoration:none }
.fp-container { width:100%; max-width:1320px; margin:0 auto; padding:0 20px }

/* Hero (slider 6) */
.fp-hero { background:#05070b }

/* Wprowadzenie + liczby */
.fp-intro { padding:clamp(40px, 6vw, 80px) 0 0; border-bottom:1px solid var(--fp-line) }
.fp-intro__grid { display:grid; gap:40px; align-items:center }
.fp .fp-eyebrow { margin:0 0 12px; color:var(--fp-accent); font:700 13px/1 var(--fp-display); letter-spacing:.18em; text-transform:uppercase }
.fp .fp-title { margin:0 0 16px; font:900 clamp(16px, 4.8vw, 40px)/1.1 var(--fp-display); color:#fff; text-transform:uppercase; text-align:left; white-space:nowrap }
.fp .fp-lead { margin:0 0 28px; max-width:56ch; color:var(--fp-muted); font-size:clamp(18px, 1.6vw, 22px); line-height:1.55 }
.fp-actions { display:flex; flex-wrap:wrap; gap:12px }
.fp-btn { display:inline-flex; align-items:center; min-height:48px; padding:0 26px; border-radius:6px; font:700 13px/1 var(--fp-display); letter-spacing:.06em; text-transform:uppercase; transition:background .2s, color .2s, border-color .2s }
.fp a.fp-btn--primary { background:var(--fp-accent); color:#05070b; border:2px solid var(--fp-accent) }
.fp a.fp-btn--primary:hover { background:#fff; border-color:#fff }
.fp a.fp-btn--ghost { color:#fff; border:2px solid var(--fp-line) }
.fp a.fp-btn--ghost:hover { border-color:var(--fp-accent); color:var(--fp-accent) }

.fp .fp-stats { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2, 1fr); gap:1px; background:var(--fp-line); border:1px solid var(--fp-line); border-radius:var(--fp-radius); overflow:hidden }
.fp-stats li { background:var(--fp-bg); padding:22px 20px }
.fp-stats strong { display:block; margin-bottom:6px; color:var(--fp-accent); font:900 clamp(20px, 2vw, 28px)/1.1 var(--fp-display) }
.fp-stats span { color:var(--fp-muted); font-size:14px }

.fp .fp-notice { margin:40px auto 0; padding-top:16px; padding-bottom:16px; border-top:1px solid var(--fp-line); color:var(--fp-muted); font-size:16px; line-height:1.5; text-align:center }
.fp-notice a { color:var(--fp-text); text-decoration:underline !important }

/* Sekcje */
.fp-section { padding:clamp(48px, 7vw, 96px) 0 }
.fp-section--alt { background:var(--fp-bg-alt) }
.fp-head { display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:32px }
.fp .fp-head h2, .fp-community .page-header { margin:0; font:900 clamp(20px, 2.2vw, 30px)/1.2 var(--fp-display); color:#fff; text-transform:uppercase; text-align:left; background:none; padding:0 }
.fp a.fp-more { color:var(--fp-accent); font:700 13px/1 var(--fp-display); text-transform:uppercase; letter-spacing:.06em; white-space:nowrap }
.fp a.fp-more::after, .fp-card__link::after { content:" \2192" }

/* Co nowego (kafle z "add_featured") */
.fp-news { display:grid; gap:20px }
.fp-news__item { display:block; background:var(--fp-surface); border:1px solid var(--fp-line); border-radius:var(--fp-radius); overflow:hidden; transition:border-color .2s, transform .2s }
.fp a.fp-news__item:hover { border-color:var(--fp-accent); transform:translateY(-3px) }
.fp-news__img { display:block; aspect-ratio:1/1; background:#05070b center/cover no-repeat }
.fp-news__title { display:block; padding:16px 18px; color:#fff; font:700 14px/1.3 var(--fp-display); text-transform:uppercase }

/* Produkty flagowe */
.fp-products { display:grid; gap:20px }
.fp-card { display:flex; flex-direction:column; background:var(--fp-surface); border:1px solid var(--fp-line); border-radius:var(--fp-radius); overflow:hidden; color:var(--fp-text); transition:border-color .2s, transform .2s }
.fp a.fp-card:hover { border-color:var(--fp-accent); transform:translateY(-3px) }
.fp-card__img { display:flex; align-items:center; justify-content:center; aspect-ratio:4/3; background:radial-gradient(circle at 50% 40%, #2a2d37 0%, #05070b 75%) }
.fp-card__img img { max-width:78%; max-height:78%; width:auto; height:auto; margin:0; transition:transform .3s }
.fp a.fp-card:hover .fp-card__img img { transform:scale(1.05) }
.fp-card__body { display:flex; flex-direction:column; flex:1; padding:20px }
.fp-card__cat { color:var(--fp-muted); font-size:12px; letter-spacing:.08em; text-transform:uppercase; margin-bottom:6px }
.fp-card__title { color:#fff; font:900 18px/1.2 var(--fp-display); text-transform:uppercase; margin-bottom:10px }
.fp-card__text { color:var(--fp-muted); font-size:14px; line-height:1.55; flex:1 }
.fp-card__link { margin-top:16px; color:var(--fp-accent); font:700 12px/1 var(--fp-display); text-transform:uppercase; letter-spacing:.06em }

/* Kategorie */
.fp-cats { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px }
.fp-cat { display:grid; grid-template-columns:64px 1fr; grid-template-rows:auto auto; column-gap:14px; align-items:center; padding:14px; background:var(--fp-surface); border:1px solid var(--fp-line); border-radius:var(--fp-radius); transition:border-color .2s }
.fp a.fp-cat:hover { border-color:var(--fp-accent) }
.fp-cat__img { grid-row:1 / 3; display:flex; align-items:center; justify-content:center; width:64px; height:64px; border-radius:8px; background:#05070b }
.fp-cat__img img { max-width:85%; max-height:85%; width:auto; height:auto; margin:0 }
.fp-cat__name { align-self:end; color:#fff; font:700 13px/1.25 var(--fp-display); text-transform:uppercase }
.fp-cat__count { align-self:start; color:var(--fp-muted); font-size:13px; margin-top:4px }

/* Opinie + social media (strona "on-home-page") */
.fp-community .page-header { margin-bottom:32px }
.fp-community hr { border:0; border-top:1px solid var(--fp-line); margin:56px 0 }
.fp-community .social-media h3 { font:700 15px/1.2 var(--fp-display); text-transform:uppercase; color:#fff }

/* Szybkie linki (strona "add_nav") */
.fp-links { display:grid; grid-template-columns:minmax(0, 1fr); gap:12px }
.fp-link { display:block; padding:20px; border:1px solid var(--fp-line); border-radius:var(--fp-radius); transition:border-color .2s, background .2s }
.fp a.fp-link:hover { border-color:var(--fp-accent); background:var(--fp-surface) }
.fp-link__label { display:block; color:var(--fp-accent); font:900 15px/1.2 var(--fp-display); text-transform:uppercase }
.fp-link__label::after { content:" \2192" }
.fp-link__text { display:block; margin-top:6px; color:var(--fp-muted); font-size:13px; line-height:1.45 }

/* Na telefonie produkty flagowe jako poziomy pasek przesuwany palcem */
@media (max-width:639px) {
	.fp-products { grid-auto-flow:column; grid-auto-columns:78%; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-inline:20px; margin:0 -20px; padding:0 20px 8px; scrollbar-width:none }
	.fp-products::-webkit-scrollbar { display:none }
	.fp-card { scroll-snap-align:start }
}
@media (min-width:640px) {
	.fp-news { grid-template-columns:repeat(3, 1fr) }
	.fp-products { grid-template-columns:repeat(2, 1fr) }
	.fp-links { grid-template-columns:repeat(3, 1fr) }
}
@media (min-width:1000px) {
	.fp-intro__grid { grid-template-columns:1.25fr 1fr; gap:64px }
	.fp .fp-title { font-size:clamp(24px, 2.9vw, 40px) }
	.fp-products { grid-template-columns:repeat(4, 1fr) }
	.fp-cats { grid-template-columns:repeat(4, 1fr) }
	.fp-links { gap:16px }
}
@media (max-width:420px) {
	.fp-cats { grid-template-columns:1fr }
	.fp-btn { flex:1 1 100%; justify-content:center }
}
@media (prefers-reduced-motion:reduce) {
	.fp * { transition:none !important }
}