/* =====================================================================
   ro3a.ru — theme.css «Ботанический альбом»
   Этап 1 FRONT-ROADMAP (docs/FRONT-ROADMAP.md). Подключается ПОСЛЕДНИМ,
   перекрывает XERO (style.css/skins/orange.css/responsive.css) только
   цветом, шрифтами, тенями и радиусами. Layout не трогает.
   Канон палитры: archive/ro3a-cms/public/templates/header.php.
   При изменении файла: front/bump-version.sh <старая-v> <новая-v>
   ===================================================================== */

/* ---- Шрифты: Cormorant Garamond (заголовки), Lora (текст статей) ----
   Файлы — объединённые подмножества cyrillic+latin (google-webfonts-helper). */
@font-face {
  font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('../fonts/cormorant-garamond-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 600; font-display: swap;
  src: url('../fonts/cormorant-garamond-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('../fonts/cormorant-garamond-700.woff2') format('woff2');
}
@font-face {
  font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 400; font-display: swap;
  src: url('../fonts/cormorant-garamond-400italic.woff2') format('woff2');
}
@font-face {
  font-family: 'Lora'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('../fonts/lora-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Lora'; font-style: normal; font-weight: 500; font-display: swap;
  src: url('../fonts/lora-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Lora'; font-style: normal; font-weight: 600; font-display: swap;
  src: url('../fonts/lora-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Lora'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('../fonts/lora-700.woff2') format('woff2');
}
@font-face {
  font-family: 'Lora'; font-style: italic; font-weight: 400; font-display: swap;
  src: url('../fonts/lora-400italic.woff2') format('woff2');
}

/* ---- Токены «Ботанический альбом» ---- */
:root {
  --paper: #FDF8F0;
  --parchment: #FAF3E8;
  --card: #FDFAF5;
  --ink: #1A1A1A;
  --pencil: #3D3D3D;
  --forest: #1B3A1B;
  --forest-soft: #2C5530;
  --sage: #A8B89C;
  --sage-deep: #3E5C20;
  --petal: #E8C4B8;
  --rose-clay: #8B2E2E;
  --rose-hover: #6B1E1E;
  --terra: #8B4033;
  --terra-hover: #6B2E23;
  --stroke: #8B7355;
  --line: #D4C5B0;
  --meta: #5C4A3A;
  --btn: #B5675A;
  --btn-hover: #9B5548;
  --btn-text: #FDF8F0;
  --radius: 12px;
  --shadow-soft: 0 4px 20px rgba(61, 43, 31, 0.08);
  --shadow-lift: 0 12px 32px rgba(139, 115, 85, 0.18);
  --font-head: 'Cormorant Garamond', Georgia, serif;
  --font-article: 'Lora', Georgia, serif;
  /* --meta, --petal, --rose-hover, --stroke, --font-ui — канон палитры, задел под Этап 2 */
  --font-ui: 'PT Sans', 'Helvetica Neue', Arial, sans-serif;
}

/* ---- Типографика: заголовки Lora 700, текст статей/инфостраниц Lora ----
   .widget_title сознательно НЕ здесь: сайдбар — UI, у v69 для него свой
   PT Sans-стиль (responsive.css:258) (багфикс 04.11).
   ПРАВИЛО ВЛАДЕЛЬЦА (05.11): декоративный Cormorant — только жирным (700)
   и только для КРУПНЫХ заголовков (от ~28px: сейчас это только буквица;
   крупные hero-заголовки появятся в Этапе 2). На средних размерах он
   теряется даже в 700 — все текущие заголовки переведены на плотный
   Lora 700. Новый заголовок < 28px = Lora 700. */
h1, h2, h3, h4, h5, h6,
.post_title, .featured_box_title {
  font-family: var(--font-article);
  font-weight: 700;
  color: var(--forest);
}
#sgl_post .post_content, .featured_box_content {
  font-family: var(--font-article);
  color: var(--ink);
  line-height: 1.7;
}
/* ---- Выравнивание (совет 05.11, 4/4): по ширине — только на десктопе,
   с автопереносами; на мобильных — по левому краю (узкая колонка даёт
   рыхлые пробелы). Единственный вариант для всего сайта. ---- */
#sgl_post .post_content, .featured_box_content {
  text-align: left;
  hyphens: auto;
  -webkit-hyphens: auto;
}
@media (min-width: 1024px) {
  #sgl_post .post_content, .featured_box_content { text-align: justify; }
}

/* ---- Списки: единые буллиты по всему сайту (владелец 05.11: где-то
   жёлтые картинки-маркеры легаси, где-то квадраты XERO, где-то зелёные
   счётчики). Единый круглый маркер цвета Sage-deep — в тон счётчикам
   шагов черенкования; легаси-картинки маркеров отключены. ---- */
#content .post_content ul, .featured_box_content ul, .comments .comment_content ul,
.ro-home-news-card .ro-home-news-body ul {
  list-style: none;
  list-style-image: none;
  list-style-position: outside;
  padding-left: 1.3rem;
  text-align: left;
}
#content .post_content ul > li::before, .featured_box_content ul > li::before,
.comments .comment_content ul > li::before,
.ro-home-news-card .ro-home-news-body ul > li::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--sage-deep);
  margin-right: 8px;
  vertical-align: 3px;
}
#content .post_content ol, .featured_box_content ol, .comments .comment_content ol {
  list-style: decimal outside;
  list-style-image: none;
  padding-left: 1.6rem;
  text-align: left;
}
#content .post_content ol > li::marker, .featured_box_content ol > li::marker,
.comments .comment_content ol > li::marker {
  color: var(--sage-deep);
  font-weight: 700;
}
#sgl_post .post_content a, .featured_box_content a { color: var(--rose-clay); }
#sgl_post .post_content a:hover, .featured_box_content a:hover { color: var(--terra-hover); }

