/* Блогът на двата сайта: списъкът (/blog/, рубриките), картите и самата
 * статия. Херото, бутоните и кутията с призива са от stranici.css, менюто
 * от menu.css и navigacia.css, подвалът от podval.css. Цветовете са тези на
 * сайта: крем #F8F4ED и #ECDFCC, злато #B8934F и #8A6B3F, текст #262320.
 * Маркъпът се сглобява в inc/blog.php и в шаблоните на децата.
 */

/* ── Пътеката: Начало / Блог / статия ── */
.bl-pateka { position: relative; }
.bl-pateka ol {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.2rem 0;
  margin: 0; padding: 0; list-style: none;
  font-size: 0.84rem; line-height: 1.5; color: rgba(38,35,32,0.66);
}
.bl-pateka li { display: inline-flex; align-items: baseline; min-width: 0; }
.bl-pateka li + li::before { content: "/"; margin: 0 0.6rem; color: #B8934F; }
.bl-pateka a { color: #8A6B3F; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(184,147,79,0.45); }
.bl-pateka a:hover { text-decoration-color: #8A6B3F; }
.bl-pateka [aria-current] {
  max-width: 28rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: rgba(38,35,32,0.8);
}

/* ── Херото на статията: по-ниско, заглавието е по-дълго от това на страница ── */
.bl-glava { padding-top: clamp(2.2rem, 6vh, 3.6rem); padding-bottom: clamp(2.4rem, 6vh, 3.8rem); }
.bl-glava .dd-hero-vatre { max-width: 52rem; }
.bl-glava h1 { font-size: clamp(2.3rem, min(4.6vw, 8vh), 3.3rem); }
.bl-glava .bl-otkas { max-width: 42rem; font-size: 1.1rem; }

/* рубрика, дата, минути, автор: един ред, разделени с тънка точка */
.bl-meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.3rem 0;
  font-size: 0.86rem; line-height: 1.5; color: rgba(38,35,32,0.7);
}
.bl-meta > * + *::before {
  content: ""; display: inline-block; width: 4px; height: 4px; margin: 0 0.75rem 0.2em;
  border-radius: 50%; background: #B8934F; vertical-align: middle;
}
.bl-rubrika { font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: #8A6B3F; }
a.bl-rubrika:hover { color: #3B2C21; }

/* ── Главната снимка ── */
.bl-glavna-snimka {
  margin: clamp(2rem, 5vh, 3rem) auto 0; max-width: 1060px;
}
.bl-glavna-snimka img {
  display: block; width: 100%; height: auto; max-height: 38rem; object-fit: cover;
  border-radius: 5px; background: #DCCBB4; box-shadow: 0 20px 48px rgba(160,140,125,0.3);
}
.bl-glavna-snimka figcaption { margin-top: 0.7rem; font-size: 0.84rem; color: rgba(38,35,32,0.66); }

/* ── Тялото: съдържанието вляво, текстът до него ── */
.bl-telo {
  display: grid; grid-template-columns: minmax(0, 15rem) minmax(0, 40rem);
  justify-content: center; gap: clamp(2rem, 5vw, 4.5rem);
  margin-top: clamp(2.4rem, 6vh, 3.6rem);
}
.bl-telo--bez { grid-template-columns: minmax(0, 40rem); }
.bl-telo > aside { min-width: 0; }
.bl-sadarzhanie { position: sticky; top: 6.5rem; }
.bl-sadarzhanie details { border-top: 2px solid #B8934F; padding-top: 0.9rem; }
.bl-sadarzhanie summary {
  list-style: none; cursor: pointer;
  font-size: 0.8rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: #8A6B3F;
}
.bl-sadarzhanie summary::-webkit-details-marker { display: none; }
.bl-sadarzhanie ol { margin: 0.9rem 0 0; padding: 0; list-style: none; counter-reset: bl-s; }
.bl-sadarzhanie li { counter-increment: bl-s; }
.bl-sadarzhanie a {
  display: grid; grid-template-columns: 1.7rem minmax(0, 1fr); padding: 0.45rem 0;
  font-size: 0.9rem; line-height: 1.45; color: #3B2C21; border-bottom: 1px solid rgba(184,147,79,0.22);
}
.bl-sadarzhanie a::before {
  content: counter(bl-s, decimal-leading-zero); font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1rem; font-weight: 600; color: #B8934F;
}
.bl-sadarzhanie a:hover { color: #8A6B3F; }
@media (max-width: 1000px) {
  .bl-telo { grid-template-columns: minmax(0, 40rem); }
  .bl-sadarzhanie { position: static; }
  .bl-sadarzhanie details { padding: 1rem 1.2rem; background: #FFFFFF; border-radius: 5px; }
  .bl-sadarzhanie summary { display: flex; align-items: center; justify-content: space-between; }
  .bl-sadarzhanie summary::after {
    content: ""; width: 8px; height: 8px; border-right: 1.5px solid #B8934F; border-bottom: 1.5px solid #B8934F;
    transform: translateY(-2px) rotate(45deg); transition: transform 0.3s ease;
  }
  .bl-sadarzhanie details[open] summary::after { transform: translateY(2px) rotate(225deg); }
}

/* ── Текстът на статията ── */
.bl-tekst { font-size: 1.04rem; line-height: 1.8; color: #262320; overflow-wrap: break-word; }
.bl-tekst > * + * { margin-top: 1.15em; }
.bl-tekst h2, .bl-tekst h3, .bl-tekst h4 { scroll-margin-top: 6.5rem; }
.bl-tekst h2 {
  margin-top: 2.2em; font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 500;
  font-size: clamp(1.8rem, 3vw, 2.25rem); line-height: 1.15; letter-spacing: -0.015em; color: #262320;
}
.bl-tekst h3 { margin-top: 1.8em; font-size: 1.14rem; font-weight: 700; line-height: 1.35; color: #3B2C21; }
.bl-tekst h4 { margin-top: 1.6em; font-size: 1rem; font-weight: 700; color: #3B2C21; }
.bl-tekst h2 + *, .bl-tekst h3 + *, .bl-tekst h4 + * { margin-top: 0.6em; }
.bl-tekst > :first-child { margin-top: 0; }
.bl-tekst a {
  color: #8A6B3F; text-decoration: underline; text-underline-offset: 3px;
  text-decoration-color: rgba(184,147,79,0.55); transition: text-decoration-color 0.2s ease;
}
.bl-tekst a:hover { text-decoration-color: #8A6B3F; }
.bl-tekst strong, .bl-tekst b { font-weight: 700; color: #1F1B18; }
.bl-tekst ul, .bl-tekst ol { padding-left: 1.3em; }
.bl-tekst li + li { margin-top: 0.45em; }
.bl-tekst ul li::marker { color: #B8934F; }
.bl-tekst ol li::marker { color: #8A6B3F; font-weight: 700; }
.bl-tekst blockquote {
  margin-left: 0; margin-right: 0; padding: 1.2rem 1.5rem;
  background: #FFFFFF; border-left: 3px solid #B8934F; border-radius: 0 5px 5px 0;
  font-family: 'Cormorant Garamond', Georgia, serif; font-size: 1.45rem; font-style: italic; line-height: 1.45; color: #3B2C21;
}
.bl-tekst blockquote p { margin: 0; }
.bl-tekst blockquote cite { display: block; margin-top: 0.6rem; font-family: 'Manrope', sans-serif; font-size: 0.84rem; font-style: normal; color: rgba(38,35,32,0.66); }
.bl-tekst img, .bl-tekst video, .bl-tekst iframe { display: block; max-width: 100%; height: auto; border-radius: 5px; }
.bl-tekst figure { margin-left: 0; margin-right: 0; }
.bl-tekst figcaption, .bl-tekst .wp-element-caption { margin-top: 0.6rem; font-size: 0.84rem; line-height: 1.5; color: rgba(38,35,32,0.66); }
.bl-tekst .aligncenter { margin-left: auto; margin-right: auto; }
.bl-tekst hr { border: 0; height: 1px; background: rgba(184,147,79,0.45); margin: 2.4em 0; }
.bl-tekst .wp-block-table { overflow-x: auto; }
.bl-tekst table { width: 100%; border-collapse: collapse; font-size: 0.94rem; line-height: 1.5; }
.bl-tekst th, .bl-tekst td { padding: 0.65rem 0.8rem; border-bottom: 1px solid rgba(184,147,79,0.3); text-align: left; vertical-align: top; }
.bl-tekst th { background: #ECDFCC; font-weight: 700; color: #3B2C21; }
.bl-tekst .wp-block-embed iframe { width: 100%; aspect-ratio: 16 / 9; }

/* ── Автор под текста ── */
.bl-avtor {
  display: flex; align-items: center; gap: 0.9rem; margin-top: 2.6rem; padding-top: 1.4rem;
  border-top: 1px solid rgba(184,147,79,0.45); font-size: 0.92rem; line-height: 1.5; color: rgba(38,35,32,0.78);
}
.bl-avtor b { display: block; font-family: 'Cormorant Garamond', Georgia, serif; font-size: 1.3rem; font-weight: 600; color: #262320; }
.bl-avtor a { color: #8A6B3F; text-decoration: underline; text-underline-offset: 3px; }

/* ── Предишна и следваща ── */
.bl-sasedi {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem;
  max-width: 1060px; margin: clamp(2.6rem, 7vh, 4rem) auto 0;
}
.bl-sased {
  display: flex; flex-direction: column; gap: 0.35rem; padding: 1.2rem 1.4rem;
  background: #FFFFFF; border-top: 2px solid #B8934F; border-radius: 5px; color: #262320;
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.bl-sased--sl { text-align: right; grid-column: 2; }
.bl-sased span { font-size: 0.78rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: #8A6B3F; }
.bl-sased b { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 1.35rem; font-weight: 500; line-height: 1.25; }
.bl-sased:hover { box-shadow: 0 14px 30px rgba(138,107,63,0.18); transform: translateY(-2px); }
@media (max-width: 700px) {
  .bl-sasedi { grid-template-columns: minmax(0, 1fr); }
  .bl-sased--sl { grid-column: 1; }
}

/* ── Решетката с карти ── */
.bl-sekcia { margin-top: clamp(2.6rem, 7vh, 4.4rem); }
.bl-sekcia > .dd-h2 { margin-bottom: clamp(1.4rem, 3vh, 2rem); }
.bl-belezhka { margin-bottom: 1.4rem; font-size: 0.98rem; color: rgba(38,35,32,0.74); }
.bl-mreja {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr));
  gap: clamp(1.2rem, 2.4vw, 1.8rem);
}
.bl-karta {
  position: relative; display: flex; flex-direction: column; overflow: hidden;
  background: #FFFFFF; border-radius: 5px; box-shadow: 0 1px 0 rgba(184,147,79,0.35);
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.bl-karta:hover, .bl-karta:focus-within { box-shadow: 0 18px 40px rgba(138,107,63,0.2); transform: translateY(-3px); }
.bl-karta-snimka { aspect-ratio: 16 / 10; overflow: hidden; background: #DCCBB4; }
.bl-karta-snimka img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.bl-karta:hover .bl-karta-snimka img { transform: scale(1.04); }
.bl-karta-bez {
  display: block; width: 100%; height: 100%;
  background:
    linear-gradient(128deg, rgba(184,147,79,0.42), transparent 45%, transparent 60%, rgba(184,147,79,0.36)),
    #ECDFCC;
}
.bl-karta-tekst { display: flex; flex-direction: column; flex: 1; gap: 0.7rem; padding: 1.3rem 1.4rem 1.5rem; }
.bl-karta .bl-meta { font-size: 0.78rem; }
.bl-karta-zaglavie {
  margin: 0; font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 500;
  font-size: 1.6rem; line-height: 1.18; letter-spacing: -0.01em;
}
.bl-karta-zaglavie a { color: #262320; }
/* цялата карта е връзката на заглавието, без вложени <a> */
.bl-karta-zaglavie a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.bl-karta-zaglavie a:focus-visible { outline: none; }
.bl-karta:focus-within { outline: 2px solid #B8934F; outline-offset: 3px; }
.bl-karta:hover .bl-karta-zaglavie a { color: #8A6B3F; }
.bl-karta-otkas { font-size: 0.94rem; line-height: 1.6; color: rgba(38,35,32,0.76); }
.bl-karta-oshte {
  margin-top: auto; padding-top: 0.4rem; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.12em;
  text-transform: uppercase; color: #8A6B3F;
}
.bl-karta-oshte::after { content: " \2192"; }

/* ── Страниците на списъка ── */
.bl-stranici {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 0.5rem;
  margin-top: clamp(2.2rem, 5vh, 3rem);
}
.bl-stranici .page-numbers {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem;
  min-width: 2.6rem; height: 2.6rem; padding: 0 0.8rem; border-radius: 5px;
  background: #FFFFFF; border: 1px solid rgba(184,147,79,0.5); color: #3B2C21;
  font-size: 0.9rem; font-weight: 600;
}
.bl-stranici a.page-numbers:hover { background: #ECDFCC; color: #262320; }
.bl-stranici .page-numbers.current {
  background: linear-gradient(135deg, #E4C98F 0%, #B8934F 52%, #8A6B3F 100%); border-color: transparent; color: #241A12;
}
.bl-stranici .page-numbers.dots { background: none; border: 0; min-width: 0; }

/* ── Призивът накрая: .dd-kutiq, с малко повече въздух над нея ── */
.bl-prizov { margin-top: clamp(2.6rem, 7vh, 4rem); }
/* под статията призивът е широк колкото главната снимка */
.bl-po-statia .bl-prizov { max-width: 1060px; margin-left: auto; margin-right: auto; }

@media (max-width: 760px) {
  /* на телефон заглавието е точно отдолу: пътеката спира до „Блог“ */
  .bl-pateka li:last-child:not(:first-child) { display: none; }
  .bl-karta-zaglavie { font-size: 1.45rem; }
  .bl-tekst { font-size: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .bl-karta, .bl-karta-snimka img, .bl-sased { transition: none; }
  .bl-karta:hover, .bl-sased:hover { transform: none; }
  .bl-karta:hover .bl-karta-snimka img { transform: none; }
}