/*
Theme Name: Caprice ’67
Author: Mirek
Description: Motyw jednostronicowy dla wynajmu klasycznego Chevroleta Caprice 1967 na śluby i sesje zdjęciowe w Lublinie. Wszystkie style, skrypty i czcionki są wbudowane w motyw — brak jakichkolwiek zasobów ładowanych z zewnętrznych serwerów. Formularz kontaktowy współpracuje z wtyczką Contact Form 7.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.6
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: caprice67
*/

/* ---------- Czcionki (hostowane lokalnie, bez połączeń z internetem) ---------- */

@font-face {
  font-family: 'Bodoni Moda';
  src: url('fonts/bodoni-moda-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Bodoni Moda';
  src: url('fonts/bodoni-moda-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Bodoni Moda';
  src: url('fonts/bodoni-moda-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Italianno';
  src: url('fonts/italianno-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Jost';
  src: url('fonts/jost-300.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Jost';
  src: url('fonts/jost-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Jost';
  src: url('fonts/jost-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Jost';
  src: url('fonts/jost-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* ---------- Bazowe ---------- */

html { scroll-behavior: smooth; }
body { margin: 0; background: #161014; }
a { color: #f3ede3; text-decoration: none; }
a:hover { color: #a81c33; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
}

@keyframes kenburns { from { transform: scale(1.05) } to { transform: scale(1.15) } }
@keyframes riseIn { from { opacity: 0; transform: translateY(26px) } to { opacity: 1; transform: none } }
@keyframes fadeIn { from { opacity: 0 } to { opacity: 1 } }
@keyframes bob { 0%,100% { transform: translateY(0); opacity: .85 } 50% { transform: translateY(8px); opacity: .35 } }

.btn-primary { transition: background .2s ease, border-color .2s ease; }
.btn-primary:hover { background: #c0233d; border-color: #c0233d; color: #fff; }
.btn-outline { transition: background .2s ease; }
.btn-outline:hover { background: rgba(243,237,227,.1); color: #f3ede3; }

.nav-link { position: relative; padding-bottom: 4px; transition: color .2s ease; }
.nav-link::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: #a81c33; transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
.nav-link:hover { color: #a81c33; }
.nav-link:hover::after { transform: scaleX(1); }

.gallery-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
@media (max-width: 780px) { .gallery-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 460px) { .gallery-grid { grid-template-columns: 1fr; } }

/* ---------- Formularz Contact Form 7 — dopasowanie do ciemnego motywu ---------- */

.kontakt-karta { border: 1px solid rgba(217,221,224,.2); background: #211820; padding: clamp(26px,3.5vw,38px); }

.dziekuje-panel { display: none; padding: 44px 8px; text-align: center; }
.dziekuje-panel .naglowek { font-family: 'Italianno', cursive; font-size: 56px; color: #e8455f; line-height: 1; }
.dziekuje-panel p { margin: 10px 0 0; color: #d9dde0; }

.formularz-eyebrow { font-size: 12px; letter-spacing: .32em; text-transform: uppercase; color: #8d949a; font-weight: 500; margin: 0 0 16px; }

.wpcf7-form { display: grid; gap: 16px; }
.wpcf7-form p { margin: 0; display: grid; gap: 6px; }
.wpcf7-form label { display: grid; gap: 6px; font-size: 12.5px; letter-spacing: .14em; text-transform: uppercase; color: #a89fa6; }

.wpcf7-form-control-wrap { display: block; }

.wpcf7-form .cf7-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 480px) { .wpcf7-form .cf7-row-2 { grid-template-columns: 1fr; } }

.wpcf7-form-control.wpcf7-text,
.wpcf7-form-control.wpcf7-tel,
.wpcf7-form-control.wpcf7-date,
.wpcf7-form-control.wpcf7-select,
.wpcf7-form-control.wpcf7-textarea {
  padding: 12px 14px;
  background: #161014;
  border: 1px solid rgba(217,221,224,.24);
  color: #f3ede3;
  font-family: 'Jost', sans-serif;
  font-size: 17px;
  font-weight: 300;
  letter-spacing: normal;
  text-transform: none;
  width: 100%;
  box-sizing: border-box;
}
.wpcf7-form-control.wpcf7-textarea { resize: vertical; }
.wpcf7-form-control.wpcf7-select { appearance: auto; }
.wpcf7-form-control::placeholder { color: #6f6870; opacity: 1; }
.wpcf7-form-control:focus { outline: none; border-color: #a81c33; }
.wpcf7-form-control.wpcf7-not-valid { border-color: #c0233d; }
.wpcf7-not-valid-tip { color: #e8455f; font-size: 12.5px; margin-top: 4px; letter-spacing: normal; text-transform: none; }

.wpcf7-form-control.wpcf7-submit,
.wpcf7-submit {
  padding: 16px;
  background: #a81c33;
  color: #fff;
  border: 1px solid #a81c33;
  font-family: 'Jost', sans-serif;
  font-size: 13px;
  letter-spacing: .22em;
  text-transform: uppercase;
  font-weight: 500;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
}
.wpcf7-submit:hover { background: #c0233d; border-color: #c0233d; }
.wpcf7-spinner { margin-left: 10px; }

.wpcf7-response-output {
  margin: 4px 0 0;
  padding: 12px 14px;
  border: 1px solid rgba(217,221,224,.24);
  font-size: 13.5px;
  color: #d9dde0;
}
.wpcf7-form.invalid .wpcf7-response-output,
.wpcf7-form.unaccepted .wpcf7-response-output,
.wpcf7-form.payment-required .wpcf7-response-output,
.wpcf7-form.spam .wpcf7-response-output {
  border-color: #c0233d;
  color: #e8455f;
}
.wpcf7-form.sent .wpcf7-response-output { display: none; }

.formularz-info { font-size: 13px; color: #8d949a; margin: 0; line-height: 1.5; }

.cf7-brak-wtyczki {
  padding: 18px 22px;
  border: 1px dashed rgba(217,221,224,.3);
  color: #d9dde0;
  font-size: 14.5px;
  line-height: 1.6;
}

/* ---------- Dostępność ---------- */

.skip-link {
  position: absolute;
  left: 12px;
  top: -60px;
  background: #a81c33;
  color: #fff;
  padding: 12px 18px;
  font-family: 'Jost', sans-serif;
  font-size: 13px;
  letter-spacing: .12em;
  text-transform: uppercase;
  z-index: 100;
  transition: top .2s ease;
}
.skip-link:focus { top: 12px; color: #fff; }

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid #e8455f;
  outline-offset: 3px;
}

/* ---------- Siatka kart wpisów (blog, archiwa, wyszukiwanie, powiązane) ---------- */

.post-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
@media (max-width: 900px) { .post-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; } }
@media (max-width: 560px) { .post-grid { grid-template-columns: 1fr; } }

.post-card {
  background: #211820;
  border: 1px solid rgba(217,221,224,.2);
  transition: border-color .2s ease;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.post-card:hover { border-color: rgba(217,221,224,.4); }

/* ---------- Nawigacja poprzedni / następny wpis ---------- */

.post-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.post-nav-next { text-align: right; }
@media (max-width: 600px) {
  .post-nav { grid-template-columns: 1fr; gap: 28px; }
  .post-nav-next { text-align: left; }
}

/* ---------- Paginacja ---------- */

.caprice67-pagination { margin-top: 8px; }
.caprice67-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 10px;
  margin: 0 4px 8px 0;
  border: 1px solid rgba(217,221,224,.2);
  color: #d9dde0;
  font-size: 13px;
  font-family: 'Jost', sans-serif;
}
.caprice67-pagination .page-numbers.current {
  background: #a81c33;
  border-color: #a81c33;
  color: #fff;
}
.caprice67-pagination .page-numbers.dots { border-color: transparent; color: #8d949a; }
.caprice67-pagination a.page-numbers:hover { border-color: #a81c33; color: #a81c33; }

/* ---------- Treść artykułu (Gutenberg) ----------
   Wąska, czytelna kolumna (720px) z możliwością wybicia bloków na
   alignwide (960px) i alignfull (pełna szerokość) — standardowy wzorzec
   "content grid", bez potrzeby motywu blokowego. */

.entry-content {
  display: grid;
  grid-template-columns: 1fr min(720px, 100%) 1fr;
  font-size: 17px;
  line-height: 1.75;
  color: #d9dde0;
}
.entry-content > * { grid-column: 2; min-width: 0; }
.entry-content > .alignwide { grid-column: 1 / -1; width: 100%; max-width: 960px; justify-self: center; }
.entry-content > .alignfull { grid-column: 1 / -1; width: 100%; max-width: none; }
.entry-content > .alignleft { float: left; margin: 6px 24px 16px 0; max-width: min(360px, 100%); }
.entry-content > .alignright { float: right; margin: 6px 0 16px 24px; max-width: min(360px, 100%); }

.entry-content > * + * { margin-top: 26px; }

.entry-content h2 {
  font-family: 'Bodoni Moda', serif;
  font-weight: 500;
  font-size: clamp(24px, 3vw, 32px);
  line-height: 1.25;
  color: #fff;
  margin-top: 52px;
}
.entry-content h3 {
  font-family: 'Bodoni Moda', serif;
  font-weight: 500;
  font-size: clamp(20px, 2.4vw, 25px);
  line-height: 1.3;
  color: #fff;
  margin-top: 40px;
}
.entry-content h4 {
  font-family: 'Jost', sans-serif;
  font-weight: 600;
  font-size: 17px;
  letter-spacing: .04em;
  color: #fff;
  margin-top: 32px;
}
.entry-content > h2:first-child,
.entry-content > h3:first-child { margin-top: 0; }

.entry-content p { margin: 0; overflow-wrap: break-word; }
.entry-content a { color: #e8455f; text-decoration: underline; text-decoration-color: rgba(232,69,95,.4); text-underline-offset: 3px; overflow-wrap: break-word; }
.entry-content a:hover { color: #f2748a; }

.entry-content ul,
.entry-content ol { padding-left: 1.3em; }
.entry-content li + li { margin-top: 8px; }
.entry-content ul { list-style: disc; }
.entry-content ul ul { list-style: circle; }
.entry-content ol { list-style: decimal; }

.entry-content blockquote,
.entry-content .wp-block-quote {
  border-left: 3px solid #a81c33;
  padding: 4px 0 4px 22px;
  margin-left: 0;
  font-style: italic;
  color: #f3ede3;
  font-size: 1.1em;
}
.entry-content .wp-block-quote cite,
.entry-content blockquote cite {
  display: block;
  margin-top: 10px;
  font-style: normal;
  font-size: 13px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #8d949a;
}
.entry-content .wp-block-pullquote blockquote {
  border-left: none;
  padding-left: 0;
  text-align: center;
  font-family: 'Bodoni Moda', serif;
  font-size: clamp(22px, 3vw, 30px);
}

.entry-content img { max-width: 100%; height: auto; display: block; }
.entry-content .wp-block-image img,
.entry-content .wp-block-gallery img { border: 1px solid rgba(217,221,224,.14); }
.entry-content figure { margin: 0; }
.entry-content figcaption {
  margin-top: 10px;
  font-size: 13px;
  color: #8d949a;
  text-align: center;
}

.entry-content .wp-block-gallery { gap: 8px; }

.entry-content .wp-block-columns { display: flex; gap: 32px; flex-wrap: wrap; }
.entry-content .wp-block-column { flex: 1 1 240px; min-width: 0; }

.entry-content .wp-block-cover {
  min-height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px 24px;
}

.entry-content .wp-block-embed,
.entry-content .wp-block-embed__wrapper { position: relative; max-width: 100%; }
.entry-content .wp-block-embed iframe { max-width: 100%; }

.entry-content table,
.entry-content .wp-block-table table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
}
.entry-content .wp-block-table { overflow-x: auto; }
.entry-content th,
.entry-content td {
  padding: 10px 14px;
  border-bottom: 1px solid rgba(217,221,224,.15);
  text-align: left;
}
.entry-content th { color: #fff; font-weight: 600; border-bottom-width: 2px; }
/* Zabezpieczenie dla „gołej” tabeli wklejonej poza blokiem Table (np. blok Custom HTML). */
.entry-content > table { display: block; overflow-x: auto; }

.entry-content code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .9em;
  background: #0d0a0c;
  border: 1px solid rgba(217,221,224,.18);
  padding: 2px 6px;
}
.entry-content pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 14px;
  line-height: 1.6;
  background: #0d0a0c;
  border: 1px solid rgba(217,221,224,.18);
  padding: 18px 20px;
  overflow-x: auto;
  max-width: 100%;
}
.entry-content pre code { background: none; border: none; padding: 0; }

.entry-content hr,
.entry-content .wp-block-separator {
  border: none;
  border-top: 1px solid rgba(217,221,224,.2);
  margin: 48px auto;
  width: 100%;
  max-width: 140px;
}
.entry-content .wp-block-separator.is-style-wide { max-width: 100%; }
.entry-content .wp-block-separator.is-style-dots { border: none; text-align: center; max-width: none; color: #a81c33; font-size: 20px; letter-spacing: .4em; }
.entry-content .wp-block-separator.is-style-dots::before { content: "···"; }

.entry-content .wp-block-button__link,
.entry-content .wp-block-file__button {
  display: inline-block;
  padding: 14px 30px;
  background: #a81c33;
  border: 1px solid #a81c33;
  color: #fff;
  font-family: 'Jost', sans-serif;
  font-size: 13px;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-weight: 500;
  text-decoration: none;
  transition: background .2s ease, border-color .2s ease;
}
.entry-content .wp-block-button__link:hover { background: #c0233d; border-color: #c0233d; color: #fff; }
.entry-content .wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  border: 1px solid #d9dde0;
  color: #f3ede3;
}
.entry-content .wp-block-button.is-style-outline .wp-block-button__link:hover { background: rgba(243,237,227,.1); }
.entry-content .wp-block-buttons { display: flex; gap: 16px; flex-wrap: wrap; }

.entry-content mark { background: rgba(168,28,51,.35); color: #fff; padding: 0 3px; }

.page-links { margin-top: 40px; font-size: 13px; color: #8d949a; }
.page-links span { display: inline-block; margin: 0 6px 6px 0; padding: 6px 12px; border: 1px solid rgba(217,221,224,.2); }
.page-links a { color: #d9dde0; }

@media (max-width: 600px) {
  .entry-content { font-size: 16px; }
}

/* ---------- Komentarze ---------- */

.comment-list .comment { border: 1px solid rgba(217,221,224,.15); background: #211820; padding: 20px 22px; }
.comment-list .children { list-style: none; margin: 20px 0 0; padding-left: clamp(16px, 4vw, 40px); display: grid; gap: 20px; }
.comment-author { display: flex; align-items: center; gap: 12px; font-size: 14px; }
.comment-author .avatar { border-radius: 0; display: block; }
.archive-header-avatar { border: 2px solid #a81c33; border-radius: 0; display: block; }
.comment-author .fn { font-style: normal; font-weight: 500; color: #fff; }
.comment-metadata { font-size: 12px; color: #8d949a; margin-top: 2px; }
.comment-metadata a { color: #8d949a; }
.comment-content { margin-top: 12px; color: #d9dde0; line-height: 1.65; }
.comment-content p + p { margin-top: 12px; }
.comment-reply-link {
  display: inline-block;
  margin-top: 12px;
  font-size: 11.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #a81c33;
}
.comment-awaiting-moderation { display: block; margin-top: 10px; font-size: 12.5px; color: #8d949a; font-style: italic; }

.comment-form label { display: block; font-size: 12.5px; letter-spacing: .14em; text-transform: uppercase; color: #a89fa6; margin-bottom: 6px; }
.comment-form p { margin: 0 0 18px; }
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
  width: 100%;
  padding: 12px 14px;
  background: #161014;
  border: 1px solid rgba(217,221,224,.24);
  color: #f3ede3;
  font-family: 'Jost', sans-serif;
  font-size: 16px;
  font-weight: 300;
  box-sizing: border-box;
}
.comment-form textarea { resize: vertical; }
.comment-form input:focus,
.comment-form textarea:focus { outline: none; border-color: #a81c33; }
.comment-form .comment-form-cookies-consent { display: flex; align-items: center; gap: 8px; }
.comment-form .comment-form-cookies-consent label { margin: 0; text-transform: none; letter-spacing: normal; font-size: 13.5px; }