/*
 Theme Name: Xtra Child
 Theme URI: https://yourwebsite.com/
 Description: A child theme for the Xtra WordPress theme
 Author: Your Name
 Author URI: https://yourwebsite.com/
 Template: xtra
 Version: 1.0.0
 Text Domain: xtra-child
*/

/* شما می‌تونید CSS دلخواهتون رو اینجا بنویسید */

/* === دکمه‌های فیلتر آکادمی برنا === */
.academy-filter-btn {
  padding: 8px 20px;
  margin: 0 6px;
  border-radius: 30px;
  background-color: #2E2340 !important;
  color: #ffffff !important;
  text-decoration: none;
  font-family: 'IranYekan', sans-serif;
  font-size: 15px;
  border: 1px solid #2E2340;
  transition: all 0.3s ease;
  display: inline-block;
}

/* هاور و فعال */
.academy-filter-btn:hover,
.academy-filter-btn.active {
  background-color: #20AC73 !important;
  color: #ffffff !important;
  border-color: #20AC73 !important;
  font-weight: bold;
}

/* === موبایل (ریسپانسیو) === */
@media (max-width: 768px) {
  .academy-filters > div {
    padding: 15px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .academy-filter-btn {
    display: block;
    width: 100%;
    max-width: 300px;
    margin: 6px 0;
    text-align: center;
  }

  form input[type="text"] {
    width: 100% !important;
    margin-bottom: 10px;
  }

  form button[type="submit"] {
    width: 100% !important;
    margin-right: 0 !important;
  }
}



/* سایز تیترها در دسکتاپ */
h1 { font-size: 24px; font-weight: 700; line-height: 1.6; }
h2 { font-size: 22px; font-weight: 700; line-height: 1.6; }
h3 { font-size: 20px; font-weight: 600; line-height: 1.6; }
h4 { font-size: 18px; font-weight: 600; line-height: 1.6; }
h5 { font-size: 16px; font-weight: 500; line-height: 1.6; }
h6 { font-size: 14px; font-weight: 500; line-height: 1.6; }

/* فاصله عمودی تیترها */
h1, h2, h3, h4, h5, h6 {
  margin-top: 2em;
  margin-bottom: 1em;
}

/* ریسپانسیو برای موبایل (زیر 768px) */
@media (max-width: 768px) {
  h1 { font-size: 20px; }
  h2 { font-size: 18px; }
  h3 { font-size: 16px; }
  h4 { font-size: 15px; }
  h5 { font-size: 14px; }
  h6 { font-size: 13px; }

  h1, h2, h3, h4, h5, h6 {
    margin-top: 1.5em;
    margin-bottom: 0.75em;
  }
}




/* سایز متن اصلی (پاراگراف‌ها) در دسکتاپ */
body,
p {
  font-size: 16px;
  line-height: 1.9;
}

/* در موبایل، سایز کمتر بشه */
@media (max-width: 768px) {
  body,
  p {
    font-size: 14px;
    line-height: 1.9;
  }
}


@media (max-width: 768px) {
  .container,
  .single-post-content,
  .post-content {
    padding-top: 15px !important;
    margin-top: 0 !important;
  }

  h1.entry-title:first-child {
    margin-top: 0 !important;
  }
}



/* متن مقاله در دسکتاپ */
.single-post .post-content,
.single-post .post-content p,
.single-post .post-content span,
.single-post .post-content div,
.single-post .post-content li,
.single-post .post-content ul,
.single-post .post-content ol {
  font-size: 16px !important;
  line-height: 1.9 !important;
  color: #222;
}

/* متن مقاله در موبایل */
@media (max-width: 768px) {
  .single-post .post-content,
  .single-post .post-content p,
  .single-post .post-content span,
  .single-post .post-content div,
  .single-post .post-content li,
  .single-post .post-content ul,
  .single-post .post-content ol {
    font-size: 14px !important;
  }
}



/* ===== BRNA Testimonials — نسخه تمیز ===== */

.brna-testimonials{ margin:64px 0; position:relative; }
.brna-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; }
.brna-title{ margin:0; font-weight:800; font-size:clamp(22px,2.6vw,22px); color:#0f172a; }

.brna-carousel{ position:relative; }
.brna-swiper{ overflow:visible; }
.brna-swiper .swiper-slide{ height:auto; }

/* فلش‌ها داخل قاب و واضح */
.brna-arrow{
  position:absolute; top:50%; transform:translateY(-50%);
  width:46px; height:46px; border-radius:50%;
  background:#fff; border:1px solid #e5e7eb; color:#0f172a;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 12px 24px rgba(15,23,42,.10); cursor:pointer; z-index:10;
  font-size:22px; line-height:1;
}
.brna-arrow--prev{ left:8px; }
.brna-arrow--next{ right:8px; }

.brna-card{
  position:relative; overflow:visible;
  background:#ffffff; color:#1f2937;
  border:1px solid #e8edf3; border-radius:22px;
  box-shadow:0 16px 40px rgba(2,8,23,.08);
  padding:56px 24px 24px;       /* اسم بیاد بالاتر */
  display:flex; flex-direction:column;
}
/* هاور بدون افکت اضافه */
.brna-card:hover{ transform:none; box-shadow:0 16px 40px rgba(2,8,23,.08); }

.brna-avatar{
  position:absolute; top:60px; right:24px;
  width:76px; height:76px; border-radius:50%; overflow:hidden;
  border:3px solid #fff; background:#fff; box-shadow:0 12px 24px rgba(0,0,0,.18);
}
.brna-avatar img{ width:100%; height:100%; object-fit:cover; display:block; }

.brna-content{ padding:0 110px 0 18px; text-align:right; }
.brna-name{ margin:0 0 6px; font-size:20px; font-weight:800; color:#0f172a; }

/* خطوط متا: ۱) عنوان شغلی ۲) شرکت‌کننده کارگاه ۳) سازمان */
.brna-meta{ margin:0 0 12px; }
.brna-meta > *{ display:block; }
.brna-role{ color:#334155; font-weight:600; }
.brna-rel{  color:#475569; margin-top:2px; }
.brna-org{  color:#64748b; margin-top:2px; }

.brna-text, .brna-text *{
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  margin:0; line-height:1.95; color:#1f2937; font-size:16px;
}

@media (max-width:768px){
  .brna-avatar{ right:50%; transform:translateX(50%); top:-34px; }
  .brna-content{ padding:52px 16px 0 16px; text-align:center; }
  .brna-meta{ text-align:center; }
}



/* ===== فلش های ناوبری به سبک دایره تیره با آیکن سفید ===== */
.brna-carousel{ position:relative; }           /* مطمئن شو والد پوزیشن دارد */

.brna-arrow{
  position:absolute; top:50%; transform:translateY(-50%);
  width:64px; height:64px; border-radius:50%;
  background:#273154;            /* سرمه‌ای مثل نمونه */
  border:none;
  box-shadow:0 20px 38px rgba(39,49,84,.26);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; z-index:10;
  font-size:0;                   /* متن داخل دکمه پنهان شود (‹ ›) */
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.brna-arrow--prev{ left:-32px; }               /* اگر نصفه بیرون افتاد: 8px */
.brna-arrow--next{ right:-32px; }

.brna-arrow::before{
  content:"";
  width:22px; height:22px;
  /* فلش سفید (SVG) */
  background: url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
    <path d='M5 12h14M13 5l7 7-7 7' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/>\
  </svg>") no-repeat center/contain;
}
.brna-arrow--prev::before{ transform: rotate(180deg); }  /* فلش به چپ */

.brna-arrow:hover{ background:#2d3966; box-shadow:0 24px 44px rgba(39,49,84,.30); transform:translateY(-50%) scale(1.03); }
.brna-arrow:active{ transform:translateY(-50%) scale(0.98); }
.brna-arrow:focus{ outline:2px solid #cbd5e1; outline-offset:3px; }

/* موبایل: فلش‌ها بیایند داخل کادر */
@media (max-width: 1024px){
  .brna-arrow--prev{ left:8px; }
  .brna-arrow--next{ right:8px; }
  .brna-arrow{ width:52px; height:52px; }
}


/* لبه‌ی اسلایدها بیرون نزنه؛ کارت سوم دیده نشه */
.brna-swiper{
  overflow: hidden;        /* قبلاً visible بود */
  padding-inline: 12px;    /* کمی فضا برای سایه‌ها داخل کادر */
}
/* لازم نیست، ولی مطمئن می‌شیم خودِ اسلاید قطع نشه */
.brna-swiper .swiper-slide{ overflow: visible; }



/* --- فیکس نهایی کارت‌ها --- */

/* 1) حذف کامل سایه‌ها + ظاهر تمیز */
.brna-card{
  border:1px solid #e9eef5 !important;
  box-shadow:none !important;
  padding:36px 24px 22px !important;   /* فاصله بالا کمتر شد تا اسم بالاتر بیاد */
  border-radius:20px;
}
.brna-card:hover{ box-shadow:none !important; transform:none !important; }

/* 2) آواتار کمی کوچکتر و نزدیک‌تر به بالای کارت */
.brna-avatar{
  top:60px !important; right:24px !important;
  width:68px !important; height:68px !important;
  box-shadow:none !important;          /* اگر روی آواتار هم سایه نمی‌خوای */
  border:3px solid #fff;
}

/* 3) اسم بالاتر دیده شود (پدینگ راست کمتر شد) */
.brna-content{ padding:0 88px 0 16px !important; text-align:right; }
.brna-name{ margin:0 0 4px !important; font-size:19px; font-weight:800; }

/* 4) متا: خط 1 = عنوان شغلی، خط 2 = «شرکت‌کننده کارگاه»، خط 3 = سازمان */
.brna-meta{ margin:0 0 10px !important; }
.brna-meta > *{ display:block; line-height:1.6; }
.brna-role{ color:#334155; font-weight:600; }   /* عنوان شغلی */
.brna-rel { color:#475569; }                    /* شرکت‌کننده کارگاه (زیر عنوان شغلی) */
.brna-org { color:#64748b; }                    /* سازمان (اگر وارد شده باشد) */




/* ===== پولیش نهایی ظاهر توصیه‌نامه‌ها ===== */

/* کارت: نور لطیف بدون سایه، نوار خیلی کم‌رنگ بالای کارت */
.brna-card{
  border:1px solid #e7edf5 !important;
  background:
    linear-gradient(180deg, #f9fbff 0%, #ffffff 60%) !important; /* روشن‌تر و تمیزتر */
  border-radius:22px !important;
  padding:30px 24px 22px !important;   /* فضای بالا کمتر → اسم بالاتر */
  box-shadow:none !important;
  transition:border-color .18s ease;
}
.brna-card:hover{ border-color:#d7e2f0 !important; }

/* آواتار: کاملاً گرد با رینگ ظریف (بدون سایه) */
.brna-avatar{
  top:60px !important; right:24px !important;
  width:70px !important; height:70px !important;
  border-radius:50% !important; overflow:hidden !important;
  /*border:3px solid #fff !important; box-shadow:none !important;*/
  outline:2px solid #20ab73; outline-offset:2px; /* رینگ لطیف */
}
.brna-avatar img{ width:150%; height:150%; object-fit:cover; }

/* محتوا: راست‌چین، اسم بالاتر و قوی‌تر، عرض بهینه متن */
.brna-content{ padding:0 88px 0 16px !important; text-align:right; }
.brna-name{ margin:0 0 6px !important; font-size:20px !important; font-weight:800; color:#0f172a; letter-spacing:-.2px; }
.brna-text{ max-width:56ch; }          /* عرض خواناتر برای پاراگراف */
.brna-text, .brna-text *{ line-height:1.95; color:#1f2937; }

/* متا: ۱) عنوان شغلی ۲) شرکت‌کننده کارگاه ۳) سازمان — به شکل چیپ تمیز */
.brna-meta{ margin:0 0 12px !important; }
.brna-meta > *{ display:block; }

.brna-role{                /* عنوان شغلی */
  display:inline-block; padding:4px 10px; border-radius:999px;
  background:#eff4fb; color:#1f2a44; font-weight:700; font-size:14px;
}
.brna-rel{                 /* شرکت‌کننده کارگاه */
  display:inline-block; margin-top:6px; padding:3px 10px; border-radius:999px;
  border:1px solid #e6ebf3; color:#334155; font-weight:600; font-size:13px;
}
.brna-org{                 /* سازمان (اگر بود) */
  margin-top:4px; color:#667085; font-size:13px;
}

/* فلش‌ها: کمی نزدیک‌تر به کارت‌ها و یک اندازه ثابت */
.brna-arrow{ width:60px; height:60px; }
.brna-arrow--prev{ left:6px; }
.brna-arrow--next{ right:6px; }

/* ریسپانسیو */
@media (max-width: 768px){
  .brna-avatar{ right:50% !important; transform:translateX(50%); top:15px !important; }
  .brna-content{ padding:52px 16px 0 16px !important; text-align:center; }
  .brna-meta{ text-align:center; }
  .brna-text{ margin-inline:auto; }
}



/* فلش‌ها بیرون‌تر (دسکتاپ) */
@media (min-width: 1200px){
  .brna-arrow--prev{ left:-110px !important; }  /* قبلی */
  .brna-arrow--next{ right:-110px !important; } /* بعدی */
  .brna-arrow{ width:68px; height:68px; }       /* کمی بزرگ‌تر، اختیاری */
}

/* خیلی عریض‌ها (مانیتور بزرگ) حتی بیرون‌تر */
@media (min-width: 1600px){
  .brna-arrow--prev{ left:-140px !important; }
  .brna-arrow--next{ right:-140px !important; }
}

/* تبلت/موبایل: برگردن داخل قاب */
@media (max-width: 1024px){
  .brna-arrow--prev{ left:8px !important; }
  .brna-arrow--next{ right:8px !important; }
  .brna-arrow{ width:52px; height:52px; }
}


/* تیتر «تجربه همکاری‌ها با برنا» در موبایل وسط‌چین */
@media (max-width: 768px){
  .brna-head{ justify-content:center !important; }
  .brna-title{ width:100%; text-align:center !important; margin:0 auto !important; }
}



/* فلش‌های ناوبری در موبایل: پایینِ اسلایدر و کنار هم */
@media (max-width: 768px){
  .brna-carousel{ position:relative; padding-bottom:84px; } /* جا برای دکمه‌ها */

  .brna-arrow{
    top:auto !important;                 /* دیگه وسط عمودی نباشه */
    bottom:12px !important;              /* بیاد پایین */
    width:52px; height:52px;             /* کوچیک‌تر برای موبایل */
    transform:none !important;           /* ترنسفورم قبلی پاک بشه */
    z-index:10;
  }

  .brna-arrow--prev{
    right:auto !important;               /* قوانین دسکتاپ بی‌اثر بشه */
    left:50% !important;
    transform:translateX(-110%) !important;  /* دکمه قبلی سمت چپِ مرکز */
  }
  .brna-arrow--next{
    left:50% !important;
    right:auto !important;
    transform:translateX(10%) !important;    /* دکمه بعدی سمت راستِ مرکز */
  }
}



/* فاصله بیشتر بین آواتار و نام در موبایل */
@media (max-width: 768px){
  .brna-content{
    padding-top: 70px !important;   /* قبلاً کمتر بود؛ اسم پایین‌تر میاد */
  }
  .brna-name{
    margin-top: 8px !important;     /* یه ذره فاصله اضافه زیر آواتار */
  }
  /* اگر هنوز خیلی چسبیده بود، یکی از این دو تا رو هم امتحان کن: */
  /* .brna-content{ padding-top: 96px !important; } */
  /* .brna-avatar{ top:-22px !important; } */  /* آواتار کمی بالاتر بره */
}






.wb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}
.wb-card{border:1px solid #eee;border-radius:16px;padding:14px;background:#fff}
.wb-card .thumb img{width:100%;height:auto;border-radius:12px}
.wb-title{font-size:1.05rem;margin:8px 0}
.wb-meta{color:#666;margin-bottom:10px}
.wb-btn{display:inline-block;padding:10px 14px;border-radius:10px;background:#0a5e8a;color:#fff;text-decoration:none}
.wb-btn:hover{opacity:.9}
.wb-btn-outline{padding:8px 12px;border:1px solid #0a5e8a;border-radius:10px;background:#fff;color:#0a5e8a;text-decoration:none}
.wb-btn-success{background:#0a7a2d;color:#fff;padding:10px 14px;border-radius:10px;text-decoration:none}
.wb-single-box{border:1px solid #eee;border-radius:16px;padding:16px;margin:16px 0;background:#fff}
.wb-info{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:12px}
.wb-info li{background:#f8fafc;padding:8px 10px;border-radius:10px}
.wb-cta{text-align:left} /* اگر خواستی راست‌چین: right */


/*وبینار*/


.container{max-width:1100px;margin:0 auto;padding:0 16px}

/* آرشیو */
.wb-arch-title{font-size:28px;margin:20px 0 10px}
.wb-sec-title{font-size:20px;margin:18px 0 12px}
.wb-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media (max-width:1024px){.wb-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:768px){.wb-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.wb-grid{grid-template-columns:1fr}}

.wb-card{border:1px solid #e5e7eb;border-radius:16px;background:#fff;overflow:hidden;display:flex;flex-direction:column}
.wb-thumb{position:relative;display:block}
.wb-thumb img{width:100%;display:block;aspect-ratio:16/9;object-fit:cover}
.wb-badge{position:absolute;top:10px;left:10px;padding:6px 10px;border-radius:999px;font-size:12px;background:#111827;color:#fff}
.wb-badge.is-free{background:#10b981}
.wb-badge.is-paid{background:#2563eb}
.wb-badge.is-arch{background:#6b7280}
.wb-title{font-size:16px;line-height:1.6;margin:10px 12px 6px}
.wb-title a{color:#111827;text-decoration:none}
.wb-excerpt{color:#6b7280;font-size:14px;margin:0 12px 10px;min-height:42px}
.wb-meta{display:flex;gap:8px;flex-wrap:wrap;margin:0 12px 14px}
.wb-chip{background:#f3f4f6;border:1px solid #e5e7eb;border-radius:999px;padding:6px 10px;font-size:12px}
.wb-chip.wb-price{background:#eef2ff;border-color:#e0e7ff}

/* تکی */
.wb-breadcrumbs{font-size:13px;color:#6b7280;margin:12px 0}
.wb-breadcrumbs a{color:#2563eb;text-decoration:none}
.wb-hero{display:grid;grid-template-columns:1fr 1.2fr;gap:24px;align-items:start}
@media (max-width:920px){.wb-hero{grid-template-columns:1fr}}
.wb-hero-media{position:relative;border:1px solid #e5e7eb;border-radius:16px;overflow:hidden;background:#fff}
.wb-hero-media img{width:100%;display:block}
.wb-title-single{font-size:26px;margin:0 0 8px}
.wb-sub{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.wb-info-row{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 16px}
.wb-btn{display:inline-block;background:#0a5e8a;color:#fff;border-radius:12px;padding:12px 16px;text-decoration:none}
.wb-btn:hover{opacity:.9}
.wb-btn-outline{background:#fff;border:1px solid #0a5e8a;color:#0a5e8a;border-radius:12px;padding:10px 14px;text-decoration:none}
.wb-btn-success{background:#059669;color:#fff;border-radius:12px;padding:12px 16px;text-decoration:none}
.wb-cta-row{display:flex;gap:10px;flex-wrap:wrap}
.wb-content{border:1px solid #e5e7eb;background:#fff;border-radius:16px;padding:16px;margin:22px 0}
.wb-free-form{border:1px solid #e5e7eb;background:#f9fafb;border-radius:16px;padding:16px;margin:18px 0}
.wb-free-form input{display:block;width:100%;max-width:420px;margin:8px 0;padding:10px;border:1px solid #e5e7eb;border-radius:10px}







.logo img {
    height: 65px;
    width: 164px !important;
    filter: none !important;
    margin: 10px 0px 30px;
    transform: scale(1.5);
    position: relative;
    top: 8px;
    transform-origin: right;
}