/*
 * Szablon „Elegancki butik”: szeryfowe wersaliki, dużo powietrza, zdjęcia na całą szerokość.
 * Dokładany na wierzch arkusza podstawowego, korzysta z tych samych zmiennych palety.
 */

.bf-tpl-elegancki {
	--bf-page: color-mix(in srgb, var(--bf-surface) 70%, #fffdfa);
	--bf-panel: color-mix(in srgb, var(--bf-surface) 45%, #fffdfa);
	--bf-card: #ffffff;
	--bf-line: color-mix(in srgb, var(--bf-text) 14%, transparent);
	--bf-muted: color-mix(in srgb, var(--bf-text) 55%, transparent);
	--bf-radius: 0px;
	--bf-radius-sm: 0px;
	--bf-container: 1240px;
	--bf-header: 92px;
	--bf-fs-display: 64px;
	--bf-fs-h1: 52px;
	--bf-fs-h2: 40px;
	--bf-fs-h3: 30px;
}

/* ---------- typografia ---------- */
.bf-tpl-elegancki h1,
.bf-tpl-elegancki h2,
.bf-tpl-elegancki .bf-section__title,
.bf-tpl-elegancki .bf-hero__title,
.bf-tpl-elegancki .bf-page-head h1 {
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 1.15;
}
.bf-tpl-elegancki .bf-eyebrow {
	color: var(--bf-muted);
	font-weight: 500;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	font-size: var(--bf-fs-xs);
}
.bf-tpl-elegancki body,
.bf-tpl-elegancki p { letter-spacing: 0.01em; }

/* ---------- paski i nagłówek ---------- */
.bf-tpl-elegancki .bf-topbar { background: var(--bf-text); color: color-mix(in srgb, var(--bf-page) 92%, #fff); border-bottom: 0; }
.bf-tpl-elegancki .bf-promobar { background: var(--bf-text); color: color-mix(in srgb, var(--bf-page) 92%, #fff); }
.bf-tpl-elegancki .bf-promobar__item { letter-spacing: 0.12em; text-transform: uppercase; font-size: var(--bf-fs-xs); font-weight: 500; }
.bf-tpl-elegancki .bf-header { background: var(--bf-card); border-bottom: 1px solid var(--bf-line); }
.bf-tpl-elegancki .bf-header__inner { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: var(--bf-space-6); }
.bf-tpl-elegancki .bf-brand { font-size: 30px; font-weight: 500; letter-spacing: 0.01em; text-transform: none; }
.bf-tpl-elegancki .bf-nav { justify-self: center; }
.bf-tpl-elegancki .bf-nav__list { gap: var(--bf-space-8); font-size: var(--bf-fs-sm); font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; }
.bf-tpl-elegancki .bf-nav__list a:hover { border-color: transparent; color: var(--bf-muted); }
.bf-tpl-elegancki .bf-header__actions { justify-self: end; }
.bf-tpl-elegancki .bf-search { width: 200px; }
.bf-tpl-elegancki .bf-search input { border-radius: 0; border-color: var(--bf-line); }
.bf-tpl-elegancki .bf-icon-btn:hover { background: transparent; color: var(--bf-muted); }
@media (max-width: 1023px) { .bf-tpl-elegancki .bf-header__inner { grid-template-columns: auto 1fr auto; } .bf-tpl-elegancki .bf-brand { font-size: 24px; } }

/* ---------- przyciski ---------- */
.bf-tpl-elegancki .bf-btn {
	border-radius: 0;
	min-height: 52px;
	padding: 12px 36px;
	background: var(--bf-text);
	color: var(--bf-card);
	font-family: var(--bf-body);
	font-size: var(--bf-fs-sm);
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}
.bf-tpl-elegancki .bf-btn:hover { background: color-mix(in srgb, var(--bf-text) 80%, #fff); color: var(--bf-card); }
.bf-tpl-elegancki .bf-btn--ghost { background: transparent; color: var(--bf-text); border: 1px solid var(--bf-text); }
.bf-tpl-elegancki .bf-btn--ghost:hover { background: var(--bf-text); color: var(--bf-card); }
.bf-tpl-elegancki .bf-link { letter-spacing: 0.12em; text-transform: uppercase; font-size: var(--bf-fs-sm); color: var(--bf-text); }

/* ---------- hero na całą szerokość ---------- */
.bf-tpl-elegancki .bf-hero-cover {
	position: relative;
	display: grid;
	place-items: center;
	min-height: min(78vh, 680px);
	padding: var(--bf-space-20) var(--bf-gutter);
	background-size: cover;
	background-position: center;
	text-align: center;
	isolation: isolate;
}
/* Zdjęcia bywają jasne i kontrastowe, więc nagłówek dostaje własną, spokojną warstwę. */
.bf-tpl-elegancki .bf-hero-cover::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: radial-gradient(ellipse at center, rgb(255 255 255 / 0.86) 0%, rgb(255 255 255 / 0.66) 45%, rgb(255 255 255 / 0.42) 100%);
}
.bf-hero-cover__body { max-width: 720px; display: grid; gap: var(--bf-space-4); justify-items: center; }
.bf-hero-cover__title { font-size: var(--bf-fs-display); margin: 0; }
.bf-hero-cover__rule { display: flex; align-items: center; gap: var(--bf-space-3); color: color-mix(in srgb, var(--bf-text) 45%, transparent); }
.bf-hero-cover__rule::before, .bf-hero-cover__rule::after { content: ""; width: 72px; height: 1px; background: currentColor; }
.bf-hero-cover__lead { margin: 0 auto; max-width: 46ch; color: color-mix(in srgb, var(--bf-text) 75%, transparent); font-size: var(--bf-fs-base); line-height: 1.7; }

/* ---------- manifest marki ---------- */
.bf-manifest { display: grid; gap: var(--bf-space-10); padding-block: var(--bf-space-16); }
.bf-manifest__title { font-size: var(--bf-fs-h2); margin: 0; }
.bf-manifest__text { margin: 0; font-family: var(--bf-heading); font-size: clamp(20px, 1.2vw + 14px, 28px); line-height: 1.5; color: color-mix(in srgb, var(--bf-text) 80%, transparent); }
@media (min-width: 62rem) { .bf-manifest { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: var(--bf-space-16); } }

/* ---------- sekcje ---------- */
.bf-tpl-elegancki .bf-section__head { justify-content: center; text-align: center; }
.bf-tpl-elegancki .bf-section__head > div { width: 100%; }
.bf-tpl-elegancki .bf-section__head .bf-btn,
.bf-tpl-elegancki .bf-section__head .bf-link { margin-inline: auto; }
.bf-tpl-elegancki .bf-strip { background: var(--bf-panel); }
.bf-tpl-elegancki .bf-strip--soft { background: var(--bf-page); }
.bf-tpl-elegancki .bf-band { background: transparent; }
.bf-tpl-elegancki .bf-glow::before { display: none; }
.bf-tpl-elegancki .bf-panel-card { background: var(--bf-card); border: 1px solid var(--bf-line); box-shadow: none; }

/* ---------- karta produktu ---------- */
.bf-tpl-elegancki .bf-product-card { background: var(--bf-card); border: 1px solid var(--bf-line); border-radius: 0; }
.bf-tpl-elegancki .bf-product-card:hover { transform: none; box-shadow: 0 12px 30px -24px rgb(0 0 0 / 0.5); }
.bf-tpl-elegancki .bf-product-card__media { aspect-ratio: 3 / 4; background: var(--bf-panel); }
.bf-tpl-elegancki .bf-product-card__media img { width: 100%; height: 100%; object-fit: cover; }
.bf-tpl-elegancki .bf-product-card__arrow { display: none; }
.bf-tpl-elegancki .bf-product-card__body { gap: var(--bf-space-2); padding: var(--bf-space-5) var(--bf-space-5) var(--bf-space-6); }
.bf-tpl-elegancki .bf-product-card__title { font-family: var(--bf-heading); font-size: var(--bf-fs-lg); font-weight: 500; letter-spacing: 0.02em; }
.bf-tpl-elegancki .bf-product-card__excerpt { margin: 0; color: var(--bf-muted); font-size: var(--bf-fs-sm); line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bf-tpl-elegancki .bf-product-card__price { font-family: var(--bf-body); font-size: var(--bf-fs-base); font-weight: 600; letter-spacing: 0.04em; }
.bf-tpl-elegancki .bf-badge { border-radius: 0; height: 26px; padding-inline: 10px; background: var(--bf-card); color: var(--bf-text); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; }
.bf-tpl-elegancki .bf-badge--new { background: var(--bf-text); color: var(--bf-card); }
.bf-tpl-elegancki .bf-product-card__badges { top: 0.75rem; left: 0.75rem; gap: 4px; }

/* ---------- sekcja ze zdjęciem w ramce ---------- */
.bf-frame { display: grid; gap: var(--bf-space-10); align-items: center; padding-block: var(--bf-space-12); }
.bf-frame__media { position: relative; }
.bf-frame__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; position: relative; z-index: 1; }
.bf-frame__media::after {
	content: "";
	position: absolute;
	inset: 40px -40px -40px 40px;
	border: 1px solid var(--bf-line);
	z-index: 0;
}
.bf-frame__title { font-size: var(--bf-fs-h2); margin: 0 0 var(--bf-space-5); }
.bf-frame__text { color: var(--bf-muted); line-height: 1.8; max-width: 52ch; }
@media (min-width: 62rem) { .bf-frame { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--bf-space-16); } }
@media (max-width: 61.99rem) { .bf-frame__media::after { display: none; } }

/* ---------- newsletter na zdjęciu ---------- */
.bf-tpl-elegancki .bf-newsletter {
	position: relative;
	border-radius: 0;
	background: var(--bf-panel);
	isolation: isolate;
	overflow: hidden;
}
.bf-tpl-elegancki .bf-newsletter--split { grid-template-columns: 1fr; }
.bf-tpl-elegancki .bf-newsletter__media { position: absolute; inset: 0; z-index: -2; }
.bf-tpl-elegancki .bf-newsletter__media img { width: 100%; height: 100%; object-fit: cover; }
.bf-tpl-elegancki .bf-newsletter::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(90deg, color-mix(in srgb, var(--bf-accent) 88%, transparent) 0%, color-mix(in srgb, var(--bf-accent) 62%, transparent) 55%, color-mix(in srgb, var(--bf-accent) 28%, transparent) 100%);
}
.bf-tpl-elegancki .bf-newsletter__body { max-width: 620px; padding: var(--bf-space-16) var(--bf-space-12); color: #fff; }
.bf-tpl-elegancki .bf-newsletter__title { font-size: var(--bf-fs-h2); color: #fff; text-shadow: 0 1px 12px rgb(0 0 0 / 0.18); }
.bf-tpl-elegancki .bf-newsletter__text,
.bf-tpl-elegancki .bf-newsletter__note { color: color-mix(in srgb, #fff 88%, transparent); }
.bf-tpl-elegancki .bf-newsletter__form input { border-radius: 0; border-color: color-mix(in srgb, #fff 70%, transparent); background: color-mix(in srgb, #fff 92%, transparent); }
.bf-tpl-elegancki .bf-newsletter__form .bf-btn { background: #fff; color: var(--bf-text); }

/* ---------- stopka ---------- */
.bf-tpl-elegancki .bf-footer { background: var(--bf-card); color: var(--bf-text); border-top: 1px solid var(--bf-line); margin-top: 0; }
.bf-tpl-elegancki .bf-footer__top { grid-template-columns: 1.4fr repeat(3, 1fr); padding-block: var(--bf-space-12); }
.bf-tpl-elegancki .bf-footer__col h2 { letter-spacing: 0.16em; text-transform: uppercase; font-size: var(--bf-fs-xs); color: var(--bf-muted); }
.bf-tpl-elegancki .bf-footer__facts li,
.bf-tpl-elegancki .bf-footer__tagline { color: var(--bf-muted); }
.bf-tpl-elegancki .bf-footer__social a { border-color: var(--bf-line); }
.bf-tpl-elegancki .bf-footer__bottom { border-top: 1px solid var(--bf-line); color: var(--bf-muted); }

/* ---------- sklep i karta produktu ---------- */
.bf-tpl-elegancki .bf-shop { background: transparent; padding: 0; gap: var(--bf-space-12); }
.bf-tpl-elegancki .bf-shop__aside h2 { letter-spacing: 0.16em; text-transform: uppercase; font-size: var(--bf-fs-xs); color: var(--bf-muted); }
.bf-tpl-elegancki .bf-page-banner { border-radius: 0; }
.bf-tpl-elegancki .bf-product { background: transparent; padding: 0; gap: var(--bf-space-16); }
.bf-tpl-elegancki .bf-product__summary .product_title { letter-spacing: 0.04em; }
.bf-tpl-elegancki .woocommerce-ordering select, .bf-tpl-elegancki .bf-select, .bf-tpl-elegancki .bf-field input { border-radius: 0; }
.bf-tpl-elegancki .woocommerce a.button, .bf-tpl-elegancki .woocommerce button.button, .bf-tpl-elegancki .woocommerce input.button, .bf-tpl-elegancki .woocommerce #respond input#submit {
	border-radius: 0;
	background: var(--bf-text);
	color: var(--bf-card);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-size: var(--bf-fs-sm);
}

/* Karty produktów w tym szablonie są większe: trzy w rzędzie zamiast czterech. */
.bf-tpl-elegancki .bf-grid--4 { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.bf-tpl-elegancki .bf-grid--3 { grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); }
@media (max-width: 767px) {
	.bf-tpl-elegancki .bf-section > .bf-grid--3 > *,
	.bf-tpl-elegancki .bf-section > .bf-grid--4 > * { flex: 0 0 280px; }
}