/* SM Blog — оформление статей (тип Equinox: смещённая колонка, крупная типографика) */

body.smb { --smb-ink: #111; --smb-mut: #777; --smb-line: #e6e6e6; --smb-max: 1200px; }

/* прячем дефолтный заголовок темы hello-elementor (рисуем свой hero) */
body.smb .site-main > .page-header { display: none; }

body.smb .site-main {
  max-width: var(--smb-max);
  margin: 0 auto;
  padding: 40px 24px 80px;
  font-family: 'Onest', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: var(--smb-ink);
}

/* ── прогресс-бар чтения ── */
.smb-progress {
  position: fixed; top: 0; left: 0; height: 3px; width: 0;
  background: var(--smb-ink); z-index: 9999; transition: width .08s linear;
}

/* ── hero ── */
.smb-kicker {
  font-size: 12px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--smb-mut); margin-bottom: 16px;
}
.smb-title {
  font-size: clamp(34px, 5.4vw, 64px);
  line-height: 1.04; font-weight: 700; text-transform: uppercase;
  letter-spacing: -.01em; margin: 0 0 18px; max-width: 17ch;
}
.smb-meta { font-size: 14px; color: var(--smb-mut); margin-bottom: 32px; }
.smb-cover { margin: 0 0 56px; }
.smb-cover img {
  width: 100%; height: auto; max-height: 68vh; object-fit: cover;
  border-radius: 20px; display: block;
}

/* ── layout: рельса слева + текст ── */
.smb-layout {
  display: grid; grid-template-columns: 260px minmax(0, 680px);
  gap: 64px; justify-content: start;
}
.smb-rail-inner { position: sticky; top: 96px; }

.smb-author-label, .smb-share-label {
  font-size: 11px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--smb-mut); margin: 0 0 12px;
}
.smb-share-label { margin-top: 32px; }
.smb-author { display: flex; align-items: center; gap: 14px; }
.smb-ava {
  width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex: none;
}
.smb-ava-fallback {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--smb-ink); color: #fff; font-weight: 600; font-size: 18px;
}
.smb-author-meta { display: flex; flex-direction: column; gap: 2px; }
.smb-author-name { font-weight: 600; font-size: 16px; }
.smb-author-role { font-size: 13px; color: var(--smb-mut); }

