/* ═══════════════════════════════════════════════════════
   Zovino — pages.css
   استایل مشترک صفحات ساده: درباره ما، تماس با ما، قوانین
═══════════════════════════════════════════════════════ */

#zv-page, #zv-page * { box-sizing: border-box; }
#zv-page {
  --blue: #2563EB; --blue-l: #60A5FA; --blue-d: #1D4ED8;
  --navy: #0F172A; --navy-2: #0e1f3a;
  --white: #FFFFFF; --slate: #F8FAFC;
  --ink: #0F172A; --sub: #64748B; --muted: #94A3B8;
  --border: rgba(15,23,42,0.07);
  --radius: 20px;
  --ff: 'Vazirmatn', sans-serif;
  --fe: 'Inter', sans-serif;

  font-family: var(--ff);
  color: var(--ink);
  direction: rtl;
  background: var(--slate);
  padding-bottom: 70px;
}

#zv-page a { text-decoration: none; color: inherit; }
#zv-page .zv-en { font-family: var(--fe); direction: ltr; unicode-bidi: isolate; }
#zv-page .zv-con { max-width: 1100px; margin: 0 auto; padding: 0 20px; }

/* --- گلس یوتیلیتی مشترک --- */
#zv-page .zv-glass{
  background: rgba(255,255,255,.6);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,.5);
  box-shadow: 0 8px 30px rgba(15,23,42,.06);
}

/* --- هدر گرادینت full-bleed مشترک بین هر سه صفحه --- */
#zv-page .zv-page-header{
  width: 100vw;
  position: relative;
  right: 50%;
  margin-right: -50vw;
  background: linear-gradient(135deg, var(--blue) 0%, var(--blue-d) 50%, var(--navy) 100%);
  padding: 56px 0 64px;
  text-align: center;
  margin-bottom: 50px;
  overflow: hidden;
}
#zv-page .zv-page-header::before,
#zv-page .zv-page-header::after{
  content: ''; position: absolute; border-radius: 50%; filter: blur(60px); pointer-events: none;
}
#zv-page .zv-page-header::before{ width: 320px; height: 320px; background: rgba(255,255,255,.08); top: -100px; right: -60px; }
#zv-page .zv-page-header::after{ width: 260px; height: 260px; background: rgba(255,255,255,.06); bottom: -90px; left: -60px; }
#zv-page .zv-page-header .zv-con{ position: relative; z-index: 2; }
#zv-page .zv-page-title{ font-size: clamp(26px,4vw,36px); font-weight: 800; color: #fff; margin: 0 0 10px; }
#zv-page .zv-page-sub{ font-size: 15px; color: rgba(255,255,255,.8); max-width: 520px; margin: 0 auto; }

/* --- بخش عمومی --- */
#zv-page .zv-page-section{ margin-bottom: 44px; }
#zv-page .zv-page-section-title{ font-size: 20px; font-weight: 800; color: var(--ink); margin-bottom: 18px; display: flex; align-items: center; gap: 10px; }
#zv-page .zv-page-section-title .ic{ font-size: 22px; }

#zv-page .zv-page-card{ border-radius: var(--radius); padding: 30px; }
#zv-page .zv-page-card p{ font-size: 14.5px; line-height: 2.1; color: var(--sub); margin: 0 0 14px; }
#zv-page .zv-page-card p:last-child{ margin-bottom: 0; }

/* --- گرید کارت (چرا اعتماد کنید / مجوزها) --- */
#zv-page .zv-grid{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
#zv-page .zv-grid.cols-3{ grid-template-columns: repeat(3, 1fr); }

#zv-page .zv-reason{ border-radius: 18px; padding: 24px 20px; text-align: center; transition: transform .2s; }
#zv-page .zv-reason:hover{ transform: translateY(-4px); }
#zv-page .zv-reason .ic{ font-size: 30px; margin-bottom: 12px; }
#zv-page .zv-reason h4{ font-size: 14.5px; font-weight: 700; margin: 0 0 6px; color: var(--ink); }
#zv-page .zv-reason p{ font-size: 12.5px; color: var(--sub); margin: 0; line-height: 1.8; }

/* --- مجوزها --- */
#zv-page .zv-license{ border-radius: 16px; padding: 22px 16px; text-align: center; }
#zv-page .zv-license-badge{
  width: 64px; height: 64px; margin: 0 auto 12px; border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(37,99,235,.08); font-size: 26px;
  border: 1px dashed rgba(37,99,235,.25);
}
#zv-page .zv-license-badge img{ max-width: 100%; max-height: 100%; border-radius: 14px; }
#zv-page .zv-license h4{ font-size: 13px; font-weight: 700; color: var(--ink); margin: 0; }

/* --- آمار --- */
#zv-page .zv-stats{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; text-align: center; }
#zv-page .zv-stat b{ display: block; font-size: 26px; font-weight: 900; color: var(--blue); }
#zv-page .zv-stat span{ font-size: 12.5px; color: var(--sub); }

/* --- شبکه‌های اجتماعی --- */
#zv-page .zv-social-row{ display: flex; gap: 14px; flex-wrap: wrap; }
#zv-page .zv-social-card{
  display: flex; align-items: center; gap: 12px;
  padding: 14px 18px; border-radius: 16px; flex: 1; min-width: 180px;
  transition: transform .2s;
}
#zv-page .zv-social-card:hover{ transform: translateY(-3px); }
#zv-page .zv-social-card img{ width: 30px; height: 30px; }
#zv-page .zv-social-card b{ display: block; font-size: 13.5px; color: var(--ink); }
#zv-page .zv-social-card span{ font-size: 11.5px; color: var(--sub); }

