html {
  scroll-behavior: smooth;
}

/* Подключение шрифта для логотипа BigVova */
@font-face {
  font-family: "ComfortaaLogo";
  src: url("../fonts/Comfortaa-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* Стиль для логотипа (надпись BigVova) */
.logo-text {
  font-family: "ComfortaaLogo", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* ---------- Логотип: "bigV{code}va" (иконка внутри названия) ---------- */

/* Кружок с градиентной заливкой вокруг {code} */
.logo-code-badge {
  width: 1.15em;
  height: 1.15em;
  border-radius: 9999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  vertical-align: -0.08em;

  /* Градиентная заливка кружка */
  background: linear-gradient(180deg, #6494d4 0%, #4c80c9 100%);

  /* Лёгкое обрамление и глубина */
  border: none;
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.18);
}

/* Внутренний контейнер под GIF, чтобы удобно центрировать и позиционировать */
.logo-code-icon-wrap {
  position: relative;
  width: 0.72em;
  height: 0.72em;
}

.logo-code-icon-wrap .logo-icon {
  position: absolute;
  inset: 0;
  width: 0.72em;
  height: 0.72em;
  display: block;
  object-fit: contain;
}

/* По умолчанию (светлая тема): показываем чёрную иконку */
.logo-icon-light {
  opacity: 1;
}

.logo-icon-dark {
  opacity: 0;
}

/* Тёмная тема: показываем белую иконку */
body.theme-dark .logo-icon-light {
  opacity: 0 !important;
}

body.theme-dark .logo-icon-dark {
  opacity: 1 !important;
}

/* В тёмной теме добавим контраст на обводке/тени кружка */
body.theme-dark .logo-code-badge {
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.65);
}

/* Анимация появления блоков снизу */
.fade-in-up {
  opacity: 0;
  transform: translateY(12px);
  animation: fadeInUp 0.6s ease-out forwards;
}

.fade-in-up-delay {
  opacity: 0;
  transform: translateY(12px);
  animation: fadeInUp 0.8s ease-out forwards;
}

/* Лёгкое “плавание” аватара */
.float {
  animation: float 6s ease-in-out infinite;
}

@keyframes fadeInUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes float {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-6px);
  }
}

/* --- Переключатель языков (desktop dropdown) --- */

.lang-switcher {
  position: relative;
}

.lang-dropdown {
  display: none;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 0.15s ease-out, transform 0.15s ease-out;
  z-index: 9999; /* всегда поверх остальных элементов */
}

/* Показываем дропдаун, когда на контейнере есть класс .open */
.lang-switcher.open .lang-dropdown {
  display: block;
  opacity: 1;
  transform: translateY(0);
}

/* --- Анимированный бургер (mobile) --- */
/* From Uiverse.io by JulanDeAlb (адаптировано) */

.hamburger {
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.hamburger input {
  display: none;
}

.hamburger svg {
  /* Размер иконки */
  height: 1.75rem;
  width: 1.75rem;
  /* Плавное вращение */
  transition: transform 600ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* Ограничиваем стили линий только внутрь .hamburger,
   чтобы не задеть случайно другие .line на сайте */
.hamburger .line {
  fill: none;
  stroke: #4b5563; /* gray-600, хорошо видно на светлом фоне */
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 3;
  transition:
    stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1),
    stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
}

.hamburger .line-top-bottom {
  stroke-dasharray: 12 63;
}

.hamburger input:checked + svg {
  transform: rotate(-45deg);
}

.hamburger input:checked + svg .line-top-bottom {
  stroke-dasharray: 20 300;
  stroke-dashoffset: -32.42;
}

/* --- Мобильное меню (гамбургер): центрирование и типографика --- */

@media (max-width: 767px) {
  /* Контейнер выпадающего меню */
  #mobileMenu {
    text-align: center;
  }

  /* Пункты меню: крупнее и комфортнее для тапа */
  #mobileMenu a {
    font-size: 1.125rem; /* ~text-lg */
    line-height: 1.75rem;
  }

  /* Соцсети внутри мобильного меню: по центру */
  #mobileMenu .social-link {
    transform: none; /* не дёргаем иконки в мобильном меню */
  }

  #mobileMenu .social-link:hover {
    transform: none;
  }
}

/* --- Переключатель темы (Theme Switch) --- */
/* From Uiverse.io by JustCode14 (адаптировано) */

