/*
Theme Name: Peyvast
Theme URI: https://peyvast.art
Author: Peyvast Studio
Author URI: https://peyvast.art
Description: تم اختصاصی پلتفرم پی‌وست — رسانه‌ی تخصصی هنرهای تجسمی ایران. معرفی هنرمند و اثر، گزارش گالری‌گردی، و خدمات به هنرمندان و گالری‌ها.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: peyvast
*/

/* =========================================================
   Design Tokens — پی‌وست
   منطق طراحی: برچسب دیوار گالری / کاتالوگ نمایشگاه
   ========================================================= */

/*
 * پالت سازمانی پی‌وست: سفید و مشکی (مینیمال)
 * فونت سازمانی: دیباج — فایل فونت (woff2) باید در assets/fonts قرار بگیرد
 * و در @font-face زیر مسیردهی شود (چون دیباج روی CDN عمومی موجود نیست).
 */
:root {
  /* رنگ‌ها — مینیمال، سفید/مشکی */
  --pv-paper: #FFFFFF;          /* زمینه اصلی: سفید خالص */
  --pv-paper-raised: #FAFAFA;   /* سطح خیلی ملایم‌تر برای جداسازی بصری بدون رنگ اضافه */
  --pv-ink: #111111;            /* مشکی سازمانی برای متن و تیتر */
  --pv-ink-soft: #6B6B6B;       /* خاکستری برای متن ثانویه/متا */
  --pv-line: #E5E5E5;           /* خط جداکننده نازک خاکستری روشن */
  --pv-turquoise: #111111;      /* رنگ تاکیدی = همان مشکی (بدون رنگ اضافه، طبق پالت سازمانی) */
  --pv-turquoise-dim: #1111110A;
  --pv-gold: #111111;
  --pv-error: #B00020;

  /* تایپوگرافی */
  --pv-font-body: 'Dibaj', 'Vazirmatn', Tahoma, sans-serif;
  --pv-font-display: 'Dibaj', 'Vazirmatn', sans-serif;

  /* فاصله‌گذاری */
  --pv-space-1: 0.5rem;
  --pv-space-2: 1rem;
  --pv-space-3: 1.75rem;
  --pv-space-4: 3rem;
  --pv-space-5: 5rem;

  /* لی‌اوت */
  --pv-container: 1240px;
  --pv-radius: 2px; /* گردی تقریباً صفر، عمدی */
}

/* فونت سازمانی — فایل‌های Dibaj-Regular.woff2 / Dibaj-Bold.woff2 را در assets/fonts قرار دهید */
@font-face {
  font-family: 'Dibaj';
  src: url('assets/fonts/Dibaj-Regular.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Dibaj';
  src: url('assets/fonts/Dibaj-Bold.woff2') format('woff2');
  font-weight: 700;
  font-display: swap;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--pv-paper);
  color: var(--pv-ink);
  font-family: var(--pv-font-body);
  font-size: 17px;
  line-height: 1.75;
  direction: rtl;
  -webkit-font-smoothing: antialiased;
}

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

a { color: inherit; text-decoration: none; }

.pv-container {
  max-width: var(--pv-container);
  margin: 0 auto;
  padding: 0 var(--pv-space-3);
}

h1, h2, h3, .pv-display {
  font-family: var(--pv-font-display);
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 var(--pv-space-2);
}

h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); }
h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); }
h3 { font-size: 1.3rem; }

p { max-width: 68ch; }

.pv-eyebrow {
  font-size: 0.85rem;
  color: var(--pv-turquoise);
  border-bottom: 1px solid var(--pv-turquoise);
  display: inline-block;
  padding-bottom: 2px;
  margin-bottom: var(--pv-space-2);
}

