/*
Theme Name: VeraMePote
Theme URI: https://veramepote.ru/
Author: OpenAI Codex
Description: Custom WordPress theme for the studio of folk clothing by Tatyana Nikitichna Moskvina.
Version: 3.3.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: veramepote
*/

:root {
  --vm-bg: #f3eee0;
  --vm-paper: #fff9ee;
  --vm-paper-soft: #f8f0db;
  --vm-text: #231917;
  --vm-muted: rgba(35, 25, 23, 0.72);
  --vm-line: rgba(93, 50, 48, 0.16);
  --vm-burgundy: #7f313d;
  --vm-green: #55724c;
  --vm-gold: #c7ab76;
  --vm-shadow: 0 24px 60px rgba(35, 25, 23, 0.08);
  --vm-radius: 26px;
  --vm-radius-sm: 18px;
  --vm-content: 1140px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--vm-text);
  font-family: Georgia, "Times New Roman", serif;
  line-height: 1.65;
  background: var(--vm-bg);
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
}

figure {
  margin: 0;
}

.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.vm-site {
  min-height: 100vh;
}

.vm-shell {
  width: min(calc(100% - 2.5rem), var(--vm-content));
  margin: 0 auto;
}

.vm-site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(255, 249, 238, 0.94);
  border-bottom: 1px solid var(--vm-line);
  backdrop-filter: blur(14px);
}

.vm-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.85rem 0;
}

.vm-brand {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  text-decoration: none;
  min-width: 0;
}

.vm-brand-logo {
  width: 3.2rem;
  height: 3.2rem;
  object-fit: contain;
  flex: 0 0 auto;
  filter: sepia(0.24) saturate(0.72) hue-rotate(-12deg) brightness(1.03);
  mix-blend-mode: multiply;
  background: var(--vm-bg);
}

.vm-brand-mark {
  display: block;
  color: var(--vm-burgundy);
  font-size: 0.64rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.vm-brand-title {
  display: block;
  font-size: clamp(0.98rem, 1.55vw, 1.2rem);
  font-weight: 700;
  line-height: 1.1;
}

.vm-nav ul,
.vm-site-footer ul {
  display: flex;
  flex-wrap: nowrap;
  gap: 0.35rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.vm-nav a,
.vm-site-footer a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0.42rem 0.72rem;
  border-radius: 999px;
  color: var(--vm-text);
  text-decoration: none;
  font-size: 0.95rem;
  white-space: nowrap;
}

.vm-nav .current-menu-item a,
.vm-nav a:hover,
.vm-site-footer a:hover {
  color: var(--vm-burgundy);
  background: rgba(127, 49, 61, 0.08);
}

.vm-main {
  padding: 0 0 3rem;
}

.vm-page,
.vm-about-page,
.vm-longread-page,
.vm-gallery-page-wrap,
.vm-single-page {
  background: rgba(255, 249, 238, 0.96);
  box-shadow: var(--vm-shadow);
}

.vm-page,
.vm-about-page,
.vm-longread-page,
.vm-gallery-page-wrap,
.vm-single-page,
.vm-footer-inner {
  border-radius: var(--vm-radius);
}

.vm-kicker {
  margin: 0 0 0.8rem;
  color: var(--vm-burgundy);
  font-size: 0.75rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.vm-page-title,
.vm-section-title,
.vm-entry-title {
  margin: 0;
  line-height: 1.05;
  letter-spacing: -0.03em;
}

.vm-page-title,
.vm-entry-title {
  font-size: clamp(2.5rem, 5vw, 4.8rem);
}

.vm-section-title {
  font-size: clamp(1.75rem, 3vw, 3rem);
}

.vm-lead {
  max-width: 46rem;
  font-size: clamp(1.05rem, 1.8vw, 1.2rem);
  color: var(--vm-muted);
}

.vm-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 0.85rem 1.8rem;
  border-radius: 999px;
  background: var(--vm-burgundy);
  color: #fff;
  text-decoration: none;
}

.vm-button-secondary {
  background: transparent;
  color: var(--vm-burgundy);
  border: 1px solid rgba(127, 49, 61, 0.18);
}

.vm-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
}

.vm-card {
  border-radius: var(--vm-radius);
  background: #fff;
  box-shadow: var(--vm-shadow);
}