.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Чуть увеличенная версия переключателя:
   по высоте сопоставима с языковым переключателем и иконками */
.switch {
  font-size: 15px;
  position: relative;
  display: inline-block;
  width: 3.6em;
  height: 1.8em;
  border-radius: 30px;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.08);
  vertical-align: middle;
}

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #2a2a2a;
  transition: 0.4s;
  border-radius: 30px;
  overflow: hidden;
}

.slider:before {
  position: absolute;
  content: "";
  height: 1.1em;
  width: 1.1em;
  border-radius: 20px;
  left: 0.4em;
  bottom: 0.35em;
  transition: 0.4s;
  transition-timing-function: cubic-bezier(0.81, -0.04, 0.38, 1.5);
  box-shadow: inset 6px -3px 0px 0px #fff;
}

.switch input:checked + .slider {
  background-color: #00a6ff;
}

.switch input:checked + .slider:before {
  transform: translateX(1.6em);
  box-shadow: inset 11px -3px 0px 11px #ffcf48;
}

.star {
  background-color: #fff;
  border-radius: 50%;
  position: absolute;
  width: 4px;
  height: 4px;
  transition: all 0.4s;
}

.star_1 {
  left: 2.4em;
  top: 0.35em;
}

.star_2 {
  left: 2.2em;
  top: 0.98em;
}

.star_3 {
  left: 2.8em;
  top: 0.7em;
}

.switch input:checked ~ .slider .star {
  opacity: 0;
}

.cloud {
  width: 3.2em;
  position: absolute;
  bottom: -1.3em;
  left: -1em;
  opacity: 0;
  transition: all 0.4s;
}

.switch input:checked ~ .slider .cloud {
  opacity: 1;
}

/* --- Социальные иконки (SVG) --- */

/*
  ВАЖНО:
  - Без рамок/квадратиков вокруг.
  - Подсвечивается именно САМА иконка (brand color) при наведении.
  - Без glow/свечений.
  - Иконка рисуется через CSS mask, поэтому цвет задаётся CSS-ом.
*/

.social-link {
  /* Брендовый цвет конкретной соцсети задаётся через data-social */
  --brand: #3b82f6; /* fallback */

  color: rgba(75, 85, 99, 1); /* gray-600 */
  transition: color 180ms ease, transform 180ms ease;
}

.social-link:hover {
  color: var(--brand);
}

.social-link:focus {
  outline: none;
}

.social-link:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--brand) 28%, transparent);
  outline-offset: 3px;
}

.social-icon {
  display: block;
}

.social-icon--mask {
  display: block;
  background-color: currentColor;
  -webkit-mask-image: var(--social-icon-url);
  mask-image: var(--social-icon-url);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  transition: background-color 180ms ease;
}

/* Брендовые цвета (id -> цвет) */
.social-link[data-social="telegram"] {
  --brand: #229ed9;
}
.social-link[data-social="x"] {
  --brand: #000000;
}
.social-link[data-social="facebook"] {
  --brand: #1877f2;
}
.social-link[data-social="instagram"] {
  --brand: #e4405f;
}
.social-link[data-social="github"] {
  --brand: #181717;
}
.social-link[data-social="youtube"] {
  --brand: #ff0000;
}
.social-link[data-social="vk"] {
  --brand: #0077ff;
}

/* --- Кнопка "Читать далее" / "Read more" (адаптация Uiverse.io) --- */

.btn-read-more {
  --primary-color: #2563eb; /* основной цвет (blue-600) */
  --secondary-color: #ffffff; /* цвет текста и стрелки */
  --hover-color: #111827; /* hover-фон (gray-900) */
  --arrow-width: 10px;
  --arrow-stroke: 2px;

  box-sizing: border-box;
  border: 0;
  border-radius: 9999px;
  color: var(--secondary-color);
  padding: 0.7em 1.8em;
  padding-right: 1.6em;
  background: var(--primary-color);
  display: inline-flex;
  align-items: center;
  gap: 0.6em;
  font-weight: 600;
  font-size: 0.875rem;
  cursor: pointer;
  transition:
    background-color 0.2s ease,
    transform 0.2s ease,
    box-shadow 0.2s ease;
  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.25);
  white-space: nowrap;
}

.btn-read-more .arrow-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
}