/* ---- Буквица 72px — только статьи (tpl_6: #sgl_post > .post_content);
   карточка розы и поиск не имеют #sgl_post, инфостраница — featured_box.
   Первый дочерний блок (в статьях это p или div с текстом), не заголовок/
   список/цитата (статьи, начинающиеся с них, буквицы не получают). ---- */
#sgl_post > .post_content > *:first-child:not(h2):not(h3):not(h4):not(ul):not(blockquote)::first-letter {
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 4.5rem;
  line-height: 0.75;
  float: left;
  margin-right: 0.75rem;
  color: var(--forest-soft);
  text-shadow: 2px 2px 0 rgba(212, 197, 176, 0.2);
}

/* ---- Цитаты статей ---- */
#sgl_post .post_content blockquote {
  border-left: 4px solid var(--forest-soft);
  background: rgba(168, 184, 156, 0.1);
  color: var(--pencil);
}

/* ---- Новости на главной: единая типографика карточки ----
   Легаси-контент новостей разномастный (текст, залитый в h1; Arial в
   списках; Georgia в дате) — приводим всё к одному виду (багфикс 04.11). */
.comments .commentor_name {
  font-family: var(--font-article);  /* Lora: Cormorant теряется на 22px
                                        (владелец 05.11) — правило выше */
  font-weight: 700;
  font-size: 1.35rem;
  line-height: 1.3;
  color: var(--forest);
  margin-bottom: 0.6rem;
}
.comments .comment_content, .comments .comment_content p,
.comments .comment_content div, .comments .comment_content span,
.comments .comment_content li, .comments .comment_content strong,
.comments .comment_content b, .comments .comment_content em, .comments .comment_content i {
  font-family: var(--font-ui);
  font-size: 1.05rem;
  line-height: 1.65;
}
.comments .comment_content strong, .comments .comment_content b { font-weight: 700; color: var(--forest-soft); }
/* заголовки внутри легаси-контента новости (текст, залитый в h1) — демотировать */
.comments .comment_content h1, .comments .comment_content h2, .comments .comment_content h3,
.comments .comment_content h4, .comments .comment_content h5, .comments .comment_content h6 {
  font-family: var(--font-ui);
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.4;
  color: var(--forest-soft);
}
.comments .comment_content ul, .comments .comment_content ol { padding-left: 1.5rem; }
/* легаси #comments_container-правила (style.css:388 и др.) сильнее классов —
   для содержимого новости семейство фиксируем принудительно */
