/* Ceny paliw — porównanie PL/DE oraz podstrony krajowe.
   Wyniesione z szablonów 19.08.2026, żeby trzy strony dzieliły jeden plik. */
.cp-page{max-width:880px;margin:2rem auto;padding:0 18px;}
.cp-hero{text-align:center;margin-bottom:1.6rem;}
.cp-beta{display:inline-block;font-family:var(--font-display);font-weight:800;font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:linear-gradient(135deg,var(--green),var(--teal));padding:3px 10px;border-radius:99px;margin-bottom:10px;}
.cp-hero h1{font-family:var(--font-display);font-weight:900;font-size:1.9rem;color:var(--gray-900);line-height:1.15;margin:0 0 6px;}
.cp-hero p{color:var(--gray-500);font-size:.98rem;margin:0 auto;max-width:52ch;}
.cp-meta{margin-top:12px;display:inline-flex;flex-wrap:wrap;gap:8px 16px;justify-content:center;font-size:.8rem;color:var(--gray-500);}
.cp-meta b{color:var(--gray-700);}
.cp-live{color:var(--green-dark);font-weight:700;}
.cp-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:1.8rem;}
.cp-card{background:#fff;border:1px solid var(--gray-100);border-radius:16px;padding:16px;box-shadow:0 6px 22px -16px rgba(15,107,46,.35);}
.cp-card-name{font-family:var(--font-display);font-weight:800;font-size:1.02rem;color:var(--gray-900);display:flex;align-items:center;gap:8px;margin-bottom:12px;}
.cp-cmp{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.cp-side{text-align:center;border-radius:12px;padding:11px 6px 9px;border:1px solid var(--gray-100);background:var(--gray-50);}
.cp-side.cheap{background:var(--green-pale);border-color:#bbf7d0;}
.cp-side-flag{font-size:1.4rem;line-height:1;margin-bottom:5px;}
.cp-side-c{font-size:.7rem;font-weight:700;color:var(--gray-400);text-transform:uppercase;letter-spacing:.03em;margin-bottom:6px;}
.cp-side-price{font-family:var(--font-display);font-weight:900;font-size:1.32rem;color:var(--gray-900);line-height:1;}
.cp-side-sub{font-size:.72rem;color:var(--gray-400);margin-top:4px;}
.cp-side.cheap .cp-side-price{color:var(--green-dark);}
.cp-badge{margin-top:12px;text-align:center;font-size:.84rem;font-weight:700;border-radius:10px;padding:8px;}
.cp-badge.pl{background:#fef2f2;color:#b91c1c;}
.cp-badge.de{background:#eff6ff;color:#1d4ed8;}
.cp-badge.eq{background:var(--gray-50);color:var(--gray-500);}
.cp-calc{background:linear-gradient(135deg,#f0fdf4,#ecfdf5);border:1px solid #bbf7d0;border-radius:18px;padding:20px 22px;margin-bottom:1.6rem;}
.cp-calc h2{font-family:var(--font-display);font-weight:800;font-size:1.2rem;color:var(--gray-900);margin:0 0 14px;}
.cp-calc-row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;}
.cp-calc-f{flex:1;min-width:130px;}
.cp-calc-f label{display:block;font-size:.78rem;font-weight:700;color:var(--gray-600);margin-bottom:5px;}
.cp-calc-f select,.cp-calc-f input{width:100%;padding:11px 13px;border:2px solid #cdeede;border-radius:11px;font-family:var(--font-body);font-size:.95rem;background:#fff;box-sizing:border-box;}
.cp-calc-f select:focus,.cp-calc-f input:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(45,181,93,.15);}
.cp-calc-out{margin-top:16px;font-size:1.02rem;color:var(--gray-700);line-height:1.5;}
.cp-calc-out b{color:var(--green-dark);font-size:1.15rem;}
.cp-note{font-size:.8rem;color:var(--gray-400);line-height:1.5;text-align:center;margin-bottom:1.8rem;}
.cp-b2b{display:flex;align-items:center;gap:18px;background:var(--gray-900);border-radius:18px;padding:22px 24px;color:#fff;flex-wrap:wrap;}
.cp-b2b-ico{flex:0 0 auto;width:52px;height:52px;border-radius:14px;display:grid;place-items:center;font-size:1.4rem;background:linear-gradient(135deg,var(--green),var(--teal));}
.cp-b2b-body{flex:1;min-width:200px;}
.cp-b2b-body h3{font-family:var(--font-display);font-weight:800;font-size:1.1rem;margin:0 0 4px;}
.cp-b2b-body p{margin:0;font-size:.88rem;color:#cbd5e1;line-height:1.45;}
.cp-b2b-cta{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,var(--green),var(--teal));color:#fff;font-family:var(--font-display);font-weight:800;font-size:.92rem;text-decoration:none;padding:12px 20px;border-radius:12px;transition:transform .2s,box-shadow .2s;}
.cp-b2b-cta:hover{transform:translateY(-2px);box-shadow:0 10px 24px -8px rgba(45,181,93,.6);}
.cp-loading{text-align:center;color:var(--gray-400);padding:2rem;}
@media(max-width:560px){.cp-hero h1{font-size:1.5rem;}.cp-cards{grid-template-columns:1fr;}.cp-b2b{flex-direction:column;text-align:center;}.cp-b2b-cta{width:100%;justify-content:center;}}
html[data-theme="dark"] .cp-hero h1{color:#f1f5f9;}
html[data-theme="dark"] .cp-card{background:#0f172a;border-color:#1e293b;}
html[data-theme="dark"] .cp-card-name,html[data-theme="dark"] .cp-side-price{color:#f1f5f9;}
html[data-theme="dark"] .cp-side{background:#0b1622;border-color:#1e293b;}
html[data-theme="dark"] .cp-side.cheap{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.28);}
html[data-theme="dark"] .cp-side.cheap .cp-side-price{color:var(--green-light);}
html[data-theme="dark"] .cp-calc{background:linear-gradient(135deg,rgba(34,197,94,.08),rgba(20,184,166,.08));border-color:rgba(34,197,94,.28);}
html[data-theme="dark"] .cp-calc h2{color:#f1f5f9;}
html[data-theme="dark"] .cp-calc-f select,html[data-theme="dark"] .cp-calc-f input{background:#0b1622;border-color:#1e3a52;color:#e2e8f0;}
html[data-theme="dark"] .cp-badge.pl{background:rgba(220,38,38,.15);color:#fca5a5;}
html[data-theme="dark"] .cp-badge.de{background:rgba(37,99,235,.15);color:#93c5fd;}
.cp-pm{ margin:26px 0; background:var(--white,#fff); border:1px solid var(--gray-100,#f1f5f9);
  border-radius:var(--radius,20px); padding:22px; }
.cp-pm-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:18px; flex-wrap:wrap; margin-bottom:16px; }
.cp-pm-head h2{ font-size:1.1rem; margin:0 0 6px; }
.cp-pm-head p{ font-size:.88rem; color:var(--gray-500,#64748b); margin:0; max-width:52ch; line-height:1.55; }
/* Znak słowny w ich barwie — plik z logo dopiero poprosimy, więc nie kopiujemy cudzego godła */
.cp-pm-znak{ display:inline-flex; align-items:center; gap:8px; text-decoration:none; flex:none;
  padding:8px 14px; border-radius:999px; border:1px solid #f3ccd2; background:#fff5f6; color:#e8001c;
  font-weight:700; font-size:.86rem; }
.cp-pm-znak b{ font-weight:800; }
.cp-pm-znak:hover{ background:#ffe9ec; }
.cp-pm-ramka{ border:1px solid var(--gray-100,#f1f5f9); border-radius:var(--radius-sm,12px); overflow:hidden;
  background:var(--gray-50,#f8fafc); min-height:180px; display:flex; align-items:center; justify-content:center; }
.cp-pm-ramka iframe{ width:100%; height:420px; border:0; display:block; background:#fff; }
.cp-pm-zgoda{ text-align:center; padding:28px 22px; }
.cp-pm-zgoda p{ font-size:.86rem; color:var(--gray-500,#64748b); margin:0 0 14px; max-width:44ch; line-height:1.55; }
.cp-pm-btn{ border:0; cursor:pointer; font-family:inherit; font-weight:700; font-size:.9rem;
  padding:11px 22px; border-radius:999px; background:var(--green,#22c55e); color:#fff; }
.cp-pm-btn:hover{ filter:brightness(.95); }
.cp-pm-stopka{ margin:12px 0 0; font-size:.78rem; color:var(--gray-500,#64748b); }
.cp-pm-stopka a{ color:var(--green-dark,#0f6b2e); font-weight:600; }
html[data-theme="dark"] .cp-pm{ background:#161a20; border-color:#252b34; }
html[data-theme="dark"] .cp-pm-ramka{ background:#11151a; border-color:#252b34; }
html[data-theme="dark"] .cp-pm-znak{ background:#2a1418; border-color:#5a2028; color:#ff6b7d; }

/* ── podstrony krajowe /ceny-paliw/polska i /ceny-paliw/niemcy ─────────── */
.cpk-wroc{ margin-bottom:14px; }
.cpk-wroc a{ color:var(--green-dark); font-weight:600; font-size:.86rem; text-decoration:none; }
.cpk-wroc a:hover{ text-decoration:underline; }
.cpk-stare{ background:var(--orange-light); color:#92400e; border-radius:var(--radius-sm);
  padding:12px 16px; font-size:.88rem; font-weight:600; margin-bottom:16px; }
.cpk-tabela{ background:var(--white); border:1px solid var(--gray-100); border-radius:var(--radius);
  padding:20px; overflow-x:auto; margin-bottom:22px; }
.cpk-tabela table{ width:100%; border-collapse:collapse; font-size:.94rem; }
.cpk-tabela caption{ text-align:left; font-weight:800; font-family:var(--font-display);
  color:var(--gray-900); padding:0 0 12px; }
.cpk-tabela th{ text-align:left; padding:9px 10px; border-bottom:2px solid var(--gray-200);
  font-size:.8rem; text-transform:uppercase; letter-spacing:.04em; color:var(--gray-500); }
.cpk-tabela td{ padding:11px 10px; border-bottom:1px solid var(--gray-100); }
.cpk-num{ text-align:right; font-variant-numeric:tabular-nums; }
.cpk-nazwa{ font-weight:700; color:var(--gray-900); }
.cpk-cena{ font-weight:800; color:var(--gray-900); font-size:1.02rem; }
.cpk-drobne{ color:var(--gray-500); }

/* Karta źródła Tankerkönig — logo jest jasne, więc musi mieć ciemne tło */
.cpk-zrodlo{ display:flex; gap:22px; align-items:flex-start; flex-wrap:wrap;
  background:var(--white); border:1px solid var(--gray-100); border-radius:var(--radius); padding:22px; margin-bottom:22px; }
.cpk-zrodlo-logo{ background:#1c1c1c; border-radius:var(--radius-sm); padding:16px 20px; flex:none; }
.cpk-zrodlo-logo img{ display:block; width:200px; height:auto; }
.cpk-zrodlo-tresc{ flex:1; min-width:260px; }
.cpk-zrodlo-tresc h2{ font-size:1.05rem; margin:0 0 8px; }
.cpk-zrodlo-tresc p{ font-size:.9rem; color:var(--gray-500); line-height:1.6; margin:0 0 8px; }
.cpk-licencja{ font-size:.82rem !important; }
.cpk-licencja a{ color:var(--green-dark); font-weight:600; }

/* Przejście na drugą stronę granicy */
.cpk-druga{ display:flex; align-items:center; gap:16px; text-decoration:none;
  background:var(--white); border:1px solid var(--gray-100); border-radius:var(--radius);
  padding:18px 22px; transition:border-color .18s, transform .18s; }
.cpk-druga:hover{ border-color:var(--green); transform:translateY(-2px); }
.cpk-druga-flaga{ font-size:1.7rem; flex:none; }
.cpk-druga-tresc{ flex:1; display:flex; flex-direction:column; gap:2px; }
.cpk-druga-tresc b{ color:var(--gray-900); font-weight:700; font-size:.98rem; }
.cpk-druga-tresc small{ color:var(--gray-500); font-size:.83rem; }
.cpk-druga i{ color:var(--green-dark); }

html[data-theme="dark"] .cpk-tabela,
html[data-theme="dark"] .cpk-zrodlo,
html[data-theme="dark"] .cpk-druga{ background:#161a20; border-color:#252b34; }

.cpk-kraje{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:22px; }
@media (max-width:640px){ .cpk-kraje{ grid-template-columns:1fr; } }