.btn-read-more .arrow {
  margin-top: 1px;
  width: var(--arrow-width);
  background: var(--secondary-color);
  height: var(--arrow-stroke);
  position: relative;
  transition: 0.2s;
}

.btn-read-more .arrow::before {
  content: "";
  box-sizing: border-box;
  position: absolute;
  border: solid var(--secondary-color);
  border-width: 0 var(--arrow-stroke) var(--arrow-stroke) 0;
  display: inline-block;
  top: -3px;
  right: 3px;
  padding: 3px;
  transform: rotate(-45deg);
  transition: 0.2s;
}

.btn-read-more:hover {
  background-color: var(--hover-color);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.35);
}

.btn-read-more:hover .arrow {
  background: var(--secondary-color);
}

.btn-read-more:hover .arrow::before {
  right: 0;
}

.btn-read-more:active {
  transform: scale(0.96) translateY(1px);
  box-shadow: 0 5px 14px rgba(15, 23, 42, 0.35);
}

/* --- Ограничение текста по числу строк (мини-выдержки) --- */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* --- Language hint banner (device RU, site non-RU) --- */

.lang-hint {
  --lh-bg: rgba(239, 246, 255, 0.78); /* blue-50 */
  --lh-border: rgba(59, 130, 246, 0.22); /* blue-500 */
  --lh-title: rgba(30, 58, 138, 0.98); /* blue-900 */
  --lh-text: rgba(30, 58, 138, 0.78);
  --lh-btn-bg: rgba(255, 255, 255, 0.76);
  --lh-btn-border: rgba(59, 130, 246, 0.22);
  --lh-btn-hover: rgba(255, 255, 255, 0.92);
  --lh-focus: rgba(59, 130, 246, 0.35);
}

.lang-hint__inner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--lh-border);
  background: var(--lh-bg);
  border-radius: 14px;
  box-shadow: 0 10px 26px rgba(30, 58, 138, 0.10);
}

.lang-hint__card {
  position: relative;
  overflow: visible; /* чтобы крестик мог быть снаружи */
}

@supports ((-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px))) {
  .lang-hint__inner {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
}

.lang-hint__icon {
  width: 28px;
  height: 28px;
  border-radius: 9999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--lh-border);
  background: rgba(59, 130, 246, 0.10);
  color: var(--lh-title);
  font-weight: 800;
  line-height: 1;
  flex: 0 0 auto;
}

.lang-hint__content {
  min-width: 0;
  flex: 1 1 auto;
}

.lang-hint__title {
  color: var(--lh-title);
  font-weight: 700;
  letter-spacing: -0.01em;
  font-size: 0.95rem;
  line-height: 1.2;
}

.lang-hint__text {
  margin-top: 2px;
  color: var(--lh-text);
  font-size: 0.9rem;
  line-height: 1.35;
}

.lang-hint__actions {
  flex: 0 0 auto;
}

.lang-hint__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  border-radius: 9999px;
  border: 1px solid var(--lh-btn-border);
  background: var(--lh-btn-bg);
  color: var(--lh-title);
  font-weight: 600;
  font-size: 0.9rem;
  white-space: nowrap;
  transition: background-color 0.2s ease, transform 0.2s ease;
}

.lang-hint__btn:hover {
  background: var(--lh-btn-hover);
  transform: translateY(-1px);
}

.lang-hint__btn:focus {
  outline: none;
}

.lang-hint__btn:focus-visible {
  outline: 3px solid var(--lh-focus);
  outline-offset: 2px;
}

/* Close (X) button */
.lang-hint__close {
  position: absolute;
  top: -14px;
  right: -14px;
  width: 32px;
  height: 32px;
  border-radius: 9999px;
  border: 1px solid var(--lh-border);
  background: rgba(255, 255, 255, 0.55);
  color: var(--lh-title);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s ease, transform 0.2s ease;
  z-index: 5;
  box-shadow: 0 10px 22px rgba(30, 58, 138, 0.10);
}

.lang-hint__close:hover {
  background: rgba(255, 255, 255, 0.85);
  transform: translateY(-1px);
}

.lang-hint__close:focus {
  outline: none;
}

.lang-hint__close:focus-visible {
  outline: 3px solid var(--lh-focus);
  outline-offset: 2px;
}

.lang-hint__close-icon {
  width: 16px;
  height: 16px;
  display: block;
}