/* دکمه‌ها */
.pv-btn {
  display: inline-block;
  padding: 0.65em 1.4em;
  border: 1px solid var(--pv-ink);
  border-radius: var(--pv-radius);
  font-size: 0.95rem;
  transition: background 0.2s ease, color 0.2s ease;
}
.pv-btn:hover { background: var(--pv-ink); color: var(--pv-paper); }
.pv-btn--accent {
  border-color: var(--pv-ink);
  background: var(--pv-ink);
  color: #fff;
}
.pv-btn--accent:hover { background: #333; }

/* نوار کوچک بالای هدر */
.pv-topbar {
  font-size: 0.8rem;
  color: var(--pv-ink-soft);
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--pv-line);
}
.pv-topbar strong { color: var(--pv-ink); }

/* هدر سایت */
.pv-site-header {
  border-bottom: 1px solid var(--pv-line);
  padding: var(--pv-space-2) 0;
  position: sticky;
  top: 0;
  background: var(--pv-paper);
  z-index: 50;
}
.pv-site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--pv-space-2);
}
.pv-logo {
  font-family: var(--pv-font-display);
  font-weight: 700;
  font-size: 1.6rem;
}
.pv-nav ul {
  list-style: none;
  display: flex;
  gap: var(--pv-space-3);
  margin: 0;
  padding: 0;
}
.pv-nav a { font-size: 0.95rem; }
.pv-nav a:hover { color: var(--pv-ink); text-decoration: underline; text-underline-offset: 4px; }
.pv-menu-toggle { display: none; background: none; border: none; font-size: 1.4rem; cursor: pointer; color: var(--pv-ink); }

/* =========================================================
   کاشی (Tile) — واحد اصلی نمایش محتوا
   عکس تمام‌قاب + کپشن روی تصویر (الگوی برگرفته از نمونه پی‌وست)
   ========================================================= */
.pv-tile {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 4/5;
  background: var(--pv-ink);
  border: 1px solid var(--pv-ink);
}
.pv-tile--hero { aspect-ratio: 21/9; }
.pv-tile--wide { aspect-ratio: 16/9; }
.pv-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}
.pv-tile:hover img { transform: scale(1.03); }
.pv-tile__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.15) 45%, transparent 65%);
}
.pv-tile__caption {
  position: absolute;
  right: var(--pv-space-2);
  left: var(--pv-space-2);
  bottom: var(--pv-space-2);
  color: #fff;
}
.pv-tile__title {
  font-family: var(--pv-font-display);
  font-weight: 700;
  font-size: 1.25rem;
  margin: 0;
}
.pv-tile__title::before { content: '\2039'; margin-left: 0.4em; color: #fff; }
.pv-tile__subtitle {
  font-size: 0.85rem;
  opacity: 0.85;
  margin-top: 0.3rem;
}
.pv-tile__subtitle::before { content: '\2013\00a0'; }

/* کاشی بدون تصویر (متنی/تیره) — مثل بلوک پادکست در نمونه */
.pv-tile--dark {
  background: var(--pv-ink);
  color: #fff;
  display: flex;
  align-items: flex-end;
  padding: var(--pv-space-2);
}
.pv-tile--dark .pv-tile__title { color: #fff; }

.pv-tile-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--pv-space-2);
}
.pv-tile-grid--2 { grid-template-columns: repeat(2, 1fr); }
.pv-tile-grid > .pv-tile--span-all { grid-column: 1 / -1; }

/* لیست ساده (برای آرشیوهای متنی چگال مثل مرور یک هنرمند) */
.pv-catalog { border-top: 1px solid var(--pv-line); }
.pv-catalog__item {
  display: grid;
  grid-template-columns: 160px 1fr auto;
  gap: var(--pv-space-3);
  align-items: center;
  padding: var(--pv-space-3) 0;
  border-bottom: 1px solid var(--pv-line);
}
.pv-catalog__thumb {
  width: 160px;
  height: 200px;
  object-fit: cover;
  background: var(--pv-paper-raised);
}
.pv-catalog__meta {
  font-size: 0.85rem;
  color: var(--pv-ink-soft);
  margin-top: var(--pv-space-1);
}
.pv-catalog__meta span + span::before { content: '، '; }
.pv-catalog__arrow {
  font-size: 1.4rem;
  color: var(--pv-ink);
}