.comments .comment_content, .comments .comment_content * { font-family: var(--font-ui) !important; }
.comments .posted_on {
  font-family: var(--font-ui) !important;
  font-size: 0.9rem !important;
  color: var(--meta) !important;
}

/* ---- Фон страницы (цвет ссылок футера не трогаем: v70 выверил контраст
   #0e2410 на зелёной текстуре — ревью 04.11, находка 2) ---- */
body { background-color: var(--paper); }

/* ---- Пагинация ----
   Разметка XERO: страницы — <a class="large_button">, текущая — <a class="current">
   (style.css:145). Селектор ul.pagination li a перебивает скин-спрайты;
   .large_button вне пагинации сознательно не трогаем (до Этапа 2).
   Цвет скина v70 (#footer a #0e2410) не перекрываем — контраст на зелёной
   текстуре футера выверен в v70, вернёмся при перевёрстке футера. */
ul.pagination li a {
  background: var(--btn);
  color: var(--btn-text);
  border: none;
  border-radius: 999px;
  box-shadow: var(--shadow-soft);
  padding: 4px 14px;
  text-shadow: none;
}
ul.pagination li a:hover {
  background: var(--btn-hover);
  color: var(--btn-text);
}
ul.pagination li a.current {
  background: var(--forest);
  color: var(--btn-text);
}

/* ---- Бейджи ---- */
.ro-stock-in, .ro-stock-out {
  display: inline-block;
  padding: 2px 12px;
  border-radius: 999px;
  color: var(--btn-text);
  font-size: 0.85em;
}
.ro-stock-in { background: var(--sage-deep); }
.ro-stock-out { background: var(--terra); }
/* фото-бейдж: тёмно-зелёная подложка (канон v70 rgba(23,54,24,.82)) — белый
   на шалфее давал контраст 2:1 (ревью 04.11, находка 1) */
.ro-photos-badge {
  background: var(--forest-soft);
  color: var(--btn-text);
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* ---- Карточки «паспарту» ----
   Селекторы с #content — легаси стилизует через #content > .post.ro-listing
   (responsive.css:179), без префикса наша тема проигрывает каскад.
   transform на hover — осознанное исключение из layout-запрета (канон
   catalog.php: подъём карточки), layout не сдвигает. */
#content .post.ro-listing, #content .post .gallery, #content .post .post_thumb {
  background: var(--card);
}
#content .post.ro-listing {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}
#content .post.ro-listing:hover {
  box-shadow: var(--shadow-lift);
  transform: translateY(-4px);
}
#content .post.ro-listing .post_thumb img, #content .ro-listing .gallery img {
  background: var(--parchment);
  border-bottom: 1px solid var(--line);
}

/* =====================================================================
   Этап 2.1 FRONT-ROADMAP — Главная (ro-home-*)
   Hero-блок + карточки новостей. Правится только главная (шаблон 3).
   Шапка/футер/сайдбар XERO, сетка каталога и jQuery-стек не тронуты.
   Источник данных новостей не менялся (pdoResources: limit 5, parents 384).
   Классы с префиксом ro-home-* — коллизий в легаси нет (проверка 05.11).
   ===================================================================== */