@media (max-width: 640px) {
  .lang-hint__inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding-right: 14px; /* на мобилке крестик не мешает, текст идёт колонкой */
  }

  .lang-hint__close {
    top: -12px;
    right: -12px;
    width: 30px;
    height: 30px;
  }

  .lang-hint__close-icon {
    width: 14px;
    height: 14px;
  }

  .lang-hint__actions {
    width: 100%;
  }

  .lang-hint__btn {
    width: 100%;
  }
}

/* --- Site warning banner (temporary, under construction) --- */

.site-warning {
  /* Light theme tokens */
  --sw-bg: rgba(255, 251, 235, 0.88); /* amber-50 with transparency */
  --sw-border: rgba(245, 158, 11, 0.28); /* amber-500 */
  --sw-title: rgba(120, 53, 15, 0.98); /* amber-900 */
  --sw-text: rgba(120, 53, 15, 0.78);
  --sw-hint: rgba(120, 53, 15, 0.62);
  --sw-accent-1: rgba(245, 158, 11, 0.95);
  --sw-accent-2: rgba(251, 191, 36, 0.92);
  --sw-cta-bg: rgba(255, 255, 255, 0.76);
  --sw-cta-border: rgba(245, 158, 11, 0.28);
  --sw-cta-hover: rgba(255, 255, 255, 0.92);
  --sw-focus: rgba(59, 130, 246, 0.35); /* blue-500 */
}

.site-warning__card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--sw-border);
  background: var(--sw-bg);
}

/* Subtle glass effect where supported */
@supports ((-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px))) {
  .site-warning__card {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
}

.site-warning__accent {
  position: absolute;
  inset: 0 auto 0 0;
  width: 6px;
  background: linear-gradient(180deg, var(--sw-accent-1) 0%, var(--sw-accent-2) 100%);
  opacity: 0.95;
}

.site-warning__inner {
  position: relative;
  z-index: 1;
}

.site-warning__icon {
  border: 1px solid var(--sw-border);
  background: rgba(245, 158, 11, 0.12);
  color: var(--sw-title);
}

.site-warning__title {
  color: var(--sw-title);
  letter-spacing: -0.01em;
}

.site-warning__body {
  color: var(--sw-text);
}

.site-warning__hint {
  color: var(--sw-hint);
}

.site-warning__cta {
  border: 1px solid var(--sw-cta-border);
  background: var(--sw-cta-bg);
  color: var(--sw-title);
  box-shadow: 0 10px 22px rgba(120, 53, 15, 0.10);
}

.site-warning__cta:hover {
  background: var(--sw-cta-hover);
}

.site-warning__cta:focus {
  outline: none;
}

.site-warning__cta:focus-visible {
  outline: 3px solid var(--sw-focus);
  outline-offset: 2px;
}

.site-warning__cta-icon {
  border: 1px solid var(--sw-border);
  background: rgba(255, 255, 255, 0.55);
}

.site-warning__cta-text {
  white-space: nowrap;
}
.cookies-consent {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 16px;
  z-index: 9999;

  /* Чтобы клики проходили только по самой карточке */
  pointer-events: none;
}

.cookies-consent__inner {
  display: block; /* ширина как у остальных блоков (внутри max-w-6xl) */
}

.cookies-card {
  /* tokens (light) */
  --cc-bg: rgba(255, 255, 255, 0.78);
  --cc-border: rgba(148, 163, 184, 0.35); /* slate-400 */
  --cc-title: rgba(15, 23, 42, 0.96); /* slate-900 */
  --cc-text: rgba(30, 41, 59, 0.82); /* slate-800 */
  --cc-muted: rgba(30, 41, 59, 0.62);

  --cc-btn-primary: rgba(15, 23, 42, 0.96);
  --cc-btn-primary-hover: rgba(2, 6, 23, 1);
  --cc-btn-secondary: rgba(241, 245, 249, 0.92); /* slate-100 */
  --cc-btn-secondary-hover: rgba(226, 232, 240, 0.96); /* slate-200 */

  width: 100%;
  height: fit-content;
  border-radius: 14px;
  border: 1px solid var(--cc-border);
  background: var(--cc-bg);

  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  padding: 18px;
  gap: 12px;
  position: relative;

  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12);

  /* клики только по карточке */
  pointer-events: auto;
}

@supports ((-webkit-backdrop-filter: blur(12px)) or (backdrop-filter: blur(12px))) {
  .cookies-card {
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
  }
}