.smb-share { display: flex; gap: 10px; }
.smb-sh {
  width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid var(--smb-line); background: #fff; color: var(--smb-ink);
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; transition: background .15s, color .15s; text-decoration: none;
  padding: 0;
}
.smb-sh:hover { background: var(--smb-ink); color: #fff; }
.smb-sh svg { width: 18px; height: 18px; }

/* тема сайта агрессивно стилизует <button> (padding 30px, radius 5px) — прибиваем наши кнопки */
body.smb button.smb-sh {
  width: 40px !important; height: 40px !important; min-width: 0 !important; min-height: 0 !important;
  padding: 0 !important; border-radius: 50% !important;
  background: #fff !important; border: 1px solid var(--smb-line) !important;
  color: var(--smb-ink) !important; box-shadow: none !important; line-height: 1 !important;
}
body.smb button.smb-sh:hover { background: var(--smb-ink) !important; color: #fff !important; }
body.smb button.smb-like {
  width: auto !important; min-width: 0 !important; min-height: 0 !important;
  padding: 10px 20px !important; border-radius: 999px !important;
  background: #fff !important; border: 1px solid var(--smb-line) !important;
  color: var(--smb-ink) !important; box-shadow: none !important;
  display: inline-flex !important; align-items: center !important; gap: 10px !important;
}
body.smb button.smb-like.is-on { border-color: #e0245e !important; color: #e0245e !important; }

/* ── типографика статьи ── */
.smb-body { font-size: 18px; line-height: 1.75; }
.smb-body > p:first-child { font-size: 21px; line-height: 1.6; color: #333; }
.smb-body p { margin: 0 0 1.4em; }
.smb-body h2 {
  font-size: clamp(24px, 3vw, 32px); line-height: 1.2; font-weight: 700;
  margin: 2em 0 .8em; letter-spacing: -.01em;
}
.smb-body h3 { font-size: 21px; font-weight: 600; margin: 1.6em 0 .6em; }
.smb-body ul, .smb-body ol { margin: 0 0 1.4em; padding-left: 1.2em; }
.smb-body li { margin-bottom: .5em; }
.smb-body a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.smb-body a:hover { opacity: .65; }
.smb-body img { max-width: 100%; height: auto; border-radius: 16px; margin: 8px 0 16px; }
.smb-body em { color: var(--smb-mut); }
.smb-body blockquote {
  border-left: 3px solid var(--smb-ink); margin: 2em 0; padding: .2em 0 .2em 1.2em;
  font-size: 20px; line-height: 1.6;
}

/* ── лайк ── */
.smb-like-wrap {
  margin-top: 64px; padding-top: 32px; border-top: 1px solid var(--smb-line);
  display: flex; align-items: center; gap: 16px;
}
.smb-like {
  display: inline-flex; align-items: center; gap: 10px;
  border: 1px solid var(--smb-line); background: #fff; color: var(--smb-ink);
  border-radius: 999px; padding: 10px 20px; font-size: 16px; cursor: pointer;
  transition: transform .12s, border-color .15s;
}
.smb-like:active { transform: scale(.94); }
.smb-like svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; transition: fill .15s; }
.smb-like.is-on { border-color: #e0245e; color: #e0245e; }
.smb-like.is-on svg { fill: #e0245e; stroke: #e0245e; }
.smb-like-count { font-weight: 600; min-width: 1.5ch; }
.smb-like-hint { font-size: 14px; color: var(--smb-mut); }

/* ── тост «скопировано» ── */
.smb-toast {
  position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%) translateY(20px);
  background: var(--smb-ink); color: #fff; font-size: 14px;
  padding: 10px 18px; border-radius: 999px; opacity: 0; pointer-events: none;
  transition: opacity .2s, transform .2s; z-index: 9999;
  font-family: 'Onest', -apple-system, sans-serif;
}
.smb-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ── лента блога (архив рубрики) ── */
body.smb-arc .site-main {
  max-width: 1200px; margin: 0 auto; padding: 40px 24px 80px;
  font-family: 'Onest', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: #111;
}
body.smb-arc .site-main > .page-header { display: none; }
.smb-arc-hero { margin-bottom: 48px; grid-column: 1 / -1; } /* hero печатается внутрь grid .page-content — растягиваем на все колонки */
.smb-arc-hero .smb-kicker {
  font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: #777; margin-bottom: 14px;
}
.smb-arc-title {
  font-size: clamp(40px, 6vw, 72px); line-height: 1; font-weight: 700;
  text-transform: uppercase; letter-spacing: -.01em; margin: 0 0 14px;
}
.smb-arc-sub { font-size: 17px; color: #777; margin: 0; max-width: 46ch; }

body.smb-arc .page-content {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 32px;
}
body.smb-arc article.post {
  display: flex; flex-direction: column; margin: 0;
}
body.smb-arc article.post > a { order: 1; display: block; margin-bottom: 18px; }
body.smb-arc article.post .wp-post-image {
  width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 16px; display: block;
  height: auto; transition: opacity .15s;
}
body.smb-arc article.post > a:hover .wp-post-image { opacity: .88; }
body.smb-arc article.post .entry-title {
  order: 2; font-size: 21px; line-height: 1.3; font-weight: 700; margin: 0 0 10px; letter-spacing: -.01em;
}
body.smb-arc article.post .entry-title a { color: #111; text-decoration: none; }
body.smb-arc article.post .entry-title a:hover { opacity: .65; }
body.smb-arc article.post p { order: 3; font-size: 15px; line-height: 1.6; color: #777; margin: 0; }
body.smb-arc .navigation, body.smb-arc .pagination { grid-column: 1 / -1; margin-top: 24px; }

/* первая (свежая) статья — большая карта на всю ширину: картинка слева, текст справа */
body.smb-arc article.post:first-of-type {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  grid-template-areas: "img title" "img desc";
  gap: 12px 56px;
  align-content: center;
  margin-bottom: 24px;
}
body.smb-arc article.post:first-of-type > a { grid-area: img; margin: 0; }
body.smb-arc article.post:first-of-type .wp-post-image { aspect-ratio: 16 / 10; border-radius: 20px; }
body.smb-arc article.post:first-of-type .entry-title {
  grid-area: title; align-self: end; margin: 0;
  font-size: clamp(26px, 2.8vw, 42px); line-height: 1.12; letter-spacing: -.015em;
}
body.smb-arc article.post:first-of-type p { grid-area: desc; align-self: start; font-size: 16px; }

@media (max-width: 1000px) { body.smb-arc .page-content { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { body.smb-arc .page-content { grid-template-columns: 1fr; gap: 36px; } }
@media (max-width: 900px) {
  /* на мобиле featured-карта = обычная карточка (сбрасываем grid-раскладку, иначе grid-области дают пустоты) */
  body.smb-arc article.post:first-of-type {
    display: flex; flex-direction: column; gap: 0; margin-bottom: 0;
    grid-column: auto; grid-template-columns: none; grid-template-areas: none; align-content: normal;
  }
  body.smb-arc article.post:first-of-type > a { grid-area: auto; margin: 0 0 18px; }
  body.smb-arc article.post:first-of-type .entry-title { grid-area: auto; font-size: 24px; margin: 0 0 10px; }
  body.smb-arc article.post:first-of-type p { grid-area: auto; }
  body.smb-arc article.post:first-of-type .wp-post-image { aspect-ratio: 3 / 2; }
}

/* ── мобильная ── */
@media (max-width: 900px) {
  .smb-layout { grid-template-columns: 1fr; gap: 32px; }
  .smb-rail-inner { position: static; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; padding-bottom: 8px; border-bottom: 1px solid var(--smb-line); }
  .smb-author-label { display: none; }
  .smb-share-label { display: none; }
  .smb-share { margin-left: auto; }
  .smb-cover { margin-bottom: 32px; }
  .smb-cover img { border-radius: 14px; }
  .smb-body { font-size: 17px; }
  .smb-like-hint { font-size: 13px; }
}

/* ── Блок подписки (в статье) ── */
.smb-sub {
  margin: 56px 0 0; padding: 32px; border-radius: 20px;
  background: #f6f6f4; border: 1px solid var(--smb-line, #e6e6e6);
  font-family: 'Onest', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.smb-sub-k { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: #777; margin-bottom: 10px; }
.smb-sub-t { font-size: 24px; line-height: 1.15; font-weight: 700; margin: 0 0 8px; color: #111; letter-spacing: -.01em; }
.smb-sub-d { font-size: 15px; line-height: 1.55; color: #666; margin: 0 0 18px; }
.smb-sub-form { display: flex; gap: 10px; flex-wrap: wrap; }
.smb-sub-in {
  flex: 1; min-width: 200px; height: 48px; padding: 0 16px; font-size: 15px;
  border: 1px solid #d9d9d5; border-radius: 999px; background: #fff; color: #111; font-family: inherit;
}
.smb-sub-in:focus { outline: none; border-color: #111; }
.smb-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
/* кнопки — !important, чтобы перебить агрессивный button{} темы (padding 30px/radius 5px) */
.smb-sub-btn, .smb-survey .smb-sv-btn {
  height: 48px !important; padding: 0 28px !important; min-width: 0 !important; min-height: 0 !important;
  border-radius: 999px !important; border: 1px solid #111 !important;
  background: #111 !important; color: #fff !important; font-size: 15px !important; font-weight: 600 !important;
  font-family: inherit !important; cursor: pointer !important; box-shadow: none !important; line-height: 1 !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
}
.smb-sub-btn:hover, .smb-survey .smb-sv-btn:hover { opacity: .85; }
.smb-sub-msg, .smb-sv-msg { margin-top: 12px; font-size: 14px; color: #2e9e6b; min-height: 18px; }
.smb-sub-msg.err, .smb-sv-msg.err { color: #d33; }
.smb-sub-consent { margin: 10px 0 0; font-size: 12px; line-height: 1.5; color: #999; }
.smb-sub-consent a { color: #777; text-decoration: underline; text-underline-offset: 2px; }

/* ── Опрос читателей (страница с шорткодом [sm_survey]) ── */
.smb-survey {
  max-width: 680px; margin: 0 auto; padding: 8px 0 40px;
  font-family: 'Onest', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; color: #111;
}
.smb-survey .smb-kicker { font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: #777; margin-bottom: 14px; }
.smb-sv-title { font-size: clamp(28px, 4.4vw, 44px); line-height: 1.06; font-weight: 700; letter-spacing: -.015em; margin: 0 0 12px; text-transform: uppercase; }
.smb-sv-lead { font-size: 18px; line-height: 1.6; color: #444; margin: 0 0 36px; }
.smb-sv-q { margin: 0 0 28px; padding: 0 0 28px; border-bottom: 1px solid #ececec; }
.smb-sv-q:last-of-type { border-bottom: none; }
.smb-sv-qt { font-size: 18px; font-weight: 600; margin: 0 0 14px; }
.smb-sv-qt span { display: inline-block; font-size: 13px; font-weight: 400; color: #999; margin-left: 6px; }
.smb-sv-opts { display: flex; flex-direction: column; gap: 10px; }
.smb-sv-opt {
  display: flex; align-items: center; gap: 12px; padding: 12px 16px;
  border: 1px solid #e6e6e6; border-radius: 12px; cursor: pointer; font-size: 15px; transition: border-color .15s, background .15s;
}
.smb-sv-opt:hover { border-color: #bbb; }
.smb-sv-opt input { width: 18px; height: 18px; accent-color: #111; flex: none; margin: 0; }
.smb-sv-opt input:checked + span { font-weight: 600; }
.smb-sv-ta {
  width: 100%; padding: 14px 16px; font-size: 15px; font-family: inherit; color: #111;
  border: 1px solid #d9d9d5; border-radius: 12px; background: #fff; resize: vertical;
}
.smb-sv-ta:focus, .smb-survey .smb-sub-in:focus { outline: none; border-color: #111; }
.smb-survey .smb-sub-in { width: 100%; }
.smb-sv-btn { margin-top: 8px; }
@media (max-width: 640px) {
  .smb-sub { padding: 24px; }
  .smb-sub-btn { width: 100%; }
}