.vm-hero-banner {
  position: relative;
  overflow: hidden;
  min-height: 430px;
  border-radius: var(--vm-radius) var(--vm-radius) 0 0;
}

.vm-hero-banner img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.vm-hero-banner::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(27, 18, 17, 0.72) 0%, rgba(27, 18, 17, 0.18) 58%, rgba(27, 18, 17, 0.1) 100%);
}

.vm-hero-content {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  min-height: 430px;
  padding: 2.4rem 4rem;
  color: #fff7ea;
}

.vm-hero-content .vm-page-title {
  max-width: 12ch;
  font-size: clamp(2.8rem, 5.2vw, 5rem);
}

.vm-page-body {
  padding: 1.3rem 2.4rem 2.4rem;
}

.vm-home-page .vm-page-body {
  padding-top: 0;
}

.vm-about-layout {
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  gap: 1.6rem;
  align-items: stretch;
}

.vm-contacts-layout {
  grid-template-columns: 1.08fr 0.92fr;
  gap: 1.25rem;
}

.vm-contacts-page .vm-collection-panel,
.vm-contacts-page .vm-author-quote {
  padding: 1.1rem 1.35rem;
}

.vm-contacts-page .vm-section-title {
  font-size: clamp(1.55rem, 2.6vw, 2.5rem);
}

.vm-contacts-page .vm-rich-text {
  font-size: 1rem;
}

.vm-contacts-page .vm-author-quote figure {
  margin-bottom: 0;
}

.vm-contacts-page .vm-author-quote img {
  aspect-ratio: 4 / 4.6;
}

.vm-author-quote {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.vm-author-quote figure {
  margin-bottom: 1rem;
  overflow: hidden;
  border-radius: var(--vm-radius-sm);
}

.vm-author-quote img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.vm-author-quote blockquote {
  margin: 0;
  font-size: 1.18rem;
  line-height: 1.45;
}

.vm-author-quote cite {
  display: block;
  margin-top: 0.75rem;
  color: var(--vm-muted);
  font-style: normal;
}

.vm-collection-panel {
  padding: 1.35rem;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.vm-collection-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.8rem;
  margin-top: 1rem;
}

.vm-collection-grid figure {
  overflow: hidden;
  border-radius: var(--vm-radius-sm);
  background: var(--vm-paper);
  box-shadow: 0 10px 30px rgba(35, 25, 23, 0.06);
}

.vm-collection-grid img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
}

.vm-about-gallery-card {
  display: flex;
  flex-direction: column;
  padding: 0;
}

.vm-about-gallery-caption {
  padding: 0.9rem 1rem 1rem;
}

.vm-about-gallery-caption strong {
  display: block;
  margin: 0 0 0.35rem;
  font-size: 1rem;
}

.vm-about-gallery-caption p {
  margin: 0;
  color: var(--vm-muted);
  font-size: 0.95rem;
  line-height: 1.5;
}

.vm-summary-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-top: 1.2rem;
}

.vm-summary-card {
  padding: 1.2rem 1.3rem;
  background: var(--vm-paper);
  border-radius: var(--vm-radius-sm);
}

.vm-rich-text {
  font-size: 1.06rem;
}

.vm-rich-text > *:first-child {
  margin-top: 0;
}

.vm-rich-text > *:last-child {
  margin-bottom: 0;
}

.vm-gallery-page-wrap {
  padding: 1.8rem 1.8rem 2.2rem;
}

.vm-gallery-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1rem;
  align-items: end;
}

.vm-gallery-strip {
  display: flex;
  gap: 1.2rem;
  margin-top: 1.6rem;
  padding: 0.2rem 0 1rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  scrollbar-color: var(--vm-burgundy) rgba(127, 49, 61, 0.12);
}

.vm-gallery-strip::-webkit-scrollbar {
  height: 10px;
}

.vm-gallery-strip::-webkit-scrollbar-thumb {
  background: var(--vm-burgundy);
  border-radius: 999px;
}

.vm-gallery-slide {
  flex: 0 0 min(78vw, 360px);
  scroll-snap-align: start;
  overflow: hidden;
}

.vm-gallery-slide img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
}