/* --- ساعات کاری --- */
#zv-page .zv-hours-list{ list-style: none; margin: 0; padding: 0; }
#zv-page .zv-hours-list li{
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 0; border-bottom: 1px solid var(--border); font-size: 13.5px;
}
#zv-page .zv-hours-list li:last-child{ border-bottom: none; }
#zv-page .zv-hours-list b{ color: var(--ink); font-weight: 600; }
#zv-page .zv-hours-list span{ color: var(--blue); font-weight: 700; }
#zv-page .zv-hours-badge{
  display: inline-flex; align-items: center; gap: 8px; margin-top: 16px;
  padding: 10px 14px; border-radius: 12px; background: rgba(34,197,94,.1);
  color: #16A34A; font-size: 12.5px; font-weight: 700;
}
#zv-page .zv-hours-badge::before{ content:''; width: 8px; height: 8px; border-radius: 50%; background: #22C55E; }

/* --- فرم تماس --- */
#zv-page .zv-contact-layout{ display: grid; grid-template-columns: 1.2fr 1fr; gap: 24px; align-items: start; }
#zv-page .zv-form-row{ display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
#zv-page .zv-form-field{ display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
#zv-page .zv-form-field label{ font-size: 12.5px; font-weight: 600; color: var(--ink); }
#zv-page .zv-form-field input,
#zv-page .zv-form-field textarea{
  border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px;
  font-family: var(--ff); font-size: 13.5px; background: rgba(255,255,255,.7); outline: none;
  transition: border-color .2s;
}
#zv-page .zv-form-field input:focus,
#zv-page .zv-form-field textarea:focus{ border-color: var(--blue); }
#zv-page .zv-form-field textarea{ resize: vertical; min-height: 110px; }
#zv-page .zv-form-submit{
  width: 100%; border: none; cursor: pointer; padding: 13px; border-radius: 12px;
  background: linear-gradient(135deg, var(--blue), var(--blue-l)); color: #fff;
  font-weight: 700; font-size: 14px; font-family: var(--ff); transition: transform .2s, box-shadow .2s;
}
#zv-page .zv-form-submit:hover{ transform: translateY(-2px); box-shadow: 0 10px 24px rgba(37,99,235,.3); }

#zv-page .zv-form-notice{
  padding: 12px 16px; border-radius: 12px; font-size: 13px; font-weight: 600; margin-bottom: 18px;
}
#zv-page .zv-form-notice.success{ background: rgba(34,197,94,.1); color: #16A34A; }
#zv-page .zv-form-notice.error{ background: rgba(220,38,38,.1); color: #DC2626; }

/* --- اطلاعات تماس کناری --- */
#zv-page .zv-contact-info-item{ display: flex; align-items: flex-start; gap: 12px; margin-bottom: 18px; }
#zv-page .zv-contact-info-item:last-child{ margin-bottom: 0; }
#zv-page .zv-contact-info-item .ic{
  width: 40px; height: 40px; flex-shrink: 0; border-radius: 12px;
  background: rgba(37,99,235,.1); color: var(--blue);
  display: flex; align-items: center; justify-content: center; font-size: 17px;
}
#zv-page .zv-contact-info-item b{ display: block; font-size: 13px; color: var(--ink); margin-bottom: 3px; }
#zv-page .zv-contact-info-item span, #zv-page .zv-contact-info-item a{ font-size: 13px; color: var(--sub); }

/* --- نقشه --- */
#zv-page .zv-map{ border-radius: var(--radius); overflow: hidden; height: 320px; margin-top: 20px; }
#zv-page .zv-map iframe{ width: 100%; height: 100%; border: 0; display: block; }

/* --- آکاردئون قوانین (از همون کلاس FAQ استفاده می‌کنه، JS مشترکه) --- */
#zv-page .zv-faq-list{ display: flex; flex-direction: column; gap: 12px; }
#zv-page .zv-faq-item{ border-radius: 16px; overflow: hidden; }
#zv-page .zv-faq-q{
  width: 100%; display: flex; align-items: center; justify-content: space-between;
  padding: 18px 20px; background: transparent; border: none; cursor: pointer;
  font-family: var(--ff); font-size: 14.5px; font-weight: 700; color: var(--ink); text-align: right;
}
#zv-page .zv-faq-icon{ font-size: 18px; color: var(--blue); }
#zv-page .zv-faq-a{ padding: 0 20px 18px; }
#zv-page .zv-faq-a p{ font-size: 13.5px; line-height: 2; color: var(--sub); margin: 0; }

#zv-page .zv-terms-intro{ font-size: 13.5px; line-height: 2; color: var(--sub); margin-bottom: 24px; }

/* --- ریسپانسیو --- */
@media (max-width: 992px){
  #zv-page .zv-grid{ grid-template-columns: repeat(2, 1fr); }
  #zv-page .zv-stats{ grid-template-columns: repeat(2, 1fr); }
  #zv-page .zv-contact-layout{ grid-template-columns: 1fr; }
}
@media (max-width: 600px){
  #zv-page .zv-grid, #zv-page .zv-grid.cols-3{ grid-template-columns: 1fr 1fr; }
  #zv-page .zv-form-row{ grid-template-columns: 1fr; }
  #zv-page .zv-page-card{ padding: 22px; }
}