/* Тема сайта «Научная»: в духе Nature / Science / PNAS. Светлая, плотная сетка, крупные
   гротесковые заголовки Inter, тексты статей — Source Serif 4. Акцент и тёплый фон
   героя берутся из фирменного цвета журнала (--journal-accent из base.html).
   Подключается после pico и app.css (см. journals/site_themes.py). */

@font-face { font-family: "Inter"; font-weight: 400; src: url("../../fonts/Inter-Regular.ttf"); font-display: swap; }
@font-face { font-family: "Inter"; font-weight: 500; src: url("../../fonts/Inter-Medium.ttf"); font-display: swap; }
@font-face { font-family: "Inter"; font-weight: 600; src: url("../../fonts/Inter-SemiBold.ttf"); font-display: swap; }
@font-face { font-family: "Inter"; font-weight: 700; src: url("../../fonts/Inter-Bold.ttf"); font-display: swap; }
@font-face { font-family: "Inter"; font-weight: 800; src: url("../../fonts/Inter-ExtraBold.ttf"); font-display: swap; }
@font-face { font-family: "Source Serif 4"; font-weight: 400; src: url("../../fonts/SourceSerif4-Regular.ttf"); font-display: swap; }
@font-face { font-family: "Source Serif 4"; font-weight: 400; font-style: italic; src: url("../../fonts/SourceSerif4-It.ttf"); font-display: swap; }
@font-face { font-family: "Source Serif 4"; font-weight: 600; src: url("../../fonts/SourceSerif4-Semibold.ttf"); font-display: swap; }
@font-face { font-family: "Source Serif 4"; font-weight: 700; src: url("../../fonts/SourceSerif4-Bold.ttf"); font-display: swap; }

