/* ==========================================================================
   Savoré — style bloków poradników (front + edytor)
   Czcionki (Cormorant Garamond / Figtree) ładuje motyw.
   ========================================================================== */

:root{
	--sv-cream:#f5f0e8;
	--sv-beige:#ece2d2;
	--sv-burgundy:#4a0f28;
	--sv-burgundy-btn:#571332;
	--sv-burgundy-dark:#3a0a1f;
	--sv-gold:#b0782a;
	--sv-gold-soft:#c8a24a;
	--sv-ink:#2f2a2c;
	--sv-muted:#7a7175;
	--sv-line:#ddd2c2;
	--sv-serif:"Cormorant Garamond",Georgia,serif;
	--sv-sans:"Figtree",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

.savore-note,
.savore-cards,
.savore-qgrid,
.savore-twobox,
.savore-example,
.savore-cta,
.savore-faq{
	font-family:var(--sv-sans);
	color:var(--sv-ink);
	line-height:1.7;
	box-sizing:border-box;
}
.savore-note *,
.savore-cards *,
.savore-qgrid *,
.savore-twobox *,
.savore-example *,
.savore-cta *,
.savore-faq *{ box-sizing:border-box; }

/* --- 1. Ramka informacyjna ------------------------------------------------ */
.savore-note{
	background:#f3ead6;
	border-left:3px solid var(--sv-gold-soft);
	padding:16px 20px;
	margin-top:22px;
	margin-bottom:22px;
	font-size:15px;
	color:#5f5040;
}
.savore-note p{ margin:0; }
.savore-note p + p{ margin-top:12px; }
.savore-note a{ color:var(--sv-burgundy); font-weight:600; }

/* --- 2. Karty (3 kolumny) ------------------------------------------------- */
/* auto-fit zamiast repeat(3,1fr): siatka mierzy realną szerokość kontenera,
   a nie okna. W kolumnie 772px (makieta) daje 3 kolumny jak na froncie, w węższej
   kolumnie edytora schodzi do 2, na telefonie do 1 — bez pomocy @media. */
.savore-cards,
.savore-cards .block-editor-block-list__layout{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
	gap:16px;
}
.savore-cards{ margin-top:22px; margin-bottom:22px; }
.savore-cards .block-editor-block-list__layout{ width:100%; }

.savore-card{
	background:#fff;
	border:1px solid var(--sv-line);
	border-top:3px solid var(--sv-gold);
	border-radius:3px;
	padding:20px;
	margin:0;
}
.savore-card__big{
	font-family:var(--sv-serif);
	color:var(--sv-burgundy);
	font-size:24px;
	line-height:1.2;
	font-weight:600;
}
.savore-card__sub{
	color:var(--sv-gold);
	font-size:12px;
	letter-spacing:.1em;
	text-transform:uppercase;
	font-weight:700;
	margin:4px 0 10px;
}
.savore-card__txt{ font-size:14px; color:var(--sv-muted); }

/* --- 3. Siatka pytań ------------------------------------------------------ */
.savore-qgrid,
.savore-qgrid .block-editor-block-list__layout{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:16px;
}
.savore-qgrid{ margin-top:22px; margin-bottom:22px; }
.savore-qgrid .block-editor-block-list__layout{ width:100%; }

.savore-qbox{
	background:#fff;
	border:1px solid var(--sv-line);
	border-radius:3px;
	padding:18px 20px;
	margin:0;
}
.savore-qbox__title{
	color:var(--sv-burgundy);
	font-family:var(--sv-sans);
	font-size:13px;
	letter-spacing:.08em;
	text-transform:uppercase;
	font-weight:700;
	line-height:1.4;
	margin:0 0 12px;
}
.savore-qbox ul{ list-style:none; margin:0; padding:0; }
.savore-qbox li{
	position:relative;
	padding-left:18px;
	margin:9px 0;
	font-size:14px;
	line-height:1.55;
}
.savore-qbox li::before{
	content:"";
	position:absolute;
	left:0; top:8px;
	width:6px; height:6px;
	background:var(--sv-gold);
	border-radius:50%;
}

/* --- 4. Dwa boksy --------------------------------------------------------- */
.savore-twobox,
.savore-twobox .block-editor-block-list__layout{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:16px;
}
.savore-twobox{ margin-top:22px; margin-bottom:22px; }
.savore-twobox .block-editor-block-list__layout{ width:100%; }

.savore-twobox__item{
	border-radius:3px;
	padding:22px 24px;
	margin:0;
}
.savore-twobox.is-white .savore-twobox__item{ background:#fff; border:1px solid var(--sv-line); }
.savore-twobox.is-beige .savore-twobox__item{ background:var(--sv-beige); }

.savore-twobox__title{
	font-family:var(--sv-serif);
	color:var(--sv-burgundy);
	font-size:22px;
	line-height:1.2;
	font-weight:600;
	margin:0 0 12px;
}
.savore-twobox.is-white .savore-twobox__title{ color:var(--sv-gold); }
.savore-twobox__item p{ font-size:14px; color:var(--sv-ink); margin:0 0 10px; }
.savore-twobox__item p:last-child{ margin-bottom:0; }
.savore-twobox__item ul{ list-style:none; margin:0; padding:0; }
.savore-twobox__item li{
	position:relative;
	padding-left:20px;
	margin:10px 0;
	font-size:14px;
	line-height:1.55;
}
.savore-twobox__item li::before{
	content:"";
	position:absolute;
	left:0; top:8px;
	width:6px; height:6px;
	background:var(--sv-gold);
	border-radius:50%;
}

/* --- 5. Pasek CTA + przycisk --------------------------------------------- */
.savore-cta{
	background:#fff;
	border:1px solid var(--sv-line);
	border-radius:4px;
	padding:18px 22px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:20px;
	margin-top:22px;
	margin-bottom:18px;
	flex-wrap:wrap;
}
.savore-cta__title{
	color:var(--sv-burgundy);
	display:block;
	font-size:16px;
	font-weight:700;
	margin-bottom:4px;
}
.savore-cta__desc{ color:var(--sv-muted); font-size:14px; display:block; }

.savore-btn{
	display:inline-block;
	padding:13px 26px;
	font-size:13px;
	letter-spacing:.1em;
	font-weight:700;
	line-height:1.2;
	text-decoration:none;
	border-radius:2px;
	background:var(--sv-burgundy-btn);
	color:#fff;
	border:none;
	white-space:nowrap;
}
.savore-btn:hover,
.savore-btn:focus{ background:var(--sv-burgundy); color:#fff; }

/* --- 6. Sekcja przykładowa ------------------------------------------------ */
.savore-example{
	background:var(--sv-beige);
	border-radius:4px;
	padding:34px;
	margin-top:40px;
	margin-bottom:40px;
}
.savore-example > *:first-child,
.savore-example .block-editor-block-list__layout > *:first-child{ margin-top:0; }
.savore-example .savore-cta{ margin-bottom:0; }
.savore-example p{ margin:0 0 20px; }

/* --- 7. FAQ --------------------------------------------------------------- */
.savore-faq{ margin-top:22px; margin-bottom:22px; }
.savore-faq__item{
	border-bottom:1px solid var(--sv-line);
	padding:18px 0;
	margin:0;
}
.savore-faq__q{
	font-weight:700;
	color:var(--sv-burgundy);
	font-size:16px;
	margin-bottom:6px;
}
.savore-faq__a{ font-size:15px; }

/* --- Warianty stylów bloków rdzenia --------------------------------------- */

/* Tabela porównawcza */
.wp-block-table.is-style-savore{
	margin-top:22px;
	margin-bottom:22px;
	overflow-x:auto;
	font-family:var(--sv-sans);
}
.wp-block-table.is-style-savore table{
	width:100%;
	min-width:520px;
	border-collapse:collapse;
	margin:0;
	font-size:15px;
	color:var(--sv-ink);
	border:none;
}
.wp-block-table.is-style-savore thead{ border-bottom:none; }
.wp-block-table.is-style-savore thead th{
	background:var(--sv-burgundy);
	color:#fff;
	text-align:left;
	padding:12px 14px;
	font-weight:600;
	font-size:13px;
	letter-spacing:.04em;
	border:none;
}
.wp-block-table.is-style-savore thead th:first-child{ background:var(--sv-burgundy-dark); }
.wp-block-table.is-style-savore tbody td{
	padding:12px 14px;
	border:none;
	border-bottom:1px solid var(--sv-line);
	vertical-align:top;
}
.wp-block-table.is-style-savore tbody tr:nth-child(even){ background:#faf6ef; }
.wp-block-table.is-style-savore tbody td:first-child{
	font-weight:700;
	color:var(--sv-burgundy);
	width:26%;
}
.wp-block-table.is-style-savore figcaption{
	font-size:13px;
	color:var(--sv-muted);
}

/* Lista ze znacznikami (ticks) */
.wp-block-list.is-style-savore-ticks,
ul.is-style-savore-ticks{
	list-style:none;
	margin-top:16px;
	margin-bottom:16px;
	padding:0;
	font-family:var(--sv-sans);
}
.is-style-savore-ticks li{
	position:relative;
	padding-left:24px;
	margin:9px 0;
	font-size:15px;
	line-height:1.6;
}
.is-style-savore-ticks li::before{
	content:"";
	position:absolute;
	left:0; top:10px;
	width:7px; height:7px;
	background:var(--sv-gold);
	border-radius:50%;
}

/* Notka kontaktowa */
p.is-style-savore-contact{
	font-family:var(--sv-sans);
	font-size:14px;
	color:#5f5040;
	line-height:1.6;
}
p.is-style-savore-contact strong{ color:var(--sv-burgundy); }

/* Edytor opakowuje zawartość każdego InnerBlocks w .block-editor-block-list__layout —
   także wewnątrz kafelków. Reguły siatki wyżej są selektorami potomnymi, więc łapały
   również te zagnieżdżone kontenery: lista w boksie pytań rozjeżdżała się na dwie
   kolumny zamiast układać punkty jeden pod drugim. Zerujemy je punktowo. */
.savore-card .block-editor-block-list__layout,
.savore-qbox .block-editor-block-list__layout,
.savore-twobox__item .block-editor-block-list__layout{
	display:block;
	grid-template-columns:none;
}

/* Centrowanie w edytorze.
   Edytor centruje bloki przez `margin-left/right:auto` na `.editor-styles-wrapper .wp-block`
   (specyficzność 0,2,0). Skrót `margin:22px 0` z dwuklasowego selektora tabeli wygrywał ten
   pojedynek i zerował marginesy boczne — stąd tabela dosunięta do lewej krawędzi kanwy.
   `auto` na froncie liczy się jako 0 (element i tak wypełnia kolumnę), więc nic tam nie zmienia,
   a jednocześnie nadpisuje domyślny `figure{margin:1em 40px}` z przeglądarki. */
.savore-note,
.savore-cards,
.savore-qgrid,
.savore-twobox,
.savore-example,
.savore-cta,
.savore-faq,
.wp-block-table.is-style-savore,
.wp-block-list.is-style-savore-ticks,
ul.is-style-savore-ticks{
	margin-left:auto;
	margin-right:auto;
}

/* --- Mobile --------------------------------------------------------------- */
@media (max-width:820px){
	.savore-qgrid,
	.savore-qgrid .block-editor-block-list__layout,
	.savore-twobox,
	.savore-twobox .block-editor-block-list__layout{
		grid-template-columns:1fr;
	}
	.savore-example{ padding:24px 20px; }
	.savore-twobox__item{ padding:20px; }
}

@media (max-width:560px){
	.savore-cta{ flex-direction:column; align-items:stretch; padding:18px; }
	.savore-btn{ width:100%; text-align:center; white-space:normal; }
	.savore-note{ padding:14px 16px; }
	.savore-card__big{ font-size:22px; }
	.savore-twobox__title{ font-size:20px; }
	.wp-block-table.is-style-savore table{ min-width:440px; }
}

/* --- Druk ----------------------------------------------------------------- */
@media print{
	.savore-card,
	.savore-qbox,
	.savore-twobox__item,
	.savore-example,
	.wp-block-table.is-style-savore{ break-inside:avoid; }
	.savore-note,
	.savore-card,
	.savore-qbox,
	.savore-twobox__item,
	.savore-example,
	.savore-cta,
	.savore-btn,
	.wp-block-table.is-style-savore *{
		-webkit-print-color-adjust:exact;
		print-color-adjust:exact;
	}
}