.vm-gallery-caption {
  padding: 1rem 1.1rem 1.2rem;
}

.vm-gallery-caption h3 {
  margin: 0 0 0.5rem;
  font-size: 1.28rem;
}

.vm-gallery-caption p {
  margin: 0;
  color: var(--vm-muted);
}

.vm-gallery-note {
  margin-top: 1rem;
  padding: 1.2rem 1.3rem;
  border-radius: var(--vm-radius-sm);
  background: var(--vm-paper-soft);
  color: var(--vm-muted);
}

.vm-swipe-hint {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 1rem;
  padding: 0.25rem 0;
  color: var(--vm-burgundy);
}

.vm-swipe-hint svg {
  display: block;
  width: min(90px, 21vw);
  height: auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.vm-longread-page {
  padding: 0 0 2.4rem;
  overflow: hidden;
}

.vm-longread-list {
  display: grid;
  gap: 1rem;
  padding: 1.3rem 2rem 0;
}

.vm-longread-item {
  overflow: hidden;
  border-radius: var(--vm-radius);
  background: #fff;
  box-shadow: var(--vm-shadow);
}

.vm-longread-item[open] {
  background: var(--vm-paper);
}

.vm-longread-summary {
  list-style: none;
  cursor: pointer;
}

.vm-longread-summary::-webkit-details-marker {
  display: none;
}

.vm-longread-summary-grid {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 0;
}

.vm-longread-summary-image img {
  width: 100%;
  height: 100%;
  min-height: 220px;
  object-fit: cover;
}

.vm-longread-summary-content {
  padding: 1.5rem 1.6rem;
}

.vm-longread-summary-content h2 {
  margin: 0 0 0.8rem;
  font-size: clamp(1.5rem, 2.8vw, 2.4rem);
  line-height: 1.1;
}

.vm-longread-summary-content p {
  margin: 0;
  color: var(--vm-muted);
}

.vm-longread-meta {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  margin-top: 1rem;
  color: var(--vm-burgundy);
  font-size: 0.9rem;
}

.vm-longread-meta::after {
  content: "раскрыть";
}

.vm-longread-item[open] .vm-longread-meta::after {
  content: "свернуть";
}

.vm-longread-body {
  padding: 0 1.6rem 1.7rem;
}

.vm-longread-body-inner {
  max-width: 56rem;
  margin-left: auto;
}

.vm-longread-body .vm-rich-text {
  font-size: 1.08rem;
  line-height: 1.85;
}

.vm-longread-body .vm-button {
  margin-top: 1rem;
}

.vm-single-page {
  overflow: hidden;
}

.vm-single-body {
  padding: 2rem 2.2rem 2.4rem;
}

.vm-single-body .vm-rich-text {
  max-width: 54rem;
  font-size: 1.1rem;
  line-height: 1.9;
}

.vm-footer-inner {
  margin-top: 1.2rem;
  padding: 1.4rem 2rem 1.8rem;
  background: rgba(255, 249, 238, 0.96);
  box-shadow: var(--vm-shadow);
}

.vm-footer-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1rem;
  color: var(--vm-muted);
}

.vm-empty {
  padding: 1.4rem;
  border-radius: var(--vm-radius-sm);
  background: var(--vm-paper-soft);
}

@media (max-width: 1100px) {
  .vm-about-layout,
  .vm-summary-grid,
  .vm-longread-summary-grid {
    grid-template-columns: 1fr;
  }

  .vm-hero-content,
  .vm-page-body,
  .vm-gallery-page-wrap,
  .vm-longread-list,
  .vm-single-body {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

}

@media (max-width: 820px) {
  .vm-header-inner,
  .vm-footer-grid {
    flex-direction: column;
    align-items: flex-start;
  }

  .vm-hero-content {
    min-height: 360px;
    padding: 2rem 1.4rem;
  }

  .vm-page-body,
  .vm-gallery-page-wrap,
  .vm-longread-list,
  .vm-single-body {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .vm-gallery-slide {
    flex-basis: 88vw;
  }

  .vm-collection-grid {
    grid-template-columns: 1fr 1fr;
  }

  .vm-swipe-hint {
    padding: 0.2rem 0;
  }

  .vm-swipe-hint svg {
    width: min(74px, 25vw);
  }
}