/* هیرو صفحه اصلی — تمام‌عرض با عنوان روی تصویر */
.pv-hero {
  position: relative;
  height: 78vh;
  min-height: 480px;
  overflow: hidden;
}
.pv-hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pv-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.15) 40%, transparent 65%);
}
.pv-hero__caption {
  position: absolute;
  right: var(--pv-space-3);
  left: var(--pv-space-3);
  bottom: var(--pv-space-4);
  color: #fff;
}
.pv-hero__caption .pv-eyebrow { color: #fff; border-color: #fff; }
.pv-hero__caption h1 { color: #fff; max-width: 20ch; }
.pv-hero__caption p { color: #eee; max-width: 55ch; }

/* بخش سکشن‌ها */
.pv-section { padding: var(--pv-space-5) 0; }
.pv-section__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: var(--pv-space-3);
}

/* فوتر */
.pv-site-footer {
  border-top: 1px solid var(--pv-line);
  padding: var(--pv-space-4) 0;
  margin-top: var(--pv-space-5);
  font-size: 0.9rem;
  color: var(--pv-ink-soft);
}
.pv-site-footer__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--pv-space-3);
}

/* پروفایل هنرمند */
.pv-artist-header {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: var(--pv-space-4);
  padding: var(--pv-space-4) 0;
  border-bottom: 1px solid var(--pv-line);
}
.pv-artist-header__photo {
  width: 100%;
  aspect-ratio: 3/4;
  object-fit: cover;
}
.pv-artist-header__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--pv-space-1) var(--pv-space-3);
  font-size: 0.9rem;
  color: var(--pv-ink-soft);
  margin: var(--pv-space-2) 0;
}

/* گرید آثار داخل پروفایل هنرمند */
.pv-artwork-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--pv-space-3);
}
.pv-artwork-grid figure { margin: 0; }
.pv-artwork-grid img {
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  border: 1px solid var(--pv-line);
}
.pv-artwork-grid figcaption {
  font-size: 0.85rem;
  color: var(--pv-ink-soft);
  margin-top: var(--pv-space-1);
}

/* صفحه خدمات/تعرفه */
.pv-pricing-table { width: 100%; border-collapse: collapse; margin: var(--pv-space-3) 0; }
.pv-pricing-table th, .pv-pricing-table td {
  text-align: right;
  padding: var(--pv-space-2);
  border-bottom: 1px solid var(--pv-line);
}
.pv-pricing-table th { font-family: var(--pv-font-display); font-weight: 700; }

/* واکنش‌گرا */
/* لی‌اوت دوستونه‌ی ساده (برای صفحه‌ی تک‌اثر) */
.pv-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--pv-space-4);
  align-items: center;
}
.pv-split img { width: 100%; aspect-ratio: 4/5; object-fit: cover; border: 1px solid var(--pv-line); }

@media (max-width: 900px) {
  .pv-hero { height: 60vh; }
  .pv-split { grid-template-columns: 1fr; }
  .pv-artist-header { grid-template-columns: 1fr; }
  .pv-artwork-grid, .pv-tile-grid { grid-template-columns: repeat(2, 1fr); }
  .pv-site-footer__grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .pv-nav { display: none; }
  .pv-menu-toggle { display: block; }
  .pv-catalog__item { grid-template-columns: 100px 1fr; }
  .pv-catalog__arrow { display: none; }
  .pv-artwork-grid { grid-template-columns: 1fr 1fr; gap: var(--pv-space-2); }
  .pv-tile-grid { grid-template-columns: 1fr; }
  .pv-hero__caption h1 { max-width: none; }
}

/* دسترسی‌پذیری */
a:focus-visible, button:focus-visible {
  outline: 2px solid var(--pv-ink);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; }
}