.cookies-card .cookie-heading {
  color: var(--cc-title);
  font-weight: 800;
  letter-spacing: -0.01em;
}

.cookies-card .cookie-para {
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--cc-text);
  line-height: 1.35;
}


.cookies-card .cookies-note {
  margin-top: 2px;
  font-size: 0.8rem;
  color: var(--cc-muted);
  line-height: 1.35;
}

.cookies-card .cookies-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;

  margin-top: 2px;

  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: -0.01em;

  color: rgba(37, 99, 235, 0.92); /* blue-600 */
  text-decoration: none;
  text-underline-offset: 4px;

  transition: color 0.2s ease;
}

.cookies-card .cookies-more:hover {
  color: rgba(29, 78, 216, 0.98); /* blue-700 */
  text-decoration: underline;
}

.cookies-card .cookies-more:focus {
  outline: none;
}

.cookies-card .cookies-more:focus-visible {
  outline: 3px solid rgba(37, 99, 235, 0.28);
  outline-offset: 3px;
  border-radius: 10px;
}

.cookies-card .button-wrapper {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 12px;
}

.cookies-card .cookie-button {
  width: auto;
  min-width: 140px;
  padding: 9px 14px;
  border: 1px solid transparent;
  border-radius: 9999px;
  cursor: pointer;
  font-weight: 700;
  font-size: 0.9rem;
  transition: background-color 0.2s ease, transform 0.2s ease;
}

.cookies-card .cookie-button:active {
  transform: translateY(1px);
}

.cookies-card .accept {
  background-color: var(--cc-btn-primary);
  color: rgba(255, 255, 255, 0.96);
}

.cookies-card .accept:hover {
  background-color: var(--cc-btn-primary-hover);
}

.cookies-card .reject {
  background-color: var(--cc-btn-secondary);
  color: var(--cc-title);
  border-color: rgba(148, 163, 184, 0.35);
}

.cookies-card .reject:hover {
  background-color: var(--cc-btn-secondary-hover);
}

.cookies-card .exit-button {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(241, 245, 249, 0.72);
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 10px;
  cursor: pointer;
  transition: background-color 0.2s ease, transform 0.2s ease;
}

.cookies-card .exit-button:hover {
  background: rgba(226, 232, 240, 0.92);
  transform: translateY(-1px);
}

.cookies-card .svgIconCross {
  width: 14px;
  height: 14px;
  display: block;
  color: var(--cc-title);
}


/* Mobile: центрируем и растягиваем по ширине */
@media (max-width: 640px) {
  .cookies-consent {
    bottom: 12px;
  }

  .cookies-card .button-wrapper {
    flex-direction: column;
  }

  .cookies-card .cookie-button {
    width: 100%;
  }
}


/* --- Legal pages typography (Cookies Policy page) --- */

/*
  Tailwind CDN does not include the Typography plugin by default, so the `.prose`
  class used on the cookies page needs explicit styling.
*/

.prose {
  color: #334155; /* slate-700 */
  font-size: 1rem;
  line-height: 1.75;
}

.prose h2 {
  margin-top: 1.6em;
  margin-bottom: 0.6em;
  font-size: 1.25rem;
  line-height: 1.25;
  font-weight: 800;
  letter-spacing: -0.015em;
  color: #0f172a; /* slate-900 */
}

.prose h3 {
  margin-top: 1.2em;
  margin-bottom: 0.5em;
  font-size: 1.05rem;
  line-height: 1.3;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: #0f172a; /* slate-900 */
}

.prose p {
  margin: 0.9em 0;
}

.prose ul,
.prose ol {
  margin: 0.9em 0;
  padding-left: 1.25rem;
}

.prose li {
  margin: 0.35em 0;
}

.prose a {
  color: #0369a1; /* sky-700 */
  text-decoration: underline;
  text-underline-offset: 4px;
}

.prose a:hover {
  color: #0c4a6e; /* sky-900 */
}

.prose code {
  font-size: 0.95em;
  padding: 0.15em 0.35em;
  border-radius: 0.5rem;
  background: rgba(148, 163, 184, 0.22);
}

.prose strong {
  color: #0f172a;
}

@media (max-width: 640px) {
  .prose {
    font-size: 0.98rem;
    line-height: 1.7;
  }

  .prose h2 {
    font-size: 1.15rem;
  }
}