:root[data-theme="light"] {
  --accent: var(--journal-accent, #731b19);
  --accent-dark: color-mix(in srgb, var(--accent) 78%, #000);
  --accent-soft: color-mix(in srgb, var(--accent) 7%, #fff);
  --warm: color-mix(in srgb, var(--accent) 7%, #fdeed8);
  --ink: #14171a;
  --line: #e2e0dc;
  --line-strong: #bdb9b2;
  --sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --serif: "Source Serif 4", "PT Serif", Georgia, "Times New Roman", serif;

  --pico-font-family: var(--sans);
  --pico-font-size: 16px;
  --pico-line-height: 1.6;
  --pico-border-radius: 2px;
  --pico-background-color: #fff;
  --pico-color: var(--ink);
  --pico-muted-color: #666a6e;
  --pico-muted-border-color: var(--line);
  --pico-h1-color: var(--ink); --pico-h2-color: var(--ink); --pico-h3-color: var(--ink); --pico-h4-color: var(--ink);
  --pico-primary: var(--accent);
  --pico-primary-background: var(--accent);
  --pico-primary-border: var(--accent);
  --pico-primary-underline: color-mix(in srgb, var(--accent) 40%, transparent);
  --pico-primary-hover: var(--accent-dark);
  --pico-primary-hover-background: var(--accent-dark);
  --pico-primary-hover-border: var(--accent-dark);
  --pico-primary-hover-underline: var(--accent-dark);
  --pico-primary-focus: color-mix(in srgb, var(--accent) 22%, transparent);
  --pico-primary-inverse: #fff;
  --pico-card-background-color: #fff;
  --pico-card-sectioning-background-color: #f7f6f4;
  --pico-card-border-color: var(--line);
  --pico-card-box-shadow: none;
  --pico-form-element-border-color: var(--line-strong);
  --pico-form-element-active-border-color: var(--accent);
  --pico-form-element-focus-color: var(--accent);
  --pico-dropdown-background-color: #fff;
  --pico-dropdown-border-color: var(--line);
  --pico-dropdown-hover-background-color: var(--accent-soft);
  --pico-dropdown-box-shadow: 0 10px 30px rgba(20, 23, 26, .14);
  --pico-table-border-color: var(--line);
}

html, body { overflow-x: clip; }
body { background: #fff; min-height: 100vh; }
:root[data-theme="light"] .container { max-width: 1200px; }

/* Заголовки — плотный гротеск, как в Nature */
h1, h2, h3, h4 { font-family: var(--sans); font-weight: 700; letter-spacing: -.02em; line-height: 1.15; }
h1 { font-size: clamp(2rem, 4.4vw, 3rem); font-weight: 800; letter-spacing: -.03em; }
h2 { font-size: clamp(1.35rem, 2.4vw, 1.7rem); margin-top: 2.5rem; padding-top: .9rem; border-top: 3px solid var(--ink); }
h3 { font-size: 1.15rem; }
h4 { font-size: 1.12rem; font-weight: 650; line-height: 1.3; letter-spacing: -.01em; }
th { font-size: .74rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--pico-muted-color); border-bottom: 2px solid var(--ink); }
a { text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: .22em; text-decoration-thickness: 1px; }

/* Шапка: белая, тонкая линия, название — капителью ExtraBold */
.site-header { position: sticky; top: 0; z-index: 20; background: rgba(255, 255, 255, .94); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); margin-bottom: 0; }
.site-nav { min-height: 56px; }
.site-nav, .site-nav ul { margin-block: 0; }
.site-nav li { padding-block: 0; }
.site-nav .brand { font-family: var(--sans); font-size: 1.05rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--ink); padding-block: .4rem; margin: 0; }
.site-nav .brand::before { content: ""; display: inline-block; width: .7em; height: .7em; margin-right: .6em; background: var(--accent); }
.site-nav .brand:hover { text-decoration: none; color: var(--accent); }
.site-nav details.dropdown summary { padding-block: .4rem; color: var(--pico-color); font-size: .92rem; }
.site-nav details.dropdown summary.burger { padding: .4rem .5rem; line-height: 0; }
.site-nav details.dropdown summary.burger::after { display: none; }
.site-nav details.dropdown summary.burger:hover { color: var(--accent); }
.site-nav [aria-current="page"] { text-decoration-color: var(--accent); }
main.container { padding-top: 0; }
main.container > nav[aria-label="breadcrumb"] { margin: 1.5rem 0 1rem; font-size: .85rem; }

/* Кнопки */
button, [type="submit"], [role="button"] { font-weight: 600; box-shadow: none; letter-spacing: .01em; }
button.outline, [role="button"].outline { color: var(--accent); border-color: var(--accent); }
button.outline:hover, [role="button"].outline:hover { background: var(--accent-soft); }
article { border: 1px solid var(--line); box-shadow: none; }
tr:hover td { background: #faf9f7; }

/* Доска редакции */
.kanban-head { padding-bottom: .5rem; border-bottom: 2px solid var(--accent); }
.kanban-head h2 { border: 0; padding: 0; margin: 0; font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.stage-paper-card:hover { border-color: var(--accent); }
.card-title a { color: var(--pico-color); }

/* Главная: тёплая полоса на всю ширину — название, выпуск, обложка */
.hero { position: relative; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 4rem; align-items: center;
  margin: 0 calc(50% - 50vw) 3rem; padding: 4rem max(1rem, calc(50vw - 600px)) 4.5rem; background: var(--warm); border-bottom: 4px solid var(--accent); }
.hero h1 { font-size: clamp(2.6rem, 6.4vw, 5rem); line-height: .98; margin: .9rem 0 0; font-weight: 800; letter-spacing: -.04em; overflow-wrap: anywhere; color: var(--accent-dark); }
.hero .eyebrow { display: inline-block; font-size: .74rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #fff; background: var(--accent); padding: .3rem .65rem; }
.hero .rule { height: 3px; border: 0; background: var(--ink); width: 3.5rem; margin: 1.6rem 0 1.1rem; }
.hero .meta-row { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem 1.5rem; font-size: 1.15rem; font-weight: 600; color: var(--ink); }
.hero [role="button"] { margin-top: .5rem; border-radius: 0; padding: .8rem 1.6rem; font-size: 1rem; }
.hero-cover img { width: 100%; max-width: 360px; margin-left: auto; display: block; box-shadow: 0 2px 4px rgba(20, 23, 26, .15), 0 24px 48px -12px rgba(20, 23, 26, .35); transform: rotate(1.2deg); transition: transform .3s; }
.hero-cover img:hover { transform: rotate(0) translateY(-4px); }
/* Плашка «Авторам» — третья колонка полосы (только на широком экране): выпуск стоит рядом с ней */
@media (min-width: 1200px) {
  .hero:has(> .for-authors) { grid-template-columns: minmax(0, 1.2fr) minmax(0, .9fr) 22rem; gap: 3rem; }
  .hero > .for-authors { grid-column: auto; align-self: center; }
}
@media (max-width: 860px) {
  .hero { grid-template-columns: minmax(0, 1fr); gap: 2rem; padding-block: 2.5rem 3rem; }
  /* Блоки полосы тянутся на всю ширину экрана: кнопки, строка выпуска, обложка */
  .hero > div, .hero-cover { width: 100%; }
  .hero .eyebrow { display: block; text-align: center; padding: .55rem .65rem; }
  .hero h1 { font-size: clamp(3rem, 15vw, 4.5rem); }
  .hero .meta-row { justify-content: space-between; }
  .hero [role="button"].stretched { display: block; width: 100%; text-align: center; }
  .hero-cover img { margin: 0 auto; max-width: 100%; transform: none; }
}
.shimmer-link { font-weight: 700; color: var(--accent); }
.buy-btn { display: inline-block; padding: .15rem .7rem; border: 1px solid var(--ink); color: var(--ink); font-size: .78rem; font-weight: 600; white-space: nowrap; }
.buy-btn:hover { background: var(--ink); color: #fff; text-decoration: none; }

/* Предыдущие номера */
.issue-grid { grid-template-columns: repeat(5, 1fr); gap: 1.75rem; }
@media (max-width: 1000px) { .issue-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .issue-grid { grid-template-columns: repeat(2, 1fr); } }
.issue-card { background: none; border: 0; overflow: visible; }
.issue-card:hover { transform: none; box-shadow: none; }
.issue-cover { background: #f1efec; box-shadow: 0 1px 3px rgba(20, 23, 26, .2); transition: transform .2s, box-shadow .2s; }
.issue-card a:hover .issue-cover { transform: translateY(-4px); box-shadow: 0 14px 28px -8px rgba(20, 23, 26, .4); }
.issue-cover-empty { height: 100%; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; font-weight: 700; }
.issue-cover-empty strong { color: var(--accent); font-size: 2rem; }
.issue-info { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .8rem 0 0; }
.issue-info .card-title { margin: 0; font-weight: 700; font-size: .95rem; color: var(--ink); }

/* Список статей: ряды с линиями, рубрика — метка-капитель */
.section-title { font-size: .74rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); margin: 2.5rem 0 0; padding-bottom: .5rem; border-bottom: 3px solid var(--ink); }
.section-title + article { border-top: 0; }
main article > h4 { margin: 0 0 .35rem; }
main article > h4 a { color: var(--ink); }
main article > h4 a:hover { color: var(--accent); text-decoration: none; }

/* Элементы списка статей выпуска (article без рамки, только нижняя линия) */
.issue-head ~ article, .hero ~ h3 ~ article, h2 ~ article, .section-title ~ article {
  border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: none; margin: 0; padding: 1.15rem 0; }
.issue-head ~ article p, h2 ~ article p, .section-title ~ article p { margin: 0 0 .2rem; font-size: .93rem; color: var(--pico-muted-color); }
.issue-head ~ article p a, h2 ~ article p a, .section-title ~ article p a { color: var(--pico-muted-color); }
.issue-head ~ article p a:hover, h2 ~ article p a:hover, .section-title ~ article p a:hover { color: var(--accent); }
.issue-head ~ article small, h2 ~ article small, .section-title ~ article small { font-size: .78rem; font-weight: 500; letter-spacing: .03em; color: #8a8d90; }

/* Страница выпуска */
.issue-head { margin: 2.5rem 0 1rem; }
.issue-head.has-cover { display: grid; grid-template-columns: 1fr 2.4fr; gap: 3rem; align-items: end; }
.issue-head-cover img { width: 100%; display: block; cursor: zoom-in; box-shadow: 0 2px 4px rgba(20, 23, 26, .15), 0 20px 40px -12px rgba(20, 23, 26, .35); }
.issue-head-info h1 { margin: 0 0 .75rem; }
.cover-zoom { position: fixed; inset: 0; z-index: 1000; background: rgba(20, 23, 26, .9); display: flex; align-items: center; justify-content: center; padding: 1rem; cursor: zoom-out; }
.cover-zoom img { width: auto; max-width: 100%; max-height: 100%; cursor: zoom-out; }
@media (max-width: 700px) { .issue-head.has-cover { grid-template-columns: 1fr; gap: 1.5rem; } .issue-head-cover { max-width: 60%; } }

/* Страница статьи: колонка чтения, антиква, аннотация крупнее */
main > article:has(> h1) { border: 0; background: none; max-width: 760px; margin: 2.5rem auto; padding: 0; font-family: var(--serif); font-size: 1.1rem; line-height: 1.7; }
main > article > h1 { font-size: clamp(1.9rem, 4vw, 2.7rem); line-height: 1.12; margin-bottom: 1rem; }
main > article > h2 { font-size: 1.15rem; letter-spacing: -.01em; }
main > article > p > em { font-family: var(--sans); font-size: 1.1rem; color: var(--pico-muted-color); }
main > article .authors { list-style: none; padding: 0; margin: 1.25rem 0; font-family: var(--sans); font-size: 1rem; font-weight: 600; display: flex; flex-wrap: wrap; gap: .4rem 1.75rem; }
main > article .authors li { margin: 0; padding: 0; list-style: none; }
main > article .authors small { font-weight: 400; }
main > article .muted, main > article small { font-family: var(--sans); }
main > article > p:has(> strong:first-child) { font-size: 1rem; }
main > article .button-row { display: flex; gap: .75rem; margin-top: 2rem; font-family: var(--sans); }
main > article .button-row [role="button"] { border-radius: 0; }

/* Редколлегия */
.board-photo { border-radius: 0; filter: grayscale(.2); }