/* ---- Hero: текст слева, акварель справа ---- */
.ro-home-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: clamp(1.25rem, 3vw, 2.5rem);
  align-items: center;
  background: var(--parchment);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--shadow-soft);
  padding: clamp(1.25rem, 3.5vw, 2.75rem);
  margin-bottom: 2rem;
}
.ro-home-title {
  grid-column: 1 / -1;                    /* заголовок во всю ширину hero — 2 строки вместо 3 */
  font-family: var(--font-head);
  font-weight: 700;                       /* правило владельца 05.11: Cormorant — только 700 и от ~28px */
  font-size: clamp(2rem, 4vw, 3rem);      /* 32→48px */
  line-height: 1.15;
  color: var(--forest);
  margin: 0 0 0.9rem;
}
.ro-home-greeting {
  font-family: var(--font-article);
  color: var(--pencil);
  font-size: 1.08rem;
  line-height: 1.7;
}
.ro-home-greeting h3 {
  font-family: var(--font-article);
  font-size: 1.3rem;
  color: var(--forest-soft);
  margin: 0 0 0.6rem;
}
.ro-home-greeting p { margin: 0 0 0.65rem; }
.ro-home-greeting p:last-child { margin-bottom: 0; }
/* селектор через .ro-home-hero — перебивает легаси a:link/a:visited оранжевого
   скина (0,1,1): у нас (0,2,0), иначе кнопка оранжевая (находка владельца 05.11) */
.ro-home-hero .ro-home-cta {
  display: inline-block;
  margin-top: 1rem;
  padding: 12px 30px;
  border-radius: 999px;
  background: var(--btn);
  color: var(--btn-text);
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: 1.2rem;                      /* 19.2px bold = WCAG large text: контраст 3.9:1 проходит AA 3:1 (ревью 05.11) */
  text-decoration: none;
  box-shadow: var(--shadow-soft);
  transition: background 0.2s ease, box-shadow 0.2s ease;
}
.ro-home-hero .ro-home-cta:hover {
  background: var(--btn-hover);
  color: var(--btn-text);
  box-shadow: var(--shadow-lift);
  text-decoration: none;
}
.ro-home-fig { margin: 0; }
.ro-home-fig img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--shadow-lift);
}
@media (max-width: 1023px) {
  .ro-home-hero { grid-template-columns: 1fr; }
}

/* ---- Новости: карточки-паспарту ---- */
.ro-home-news-title {
  font-family: var(--font-head);
  font-weight: 700;                       /* Cormorant 700 при ~30px — по правилу владельца */
  font-size: 1.9rem;
  line-height: 1.2;
  color: var(--forest);
  margin: 0 0 1.1rem;
}
.ro-home-news-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: 1.1rem;
}
.ro-home-news-card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
  padding: 1.05rem 1.15rem;
}
.ro-home-news-card .ro-home-news-name { margin: 0 0 0.55rem; }
.ro-home-news-card .ro-home-news-name a {
  font-family: var(--font-article);       /* Lora 700 — плотный, владелец 05.11 */
  font-weight: 700;
  font-size: 1.15rem;
  line-height: 1.35;
  color: var(--forest);
  text-decoration: none;
}
.ro-home-news-card .ro-home-news-name a:hover { color: var(--rose-clay); }
.ro-home-news-card .ro-home-news-body {
  font-family: var(--font-ui);
  font-size: 0.98rem;
  line-height: 1.6;
  color: var(--ink);
  text-align: left;
}
.ro-home-news-card .ro-home-news-body p { margin: 0 0 0.5rem; }
.ro-home-news-card .ro-home-news-body h1, .ro-home-news-card .ro-home-news-body h2,
.ro-home-news-card .ro-home-news-body h3, .ro-home-news-card .ro-home-news-body h4,
.ro-home-news-card .ro-home-news-body h5, .ro-home-news-card .ro-home-news-body h6 {
  font-family: var(--font-ui);
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.4;
  color: var(--forest-soft);              /* легаси-h1 в контенте новостей демотируется (данные владельца, ISSUE-12) */
}
.ro-home-news-card .ro-home-news-body a { color: var(--rose-clay); }
/* маркеры в карточках — те же точки sage-deep, что на всём сайте: набранные
   владельцем «•» удалены из контента новости 678 (решение владельца 05.11,
   бэкап и откат — migration-sql-log.md) */
.ro-home-news-card .ro-home-news-body ol { list-style: decimal outside; padding-left: 1.5rem; }
.ro-home-news-card .ro-home-news-body img { max-width: 100%; height: auto; }
.ro-home-news-date {
  font-family: var(--font-ui);
  font-size: 0.88rem;
  color: var(--meta);
  margin: 0.55rem 0 0;
}